@textback/notification-widget 2.0.1-110361 → 2.0.1-13997

package/src/sdk/sdk.js

@@ -1,49 +1,25 @@
-import apiErrorHandler from "./utils/apiErrorHandler";
+require('es6-promise').polyfill();
 import 'whatwg-fetch';
 
 import Widget from './widget/widget.js';
-import {EVENTS, Observer} from './events/observer.js';
-import {deeplinkUpdater} from './utils/loadDeepLink.js';
-
-require('es6-promise').polyfill();
+import { Observer, EVENTS } from './events/observer.js';
 
 export default class SDK {
     constructor() {
         this.widgets = {};
-        this._deeplinkUpdater = deeplinkUpdater;
     }
 
-    initWidget(config, preventViewCounting = false) {
+    initWidget(config) {
         if (config && config.widgetId) {
             const widget = new Widget(config, this);
             this.widgets[config.widgetId] = widget.initialize();
-            this.widgets[config.widgetId].then(widget => {
-              Observer.trigger(EVENTS.WIDGET_INIT, {widgetId: config.widgetId});
-
-              // First of all, this is a restriction on the count of views for textback settings page ( = for widget preview)
-              if (preventViewCounting) return;
-
-              this.countWidgetView(widget);
-            }, err => console.error(err));
+            this.widgets[config.widgetId].then(widget => Observer.trigger(EVENTS.WIDGET_INIT, { widgetId: config.widgetId }), err => console.error(err));
             return this.widgets[config.widgetId];
         } else {
             throw new Error('Widget id is not defined');
         }
     }
 
-    countWidgetView(widget) {
-        return fetch(`${widget.initialConfig.apiPath}/endUserNotifications/subscriptions/notificationWidget/views`, {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json'
-            },
-            body: JSON.stringify({
-                'accountId': widget.config.accountId,
-                'widgetId': widget.id
-            })
-        }).then(apiErrorHandler);
-    }
-
     getWidget(widgetId) {
         return this.widgets[widgetId] ? this.widgets[widgetId] : null;
     }
@@ -51,17 +27,4 @@ export default class SDK {
     on(eventName, fn) {
         return Observer.on(eventName, fn);
     }
-
-    getDeeplinkUpdater(widgetId) {
-        let _getWidget = this.widgets[widgetId];
-
-        if (!_getWidget) return null;
-
-        return _getWidget.then(x => {
-            return this._deeplinkUpdater(
-                x.initialConfig.apiPath,
-                x.deeplink.split('_')[1]
-            );
-        });
-    }
-}
+}

package/src/sdk/utils/appInsights.js

@@ -36,8 +36,8 @@ const appInsights = {
                     disableAjaxTracking: true,
                     //this url will point to the library - use @dev for testing when updating\editing lib - use @latest for production version of lib
                     //keep in mind that prod widget should always use @latest
-                    url: '//cdn.jsdelivr.net/npm/@textback/notification-widget@latest/src/libraries/ai.1.0.11.js'
-                    // url: '//cdn.jsdelivr.net/npm/@textback/notification-widget@dev/src/libraries/ai.1.0.11.js'
+                    url: '//unpkg.com/@textback/notification-widget@latest/src/libraries/ai.1.0.11.js'
+                    // url: '//unpkg.com/@textback/notification-widget@dev/src/libraries/ai.1.0.11.js'
                     //url: '//localhost:8080/src/libraries/ai.1.0.11.js',
                 });
 

package/src/sdk/utils/cookies.js

@@ -44,24 +44,7 @@ const cookies = {
     */
     deleteCookie: function (name) {
         setCookie(name, "", -1);
-    },
-
-
-    getCookieObject: function () {
-      const result = {};
-
-      document.cookie
-        .split(';')
-        .forEach((cookieItem) => {
-          const separatorPos = cookieItem.indexOf('=');
-          const key = cookieItem.slice(0, separatorPos).trim();
-          const value = cookieItem.slice(separatorPos + 1);
-
-          result[key] = value;
-        });
-
-      return result;
     }
 };
 
-export default cookies;
+export default cookies;

package/src/sdk/utils/loadDeepLink.js

@@ -1,48 +1,21 @@
-'use strict';
-
 import apiErrorHandler from './apiErrorHandler.js';
 
 const cache = {};
 
