# Crypttp-angular

## Environment
```
node -v
// your version > 10.9
```

## Installation
### 1. Download dependency in project directory
```
npm i -s crypttp-angular
```

### 2.
Signup at dashboard
https://crypttp.com/dashboard

And copy merchant id

<img src="https://i.imgur.com/fyW4P6s.png" height="100%" />

## Usage
### 1. Add crypttp to imports of root app.module
```JavaScript
/*
 here your imports goes
*/
import {Crypttp} from 'crypttp-angular';

@NgModule({
    declarations: [ /* your components */ ],
    imports: [
        /* other angular modules */
        Crypttp,
    ]
})
export class AppModule {
}
```

### 2. Add component to your cart
```HTML
<crypttp type="type"
    merchant_id="merchant_id"
    country_currency="country_currency"
    currency="currency"
    amount="amount"
    payload="payload"
    memo="memo"
    onsuccess="onsuccess"
    onerror="onerror"></crypttp>
```

### 3. Configure display

Default button looks like this:

<img src="https://i.imgur.com/Hu9g5fY.png" height="100%" />

You are able to configure button by passing additional parametres

```
<crypttp
    buttonText="Custom text" <!-- This text will be displayed on button -->
    buttonColor="#000000"  <!-- Background color of button. If you set light colors we autoconvert font color to dark -->
    buttonWidth="300px" <!-- Width of the button to achive perfect fit on your website -->
    ...
    payment params
    />
```

<img src="https://i.imgur.com/wf06FCi.png" height="100%"  />
------
<img src="https://imgur.com/YGO96NC.png" height="100%" />


### 4. All available params
| Type   | Name | Optional \ Required | Discription |
|--------|------|---------------------|-------------|
| string | buttonText | optional | This text will be displayed on button |
| string | buttonColor | optional | Background color of button. |
| string | buttonWidth | optional | Width of the button to achive perfect fit on your website |
| string | type | required | 0 - if you are CRYPTO ACUQRING, track transactions yourself, you keep wallet address of merchant. 1 - if you are MERCHANT and want charge user. We will create wallet address for you to accept cryptos. 2 - if you want to specify wallet addresses where user will send crypto |
| string | merchant_id | required | id which you can find at crypttp.com/dashboard |
| string | country_currency | required | currency of your client. Can't vary for each client. |
| object | to | optional | pass wallet addresses as { 'currency ticket': 'wallet address' } if you use `type: 2` |
| string | currency | optional | pass it only if you know which crypto you want to charge from client |
| string | amount | required | amount to charge in native currency numeration |
| string | payload | optional | any extra data that you want to send with cryptocurrency transaction |
| string | memo | optional | a special tag for specific blockchains |
| string | onsuccess | optional | url (without https:// !!!) where to redirect user after checkout complete |
| string | onerror | optional | url (without https:// !!!) where to redirect user if checkout failed |