Introduction

Welcome to Empatkali API!

Empatkali API is a RESTful Web Service served as a communication bridge between merchants and our payment channels.

API Base URL
Sandbox : https://sb-api.empatkali.co.id/merchant/api
Production : https://api.empatkali.co.id/merchant/api

Overview

User performs the checkout operation
Merchant site open an iframe that contain some payload open EMPATKALI payment page
EMPATKALI server will verify the request
EMPATKALI User fill in phone number and OTP for transaction
EMPATKALI server will verify the request and process the payment
If the payment success EMPATKALI will send EMAIL to registered Merchant email and EMPATKALI User Email
If the payment success EMPATKALI backend will send HTTPS POST Request to Merchant registered callback URL containing transaction information.

Supported Browsers

We try to support the latest versions of all major browsers. The list below provides the minimum supported version of each browser in Mobile and Desktop platform :

Mobile

Chrome 32 and above
Android 4.4 and above
Safari 8 and above
BlackBerry 10 and above

Dekstop

Chrome 26 and above
Firefox 29 and above
Internet Explorer 10 and above
Safari 6 and above

On Board With EMPATKALI

To start using EMPATKALI plugin, you have to register for EMPATKALI merchant account here. Once you have registered on website, EMPATKALI will check your data and send you the credential for login to Merchant Dashboard

Example:

Username : Username_Merchant
Password : xxxxxxxxxxx
Secret Key : EMPATKALI Will provide this key

Note:
Production key and URL will be provided when going live

Backend Integration

Empatkali API integration is easy to use, just follow the steps below along with its required body and you're good to go.

(1) User Validation

Authenticate the user
-- this endpoint generate md5 for system checking is it true this transaction from empatkali system --

Example Request (JSON format)

{
  "storeId": "xxxxxx",
  "total": "xxxxxx",
  "transactionNumber": "xxxxxx",
  "mobileNumber": "xxxxxx"
}

API Methods

Endpoint	HTTP Method
`/approvedtransactions/generateal`	POST

Request Body

Parameter	Type	Description
`storeId`	ObjectId	Merchants store ID
`total`	Float	Total transaction amount
`transactionNumber`	String	Transaction Number

(2) Pre-approve Transaction

Preparing the "transaction" which will later be process
-- to create pre transaction in empatkali db --

Example Request (JSON format)

{
  "terminDuration" : 14 || 30,
  "transactionNumber": "xxxxxx",
  "amount": "xxxxxx",
  "user_mobileNumber": "xxxxxx",
  "store": "xxxxxx",
  "md5": "xxxxxx",
  "token": "xxxxxx"
}

API Methods

Endpoint	HTTP Method
`/preapprovedtransactions?store=true`	POST

Request Body

Parameter	Type	Description
`terminDuration`	String	Termin 14 for 2 weeks pay or 30 for 1 month pay
`transactionNumber`	String	Transaction Number
`amount`	Float	Total transaction amount
`user_mobileNumber`	String	User Mobile Number
`store`	ObjectId	Merchants store ID
`md5`	String	generated if user has been successfully authenticated (refer to step 1)
`token`	String	this is generated inside mobile appss which the user will provide

(3) Pre-approve Transaction Token

Generate token
-- to initial pre approvetransaction to process to empatkali sysmte with throw CVV card user --

Example Request (JSON format)

{
  "storeId": "xxxxxx",
  "transactionNumber": "xxxxxx",
  "card_cvv": "xxxxxx"
}

API Methods

Endpoint	HTTP Method
`/preapprovedtransactions/token`	POST

Request Body

Parameter	Type	Description
`storeId`	ObjectId	Merchants store ID
`transactionNumber`	String	Transaction Number
`card_cvv`	String	User input his/her CVV

(4) Process Transaction

This will finalize the transaction process.
-- to finalize transaction and checking the transaction already process pay from user or not, if already pay transaction create if not transaction not transaction failure --

Example Request (JSON format)

{
  "transactionNumber": "xxxxxx"
}

API Methods

Endpoint	HTTP Method
`/approvedtransactions/v3`	POST

Request Body

Parameter	Type	Description
`transactionNumber`	String	Transaction Number

Custom Field

Response

