@viibe/impulse-integration-js 2.3.1 → 2.3.4-alpha2

package/.vscode/settings.json

@@ -1,3 +1,2 @@
 {
-    "actions": []
 }

package/dist/index.js

@@ -1 +1 @@
-(()=>{var t={579:t=>{function e(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}var n=function(){function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.handlers=[],this.host=e.host,this.origin=/^localhost/.test(this.host)?"http://".concat(this.host):"https://".concat(this.host),this.source=e.source,window.addEventListener("message",this.onMessage.bind(this))}var n,o;return n=t,o=[{key:"createCallIframe",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var e=this.createCallUrl(t),n=document.createElement("iframe");return n.name="viibe-"+Math.floor(1e4*Math.random()),n.style="border: 0;width: calc(100% - 1rem);margin: 0.5rem;",n.src=e,n.allow="geolocation;autoplay;microphone;camera;midi;encrypted-media;clipboard-write;",n}},{key:"createCallUrl",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.clipboard,n=void 0!==e&&e,o=t.components,a=t.links,i=t.o2m,r=void 0!==i&&i,s=t.ticket,c=t.token,l=t.locale,u="".concat(this.origin,"/integration/features/call"),d=new URLSearchParams({resize:"true",source:this.source});if(null!=s&&s.title&&d.set("title",s.title),null!=s&&s.integration&&d.set("thirdPartyId",s.integration.id),a){var h=a instanceof Array?a.map((function(t){return"".concat(t.category,":").concat(t.value)})).join(","):String(a);d.set("links",h)}if(c&&d.set("token",c),l&&d.set("locale",l),o){var f=o instanceof Array?o.join(","):String(o);d.set("components",f)}return d.set("clipboard",Boolean(n)),d.set("o2m",Boolean(r)),u+"?".concat(d)}},{key:"isViibeEvent",value:function(t){return Boolean(t.isTrusted&&0===t.origin.indexOf(this.origin))}},{key:"dispatch",value:function(t,e,n){return this.handlers.filter((function(e){return e.eventName===t&&(!e.windowName||e.windowName===n)})).map((function(t){return t.func(e)}))}},{key:"onMessage",value:function(t){return this.isViibeEvent(t)?t.data&&t.data.event&&t.data.payload?this.dispatch(t.data.event,t.data.payload,t.data.windowName):t.data&&t.data.token?this.dispatch("authentication:token",t.data.token):t.data&&t.data.error?this.dispatch("authentication:error",t.data.error):null:null}},{key:"on",value:function(t,e,n){"string"==typeof t&&"function"==typeof e&&void 0===n&&(n=e,e=t,t=null);var o={eventName:e,windowName:t?t.name:null,func:n};this.handlers.push(o)}},{key:"authenticate",value:function(t){var e=this,n="".concat(this.origin,"/api/auth/login/").concat(t),o=window.screen.width/2-240,a=window.screen.height/2-300,i=["toolbar=no","location=no","directories=no","status=no","menubar=no","scrollbars=no","resizable=no","copyhistory=no","width=".concat(480),"height=".concat(600),"top=".concat(a),"left=".concat(o)];return new Promise((function(t,o){var a=window.open(n,"Authorization",i.join(", "));a||o("Failed to open window");var r=setInterval((function(){a.closed&&(c(),s())}),100),s=function(){o("User closed window")},c=function(){window.removeEventListener("message",l),clearInterval(r)},l=function(n){if(!e.isViibeEvent(n))return null;n.data.token&&(c(),t(n.data.token)),n.data.error&&(c(),o(n.data.error))};window.addEventListener("message",l)}))}}],o&&e(n.prototype,o),t}();"undefined"!=typeof window&&(window.Viibe=n),t.exports=n}},e={},n=function n(o){var a=e[o];if(void 0!==a)return a.exports;var i=e[o]={exports:{}};return t[o](i,i.exports,n),i.exports}(579);module.exports=n})();
+(()=>{var t={579:t=>{function e(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function n(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function o(t,e,o){return e&&n(t.prototype,e),o&&n(t,o),t}function i(t){return function(e){return Boolean(e.isTrusted&&0===e.origin.indexOf(t))}}function a(t){var e=new URL(t),n="".concat(e.protocol,"://").concat(e.host),o=window.screen.width/2-240,a=window.screen.height/2-300,r=["toolbar=no","location=no","directories=no","status=no","menubar=no","scrollbars=no","resizable=no","copyhistory=no","width=".concat(480),"height=".concat(600),"top=".concat(a),"left=".concat(o)];return new Promise((function(e,o){var a=window.open(t,"Authorization",r.join(", "));a||o("Failed to open window");var c=setInterval((function(){a.closed&&(l(),s())}),100),s=function(){o("User closed window")},l=function(){window.removeEventListener("message",u),clearInterval(c)},u=function(t){if(!i(n)(t))return null;t.data.token&&(l(),e(t.data.token)),t.data.error&&(l(),o(t.data.error))};window.addEventListener("message",u)}))}var r,c,s,l=function(){function t(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"auth.viibe.tech";e(this,t),this.host=n}return o(t,[{key:"loginZendesk",value:function(t){return a("https://".concat(this.host,"/auth/zendesk/login?subdomain=").concat(t))}}]),t}(),u=function(){function t(n){e(this,t),this.handlers=[],this.host=n.host,this.origin=/^localhost/.test(this.host)?"http://".concat(this.host):"https://".concat(this.host),this.source=n.source,this.isViibeEvent=i(this.origin),window.addEventListener("message",this.onMessage.bind(this))}return o(t,[{key:"createNotificationIframe",value:function(){if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var t=document.createElement("iframe");return t.name="viibe-"+Math.floor(1e4*Math.random()),t.style="border: 0;width: 0;",t.src="".concat(this.origin,"/integration/features/notifications"),t}},{key:"createCallIframe",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var n=this.createCallUrl(e),o=document.createElement("iframe");return o.name="viibe-"+Math.floor(1e4*Math.random()),o.style="border: 0;width: calc(100% - 1rem);margin: 0.5rem;",o.src=n,o.allow="geolocation;autoplay;microphone;camera;midi;encrypted-media;clipboard-write;",this.on(o,"document",(function(e){return t.onDocument(e)})),o}},{key:"createCallUrl",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.clipboard,n=void 0!==e&&e,o=t.components,i=t.links,a=t.o2m,r=void 0!==a&&a,c=t.ticket,s=t.token,l=t.locale,u=t.standalone,d="".concat(this.origin,"/integration/features/call"),h=new URLSearchParams({resize:"true",source:this.source});if(c&&c.title&&h.set("title",c.title),c&&c.integration&&h.set("thirdPartyId",c.integration.id),i){var f=i instanceof Array?i.map((function(t){return"".concat(t.category,":").concat(t.value)})).join(","):String(i);h.set("links",f)}if(s&&h.set("token",s),l&&h.set("locale",l),o){var v=o instanceof Array?o.join(","):String(o);h.set("components",v)}return u&&h.set("standalone",Boolean(u)),h.set("clipboard",Boolean(n)),h.set("o2m",Boolean(r)),d+"?".concat(h)}},{key:"dispatch",value:function(t,e,n){return this.handlers.filter((function(e){return e.eventName===t&&(!e.windowName||e.windowName===n)})).map((function(t){return t.func(e)}))}},{key:"onMessage",value:function(t){return this.isViibeEvent(t)?t.data&&t.data.event&&t.data.payload?this.dispatch(t.data.event,t.data.payload,t.data.windowName):t.data&&t.data.token?this.dispatch("authentication:token",t.data.token):t.data&&t.data.error?this.dispatch("authentication:error",t.data.error):null:null}},{key:"on",value:function(t,e,n){"string"==typeof t&&"function"==typeof e&&void 0===n&&(n=e,e=t,t=null);var o={eventName:e,windowName:t?t.name:null,func:n};this.handlers.push(o)}},{key:"onDocument",value:function(t){window.open(t.signed_url,"_blank")}},{key:"authenticate",value:function(t){return a("".concat(this.origin,"/api/auth/login/").concat(t))}}]),t}();s=l,(c="Auth")in(r=u)?Object.defineProperty(r,c,{value:s,enumerable:!0,configurable:!0,writable:!0}):r.Auth=s,"undefined"!=typeof window&&(window.Viibe=u),t.exports=u}},e={},n=function n(o){var i=e[o];if(void 0!==i)return i.exports;var a=e[o]={exports:{}};return t[o](a,a.exports,n),a.exports}(579);module.exports=n})();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viibe/impulse-integration-js",
-  "version": "2.3.1",
+  "version": "2.3.4-alpha2",
   "description": "ViiBE integration in js native",
   "main": "index.js",
   "publishConfig": {

package/src/index.js

@@ -1,5 +1,98 @@
+function isFromOrigin(origin) {
+  return function (event) {
+    return Boolean(event.isTrusted && event.origin.indexOf(origin) === 0)
+  }
+}
+
+function openAuthPopup(src) {
+  const url = new URL(src);
+  const origin = `${url.protocol}://${url.host}`;
+
+  const width = 480
+  const height = 600
+  const TWO = 2
+
+  const left = (window.screen.width / TWO) - (width / TWO)
+  const top = (window.screen.height / TWO) - (height / TWO)
+  const windowParams = [
+    'toolbar=no',
+    'location=no',
+    'directories=no',
+    'status=no',
+    'menubar=no',
+    'scrollbars=no',
+    'resizable=no',
+    'copyhistory=no',
+    `width=${width}`,
+    `height=${height}`,
+    `top=${top}`,
+    `left=${left}`,
+  ]
+
+  return new Promise((resolve, reject) => {
+    const win = window.open(src, 'Authorization', windowParams.join(', '))
+
+    if (!win) {
+      reject('Failed to open window')
+    }
+
+    // pings the login window to check if it was closed
+    const closeCheck = setInterval(() => {
+      if (win.closed) {
+        destroy();
+        onClose();
+      }
+
+    }, 100)
+
+    // triggered if the window was closed
+    const onClose = () => {
+      reject('User closed window')
+    }
+
+    // completes the process, either because the user closes or because the authentication completed
+    // cleans intervals and event listeners
+    const destroy = () => {
+      window.removeEventListener('message', onMessage)
+      clearInterval(closeCheck)
+    }
+
+    // triggered when a message is received on the current window
+    const onMessage = event => {
+      if (!isFromOrigin(origin)(event)) {
+        return null
+      }
+      if (event.data.token) {
+        destroy();
+        resolve(event.data.token)
+      }
+      if (event.data.error) {
+        destroy();
+        reject(event.data.error)
+      }
+    }
+
+    window.addEventListener('message', onMessage)
+  })
+}
+
+class ViibeAuth {
+
+  // FIXME
+  constructor(host = 'auth.viibe.tech') {
+    this.host = host;
+  }
+
+  loginZendesk(subdomain) {
+    const url = `https://${this.host}/auth/zendesk/login?subdomain=${subdomain}`;
+    return openAuthPopup(url);
+  }
+}
+
 class Viibe {
 
+  static Auth = ViibeAuth;
+
   /**
    * @typedef Handler
    * @type {object}
@@ -17,9 +110,22 @@ class Viibe {
     this.origin = /^localhost/.test(this.host) ? `http://${this.host}` : `https://${this.host}`
     this.source = options.source
 
+    this.isViibeEvent = isFromOrigin(this.origin);
+
     window.addEventListener('message', this.onMessage.bind(this))
   }
 
+  createNotificationIframe() {
+    if (!this.host) throw new Error('fillHost')
+    if (!this.source) throw new Error('fillSource')
+
+    const iframe = document.createElement('iframe')
+    iframe.name = 'viibe-' + Math.floor(Math.random() * 10000)
+    iframe.style = 'border: 0;width: 0;'
+    iframe.src = `${this.origin}/integration/features/notifications`
+    return iframe
+  }
+
   createCallIframe(options = {}) {
     if (!this.host) throw new Error('fillHost')
     if (!this.source) throw new Error('fillSource')
@@ -32,6 +138,8 @@ class Viibe {
     iframe.src = src
     iframe.allow = 'geolocation;autoplay;microphone;camera;midi;encrypted-media;clipboard-write;'
 
+    this.on(iframe, 'document', event => this.onDocument(event))
+
     return iframe
   }
 
@@ -43,7 +151,8 @@ class Viibe {
       o2m = false,
       ticket,
       token,
-      locale
+      locale,
+      standalone,
     } = options
 
     let src = `${this.origin}/integration/features/call`
@@ -53,8 +162,8 @@ class Viibe {
       source: this.source,
     });
 
-    if (ticket?.title) params.set('title', ticket.title)
-    if (ticket?.integration) params.set('thirdPartyId', ticket.integration.id)
+    if (ticket && ticket.title) params.set('title', ticket.title)
+    if (ticket && ticket.integration) params.set('thirdPartyId', ticket.integration.id)
 
     if (links) {
       let linksParams = (links instanceof Array)
@@ -76,6 +185,9 @@ class Viibe {
       params.set('components', componentsParams)
     }
 
+    if (standalone) params.set('standalone', Boolean(standalone))
+
+
     params.set('clipboard', Boolean(clipboard))
     params.set('o2m', Boolean(o2m))
 
@@ -84,23 +196,19 @@ class Viibe {
     return src
   }
 
-  isViibeEvent(event) {
-    return Boolean(event.isTrusted && event.origin.indexOf(this.origin) === 0)
-  }
-
   /**
    * Dispatches an event ie calls handlers corresponding to that event.
    * Handlers with not windowName will be triggered regardless of the origin windowName
    * Otherwise, the event will be triggered only if the handler windowName and the event windowName correspond
-   * 
-   * @param {string} eventName 
-   * @param {any} payload 
-   * @param {string} windowName 
-   * @returns 
+   *
+   * @param {string} eventName
+   * @param {any} payload
+   * @param {string} windowName
+   * @returns
    */
   dispatch(eventName, payload, windowName) {
     return this.handlers
-      .filter(handler => 
+      .filter(handler =>
         handler.eventName === eventName
         && (!handler.windowName || (handler.windowName === windowName))
       )
@@ -109,8 +217,8 @@ class Viibe {
 
   /**
    * Handles postMessages / events received on the current window
-   * @param {any} event 
-   * @returns 
+   * @param {any} event
+   * @returns
    */
   onMessage(event) {
     if (!this.isViibeEvent(event)) {
@@ -134,16 +242,16 @@ class Viibe {
 
   /**
    * Registers an event handler.
-   * Can be either called with 2 arguments (eventName and handler) to catch events from all iframes 
+   * Can be either called with 2 arguments (eventName and handler) to catch events from all iframes
    * or with 3 arguments (iframe, eventName, handler) to catch events from only that iframe
-   * @param {HTMLIFrameElement} [iframe] 
-   * @param {string} eventName 
-   * @param {Function} handler 
+   * @param {HTMLIFrameElement} [iframe]
+   * @param {string} eventName
+   * @param {Function} handler
    */
   on(iframe, eventName, func) {
-    if (typeof iframe === 'string' 
-    && typeof eventName === 'function' 
-    && typeof func === 'undefined') {
+    if (typeof iframe === 'string'
+      && typeof eventName === 'function'
+      && typeof func === 'undefined') {
       func = eventName;
       eventName = iframe;
       iframe = null;
@@ -157,80 +265,19 @@ class Viibe {
     this.handlers.push(handler);
   }
 
+  onDocument(document) {
+    window.open(document.signed_url, '_blank')
+  }
+
   /**
    * Initiates an oauth login in a popup using the passed provider
    * @param {string} provider A strategy name from the Viibe API (see /strategies API)
-   * @returns 
+   * @returns
    */
   authenticate(provider) {
     const src = `${this.origin}/api/auth/login/${provider}`
-    const width = 480
-    const height = 600
-    const TWO = 2
-
-    const left = (window.screen.width / TWO) - (width / TWO)
-    const top = (window.screen.height / TWO) - (height / TWO)
-    const windowParams = [
-      'toolbar=no',
-      'location=no',
-      'directories=no',
-      'status=no',
-      'menubar=no',
-      'scrollbars=no',
-      'resizable=no',
-      'copyhistory=no',
-      `width=${width}`,
-      `height=${height}`,
-      `top=${top}`,
-      `left=${left}`,
-    ]
-
-    return new Promise((resolve, reject) => {
-      const win = window.open(src, 'Authorization', windowParams.join(', '))
-
-      if (!win) {
-        reject('Failed to open window')
-      }
-
-      // pings the login window to check if it was closed
-      const closeCheck = setInterval(() => {
-        if (win.closed) {
-          destroy();
-          onClose();
-        }
-
-      }, 100)
-
-      // triggered if the window was closed
-      const onClose = () => {
-        reject('User closed window')
-      }
-
-      // completes the process, either because the user closes or because the authentication completed
-      // cleans intervals and event listeners
-      const destroy = () => {
-        window.removeEventListener('message', onMessage)
-        clearInterval(closeCheck)
-      }
-
-      // triggered when a message is received on the current window
-      const onMessage = event => {
-        if (!this.isViibeEvent(event)) {
-          return null
-        }
-        if (event.data.token) {
-          destroy();
-          resolve(event.data.token)
-        }
-        if (event.data.error) {
-          destroy();
-          reject(event.data.error)
-        }
-      }
-
-      window.addEventListener('message', onMessage)
-    })
 
+    return openAuthPopup(src);
   }
 
 }
@@ -240,4 +287,4 @@ if (typeof window !== 'undefined') {
 }
 if (typeof module !== 'undefined') {
   module.exports = Viibe
-}
+}