@transak/transak-sdk - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

package.json

 {
   "name": "@transak/transak-sdk",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Transak SDK that allows you to easily integrate the fiat on/ramp",
   "main": "src/index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "babel src -d build"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Transak/transak-sdk.git"
+  },
   "keywords": [
@@ -21,3 +26,11 @@ "fiat",
     "request": "^2.88.2"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.8.4",
+    "@babel/core": "^7.8.4",
+    "@babel/node": "^7.8.4",
+    "@babel/preset-env": "^7.8.4",
+    "babel-cli": "^6.26.0",
+    "babel-preset-env": "^1.7.0"
   }
 }

README.md

@@ -1,2 +0,46 @@
-# transak-sdk
- Transak SDK that allows you to easily integrate the fiat on/ramp
+# Transak SDK
+[![Build](https://travis-ci.org/joemccann/dillinger.svg)]()
+A JavaScript library for decentralised applications to onboard their global user base with fiat currency.
+### Installation
+To use the Transak widget with your React application, you will need to use `[@transak/transak-sdk](https://www.npmjs.com/package/@transak/transak-sdk)` (Transak’s  JavaScript SDK).
+Add the Transak SDK as a dependency using `yarn` or `npm`:
+```sh
+# Using yarn
+$ yarn add @transak/transak-sdk
+
+# Using npm
+$ npm install @transak/transak-sdk
+```
+### Example usage
+```sh
+import transakSDK from '@transak/transak-sdk'
+
+let transak = new transakSDK({
+    apiKey: '',  // Your API Key
+    environment: 'PRODUCTION', // STAGING/PRODUCTION
+    defaultCryptoCurrency: 'ETH',
+    walletAddress: '', // Your customer's wallet address
+    themeColor: '000000', // App theme color
+    fiatCurrency: '', // INR/GBP
+    email: '', // Your customer's email address
+    redirectURL: '',
+    hostURL: window.location.origin,
+    widgetHeight: '550px',
+    widgetWidth: '450px'
+});
+
+transak.init();
+
+// To get all the events
+transak.on(transak.ALL_EVENTS, (data) => {
+		console.log(data)
+});
+
+// This will trigger when the user marks payment is made.
+transak.on(transak.EVENTS.TRANSAK_ORDER_SUCCESSFUL, (orderData) => {
+    console.log(orderData);
+    transak.close();
+});
+```
+
+For in-depth instructions on integrating Transak, view [our complete documentation.](https://transak.com/integrate)

src/index.js

@@ -8,81 +8,76 @@ import events from 'events';
 const eventEmitter = new events.EventEmitter();
-
-class TransakSDK {
-    constructor(partnerData) {
-        this.partnerData = partnerData;
-        this.isInitialised = false;
-        this.EVENTS = EVENTS;
-        this.ALL_EVENTS = '*';
-        this.ERROR = 'TRANSAK_ERROR'
-    }
-
-    on(type, cb) {
-        if (type === this.ALL_EVENTS){
-            for (let eventName in EVENTS){
-                eventEmitter.on(EVENTS[eventName], cb);
-            }
+function TransakSDK(partnerData) {
+    this.partnerData = partnerData;
+    this.isInitialised = false;
+    this.EVENTS = EVENTS;
+    this.ALL_EVENTS = '*';
+    this.ERROR = 'TRANSAK_ERROR'
+}
+TransakSDK.prototype.on = function (type, cb) {
+    if (type === this.ALL_EVENTS) {
+        for (let eventName in EVENTS) {
+            eventEmitter.on(EVENTS[eventName], cb);
         }
-        console.log(type,'type')
-        if (EVENTS[type]) eventEmitter.on(type, cb);
-        if (type === this.ERROR) eventEmitter.on(this.ERROR, cb);
     }
-
-    init() {
-        this.modal(this);
-    }
-
-    close(){
-        let modal = document.getElementById("transakFiatOnOffRamp");
-        modal.style.display = "none";
-        modal.innerHTML = "";
-    }
-
-
-    async closeRequest() {
-        let iframeEl = document.getElementById('transakOnOffRampWidget');
-        if (iframeEl) iframeEl.contentWindow.postMessage({
-            event_id: EVENTS.TRANSAK_WIDGET_CLOSE_REQUEST,
-            data: true
-        }, '*');
-    }
-
-    async modal() {
-        try {
-            if (this.partnerData) {
-                let {url, width, height, partnerData} = await generateURL(this.partnerData);
-                let wrapper = document.createElement('div');
-                wrapper.id = "transakFiatOnOffRamp";
-                wrapper.innerHTML = `<div class="transak_modal-overlay" id="transak_modal-overlay"></div><div class="transak_modal" id="transak_modal"><div class="transak_modal-content"><span class="transak_close">${closeSVGIcon}</span><div class="transakContainer"><iframe id="transakOnOffRampWidget" src="${url}" style="width: ${width}; height: ${height}"></iframe></div></div></div>`;
-                let container = document.getElementsByTagName("body");
-                if (!container) container = document.getElementsByTagName("html");
-                if (!container) container = document.getElementsByTagName("div");
-                await container[0].appendChild(wrapper);
-                await setStyle(this.partnerData.themeColor, width, height);
-                let modal = document.getElementById("transakFiatOnOffRamp");
-                let span = document.getElementsByClassName("transak_close")[0];
-                modal.style.display = "block";
-                this.isInitialised = true;
-                eventEmitter.emit(EVENTS.TRANSAK_WIDGET_INITIALISED, {status: true, eventName : EVENTS.TRANSAK_WIDGET_INITIALISED});
-                // When the user clicks on <span> (x), close the modal
-                span.onclick = () => {
-                    return this.closeRequest()
-                }
-                // When the user clicks anywhere outside of the modal, close it
-                window.onclick = (event) => {
-                    if (event.target === document.getElementById("transak_modal-overlay")) this.closeRequest()
-                }
-                if (window.addEventListener) window.addEventListener("message", handleMessage);
-                else window.attachEvent("onmessage", handleMessage);
+    console.log(type, 'type')
+    if (EVENTS[type]) eventEmitter.on(type, cb);
+    if (type === this.ERROR) eventEmitter.on(this.ERROR, cb);
+}
+TransakSDK.prototype.init = function () {
+    this.modal(this);
+}
+TransakSDK.prototype.close = async function () {
+    let modal = document.getElementById("transakFiatOnOffRamp");
+    await modal.style.display = "none";
+    await modal.innerHTML = "";
+    await modal.remove();
+}
+TransakSDK.prototype.closeRequest = function () {
+    let iframeEl = document.getElementById('transakOnOffRampWidget');
+    if (iframeEl) iframeEl.contentWindow.postMessage({
+        event_id: EVENTS.TRANSAK_WIDGET_CLOSE_REQUEST,
+        data: true
+    }, '*');
+}
+TransakSDK.prototype.modal = async function () {
+    try {
+        if (this.partnerData) {
+            let {url, width, height, partnerData} = await generateURL(this.partnerData);
+            let wrapper = document.createElement('div');
+            wrapper.id = "transakFiatOnOffRamp";
+            wrapper.innerHTML = `<div class="transak_modal-overlay" id="transak_modal-overlay"></div><div class="transak_modal" id="transak_modal"><div class="transak_modal-content"><span class="transak_close">${closeSVGIcon}</span><div class="transakContainer"><iframe id="transakOnOffRampWidget" src="${url}" style="width: ${width}; height: ${height}"></iframe></div></div></div>`;
+            let container = document.getElementsByTagName("body");
+            if (!container) container = document.getElementsByTagName("html");
+            if (!container) container = document.getElementsByTagName("div");
+            await container[0].appendChild(wrapper);
+            await setStyle(this.partnerData.themeColor, width, height);
+            let modal = document.getElementById("transakFiatOnOffRamp");
+            let span = document.getElementsByClassName("transak_close")[0];
+            modal.style.display = "block";
+            this.isInitialised = true;
+            eventEmitter.emit(EVENTS.TRANSAK_WIDGET_INITIALISED, {
+                status: true,
+                eventName: EVENTS.TRANSAK_WIDGET_INITIALISED
+            });
+            // When the user clicks on <span> (x), close the modal
+            span.onclick = () => {
+                return this.closeRequest()
             }
-        } catch (e) {
-            throw(e)
+            // When the user clicks anywhere outside of the modal, close it
+            window.onclick = (event) => {
+                if (event.target === document.getElementById("transak_modal-overlay")) this.closeRequest()
+            }
+            if (window.addEventListener) window.addEventListener("message", handleMessage);
+            else window.attachEvent("onmessage", handleMessage);
         }
+    } catch (e) {
+        throw(e)
     }
 }
 
-let generateURL = async (configData) => {
+async function generateURL(configData) {
     let partnerData = {}, environment = 'development', queryString = "", width = "100%", height = "100%";
     if (configData) {
         if (configData.apiKey) {
-            if (configData.environment){
+            if (configData.environment) {
                 if (config.ENVIRONMENT[configData.environment]) environment = config.ENVIRONMENT[configData.environment].NAME
@@ -119,3 +114,3 @@ }
 }
-let setStyle = async (themeColor, width, height) => {
+async function setStyle(themeColor, width, height) {
     let style = await document.createElement('style');
@@ -126,4 +121,2 @@ style.innerHTML = getCSS(themeColor, height, width);
 }
-
-
 function handleMessage(event) {
@@ -135,6 +128,9 @@ let environment;
     if (environment) {
-        if (event && event.data && event.data.event_id){
+        if (event && event.data && event.data.event_id) {
             switch (event.data.event_id) {
-                case EVENTS.TRANSAK_WIDGET_CLOSE:{
-                    eventEmitter.emit(EVENTS.TRANSAK_WIDGET_CLOSE, {status: true, eventName : EVENTS.TRANSAK_WIDGET_CLOSE});
+                case EVENTS.TRANSAK_WIDGET_CLOSE: {
+                    eventEmitter.emit(EVENTS.TRANSAK_WIDGET_CLOSE, {
+                        status: true,
+                        eventName: EVENTS.TRANSAK_WIDGET_CLOSE
+                    });
                     let modal = document.getElementById("transakFiatOnOffRamp");
@@ -145,16 +141,28 @@ modal.style.display = "none";
                 }
-                case EVENTS.TRANSAK_ORDER_CREATED:{
-                    eventEmitter.emit(EVENTS.TRANSAK_ORDER_CREATED, {status: event.data.data, eventName : EVENTS.TRANSAK_ORDER_CREATED});
+                case EVENTS.TRANSAK_ORDER_CREATED: {
+                    eventEmitter.emit(EVENTS.TRANSAK_ORDER_CREATED, {
+                        status: event.data.data,
+                        eventName: EVENTS.TRANSAK_ORDER_CREATED
+                    });
                     break;
                 }
-                case EVENTS.TRANSAK_ORDER_CANCELLED:{
-                    eventEmitter.emit(EVENTS.TRANSAK_ORDER_CANCELLED, {status: event.data.data, eventName : EVENTS.TRANSAK_ORDER_CANCELLED});
+                case EVENTS.TRANSAK_ORDER_CANCELLED: {
+                    eventEmitter.emit(EVENTS.TRANSAK_ORDER_CANCELLED, {
+                        status: event.data.data,
+                        eventName: EVENTS.TRANSAK_ORDER_CANCELLED
+                    });
                     break;
                 }
-                case EVENTS.TRANSAK_ORDER_SUCCESSFUL:{
-                    eventEmitter.emit(EVENTS.TRANSAK_ORDER_SUCCESSFUL, {status: event.data.data, eventName : EVENTS.TRANSAK_ORDER_SUCCESSFUL});
+                case EVENTS.TRANSAK_ORDER_SUCCESSFUL: {
+                    eventEmitter.emit(EVENTS.TRANSAK_ORDER_SUCCESSFUL, {
+                        status: event.data.data,
+                        eventName: EVENTS.TRANSAK_ORDER_SUCCESSFUL
+                    });
                     break;
                 }
-                case EVENTS.TRANSAK_WIDGET_OPEN:{
-                    eventEmitter.emit(EVENTS.TRANSAK_WIDGET_OPEN, {status: true, eventName : EVENTS.TRANSAK_WIDGET_OPEN});
+                case EVENTS.TRANSAK_WIDGET_OPEN: {
+                    eventEmitter.emit(EVENTS.TRANSAK_WIDGET_OPEN, {
+                        status: true,
+                        eventName: EVENTS.TRANSAK_WIDGET_OPEN
+                    });
                     break;
@@ -168,5 +176,4 @@ }
 }
-
 export default TransakSDK
 
 

Fixed alerts

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

36928

increased by155.84%

Number of package files

22

increased by83.33%

Lines of code

801

increased by133.53%

Number of lines in readme file

46

increased by1433.33%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

6

increased byInfinity%

No dependency changes