{
  "transactionNumber": "__yourTransactionID__",
  "amount": 1000000,
  "user_mobileNumber": "__mobilenumber__",
  "store": "__yourStore_Id__",
  "md5": "__md5generate__",
  "token": "__paymentPIN__"
  "customField1": xxxxxxxxx,
  "customField2": xxxxxxxxx,
  "customField3": xxxxxxxxx,
  "customField4": xxxxxxxxx,
  "customField5": xxxxxxxxx
}

Set Custom Fields is a feature that enables merchants to charge a transaction with a unique data according to the merchant's need. EMPATKALI provides merchants with 5 custom fields that can be used for various utilities. Convention of a custom field can be set when merchant request transaction

JSON Attribute	Type	Description
customField1	String()	The value of custom field 1
customField2	String()	The value of custom field 2
customField3	String()	The value of custom field 3
customField4	String()	The value of custom field 4
customField5	String()	The value of custom field 5

Frontend Integration

Overview

Add this before </head> tag

<link rel="stylesheet" href="https://empatkali.co.id/__d/payment.css" />

Add this before </body> tag

<!--
  This a sample Checkout Button EMPATKALI

  "href" attribute is pointing to
  "https://sandbox-portal.empatkali.co.id"

  having required query strings i.e.
  - store_id
  - total (total amount of the transaction)
  - Add transaction Id
  - Add Redirect URL

  Note: 
  - Add transaction Id
    - if you throw this parameter system will use this if not system  will generate the orderId / transaction Number
    - ex: transaction_id=__yourOrderID__
  - Add Redirect URL
    - transaction already process system will redirecting to url you set
    - ex: redirect_url = __linkRedirect__ -- if you throw this parameter after
  - Generate md5 value
    - do POST method with using this endpoint: "https://sb-api.empatkali.co.id/merchant/api/approvedtransactions/generateal"
    ** Required Params:
      - storeId
      - total
      - transactionNumber

    Ex:
    {
      "storeId": “123019203dadjajda80f904df",
      "total": "100000",
      "transactionNumber”:”invoice001"
    }
-->
<button class='iframe'
        href="https://sandbox-portal.empatkali.co.id/index.php?total=__amount__&store_id=__yourStoreId__&transaction_id=__transactionId__&md5=md5ValueFrom_GenerateALAPI&redirect_url=__linkRedirect__&base_url=urlMerchantWebsite">
    <img src="https://empatkali.co.id/assets/img/logo-final.png" style="width: 16px; height: 16px"/>
    EMPATKALI
</button>

<!-- this will import the necessary javascript -->
<script src="https://empatkali.co.id/__d/payment.js"></script>

<!-- feel free to adjust the dimension -->
<script>
  $(document).ready(function(){
    $(".iframe").colorbox({
      iframe:true,
      width:"500px",
      height:"580px",
      escKey: false,
      overlayClose: false
    });
  });
</script>

A Process flow diagram on how to Create Payment Transaction
(click image to enlarge)

Overview :
1. User send value amount and phone number OR Scan QR
2. E-Commerce System Send to Empatkali {/api/preapprovedtransactions} Send value : storeId, secret, total, transactionNumber
3. Empatkali will send response for create payment process
4. if process Create Payment 'Success' E-Commerce connect socket to listen process from server 4x
5. Send callback to E-Commerce

formula generate code md5 (PHP);