-export const deeplinkUpdater = (apiPath, deeplink) => {
-  let _promises = [];
-
-  return data => {
-    Promise.all(_promises).then(() => {
-      let _data = JSON.stringify({
-        id: deeplink,
-        insecureContext: { data: data }
-      });
-
-      let _promise = fetch(
-        `${apiPath}/endUserNotifications/deepLinks`,
-        {
-          method: 'PATCH',
-          body: _data
-        }
-      );
-
-      _promises.push(_promise);
-
-      return _promises;
-    });
-  };
-};
-
 export default function loadDeepLink(apiPath, options = {}) {
-  const body = JSON.stringify(options);
+    const body = JSON.stringify(options);
 
-  if (cache[body]) {
-    return cache[body];
-  }
+    if (cache[body]) {
+        return cache[body];
+    }
 
-  cache[body] = fetch(`${apiPath}/endUserNotifications/deepLinks`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json'
-    },
-    body
-  }).then(apiErrorHandler);
+    cache[body] = fetch(`${apiPath}/endUserNotifications/deepLinks`, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body
+    }).then(apiErrorHandler);
 
-  return cache[body];
-};
+    return cache[body];
+};

package/src/sdk/widget/widget.js

@@ -14,179 +14,127 @@ import appInsights from '../utils/appInsights.js';
 import channelsFactory from '../channels/factory.js';
 
 const INITIAL_CONFIG_DEFAULTS = {
-  apiPath: 'https://api.textback.io/api',
+    apiPath: 'https://api.textback.io/api',
 };
 
 export default class Widget {
-  constructor(config, sdk) {
-    this.initialConfig = assign({}, INITIAL_CONFIG_DEFAULTS, config);
-    this.sdk = sdk;
-
-    this.config = {};
-    this.channels = [];
-    this.initialized = false;
-    this.initPromise = null;
-
-    this.id = this.initialConfig.widgetId;
-    this.widgetUserId = Widget.getWidgetUserId();
-    this.insecureContext = Widget.createInsecureContext(this.initialConfig.insecureContext);
-    this.secureContextToken = this.initialConfig.secureContextToken;
-  }
-
-  getConfig() {
-    return this.config;
-  }
-
-  initialize() {
-    this.initPromise = Promise.all([
-      this.initializeConfig(),
-      loadSubscriptions(this.widgetUserId, this.initialConfig.widgetId, this.initialConfig.apiPath),
-    ]).then(([config, subscriptions]) => {
-      this.config = config.$value;
-      this.subscriptions = subscriptions.$items;
-
-      this.useVKApi = this.config.type === constants.WIDGET_TYPE_API_CALL;
-      this.aiKey = Widget.getAiKey(config);
-
-      let customDeeplinkData = this.config.channels.filter(
-        c => c.hasOwnProperty('additionalProperties') && c.additionalProperties.hasOwnProperty('customDeeplinkValue')
-      ).filter(
-        c => c.channel === 'whatsapp' || c.channel === 'whatsappb'
-      ).filter(
-        c => c.enabled
-      ).map(
-        ({additionalProperties, channel, channelId}) => {
-          return {
-            channel: channel,
-            channelId: channelId,
-            customDeeplinkValue: additionalProperties.customDeeplinkValue
-          };
-        }
-      );
-
-      let deeplinkData = {
-        accountId: this.config.accountId,
-        insecureContext: this.insecureContext,
-        widgetId: this.config.id,
-        secureContextToken: this.secureContextToken,
-        user: {
-          id: this.widgetUserId
+    constructor(config, sdk) {
+        this.initialConfig = assign({}, INITIAL_CONFIG_DEFAULTS, config);
+        this.sdk = sdk;
+
+        this.config = {};
+        this.channels = [];
+        this.initialized = false;
+        this.initPromise = null;
+
+        this.id = this.initialConfig.widgetId;
+        this.widgetUserId = Widget.getWidgetUserId();
+        this.insecureContext = Widget.createInsecureContext(this.initialConfig.insecureContext);
+        this.secureContextToken = this.initialConfig.secureContextToken;
+    }
+
+    getConfig() {
+        return this.config;
+    }
+
+    initialize() {
+        this.initPromise = Promise.all([
+            this.initializeConfig(),
+            loadSubscriptions(this.widgetUserId, this.initialConfig.widgetId, this.initialConfig.apiPath),
+        ]).then(([config, subscriptions]) => {
+            this.config = config.$value;
+            this.subscriptions = subscriptions.$items;
+
+            this.useVKApi = this.config.type === constants.WIDGET_TYPE_API_CALL;
+            this.aiKey = Widget.getAiKey(config);
+
+            return Promise.all([
+                loadDeepLink(
+                    this.initialConfig.apiPath,
+                    {
+                        accountId: this.config.accountId,
+                        insecureContext: this.insecureContext,
+                        widgetId: this.config.id,
+                        secureContextToken: this.secureContextToken,
+                        user: {
+                            id: this.widgetUserId
+                        }
+                    }
+                ),
+                appInsights.init(this.aiKey, this.widgetUserId, this.config.accountId)
+            ]);
+        }).then(([deeplink, ai]) => {
+            this.deeplink = `subscribe_${deeplink.$value.id}`;
+            this.channels = this.config.channels.map(channel => channelsFactory.create(channel, this.deeplink, this))
+                                                .filter(channel => !!channel);
+            const channelInitPromises = this.channels.filter(channel => !!channel.initPromise)
+                                                     .map(channel => channel.initPromise);
+
+            return Promise.all(channelInitPromises);
+        }).then(channelPromises => {
+            return this;
+        }, err => {
+            appInsights.trackWidgetEvent(this.config.id, 'Widget.initialize.error', err);
+            return Promise.reject(err);
+        })
+
+        return this.initPromise;
+    }
+
+    initializeConfig() {
+        let promise;
+        if (!this.initialConfig.overrideConfig) {
+            promise = loadConfig(this.initialConfig.widgetId, this.initialConfig.apiPath);
+        } else {
+            promise = Promise.resolve({ $value: this.initialConfig.overrideConfig });
         }
-      };
-
-      if(customDeeplinkData.length > 0) {
-        deeplinkData.customDeeplinkValue = customDeeplinkData;
-      }
-
-      return Promise.all([
-        loadDeepLink(
-          this.initialConfig.apiPath,
-          deeplinkData
-        ),
-        appInsights.init(this.aiKey, this.widgetUserId, this.config.accountId)
-      ]);
-    }).then(([deeplink, ai]) => {
-      this.deeplink = `subscribe_${deeplink.$value.id}`;
-      this.channels = this.config.channels.map(channel => channelsFactory.create(channel, this.deeplink, this))
-        .filter(channel => !!channel);
-
-      const channelInitPromises = this.channels.filter(
-        channel => !!channel.initPromise
-      ).map(
-        channel => channel.initPromise
-      );
-
-      return Promise.all(channelInitPromises);
-    }).then(channelPromises => {
-      return this;
-    }, err => {
-      appInsights.trackWidgetEvent(this.config.id, 'Widget.initialize.error', err);
-      return Promise.reject(err);
-    });
-
-    return this.initPromise;
-  }
-
-  initializeConfig() {
-    let promise;
-    if (!this.initialConfig.overrideConfig) {
-      promise = loadConfig(this.initialConfig.widgetId, this.initialConfig.apiPath);
-    } else {
-      promise = Promise.resolve({ $value: this.initialConfig.overrideConfig });
+
+        return promise;
     }
 
-    return promise;
-  }
+    subscribe(channelCode) {
+        const channel = find(this.getEnabledChannels(), chan => chan.channel === channelCode);
+        if (channel) {
+            channel.subscribe();
+        }
+    }
 
-  subscribe(channelCode) {
-    const channel = find(this.getEnabledChannels(), chan => chan.channel === channelCode);
-    if (channel) {
-      channel.subscribe();
+    getChannels() {
+        return this.channels;
     }
-  }
-
-  getChannels() {
-    return this.channels;
-  }
-
-  getEnabledChannels() {
-    return this.channels.filter(channel => channel.enabled && !channel.hasError);
-  }
-
-  runWahunter(phoneNumber) {
-    return fetch(`${this.initialConfig.apiPath}/wahunter`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json;charset=utf-8'
-      },
-      body: JSON.stringify({
-        notificationWidgetId: this.initialConfig.widgetId,
-        phone: phoneNumber,
-        insecureContext: this.insecureContext,
-        deeplinkId: this.deeplink,
-      }),
-    }).then((resp) => {
-      if (resp.ok) {
-        cookies.setCookie(`${constants.COOKIE_NAME_PREFIX + this.id}_wahunter_was_run`, true, this.config.showWidgetSetting.showSessionLength * 60);
-      } else {
-        return Promise.reject(resp);
-      }
-    })
-  }
-
-  static getWidgetUserId() {
-    let widgetUserId = cookies.getCookie(constants.COOKIE_WIDGET_USER_ID);
-    if (widgetUserId === null) {
-      let uuid = UUID.create(4);
-      widgetUserId = uuid.hex;
-      cookies.setCookie(constants.COOKIE_WIDGET_USER_ID, widgetUserId, constants.WIDGET_USER_ID_COOKIE_TTL);
+
+    getEnabledChannels() {
+        return this.channels.filter(channel => channel.enabled && !channel.hasError);
     }
-    return widgetUserId;
-  }
 
-  static createInsecureContext(insecureContext = {}) {
-    const ctx = assign({}, insecureContext);//Object.assign({}, insecureContext);
-    ctx.pageTitle = window.document.title;
-    ctx.pageUrl = window.location.protocol + '//' + window.location.host + window.location.pathname;
-    ctx.params = parseQueryString(window.location.search.substring(1));
-    ctx.timezoneOffset = new Date().getTimezoneOffset();
-    ctx.cookies = cookies.getCookieObject();
+    static getWidgetUserId() {
+        let widgetUserId = cookies.getCookie(constants.COOKIE_WIDGET_USER_ID);
+        if (widgetUserId === null) {
+            let uuid = UUID.create(4);
+            widgetUserId = uuid.hex;
+            cookies.setCookie(constants.COOKIE_WIDGET_USER_ID, widgetUserId, constants.WIDGET_USER_ID_COOKIE_TTL);
+        }
+        return widgetUserId;
+    }
 
-    const roistatVisitCookie = cookies.getCookie("roistat_visit");
+    static createInsecureContext(insecureContext = {}) {
+        const ctx = assign({}, insecureContext);//Object.assign({}, insecureContext);
+        ctx.pageTitle = window.document.title;
+        ctx.pageUrl = window.location.protocol + '//' + window.location.host + window.location.pathname;
+        ctx.params = parseQueryString(window.location.search.substring(1));
+        ctx.timezoneOffset = new Date().getTimezoneOffset();
 
-    if (roistatVisitCookie) {
-      ctx.roistatVisit = roistatVisitCookie;
+        return ctx;
     }
 
-    return ctx;
-  }
+    static getAiKey(config) {
+        let aiKey = undefined;
+        try {
+            aiKey = config.headers.get('X-TB-AIKEY');
+        } catch (e) { }
+
+        return aiKey;
+    }
 
-  static getAiKey(config) {
-    let aiKey = undefined;
-    try {
-      aiKey = config.headers.get('X-TB-AIKEY');
-    } catch (e) { }
 
-    return aiKey;
-  }
 }

package/src/widget/components/index.js

@@ -1,52 +1,48 @@
-// const merge = require('lodash/merge');
-import merge from 'lodash/merge';
-import text from '../utils/text.js';
-import getLocale from '../utils/getLocale.js';
-
-export default class Component {
-    constructor(props = {}) {
-
-        if (Object.prototype.hasOwnProperty.call(props, 'parentElement')) this.element = props.parentElement;
-        if (!Object.prototype.hasOwnProperty.call(props, 'parentElement')) this.element = props.element || document.createElement(this.constructor.tagName);
-
-        const dataset = JSON.parse(JSON.stringify(this.element.dataset || {}));
-        const data = merge(JSON.parse(this.element.getAttribute('data')), dataset);
-
-        this.set(this.defaults, props, {data});
-    }
-
-    render() {
-        this.element.innerHTML = this.template;
-    }
-
-    text(string) {
-        return text(string, this.lang);
-    }
-
-    get template() {
-        return this.content;
-    }
-
-    get lang() {
-        return this.element.getAttribute('lang') || getLocale();
-    }
-
-    set lang(value) {
-        if (!value) return;
-
-        this.element.setAttribute('lang', value);
-    }
-
-    set() {
-        merge(this, ...arguments);
-        this.render();
-    }
-
-    get defaults() {
-        return {};
-    }
-
-    static get tagName() {
-        return 'div';
-    }
-};
+// const merge = require('lodash/merge');
+import merge from 'lodash/merge';
+import text from '../utils/text.js';
+import getLocale from '../utils/getLocale.js';
+
+export default class Component {
+    constructor(props = {}) {
+        this.element = props.element || document.createElement(this.constructor.tagName);
+
+        const dataset = JSON.parse(JSON.stringify(this.element.dataset || {}));
+        const data = merge(JSON.parse(this.element.getAttribute('data')), dataset);
+
+        this.set(this.defaults, props, {data});
+    }
+
+    render() {
+        this.element.innerHTML = this.template;
+    }
+
+    text(string) {
+        return text(string, this.lang);
+    }
+
+    get template() {
+        return this.content;
+    }
+
+    get lang() {
+        return this.element.getAttribute('lang') || getLocale();
+    }
+
+    set lang(value) {
+        this.element.setAttribute('lang', value);
+    }
+
+    set() {
+        merge(this, ...arguments);
+        this.render();
+    }
+
+    get defaults() {
+        return {};
+    }
+
+    static get tagName() {
+        return 'div';
+    }
+};

package/src/widget/components/tb-notification-button/facebook.js

@@ -1,55 +1,48 @@
-import Button from './index.js';
-import icon from '../../icons/icon_facebook.svg';
-import iconCircle from '../../icons/icon_facebook_circle.svg';
-import constants from '../../../sdk/utils/constants.js';
-
-class FacebookButton extends Button {
-    render() {
-        super.render();
-        
-        const link = this.element.querySelector('a');
-        link.addEventListener('click', (event) => {
-            event.preventDefault();
-            this.channelAPI.subscribe();
-        });
-    }
-    
-    get template() {
-        if (this.config.type === constants.WIDGET_TYPE_API_CALL) {
-            return `
-                <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
-                    <tb-notification-button__icon>${icon}</tb-notification-button__icon>
-                    <tb-notification-button__text>${this.text('facebook')}</tb-notification-button__text>
-                </a>
-                <p class="tb-notification-button__tip">
-                    ${this.text('facebookTip')}
-                </p>
-            `;
-        } else if(this.config.markUp.style === 'gradient') {
-            return `
-                <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
-                    <tb-notification-button__icon>${icon}</tb-notification-button__icon> 
-                    <tb-notification-button__text>${this.text('facebook')}</tb-notification-button__text>
-                </a>
-            `;
-        } else if (this.config.markUp.style !== 'square') {
-            return `
-                <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
-                    <tb-notification-button__icon>${(this.config.markUp.style === 'rounded' ? icon : iconCircle )}</tb-notification-button__icon>
-                    <tb-notification-button__text>${this.text('facebook')}</tb-notification-button__text>
-                </a>
-            `;
-        } else {
-            return `
-                <div class="tb-notification-button__inner">
-                    <tb-notification-button__icon>${icon}</tb-notification-button__icon> 
-                    <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
-                        <tb-notification-button__text>${this.text('facebookExtended')}</tb-notification-button__text>
-                    </a>
-                </div>
-            `;
-        }
-    }
-};
-
-module.exports = FacebookButton;
+import Button from './index.js';
+import icon from '../../icons/icon_facebook.svg';
+import iconCircle from '../../icons/icon_facebook_circle.svg';
+import constants from '../../../sdk/utils/constants.js';
+
+class FacebookButton extends Button {
+    render() {
+        super.render();
+        
+        const link = this.element.querySelector('a');
+        link.addEventListener('click', (event) => {
+            event.preventDefault();
+            this.channelAPI.subscribe();
+        });
+    }
+    
+    get template() {
+        if (this.config.type === constants.WIDGET_TYPE_API_CALL) {
+            return `
+                <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
+                    <tb-notification-button__icon>${icon}</tb-notification-button__icon>
+                    <tb-notification-button__text>${this.text('facebook')}</tb-notification-button__text>
+                </a>
+                <p class="tb-notification-button__tip">
+                    ${this.text('facebook_tip')}
+                </p>
+            `;
+        } else if (this.config.markUp.style !== 'square') {
+            return `
+                <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
+                    <tb-notification-button__icon>${(this.config.markUp.style === 'rounded' ? icon : iconCircle )}</tb-notification-button__icon>
+                    <tb-notification-button__text>${this.text('facebook')}</tb-notification-button__text>
+                </a>
+            `;
+        } else {
+            return `
+                <div class="tb-notification-button__inner">
+                    <tb-notification-button__icon>${icon}</tb-notification-button__icon> 
+                    <a target="_blank" href="https://m.me/${this.config.id}?ref=${this.deepLink}">
+                        <tb-notification-button__text>${this.text('sign-facebook')}</tb-notification-button__text>
+                    </a>
+                </div>
+            `;
+        }
+    }
+};
+
+module.exports = FacebookButton;