$md5 = md5($_POST['amount'] . $_POST['invoice_number'] . $_POST[Storeid] . Secret');

Redirect Integration Process

Overview

Flow on how the redirect integration process
(click image to enlarge)

User transacts to any merchant supported by Empatkali
Merchant will then send request to Empatkali API to create payment
Empatkali will send response after processing the create payment request from merchant
If success, merchant will connect via socket and be process by Empatkali server
Once processed, Empatkali will send a callback

Implementation

A step-by-step implementation of the redirect integration process.

1. Request an MD5

Create the md5 value as required for the next step.

Sample Request

{
  "storeId": "1234567890",
  "total": "1000",
  "transactionNumber":"4x.1234567"
}

Sample Response

{
  "md5": "aa9cd16bbbe3227b5bacfed0c331a006",
  "qr": "data:image/png;base64,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"
}

API Method

Endpoint	HTTP Method
`BASE_URL/approvedtransactions/generateal`	POST

Request Body

Parameter	Type	Description
`storeId`	ObjectId	Merchants store ID
`total`	Float	Total transaction amount
`transactionNumber`	String	Transaction Number

See sample request and response on the right side.

2. Checkout EmpatKali as payment option

This will open EmpatKali payment portal where users can pay using their EmpatKali account.

Use the base URL below according to the environment you're using.

Sandbox
https://sandbox-portal.empatkali.co.id

Production
https://portal2.empatkali.co.id

Required Query String Parameter

Parameter	Type	Description
total	Float	Transactions total amount
store_id	String	Store Id provided by EmpatKali
transaction_id	String	Transaction id
md5	String	Generated from step #1
base_url	String	merchants e-commerce base url ex. www.baseurl.com
redirect_url	String	URL where the user will be redirected when the transaction was a success
failed_url	String	URL where the user will be redirected when the transaction failed
checkout_name	String	Concatenated User's first name and last name inputted during checkout
checkout_email	String	User's email inputted during checkout
checkout_shipping_address	String	Concatenated User's address inputted during checkout, i.e. address, country, and alike
checkout_phone_number (sandbox)	String	User's phone number
sku_category	String	category
sku_price	Float	Price
sku_quantity	Integer	Quantity
sku_id	String	SKU Id
sku_product_name	String	Product name

Example Usage

https://sandbox-portal.empatkali.co.id/index.php?total=100000&store_id=5ef16ac5bc15f2396dd7635b&md5=02be278055aa592a1c1e4a0d195f3c5e&transaction_id=MAPTRX001&redirect_url=https://www.google.com/&base_url=https://www.google.com&failed_url=https://failed.com&checkout_name=Jane%20Doe&[email protected]&checkout_shipping_address=Jakarta&20Indonesia&sku_category=pants&sku_price=1200&&sku_quantity=1&sku_id=a1234&sku_product_name=pants

Sample Response

{
    "gross_amount": 344000,
    "status_message": "success",
    "status_code": 200,
    "success": true,
    "transaction_number": "PL1234",
    "transaction_id": "EMPAT.PL1234"
}

After that, it'll redirect to the specified payment portal which the user will then input their 4x credentials and other necessary steps for payment validation. Everything will be processed until a response is given, determining if the transaction was successful or not. See sample response.

Override Notification URL

Merchant can opt to change or add custom notification urls on every transaction. It can be achieved by adding additional HTTP headers into charge request.

There are two headers we provide:

X-Append-Notification
X-Override-Notification

Both header can only receive up to maximum of 3 urls.

Sample case

Assuming merchant has set https://example.com as their notification url on the dashboard.

If they set X-Append-Notification with values https://example.com/test1, https://example.com/test2. Then every HTTP notification for that specific transaction will be sent to:

https://example.com
https://example.com/test1, and
https://example.com/test2

Else if they set X-Override-Notification with values https://example.com/test1, http://example.com/test2. Then, every HTTP notification for that specific transaction will be sent to:

https://example.com/test1 and
https://example.com/test2

(NEW) Redirect Integration Process

Overview

Flow on how the redirect integration process
(click image to enlarge)

User transacts to any merchant supported by Empatkali
Merchant will then send request to Empatkali API to create payment
Empatkali will send response after processing the create payment request from merchant
If success, merchant will connect via socket and be process by Empatkali server
Once processed, Empatkali will send a callback

Implementation

A step-by-step implementation of the NEW redirect integration process.

1. Authenticate

Validate your credentials i.e. store id and secret key for authentication. If success, the API will return a redirect_url response that contains the URL value which will then be used for redirection to the portal.

API Base URL
Sandbox : https://sb-transaction.empatkali.co.id/api
Production : https://transaction.empatkali.co.id/api

API Method

Endpoint	HTTP Method
`BASE_URL/generate_authentication`	POST

Request Header

Use Basic authentication scheme for authorization and use the store id and the secret key provided to you by EmpatKali as the username (store id) and password (secret key). For example on how to implement Basic authentication, click this link.

Request Body

Parameter	Type	Description
`transactionNumber`	String	Transaction Number
`total`	Float	Total transaction amount
`detail`	Object
`detail.items`	Array	Contains SKU data
`detail.otherFields`	Object

See sample on the right side regarding the required fields under that parameter.

Sample Request

{
    "transactionNumber": "TESTONAL007",
    "total": 1000000,
    "redirectURL": "https://redirect-after-success.com",
    "failedURL": "https://redirect-after-failed.com",
    "detail": {
        "items": [
            {
                "sku_id": "sku_id",
                "sku_product_name": "sku_product_name",
                "sku_category": "sku_category",
                "sku_price": "testing",
                "sku_quantity": "sku_quantity"
            },
            {
                "sku_id": "sku_id",
                "sku_product_name": "sku_product_name",
                "sku_category": [
                    "sku_category",
                    "sku_category",
                    "sku_category"
                ],
                "sku_price": "testing",
                "sku_quantity": "sku_quantity"
            },
            {
                "sku_id": "sku_id",
                "sku_product_name": "sku_product_name",
                "sku_category": [
                    "sku_category",
                    "sku_category"
                ],
                "sku_price": "testing",
                "sku_quantity": "sku_quantity"
            }
        ],
        "otherFields": {
            "checkout_name": "firstname and last name user",
            "checkout_email": "email user on checkout",
            "checkout_phone": "123456",
            "checkout_shipping_address": {
                "street": "Jl. Sultan Sharir",
                "number": "666",
                "city": "jakarta",
                "postal_code": "12210",
                "province": "jakarta"
            },
            "billing_name": "firstname and last name user",
            "billing_email": "email user on checkout",
            "billing_phone": "123456",
            "billing_shipping_address": {
                "street": "Jl. Sultan Sharir",
                "number": "666",
                "city": "jakarta",
                "postal_code": "12210",
                "province": "jakarta"
            }
        }
    }
}

Sample Response

{
    "redirect_url": "https://release-empatkali.co.id/5fd3c2c74c96a68f41d6dcc5/fa1fdbe552c62b16c1c96992150dc894",
    "qr": "data:image/png;base64,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"
}

2. Redirection

If verified by our system (Step 1), you will be provided a response from the API, and one of it is the redirect_url. You may use that response to redirect to EmpatKali portal.

Override Notification URL

Merchant can opt to change or add custom notification urls on every transaction. It can be achieved by adding additional HTTP headers into charge request.

There are two headers we provide:

X-Append-Notification
X-Override-Notification

Both header can only receive up to maximum of 3 urls.

Sample case

Assuming merchant has set https://example.com as their notification url on the dashboard.

If they set X-Append-Notification with values https://example.com/test1, https://example.com/test2. Then every HTTP notification for that specific transaction will be sent to:

https://example.com
https://example.com/test1, and
https://example.com/test2

Else if they set X-Override-Notification with values https://example.com/test1, http://example.com/test2. Then, every HTTP notification for that specific transaction will be sent to:

https://example.com/test1 and
https://example.com/test2

PDP Snippet Custom Merchant

Overview

Integrating EmpatKali PDP (Product Display Page) Snippet for custom website.

For other supported e-commerce platforms:
- WooCommerce
- Shopify

Sample screenshot of how it should look (click image to enlarge)

Implementation

Below are the steps on implementing the PDP

(1) Copy the text

Make sure to copy the provided text below depending on the language you are using. Currently we support 2 versions i.e. Bahasa and English.

English
or 4 interest-free payment of IDR (Amount of item / 4) with Info

Bahasa
atau 4 kali cicilan 0% Rp (nilai item / 4) pakai with Info lebih lanjut

For the EmpatKali logo, you may download it here

When "info" is clicked, it should trigger a popup that contains EmpatKali information. You may use vanilla JS or a variety of libraries such as Fancybox for example, or use bootstrap modal. Then inside that modal, just create an iframe and call the URL that contains EmpatKali information (see below for the link) based on the language that you support (Bahasa or English version).

For Bahasa
https://static.empatkali.co.id/info-lebih-lanjut.html

For English
https://static.empatkali.co.id/en/info-lebih-lanjut.html

(3) That's it

WooCommerce Integration

Overview

Install EmpatKali plugin as one of your payment gateway during checkout.

Download the plugin here
https://wordpress.org/plugins/woo-empatkali-checkout-gateway/

Usage

Step By Step

1. After Download and install 
2. In side Menu Wordpress choose woocomerce and then click sub menu setting
3. then click payment tab -> enable radio button
4. then click empatkali woocomerce plugin -> input storeId and 
   secret key ( get from email : Subject create Store )

Follow instructions below on how to setup EmpatKali on WooCommerce.

Enabling the plugin (click image to enlarge)

Setting up the payment gateway
Input the Store Id and Secret Key on the right environment field (click image to enlarge).

Sample transaction using Empatkali payment gateway (click image to enlarge)
```

WooCommerce Product Snippet Integration

Overview

Install Product Snippet which will then display to your single product page.

Installation

Download the plugin by clicking this link then upload the zip file.
Just activate it, no dependencies required, no codes to embed
Done!

Shopify

Snippet Integration on Product Page

Copy the codes (Step #1)

<script type="text/javascript">
// Non-editable fields
var empatkali_shop_currency = {{ shop.currency | json }};
var empatkali_shop_money_format = {{ shop.money_format | json }};
var empatkali_shop_permanent_domain = {{ shop.permanent_domain | json }};
var empatkali_theme_name = {{ theme.name | json }};
var empatkali_product = {{ product | json }};
var empatkali_current_variant = {{ product.selected_or_first_available_variant | json }};
var empatkali_cart_total_price = {{ cart.total_price | json }};
var empatkali_js_snippet_version = '1.0.0';
</script>

<script type="text/javascript" src="https://static.empatkali.co.id/shopify-empatkali.js"></script>

The Empatkali logo and instalment amounts will appear on the Shopify Product Pages.
Note: The display may differ depending on site-specific theme and layout.

Configuration

Completing the steps on the right section will position the Empatkali Product Page assets on your Shopify website.

Copy the codes on the right side.
Navigate to Shopify Admin.
Navigate to: ‘Sales Channels‘ > ‘Online Store‘ > ‘Themes‘.
Navigate to ‘Actions’ > ‘Edit Code’.
Under the ‘Layout’ folder, click on ‘theme.liquid’.
Scroll to the bottom of the ‘theme.liquid’ file.
Paste the copied text (Step 1), at the bottom of the ‘theme.liquid’ file.
Click Save
Navigate to the website and review the product page for Empatkali assets. Example below

Sirclo Integration

Overview

Empatkali payment gateway will allow you to purchase products on your website during checkout

Usage

Step By Step

1. Go to Sirclo Admin Dashboard
2. In side Menu Prestashop choose “Setting”
3. Please Search Empatkali and Check the checkbox to allow user to use Empatkali Payment 
4. Then input Store ID and Secret Key (get from email with Subject Create Store)
5. Then Click SAVE

In your Sirclo payment settings, input the required fields such as the idStore and secret key and make sure that it is working. If all is well, then you should see Empatkali as one of your payment gateway during checkout.

See screenshots below

STEP 01 (click image to enlarge)

STEP 02 (click image to enlarge)

PRESTASHOP Integration

Overview

Empatkali payment gateway will allow you to purchase products on your website during checkout

you can find our PRESTASHOP plugin with click here

Usage

Step By Step

1. After download our PRESTASHOP PLUGIN then go to Prestashop Admin
2. In side Menu Prestashop choose “Module and Services”then click submenu “Modul and Service”
3. Then click “Add a New Module” 
4.  Please upload .zip that downloaded before and click Upload This Module
5.  Then in Module and Services Page there several module list, search Empatkali plugin that already uploaded and then click “Configure” 
6.  Input Store ID and Secret Key (get from email with Subject Create Store)
7.  Then Click SAVE

In your PRESTASHOP payment settings, input the required fields such as the idStore and secret key and make sure that it is working. If all is well, then you should see Empatkali as one of your payment gateway during checkout.

See screenshots below

STEP 01 (click image to enlarge)

STEP 02 (click image to enlarge)

QR Code Integration

Process Flow Diagram

A Process flow diagram on how to integrate qr code to your app
(click image to enlarge)

Below are the snippets and instructions to follow on how to (1) generate qr code which will then be used for (2) socket implementation.

(1) Generate QR

Generate a QR code

Sample Request

{
  "storeId": "xxxxxxxxxxxxxxxxx",
  "total": "1000000",
  "transactionNumber":"AABBCC123456"
  // note : aditional parameter
  "customField1": xxxxxxxxx,
  "customField2": xxxxxxxxx,
  "customField3": xxxxxxxxx,
  "customField4": xxxxxxxxx,
  "customField5": xxxxxxxxx
}

Sample Response

{
    "md5": "f9fe0f79ddef11c1590980267662608b",
    "qr": "data:image/png;base64,A3lAvp/2dqdlAAAAAElFTkSuQmCC....."
}

Endpoint	HTTP Method
`/api/approvedtransactions/generateal`	POST

Keep the qr value from the response for creating a transaction.

(2) Socket Implementation

This is the example for how to implement qr code with socket,

HTML [QR CODE PAYMENT SAMPLE PAGE]

<html>

<head>
  <style>
    body {
      font-family: Arial, Helvetica, sans-serif;
    }

    /* The Modal (background) */
    .modal {
      display: none;
      /* Hidden by default */
      position: fixed;
      /* Stay in place */
      z-index: 1;
      /* Sit on top */
      padding-top: 100px;
      /* Location of the box */
      left: 0;
      top: 0;
      width: 100%;
      /* Full width */
      height: 100%;
      /* Full height */
      overflow: auto;
      /* Enable scroll if needed */
      background-color: rgb(0, 0, 0);
      /* Fallback color */
      background-color: rgba(0, 0, 0, 0.4);
      /* Black w/ opacity */
    }

    /* Modal Content */
    .modal-content {
      background-color: #fefefe;
      margin: auto;
      padding: 20px;
      border: 1px solid #888;
      width: 80%;
    }

    /* The Close Button */
    .close {
      color: #aaaaaa;
      float: right;
      font-size: 28px;
      font-weight: bold;
    }

    .close:hover,
    .close:focus {
      color: #000;
      text-decoration: none;
      cursor: pointer;
    }
  </style>

</head>

<body>
  <h2>QR CODE PAYMENT SAMPLE PAGE</h2>
  <br><br>

  <!-- <button id="myBtn">Open Modal</button> -->
  <table>
    <tr>
      <td>Transaction Number</td>
      <td>:</td>
      <td><input type="text" name="transactionnumber" value="123123" id="transactionnumber"></td>
    </tr>
    <tr>
      <td>Total</td>
      <td>:</td>
      <td><input type="number" name="total" value="100000" id="total"></td>
    </tr>
    <tr>
      <td colspan='3'><button onclick="generate()">Generate</button></td>
    </tr>
  </table>
  <br><br><br>

  <!-- The Modal -->
  <div id="myModal" class="modal">

    <!-- Modal content -->
    <div class="modal-content">
      <center>
        <span class="close">&times;</span>
        <p id="free_text"></p>
      </center>
    </div>

  </div>

  <div id="transaction-modal" class="modal">

    <!-- Modal content -->
    <div class="modal-content">
      <br><br>

      <p><b>Scan this qr code with your EmpatKali mobile apps</b></p>

      <center>
        <img id="qr" name="qr">
      </center>
    </div>

  </div>


  <script type="text/javascript">
    var websocket;
    var storeId = "__yourstoreId__";
    var storeSecret = "__yourstoreSecret__";
    var user_mobileNumber = "__userMobileNumber__";
    var md5 = "";

    // MODAL ASSETS
    // Get the modal
    var modal = document.getElementById('myModal');

    // Get the button that opens the modal
    // var btn = document.getElementById("myBtn");

    // Get the <span> element that closes the modal
    var span = document.getElementsByClassName("close")[0];

    // When the user clicks the button, open the modal 
    // btn.onclick = function() {
    //   modal.style.display = "block";
    // }

    // When the user clicks on <span> (x), close the modal
    span.onclick = function () {
      modal.style.display = "none";
    }

    // When the user clicks anywhere outside of the modal, close it
    window.onclick = function (event) {
      if (event.target == modal) {
        modal.style.display = "none";
      }
    }

    function myFunction() {
      /* Get the text field */
      var copyText = document.getElementById("token");

      /* Select the text field */
      copyText.select();

      /* Copy the text inside the text field */
      document.execCommand("copy");

      /* Alert the copied text */
      document.getElementById('wording').innerHTML = 'Copied';
      document.getElementById('wording').style.color = getRandomColor();
    }

    function getRandomColor() {
      var letters = '0123456789ABCDEF';
      var color = '#';
      for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
      }
      return color;
    }

    function generate() {
      var datas = {
        "storeId": storeId,
        "secret": storeSecret,
        "total": document.getElementById('total').value,
        "transactionNumber": document.getElementById('transactionnumber').value
      }

      var xhttp = new XMLHttpRequest();
      xhttp.open("POST", "http://sb-api.empatkali.co.id/merchant/api/approvedtransactions/generateal");
      xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
      xhttp.send(JSON.stringify(datas));
      xhttp.onreadystatechange = function () {
        if (xhttp.readyState == XMLHttpRequest.DONE) {
          var resp = JSON.parse(xhttp.responseText);
          md5value = resp.md5;
          document.getElementById('qr').src = resp.qr;

          document.getElementById('transaction-modal').style.display = "block";
        }
      }
    }

    function socketMessageListener(evt) {
      // sample: {
      //   "transaction_number": String,
      //   "success": Boolean,
      //   "status_code": String,
      //   "status_message": String
      // }
      var message = JSON.parse(evt.data);

      switch (message.type) {
        case 'validateClient':
          /**
           * message
           * {
           *    type: 'validateClient',
           *    store: {id: <String>, secret: <String>}
           *    clientType: <String Enum['store']>
           * }
           */
          modal = document.getElementById('transaction-modal');
          modal.style.display = "none";
          modal = document.getElementById('myModal');

          if (message.success) {
            document.getElementById('free_text').innerHTML = 'Success connecting';
            document.getElementById('free_text').style.color = "green";
          } else {
            document.getElementById('free_text').innerHTML = 'Failed connecting';
            document.getElementById('free_text').style.color = "red";
          }

          modal.style.display = "block";
          break;

        case 'paymentPin':
          /**
           * message
           * {
           *    succes: true,
           *    type: 'paymentPin',
           *    detail : {
           *      expiredIn: tokens.delay,
           *      otp: tokens.otp
           *    }
           * }
          */
          if (message.success && message.type === 'paymentPin') {
            document.getElementById('expired').innerHTML = message.detail.expiredIn;
            document.getElementById('token').value = message.detail.otp;
            // modal.style.display = "block";
          }
          break;

        case 'createPayment':
          modal.style.display = "none";
          modal = document.getElementById('myModal');

          if (message.success) {
            document.getElementById('free_text').innerHTML = 'Transaction ' + message.detail.transaction_number + 'Success';
            document.getElementById('free_text').style.color = "green";
          } else {
            document.getElementById('free_text').innerHTML = 'Transaction ' + message.detail.transaction_number + 'Failed';
            document.getElementById('free_text').style.color = "red";
          }

          modal.style.display = "block";
          break;
        default:
          alert(JSON.stringify(message));
      }
    }

    function createTransaction() {
      var datas = {
        "transactionNumber": document.getElementById('transactionnumber').value,
        "amount": parseInt(document.getElementById('total').value),
        "user_mobileNumber": user_mobileNumber,
        "store": storeId,
        "md5": md5value,
        "token": document.getElementById('paymentpin').value
      }

      var xhttp = new XMLHttpRequest();
      xhttp.open("POST", "http://sb-api.empatkali.co.id/merchant/api/preapprovedtransactions");
      xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
      xhttp.send(JSON.stringify(datas));
      xhttp.onreadystatechange = function () {
        if (xhttp.readyState == XMLHttpRequest.DONE) {
          var resp = JSON.parse(xhttp.responseText);

          if (resp.success && resp.status_code === '200') {

            modal.style.display = "none";
            modal = document.getElementById('myModal');

            document.getElementById('free_text').innerHTML = 'Success creating transaction. now connecting to socket. . .';
            document.getElementById('free_text').style.color = "green";

            modal.style.display = "block";

            if (websocket) console.error('Disconnected.');
            var urinya = 'ws://sb-api.empatkali.co.id:4041/ws/approvedtransactions/paymentcode/' + user_mobileNumber;
            websocket = new WebSocket(urinya);

            websocket.addEventListener('open', socketOpenListener);

            // websocket.onmessage = function (evt) { };
            websocket.addEventListener('message', socketMessageListener);

          } else {
            document.getElementById('free_text').innerHTML = 'Failed creating transaction';
            document.getElementById('free_text').style.color = "red";
            modal.style.display = "block";
          }
        }
      }
    }

    function socketOpenListener(evt) {
      var a = {
        type: 'validateClient',
        store: {
          id: storeId,
          secret: storeSecret
        },
        clientType: 'store'
      };

      console.log('Connected');
      console.log('socket.readyState: ' + websocket.readyState);

      return setTimeout(() => websocket.send(JSON.stringify(a)), 1000);
    }
  </script>

</body>

</html>

Custom Field

Response

{
  "storeId": __yourStore_Id__,
  "secret": __yourstore_secret__,
  "total": 1000000,
  "transactionNumber": __yourTransactionID__,
  "customField1": xxxxxxxxx,
  "customField2": xxxxxxxxx,
  "customField3": xxxxxxxxx,
  "customField4": xxxxxxxxx,
  "customField5": xxxxxxxxx
}

JSON Attribute	Type	Description
customField1	String()	The value of custom field 1
customField2	String()	The value of custom field 2
customField3	String()	The value of custom field 3
customField4	String()	The value of custom field 4
customField5	String()	The value of custom field 5

Callback

Response

{
  "status_message": String
  "status_code": String,
  "success": Boolean,
  "transaction_number": String,
  "transaction_id": String,
}

Status Code	Success	Status Message
200	true	Success
201	false	OTP not valid
202	false	Duplicate Invoice Number
203	false	Insufficient Users Balance
204	false	MD5 not valid
205	false	User is not allowed
206	false	Cannot charge the card
207	false	User not found
208	false	Store not found
209	false	Card not found
210	false	Unexpected error
300	false	Transaction cancelled

Dependency for testing

This is mobile number of EMPATKALI active user, for mechant doing testing approval transaction

0817345545 -- Dana
087897971805 -- Card

You can take the payment code on store dashboard with credential we already sent to you after you create the store account on your merchant portal. To do generate payment code you just insert the the mobile number and click generate, the payment code will show to you and can use.

Dashboard on boarding

(1) Merchant Dashboard

Merchant dashboard adalah dashboard yang disediakan oleh Empatkali dimana didalam dashboard ini memuat berbagai informasi mengenai suatu merchant yang sudah terintegrasi dengan menggunakan EMPATKALI, seperti informasi untuk seluruh sales order di semua store yang dimiliki oleh merchant,store yang dimiliki merchant, detail dari merchant dll. Merchant Dashboard ini dapat diakses di url https://merchant.empatkali.co.id Untuk dapat masuk ke merchant dashboard diperlukan Login dengan menggunakan username atau alamat email dan juga password. Merchant Dashboard

Homepage Merchant Dashboard -> Choose Account Setting menu

Klik Edit -> Input Nama Merchant , Nama Penanggung Jawab, No Telp, Alamat email, Aamat website.
**for field Fav Icon and image will provide by us -> Save

Then in menu store -> Klik ADD

Then Input field Nama, Email, Username No Telp(Mobile), Type store (Online atau Offline) dan password -> ADD

(2) Store Dashboard

Store Dashboard link here.

Homepage Merchant Dashboard -> Choose Account Setting menu

Klik Edit -> Input Nama Merchant , Nama Penanggung Jawab, No Telp, Alamat email, Aamat website.
**for field Fav Icon and image will provide by us -> Save

Introduction

Overview

Supported Browsers

On Board With EMPATKALI

Backend Integration

(1) User Validation

API Methods

Request Body

(2) Pre-approve Transaction

API Methods

Request Body

(3) Pre-approve Transaction Token

API Methods

Request Body

(4) Process Transaction

API Methods

Request Body

Custom Field

Frontend Integration

Overview

Redirect Integration Process

Overview

Implementation

1. Request an MD5

API Method

Request Body

2. Checkout EmpatKali as payment option

Required Query String Parameter

Override Notification URL

Sample case

(NEW) Redirect Integration Process

Overview

Implementation

1. Authenticate

API Method

Request Header

Request Body

2. Redirection

Override Notification URL

Sample case

PDP Snippet Custom Merchant

Overview

Implementation

(1) Copy the text

(2) Popup Content

(3) That's it

WooCommerce Integration

Overview

Usage

WooCommerce Product Snippet Integration

Overview

Installation

Shopify

Snippet Integration on Product Page

Configuration

Sirclo Integration

Overview

Usage

PRESTASHOP Integration

Overview

Usage

QR Code Integration

Process Flow Diagram

(1) Generate QR

(2) Socket Implementation

Custom Field

Callback

Dependency for testing

Dashboard on boarding

(1) Merchant Dashboard

(2) Store Dashboard