@gobistories/gobi-web-integration
Advanced tools
Comparing version 1.2.2 to 1.2.3
@@ -1,1 +0,1 @@ | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.gobi=e():t.gobi=e()}(window,function(){return function(n){var i={};function r(t){if(i[t])return i[t].exports;var e=i[t]={i:t,l:!1,exports:{}};return n[t].call(e.exports,e,e.exports,r),e.l=!0,e.exports}return r.m=n,r.c=i,r.d=function(t,e,n){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)r.d(n,i,function(t){return e[t]}.bind(null,i));return n},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=7)}([function(t,e){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(t){"object"==typeof window&&(n=window)}t.exports=n},function(t,p,d){"use strict";(function(e){var t=d(2),n=setTimeout;function i(){}function o(t){if(!(this instanceof o))throw new TypeError("Promises must be constructed via new");if("function"!=typeof t)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],u(t,this)}function r(n,i){for(;3===n._state;)n=n._value;0!==n._state?(n._handled=!0,o._immediateFn(function(){var t=1===n._state?i.onFulfilled:i.onRejected;if(null!==t){var e;try{e=t(n._value)}catch(t){return void a(i.promise,t)}s(i.promise,e)}else(1===n._state?s:a)(i.promise,n._value)})):n._deferreds.push(i)}function s(e,t){try{if(t===e)throw new TypeError("A promise cannot be resolved with itself.");if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if(t instanceof o)return e._state=3,e._value=t,void l(e);if("function"==typeof n)return void u((i=n,r=t,function(){i.apply(r,arguments)}),e)}e._state=1,e._value=t,l(e)}catch(t){a(e,t)}var i,r}function a(t,e){t._state=2,t._value=e,l(t)}function l(t){2===t._state&&0===t._deferreds.length&&o._immediateFn(function(){t._handled||o._unhandledRejectionFn(t._value)});for(var e=0,n=t._deferreds.length;e<n;e++)r(t,t._deferreds[e]);t._deferreds=null}function c(t,e,n){this.onFulfilled="function"==typeof t?t:null,this.onRejected="function"==typeof e?e:null,this.promise=n}function u(t,e){var n=!1;try{t(function(t){n||(n=!0,s(e,t))},function(t){n||(n=!0,a(e,t))})}catch(t){if(n)return;n=!0,a(e,t)}}o.prototype.catch=function(t){return this.then(null,t)},o.prototype.then=function(t,e){var n=new this.constructor(i);return r(this,new c(t,e,n)),n},o.prototype.finally=t.a,o.all=function(e){return new o(function(i,r){if(!e||void 0===e.length)throw new TypeError("Promise.all accepts an array");var o=Array.prototype.slice.call(e);if(0===o.length)return i([]);var s=o.length;function a(e,t){try{if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if("function"==typeof n)return void n.call(t,function(t){a(e,t)},r)}o[e]=t,0==--s&&i(o)}catch(t){r(t)}}for(var t=0;t<o.length;t++)a(t,o[t])})},o.resolve=function(e){return e&&"object"==typeof e&&e.constructor===o?e:new o(function(t){t(e)})},o.reject=function(n){return new o(function(t,e){e(n)})},o.race=function(r){return new o(function(t,e){for(var n=0,i=r.length;n<i;n++)r[n].then(t,e)})},o._immediateFn="function"==typeof e&&function(t){e(t)}||function(t){n(t,0)},o._unhandledRejectionFn=function(t){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",t)},p.a=o}).call(this,d(4).setImmediate)},function(t,e,n){"use strict";e.a=function(e){var n=this.constructor;return this.then(function(t){return n.resolve(e()).then(function(){return t})},function(t){return n.resolve(e()).then(function(){return n.reject(t)})})}},function(t,e,n){},function(t,r,o){(function(t){var e=void 0!==t&&t||"undefined"!=typeof self&&self||window,n=Function.prototype.apply;function i(t,e){this._id=t,this._clearFn=e}r.setTimeout=function(){return new i(n.call(setTimeout,e,arguments),clearTimeout)},r.setInterval=function(){return new i(n.call(setInterval,e,arguments),clearInterval)},r.clearTimeout=r.clearInterval=function(t){t&&t.close()},i.prototype.unref=i.prototype.ref=function(){},i.prototype.close=function(){this._clearFn.call(e,this._id)},r.enroll=function(t,e){clearTimeout(t._idleTimeoutId),t._idleTimeout=e},r.unenroll=function(t){clearTimeout(t._idleTimeoutId),t._idleTimeout=-1},r._unrefActive=r.active=function(t){clearTimeout(t._idleTimeoutId);var e=t._idleTimeout;0<=e&&(t._idleTimeoutId=setTimeout(function(){t._onTimeout&&t._onTimeout()},e))},o(5),r.setImmediate="undefined"!=typeof self&&self.setImmediate||void 0!==t&&t.setImmediate||this&&this.setImmediate,r.clearImmediate="undefined"!=typeof self&&self.clearImmediate||void 0!==t&&t.clearImmediate||this&&this.clearImmediate}).call(this,o(0))},function(t,e,n){(function(t,f){!function(n,i){"use strict";if(!n.setImmediate){var r,o,e,s,t,a=1,l={},c=!1,u=n.document,p=Object.getPrototypeOf&&Object.getPrototypeOf(n);p=p&&p.setTimeout?p:n,r="[object process]"==={}.toString.call(n.process)?function(t){f.nextTick(function(){h(t)})}:function(){if(n.postMessage&&!n.importScripts){var t=!0,e=n.onmessage;return n.onmessage=function(){t=!1},n.postMessage("","*"),n.onmessage=e,t}}()?(s="setImmediate$"+Math.random()+"$",t=function(t){t.source===n&&"string"==typeof t.data&&0===t.data.indexOf(s)&&h(+t.data.slice(s.length))},n.addEventListener?n.addEventListener("message",t,!1):n.attachEvent("onmessage",t),function(t){n.postMessage(s+t,"*")}):n.MessageChannel?((e=new MessageChannel).port1.onmessage=function(t){h(t.data)},function(t){e.port2.postMessage(t)}):u&&"onreadystatechange"in u.createElement("script")?(o=u.documentElement,function(t){var e=u.createElement("script");e.onreadystatechange=function(){h(t),e.onreadystatechange=null,o.removeChild(e),e=null},o.appendChild(e)}):function(t){setTimeout(h,0,t)},p.setImmediate=function(t){"function"!=typeof t&&(t=new Function(""+t));for(var e=new Array(arguments.length-1),n=0;n<e.length;n++)e[n]=arguments[n+1];var i={callback:t,args:e};return l[a]=i,r(a),a++},p.clearImmediate=d}function d(t){delete l[t]}function h(t){if(c)setTimeout(h,0,t);else{var e=l[t];if(e){c=!0;try{!function(t){var e=t.callback,n=t.args;switch(n.length){case 0:e();break;case 1:e(n[0]);break;case 2:e(n[0],n[1]);break;case 3:e(n[0],n[1],n[2]);break;default:e.apply(i,n)}}(e)}finally{d(t),c=!1}}}}}("undefined"==typeof self?void 0===t?this:t:self)}).call(this,n(0),n(6))},function(t,e){var n,i,r=t.exports={};function o(){throw new Error("setTimeout has not been defined")}function s(){throw new Error("clearTimeout has not been defined")}function a(e){if(n===setTimeout)return setTimeout(e,0);if((n===o||!n)&&setTimeout)return n=setTimeout,setTimeout(e,0);try{return n(e,0)}catch(t){try{return n.call(null,e,0)}catch(t){return n.call(this,e,0)}}}!function(){try{n="function"==typeof setTimeout?setTimeout:o}catch(t){n=o}try{i="function"==typeof clearTimeout?clearTimeout:s}catch(t){i=s}}();var l,c=[],u=!1,p=-1;function d(){u&&l&&(u=!1,l.length?c=l.concat(c):p=-1,c.length&&h())}function h(){if(!u){var t=a(d);u=!0;for(var e=c.length;e;){for(l=c,c=[];++p<e;)l&&l[p].run();p=-1,e=c.length}l=null,u=!1,function(e){if(i===clearTimeout)return clearTimeout(e);if((i===s||!i)&&clearTimeout)return i=clearTimeout,clearTimeout(e);try{i(e)}catch(t){try{return i.call(null,e)}catch(t){return i.call(this,e)}}}(t)}}function f(t,e){this.fun=t,this.array=e}function y(){}r.nextTick=function(t){var e=new Array(arguments.length-1);if(1<arguments.length)for(var n=1;n<arguments.length;n++)e[n-1]=arguments[n];c.push(new f(t,e)),1!==c.length||u||a(h)},f.prototype.run=function(){this.fun.apply(null,this.array)},r.title="browser",r.browser=!0,r.env={},r.argv=[],r.version="",r.versions={},r.on=y,r.addListener=y,r.once=y,r.off=y,r.removeListener=y,r.removeAllListeners=y,r.emit=y,r.prependListener=y,r.prependOnceListener=y,r.listeners=function(t){return[]},r.binding=function(t){throw new Error("process.binding is not supported")},r.cwd=function(){return"/"},r.chdir=function(t){throw new Error("process.chdir is not supported")},r.umask=function(){return 0}},function(t,e,n){"use strict";n.r(e);n(3);var i=function(){function t(){this._eventsCallbacks={}}return t.prototype.on=function(t,e){this._eventsCallbacks.hasOwnProperty(t)||(this._eventsCallbacks[t]=[]);var n=this._eventsCallbacks[t];-1===n.indexOf(e)&&n.push(e)},t.prototype.off=function(t,e){"string"==typeof t?this._eventsCallbacks.hasOwnProperty(t)&&("function"==typeof e?this._removeCallback(t,e):this._eventsCallbacks[t]=[]):this._removeAllCallbacks()},t.prototype.emit=function(t,e,n){if(this._eventsCallbacks.hasOwnProperty(t))for(var i=this._eventsCallbacks[t],r=i.length,o=0;o<r;o++)i[o].call(n||this,e)},t.prototype._removeCallback=function(t,e){var n=this._eventsCallbacks[t],i=n.indexOf(e);-1<i&&n.splice(i,1)},t.prototype._removeAllCallbacks=function(){for(var t in this._eventsCallbacks)this._eventsCallbacks.hasOwnProperty(t)&&delete this._eventsCallbacks[t]},t}(),o=n(1);function s(){return(s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function a(t,e){for(var n,i=t.length,r=0;r<i;r++)(n=t[r]).className=e+n.className}function c(r){return new o.a(function(t,e){var n=new XMLHttpRequest,i="https://live.gobiapp.com/projector/player/storyModules/"+r;n.open("GET",i,!0),n.send(),n.onload=function(){this.status<400?t(JSON.parse(this.responseText)):e(Error("Module didn't load successfully; error code:"+n.statusText))},n.onerror=function(){e(Error("There was a network error."))}})}function u(t,e){var n=[];for(var i in t){var r=t[i],o=e[i];n.push(o?s(r,o):r)}return n}function p(t){return t.map(function(t){return{title:t.title,avatarSrc:t.thumbnail,description:t.description,name:t.story_id}})}function r(t,e,n){var i=function(t){return n(t)};return t.addEventListener(e,i),function(){return t.removeEventListener(e,i)}}var l={scrollTop:0,bodyOverflow:"",htmlOverflow:"",disable:function(){this.isIOS?this.IOSDisable():this.classicDisable()},enable:function(){this.isIOS?this.IOSEnable():this.classicEnable()},classicDisable:function(){this.bodyOverflow=document.body.style.overflow,this.htmlOverflow=document.documentElement.style.overflow,document.documentElement.style.overflow="hidden",document.body.style.overflow="hidden"},classicEnable:function(){document.documentElement.style.overflow=this.htmlOverflow,document.body.style.overflow=this.bodyOverflow},IOSEnable:function(){document.documentElement.classList.remove("disabled-scroll"),document.body.classList.remove("disabled-scroll"),window.scrollTo(0,this.scrollTop)},IOSDisable:function(){this.scrollTop=window.pageYOffset,document.documentElement.classList.add("disabled-scroll"),document.body.classList.add("disabled-scroll")},isIOS:/iPad|iPhone|iPod/.test(navigator.userAgent)};function d(){return(d=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var h=function(){function t(t){var n=this;this._defaultOptions={autoStart:!1,hideOverlay:!1,loop:!1,width:0,height:0,roundedCorners:!0,shadow:!0,checkViewPort:!0},this._eventEmitter=new i,this.on=this._eventEmitter.on.bind(this._eventEmitter),this.off=this._eventEmitter.off.bind(this._eventEmitter),this._removeIsOnScreenChecker=function(){},this._removeIsOutOfScreenChecker=function(){},this._options=d({},this._defaultOptions,t),this.el=this._createIframe(),this._options.container&&this._options.container.appendChild(this.el),window.addEventListener("message",function(t){if(n.el.contentWindow===t.source){var e=t.data;e.event&&(n._eventEmitter.emit(e.event,e.value,n),n._options.checkViewPort&&n._viewPortChecker(e.event))}})}return Object.defineProperty(t.prototype,"storyURL",{get:function(){return"https://live.gobiapp.com/next/story/id/"+this._options.storyName+"?autoStart="+this._options.autoStart+"&addLooping="+this._options.loop+"&hideOverlay="+this._options.hideOverlay+"&roundedCorners="+this._options.roundedCorners},enumerable:!0,configurable:!0}),t.prototype.load=function(t){d(this._options,t),this.el.src=this.storyURL},t.prototype.play=function(){this._callPlayerMethod("play")},t.prototype.pause=function(){this._callPlayerMethod("pause")},t.prototype.reload=function(){this._callPlayerMethod("reset")},t.prototype.setMute=function(t){this._callPlayerMethod("setMute",t)},t.prototype.isInViewport=function(){var t=this.el.getBoundingClientRect(),e=window.innerHeight||document.documentElement.clientHeight,n=window.innerWidth||document.documentElement.clientWidth,i=.8*t.height,r=.8*t.width;return t.top>=0-i&&t.left>=0-r&&t.bottom<=e+i&&t.right<=n+r},t.prototype._callPlayerMethod=function(t,e){void 0===e&&(e=void 0),this._sendMessage({method:t,value:e})},t.prototype._sendMessage=function(t){var e=this.el.contentWindow;e&&e.postMessage(t,"*")},t.prototype._createIframe=function(){var t=document.createElement("iframe"),e=this._calcPlayerSize();return t.src=this.storyURL,t.width=e.width.toString(),t.height=e.height.toString(),t.frameBorder="0",t.scrolling="no",t.style.overflow="hidden",t.style.background="#000",t.style.border="0",this._options.shadow&&t.classList.add("gobi-player-shadow"),this._options.roundedCorners&&(t.style.borderRadius="10px"),t.setAttribute("allow","autoplay;"),t},t.prototype._viewPortChecker=function(t){switch(t){case"play":this._addIsOutOfScreenChecker();break;case"pause":this.isInViewport()&&(this._removeIsOnScreenChecker(),this._removeIsOutOfScreenChecker());break;case"ended":this._removeIsOnScreenChecker(),this._removeIsOutOfScreenChecker()}},t.prototype._addIsOutOfScreenChecker=function(){var t=this;this._removeIsOutOfScreenChecker(),this._removeIsOnScreenChecker(),this._removeIsOutOfScreenChecker=r(window,"scroll",function(){t.isInViewport()||(t.pause(),t._removeIsOutOfScreenChecker(),t._addIsOnScreenChecker())})},t.prototype._addIsOnScreenChecker=function(){var t=this;this._removeIsOnScreenChecker=r(window,"scroll",function(){t.isInViewport()&&(t.play(),t._removeIsOnScreenChecker(),t._addIsOutOfScreenChecker())})},t.prototype._calcPlayerSize=function(){var t=612,e=1088;return this._options.width&&this._options.height?(t=this._options.width,e=this._options.height):this._options.width?e=(t=this._options.width)/.5625:this._options.height&&(t=.5625*(e=this._options.height)),{width:t,height:e}},t}(),f=function(t,e){return(f=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function y(t,e){function n(){this.constructor=t}f(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}function v(){return(v=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var m=function(){function n(t){this._listeners=[],this._eventEmitter=new i,this.on=this._eventEmitter.on.bind(this._eventEmitter),this.off=this._eventEmitter.off.bind(this._eventEmitter);var e=v({},n._defaultStoryOptions,t);this.el=this._createTemplate(),this.name=e.name,this._title=e.title,this._description=e.description,this._avatarSrc=e.avatarSrc,this._color=e.color,this._addSelectEmitter(),"function"==typeof e.onSelect&&this._eventEmitter.on("select",e.onSelect),e.container&&e.container.appendChild(this.el)}return n.prototype.destroy=function(){this.el.parentElement&&this.el.parentElement.removeChild(this.el),this._eventEmitter.off();for(var t=this._listeners.length;t--;)this._listeners[t]()},n.prototype._addSelectEmitter=function(){for(var t=this,e=this.el.querySelectorAll("[data-select-area]"),n=function(){t._eventEmitter.emit("select",t)},i=e.length;i--;)this._listeners.push(r(e[i],"click",n))},n.prototype._getElem=function(t){var e="data-"+t,n=this.el.querySelector("["+e+"]");if(n)return n.removeAttribute(e),n;throw new Error("Story does not contain element with name:"+t)},n._defaultStoryOptions={avatarSrc:"",title:"",description:"",color:"",selected:!1,titleColor:"",descriptionColor:""},n}(),_=function(n){function i(t){var e=n.call(this,t)||this;return e._selected=!1,e._elems={title:e._getElem("title"),description:e._getElem("description"),avatar:e._getElem("avatar"),avatarContainer:e._getElem("avatarContainer")},t.titleColor&&(e._elems.title.style.color=t.titleColor),t.descriptionColor&&(e._elems.description.style.color=t.descriptionColor),t.titleSize&&(e._elems.title.style.fontSize=t.titleSize),t.descriptionSize&&(e._elems.description.style.fontSize=t.descriptionSize),t.avatarSize&&(e._elems.avatarContainer.style.width=t.avatarSize),e._selected=!!t.selected,e.title=e._title,e.description=e._description,e.avatarSrc=e._avatarSrc,e.color=e._color,e}return y(i,n),Object.defineProperty(i.prototype,"avatarSrc",{get:function(){return this._avatarSrc},set:function(t){this._avatarSrc=t,this._elems.avatar.style.backgroundImage="url("+t+")"},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"title",{get:function(){return this._title},set:function(t){this._title=t,this._elems.title.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"description",{get:function(){return this._description},set:function(t){this._description=t,this._elems.description.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"color",{get:function(){return this._color},set:function(t){this._color=t,this._elems.avatarContainer.style.borderColor=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"selected",{get:function(){return this._selected},set:function(t){t?this.el.classList.add("gobi-story--selected"):this.el.classList.remove("gobi-story--selected"),this._selected=t},enumerable:!0,configurable:!0}),i.prototype._createTemplate=function(){var t="gobi-story",e=document.createElement("div");return e.classList.add(t),e.innerHTML=i._HTML,a(e.querySelectorAll("*"),t+"__"),e},Object.defineProperty(i,"_HTML",{get:function(){return'<div class="avatar-container" data-select-area data-avatarContainer><div class="avatar" data-avatar></div></div><div class="title" data-title></div><div class="description" data-description></div>'},enumerable:!0,configurable:!0}),i}(m);function b(){return(b=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var g=function(){function i(t){var e=this,n=b({},i._defaultOptions,t);this.el=this._createTemplate(),this._title=n.title,this.title=n.title,this._color=n.color,this._activeColor=n.activeColor,this.stories=this._createStories(n.stories,n),this._currentStory=this.stories[0],this._playerContainer=this.el.querySelector("[data-player]"),this.player=new h(b({storyName:this._currentStory.name,container:this._playerContainer},n.playerOptions)),this._playerContainer.style.maxWidth=Math.min(.53*window.innerHeight,350)+"px",window.addEventListener("resize",function(){e._playerContainer.style.maxWidth=Math.min(.53*window.innerHeight,350)+"px"}),this.currentStory=this._currentStory}return Object.defineProperty(i.prototype,"title",{get:function(){return this._title},set:function(t){var e=this.el.querySelector("[data-title]");e&&(this._title=t,e.textContent=t)},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"currentStory",{get:function(){return this._currentStory},set:function(t){this._currentStory.color=this._color,this._currentStory.selected=!1,this._currentStory=t,this._currentStory.selected=!0,this._currentStory.color=this._activeColor,this.player.load({storyName:this._currentStory.name})},enumerable:!0,configurable:!0}),i.prototype.append=function(t){t.appendChild(this.el)},i.prototype.remove=function(){var t=this.el.parentElement;t&&t.removeChild(this.el)},i.prototype._createStories=function(t,e){var n=this,i=this.el.querySelector("[data-stories]");return t.map(function(t){return new _({name:t.name,container:i,avatarSrc:t.avatarSrc,title:t.title,description:t.description,titleColor:t.titleColor,descriptionColor:t.descriptionColor,color:n._color,titleSize:e.titleSize,avatarSize:e.avatarSize,descriptionSize:e.descriptionSize,onSelect:n._onStorySelect.bind(n)})})},i.prototype._onStorySelect=function(t){console.log("_onStorySelect"),this.currentStory=t},i.prototype._createTemplate=function(){var t=document.createElement("div"),e="gobi-module";return t.classList.add(e),t.innerHTML=i._HTML,a(t.querySelectorAll("*"),e+"__"),t},Object.defineProperty(i,"_HTML",{get:function(){return'<div class="player-block"><div class="player" data-player></div></div><div class="stories-block"><div class="title" data-title></div><div class="stories" data-stories></div></div>'},enumerable:!0,configurable:!0}),i._defaultOptions={title:"",color:"",activeColor:"",playerOptions:{}},i}();function w(){return(w=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var O=function(){function t(t){this._isOpen=!1,this._defaultOptions={classes:"",openers:"",closers:""},this._eventEmitter=new i,this._listeners=[];var e=w({},this._defaultOptions,t);this.el=this._createDiv(e.classes),this.content=this._createDiv("gobi-popup__content"),this.iframeContainer=this._createDiv("gobi-popup__iframe-container"),this._createTemplate(),this.player=e.player,this.appendPlayer(this.player),this._initClosers(e.closers)}return Object.defineProperty(t.prototype,"isOpen",{get:function(){return this._isOpen},enumerable:!0,configurable:!0}),t.prototype.appendPlayer=function(t){this.player=t,this.iframeContainer.insertBefore(this.player.el,this.iframeContainer.lastElementChild)},t.prototype.open=function(){l.disable(),this.el.style.zIndex=(function(){for(var t=document.body.querySelectorAll("*"),e=1,n=0,i=t.length;i--;)e<(n=Number(window.getComputedStyle(t[i]).zIndex))&&(e=n);return e}()+1).toString(),this.el.classList.add("gobi-popup--active"),this._listeners.push(r(window,"keyup",this._onKeyUpClose.bind(this))),this._isOpen=!0,this._eventEmitter.emit("open",this,this)},t.prototype.close=function(){this.el.style.zIndex="",this.el.classList.remove("gobi-popup--active"),this.el.style.padding="",l.enable(),this._removeListeners(),this.player.pause(),this._isOpen=!1,this._eventEmitter.emit("close",this,this)},t.prototype.on=function(t,e){this._eventEmitter.on(t,e)},t.prototype.off=function(t,e){this._eventEmitter.off(t,e)},t.prototype._removeListeners=function(){for(var t=this._listeners.length;t--;)this._listeners[t]()},t.prototype._createTemplate=function(){var t=this._createElement("button","gobi-popup__close-btn");r(t,"click",this.close.bind(this)),this._calcPlayerSize(),this.iframeContainer.appendChild(t),this.content.appendChild(this.iframeContainer),this.el.classList.add("gobi-popup"),this.el.appendChild(this.content),window.addEventListener("resize",this._calcPlayerSize.bind(this))},t.prototype._createDiv=function(t){return this._createElement("div",t)},t.prototype._createElement=function(t,e){var n=document.createElement(t);return n.className=e,n},t.prototype._initClosers=function(t){this.el.addEventListener("click",this._onOutsideClose.bind(this)),this.content.addEventListener("click",this._onOutsideClose.bind(this))},t.prototype._onOutsideClose=function(t){t.target===t.currentTarget&&this.close()},t.prototype._onKeyUpClose=function(t){(void 0!==t.key?"Escape"===t.key||"Esc"===t.key:27===t.keyCode)&&this.close()},t.prototype._calcPlayerSize=function(){var t,e,n=window.innerHeight-100,i=window.innerWidth;e=.5625<i/n?(t=.5625*n,n):(t=i)/.5625,this.iframeContainer.style.width=t+"px",this.iframeContainer.style.height=e+"px"},t}(),S=function(n){function i(t){var e=n.call(this,t)||this;return e._elems={title:e._getElem("title"),description:e._getElem("description"),avatar:e._getElem("avatar"),avatarContainer:e._getElem("avatarContainer")},t.titleColor&&(e._elems.title.style.color=t.titleColor),t.descriptionColor&&(e._elems.description.style.color=t.descriptionColor),e.title=e._title,e.description=e._description,e.avatarSrc=e._avatarSrc,e.color=e._color,e}return y(i,n),Object.defineProperty(i.prototype,"avatarSrc",{get:function(){return this._avatarSrc},set:function(t){this._avatarSrc=t,this._elems.avatar.style.backgroundImage="url("+t+")"},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"title",{get:function(){return this._title},set:function(t){this._title=t,this._elems.title.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"description",{get:function(){return this._description},set:function(t){this._description=t,this._elems.description.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"color",{get:function(){return this._color},set:function(t){this._color=t,this._elems.avatarContainer.style.borderColor=t},enumerable:!0,configurable:!0}),i.prototype._createTemplate=function(){var t="gobi-popup-story",e=document.createElement("div");return e.classList.add(t),e.innerHTML=i._HTML,a(e.querySelectorAll("*"),t+"__"),e},Object.defineProperty(i,"_HTML",{get:function(){return'<div class="avatar-container" data-select-area data-avatarContainer><div class="avatar" data-avatar></div></div><div class="title" data-title></div><div class="description"><div class="description-text" data-description></div></div>'},enumerable:!0,configurable:!0}),i}(m);function C(){return(C=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var E=function(){function r(t){var e=C({},r._defaultMobileModuleOptions,t);this.el=this._createTemplate(e.verticalOrientation),this._title=e.title,this.title=e.title,this._color=e.color,this.stories=this._createStories(e.stories),this._currentStory=this.stories[0],this.player=new h(C({storyName:this.currentStory.name,checkViewPort:!1},e.playerOptions)),this.popup=new O({player:this.player})}return Object.defineProperty(r.prototype,"title",{get:function(){return this._title},set:function(t){var e=this.el.querySelector("[data-title]");e&&(this._title=t,e.textContent=t)},enumerable:!0,configurable:!0}),Object.defineProperty(r.prototype,"currentStory",{get:function(){return this._currentStory},set:function(t){this._currentStory=t,this.player.load({storyName:this._currentStory.name})},enumerable:!0,configurable:!0}),r.prototype.append=function(t){document.body.appendChild(this.popup.el),t.appendChild(this.el)},r.prototype.remove=function(){var t=this.el.parentElement;t&&(document.body.removeChild(this.popup.el),t.removeChild(this.el),this.popup.close())},r.prototype._createStories=function(t){var e=this,n=this.el.querySelector("[data-stories]");return t.map(function(t){return new S({name:t.name,container:n,avatarSrc:t.avatarSrc,title:t.title,description:t.description,titleColor:t.titleColor,descriptionColor:t.descriptionColor,color:e._color,onSelect:e._onStorySelect.bind(e)})})},r.prototype._onStorySelect=function(t){this.currentStory=t,this.popup.open()},r.prototype._createTemplate=function(t){void 0===t&&(t=!1);var e=document.createElement("div"),n="gobi-popup-module";e.classList.add(n),e.innerHTML=r._HTML,a(e.querySelectorAll("*"),n+"__");var i=e.lastElementChild;return t?i.classList.add(n+"__stories--vertical"):i.classList.add(n+"__stories--horizontal"),e},Object.defineProperty(r,"_HTML",{get:function(){return'<div class="title" data-title></div>\n <div class="stories" data-stories></div>'},enumerable:!0,configurable:!0}),r._defaultMobileModuleOptions={title:"",color:"",playerOptions:{}},r}();function T(){return(T=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var k=function(){function l(t){this.load(t)}return l.prototype.load=function(s){var a=this;c(s.moduleId).then(function(t){var e=T({},l._defaultOptions,s),n=e.container,i=u(p(t),e.stories),r=window.innerWidth<768,o=a._initModules(e,i);window.innerWidth<768&&o.mobile.append(n),767<window.innerWidth&&o.desktop.append(n),window.addEventListener("resize",function(){window.innerWidth<768&&!r&&(o.desktop.remove(),o.mobile.append(n),r=!0),767<window.innerWidth&&r&&(o.mobile.remove(),o.desktop.append(n),r=!1)})})},l.prototype._initModules=function(t,e){return{desktop:new g({title:t.title,color:t.color,activeColor:t.activeColor,stories:e,playerOptions:t.playerOptions,titleSize:t.desktopStoryStyle.titleSize,avatarSize:t.desktopStoryStyle.avatarSize,descriptionSize:t.desktopStoryStyle.descriptionSize}),mobile:new E({title:t.title,color:t.activeColor,stories:e,playerOptions:t.playerOptions})}},l._defaultOptions={title:"",color:"#999999",activeColor:"#15d6ea",stories:[],desktopStoryStyle:{}},l}();function P(){return(P=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var j=function(){function r(t){this.load(t)}return r.prototype.load=function(i){c(i.moduleId).then(function(t){var e=P({},r._defaultOptions,i),n=u(p(t),e.stories);new E({verticalOrientation:e.verticalOrientation,title:i.title,color:i.color,stories:n,playerOptions:i.playerOptions}).append(e.container)})},r._defaultOptions={title:"",color:"#15d6ea",stories:[]},r}();n.d(e,"Module",function(){return I}),n.d(e,"MobileModule",function(){return L}),n.d(e,"Player",function(){return M});var I=k,L=j,M=h}])}); | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.gobi=e():t.gobi=e()}(window,function(){return function(n){var i={};function r(t){if(i[t])return i[t].exports;var e=i[t]={i:t,l:!1,exports:{}};return n[t].call(e.exports,e,e.exports,r),e.l=!0,e.exports}return r.m=n,r.c=i,r.d=function(t,e,n){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)r.d(n,i,function(t){return e[t]}.bind(null,i));return n},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=7)}([function(t,e){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(t){"object"==typeof window&&(n=window)}t.exports=n},function(t,p,d){"use strict";(function(e){var t=d(2),n=setTimeout;function i(){}function o(t){if(!(this instanceof o))throw new TypeError("Promises must be constructed via new");if("function"!=typeof t)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],u(t,this)}function r(n,i){for(;3===n._state;)n=n._value;0!==n._state?(n._handled=!0,o._immediateFn(function(){var t=1===n._state?i.onFulfilled:i.onRejected;if(null!==t){var e;try{e=t(n._value)}catch(t){return void a(i.promise,t)}s(i.promise,e)}else(1===n._state?s:a)(i.promise,n._value)})):n._deferreds.push(i)}function s(e,t){try{if(t===e)throw new TypeError("A promise cannot be resolved with itself.");if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if(t instanceof o)return e._state=3,e._value=t,void l(e);if("function"==typeof n)return void u((i=n,r=t,function(){i.apply(r,arguments)}),e)}e._state=1,e._value=t,l(e)}catch(t){a(e,t)}var i,r}function a(t,e){t._state=2,t._value=e,l(t)}function l(t){2===t._state&&0===t._deferreds.length&&o._immediateFn(function(){t._handled||o._unhandledRejectionFn(t._value)});for(var e=0,n=t._deferreds.length;e<n;e++)r(t,t._deferreds[e]);t._deferreds=null}function c(t,e,n){this.onFulfilled="function"==typeof t?t:null,this.onRejected="function"==typeof e?e:null,this.promise=n}function u(t,e){var n=!1;try{t(function(t){n||(n=!0,s(e,t))},function(t){n||(n=!0,a(e,t))})}catch(t){if(n)return;n=!0,a(e,t)}}o.prototype.catch=function(t){return this.then(null,t)},o.prototype.then=function(t,e){var n=new this.constructor(i);return r(this,new c(t,e,n)),n},o.prototype.finally=t.a,o.all=function(e){return new o(function(i,r){if(!e||void 0===e.length)throw new TypeError("Promise.all accepts an array");var o=Array.prototype.slice.call(e);if(0===o.length)return i([]);var s=o.length;function a(e,t){try{if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if("function"==typeof n)return void n.call(t,function(t){a(e,t)},r)}o[e]=t,0==--s&&i(o)}catch(t){r(t)}}for(var t=0;t<o.length;t++)a(t,o[t])})},o.resolve=function(e){return e&&"object"==typeof e&&e.constructor===o?e:new o(function(t){t(e)})},o.reject=function(n){return new o(function(t,e){e(n)})},o.race=function(r){return new o(function(t,e){for(var n=0,i=r.length;n<i;n++)r[n].then(t,e)})},o._immediateFn="function"==typeof e&&function(t){e(t)}||function(t){n(t,0)},o._unhandledRejectionFn=function(t){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",t)},p.a=o}).call(this,d(4).setImmediate)},function(t,e,n){"use strict";e.a=function(e){var n=this.constructor;return this.then(function(t){return n.resolve(e()).then(function(){return t})},function(t){return n.resolve(e()).then(function(){return n.reject(t)})})}},function(t,e,n){},function(t,r,o){(function(t){var e=void 0!==t&&t||"undefined"!=typeof self&&self||window,n=Function.prototype.apply;function i(t,e){this._id=t,this._clearFn=e}r.setTimeout=function(){return new i(n.call(setTimeout,e,arguments),clearTimeout)},r.setInterval=function(){return new i(n.call(setInterval,e,arguments),clearInterval)},r.clearTimeout=r.clearInterval=function(t){t&&t.close()},i.prototype.unref=i.prototype.ref=function(){},i.prototype.close=function(){this._clearFn.call(e,this._id)},r.enroll=function(t,e){clearTimeout(t._idleTimeoutId),t._idleTimeout=e},r.unenroll=function(t){clearTimeout(t._idleTimeoutId),t._idleTimeout=-1},r._unrefActive=r.active=function(t){clearTimeout(t._idleTimeoutId);var e=t._idleTimeout;0<=e&&(t._idleTimeoutId=setTimeout(function(){t._onTimeout&&t._onTimeout()},e))},o(5),r.setImmediate="undefined"!=typeof self&&self.setImmediate||void 0!==t&&t.setImmediate||this&&this.setImmediate,r.clearImmediate="undefined"!=typeof self&&self.clearImmediate||void 0!==t&&t.clearImmediate||this&&this.clearImmediate}).call(this,o(0))},function(t,e,n){(function(t,f){!function(n,i){"use strict";if(!n.setImmediate){var r,o,e,s,t,a=1,l={},c=!1,u=n.document,p=Object.getPrototypeOf&&Object.getPrototypeOf(n);p=p&&p.setTimeout?p:n,r="[object process]"==={}.toString.call(n.process)?function(t){f.nextTick(function(){h(t)})}:function(){if(n.postMessage&&!n.importScripts){var t=!0,e=n.onmessage;return n.onmessage=function(){t=!1},n.postMessage("","*"),n.onmessage=e,t}}()?(s="setImmediate$"+Math.random()+"$",t=function(t){t.source===n&&"string"==typeof t.data&&0===t.data.indexOf(s)&&h(+t.data.slice(s.length))},n.addEventListener?n.addEventListener("message",t,!1):n.attachEvent("onmessage",t),function(t){n.postMessage(s+t,"*")}):n.MessageChannel?((e=new MessageChannel).port1.onmessage=function(t){h(t.data)},function(t){e.port2.postMessage(t)}):u&&"onreadystatechange"in u.createElement("script")?(o=u.documentElement,function(t){var e=u.createElement("script");e.onreadystatechange=function(){h(t),e.onreadystatechange=null,o.removeChild(e),e=null},o.appendChild(e)}):function(t){setTimeout(h,0,t)},p.setImmediate=function(t){"function"!=typeof t&&(t=new Function(""+t));for(var e=new Array(arguments.length-1),n=0;n<e.length;n++)e[n]=arguments[n+1];var i={callback:t,args:e};return l[a]=i,r(a),a++},p.clearImmediate=d}function d(t){delete l[t]}function h(t){if(c)setTimeout(h,0,t);else{var e=l[t];if(e){c=!0;try{!function(t){var e=t.callback,n=t.args;switch(n.length){case 0:e();break;case 1:e(n[0]);break;case 2:e(n[0],n[1]);break;case 3:e(n[0],n[1],n[2]);break;default:e.apply(i,n)}}(e)}finally{d(t),c=!1}}}}}("undefined"==typeof self?void 0===t?this:t:self)}).call(this,n(0),n(6))},function(t,e){var n,i,r=t.exports={};function o(){throw new Error("setTimeout has not been defined")}function s(){throw new Error("clearTimeout has not been defined")}function a(e){if(n===setTimeout)return setTimeout(e,0);if((n===o||!n)&&setTimeout)return n=setTimeout,setTimeout(e,0);try{return n(e,0)}catch(t){try{return n.call(null,e,0)}catch(t){return n.call(this,e,0)}}}!function(){try{n="function"==typeof setTimeout?setTimeout:o}catch(t){n=o}try{i="function"==typeof clearTimeout?clearTimeout:s}catch(t){i=s}}();var l,c=[],u=!1,p=-1;function d(){u&&l&&(u=!1,l.length?c=l.concat(c):p=-1,c.length&&h())}function h(){if(!u){var t=a(d);u=!0;for(var e=c.length;e;){for(l=c,c=[];++p<e;)l&&l[p].run();p=-1,e=c.length}l=null,u=!1,function(e){if(i===clearTimeout)return clearTimeout(e);if((i===s||!i)&&clearTimeout)return i=clearTimeout,clearTimeout(e);try{i(e)}catch(t){try{return i.call(null,e)}catch(t){return i.call(this,e)}}}(t)}}function f(t,e){this.fun=t,this.array=e}function y(){}r.nextTick=function(t){var e=new Array(arguments.length-1);if(1<arguments.length)for(var n=1;n<arguments.length;n++)e[n-1]=arguments[n];c.push(new f(t,e)),1!==c.length||u||a(h)},f.prototype.run=function(){this.fun.apply(null,this.array)},r.title="browser",r.browser=!0,r.env={},r.argv=[],r.version="",r.versions={},r.on=y,r.addListener=y,r.once=y,r.off=y,r.removeListener=y,r.removeAllListeners=y,r.emit=y,r.prependListener=y,r.prependOnceListener=y,r.listeners=function(t){return[]},r.binding=function(t){throw new Error("process.binding is not supported")},r.cwd=function(){return"/"},r.chdir=function(t){throw new Error("process.chdir is not supported")},r.umask=function(){return 0}},function(t,e,n){"use strict";n.r(e);n(3);var i=function(){function t(){this._eventsCallbacks={}}return t.prototype.on=function(t,e){this._eventsCallbacks.hasOwnProperty(t)||(this._eventsCallbacks[t]=[]);var n=this._eventsCallbacks[t];-1===n.indexOf(e)&&n.push(e)},t.prototype.off=function(t,e){"string"==typeof t?this._eventsCallbacks.hasOwnProperty(t)&&("function"==typeof e?this._removeCallback(t,e):this._eventsCallbacks[t]=[]):this._removeAllCallbacks()},t.prototype.emit=function(t,e,n){if(this._eventsCallbacks.hasOwnProperty(t))for(var i=this._eventsCallbacks[t],r=i.length,o=0;o<r;o++)i[o].call(n||this,e)},t.prototype._removeCallback=function(t,e){var n=this._eventsCallbacks[t],i=n.indexOf(e);-1<i&&n.splice(i,1)},t.prototype._removeAllCallbacks=function(){for(var t in this._eventsCallbacks)this._eventsCallbacks.hasOwnProperty(t)&&delete this._eventsCallbacks[t]},t}(),o=n(1);function s(){return(s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function a(t,e){for(var n,i=t.length,r=0;r<i;r++)(n=t[r]).className=e+n.className}function c(r){return new o.a(function(t,e){var n=new XMLHttpRequest,i="https://live.gobiapp.com/projector/player/storyModules/"+r;n.open("GET",i,!0),n.send(),n.onload=function(){this.status<400?t(JSON.parse(this.responseText)):e(Error("Module didn't load successfully; error code:"+n.statusText))},n.onerror=function(){e(Error("There was a network error."))}})}function u(t,e){var n=[];for(var i in t){var r=t[i],o=e[i];n.push(o?s(r,o):r)}return n}function p(t){return t.map(function(t){return{title:t.title,avatarSrc:t.thumbnail,description:t.description,name:t.story_id}})}function r(t,e,n){var i=function(t){return n(t)};return t.addEventListener(e,i),function(){return t.removeEventListener(e,i)}}var l={scrollTop:0,bodyOverflow:"",htmlOverflow:"",disable:function(){this.isIOS?this.IOSDisable():this.classicDisable()},enable:function(){this.isIOS?this.IOSEnable():this.classicEnable()},classicDisable:function(){this.bodyOverflow=document.body.style.overflow,this.htmlOverflow=document.documentElement.style.overflow,document.documentElement.style.overflow="hidden",document.body.style.overflow="hidden"},classicEnable:function(){document.documentElement.style.overflow=this.htmlOverflow,document.body.style.overflow=this.bodyOverflow},IOSEnable:function(){document.documentElement.classList.remove("disabled-scroll"),document.body.classList.remove("disabled-scroll"),window.scrollTo(0,this.scrollTop)},IOSDisable:function(){this.scrollTop=window.pageYOffset,document.documentElement.classList.add("disabled-scroll"),document.body.classList.add("disabled-scroll")},isIOS:/iPad|iPhone|iPod/.test(navigator.userAgent)};function d(){return(d=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var h=function(){function t(t){var n=this;this._defaultOptions={autoStart:!1,hideOverlay:!1,loop:!1,width:0,height:0,roundedCorners:!0,shadow:!0,checkViewPort:!0},this._eventEmitter=new i,this.on=this._eventEmitter.on.bind(this._eventEmitter),this.off=this._eventEmitter.off.bind(this._eventEmitter),this._removeIsOnScreenChecker=function(){},this._removeIsOutOfScreenChecker=function(){},this._options=d({},this._defaultOptions,t),this.el=this._createIframe(),this._options.container&&this._options.container.appendChild(this.el),window.addEventListener("message",function(t){if(n.el.contentWindow===t.source){var e=t.data;e.event&&(n._eventEmitter.emit(e.event,e.value,n),n._options.checkViewPort&&n._viewPortChecker(e.event))}})}return Object.defineProperty(t.prototype,"storyURL",{get:function(){return"https://live.gobiapp.com/next/story/id/"+this._options.storyName+"?autoStart="+this._options.autoStart+"&addLooping="+this._options.loop+"&hideOverlay="+this._options.hideOverlay+"&roundedCorners="+this._options.roundedCorners},enumerable:!0,configurable:!0}),t.prototype.load=function(t){d(this._options,t),this.el.src=this.storyURL},t.prototype.play=function(){this._callPlayerMethod("play")},t.prototype.pause=function(){this._callPlayerMethod("pause")},t.prototype.reload=function(){this._callPlayerMethod("reset")},t.prototype.setMute=function(t){this._callPlayerMethod("setMute",t)},t.prototype.isInViewport=function(){var t=this.el.getBoundingClientRect(),e=window.innerHeight||document.documentElement.clientHeight,n=window.innerWidth||document.documentElement.clientWidth,i=.8*t.height,r=.8*t.width;return t.top>=0-i&&t.left>=0-r&&t.bottom<=e+i&&t.right<=n+r},t.prototype._callPlayerMethod=function(t,e){void 0===e&&(e=void 0),this._sendMessage({method:t,value:e})},t.prototype._sendMessage=function(t){var e=this.el.contentWindow;e&&e.postMessage(t,"*")},t.prototype._createIframe=function(){var t=document.createElement("iframe"),e=this._calcPlayerSize();return t.src=this.storyURL,t.width=e.width.toString(),t.height=e.height.toString(),t.frameBorder="0",t.scrolling="no",t.style.overflow="hidden",t.style.background="#000",t.style.border="0",this._options.shadow&&t.classList.add("gobi-player-shadow"),this._options.roundedCorners&&(t.style.borderRadius="10px"),t.setAttribute("allow","autoplay;"),t},t.prototype._viewPortChecker=function(t){switch(t){case"play":this._addIsOutOfScreenChecker();break;case"pause":this.isInViewport()&&(this._removeIsOnScreenChecker(),this._removeIsOutOfScreenChecker());break;case"ended":this._removeIsOnScreenChecker(),this._removeIsOutOfScreenChecker()}},t.prototype._addIsOutOfScreenChecker=function(){var t=this;this._removeIsOutOfScreenChecker(),this._removeIsOnScreenChecker(),this._removeIsOutOfScreenChecker=r(window,"scroll",function(){t.isInViewport()||(t.pause(),t._removeIsOutOfScreenChecker(),t._addIsOnScreenChecker())})},t.prototype._addIsOnScreenChecker=function(){var t=this;this._removeIsOnScreenChecker=r(window,"scroll",function(){t.isInViewport()&&(t.play(),t._removeIsOnScreenChecker(),t._addIsOutOfScreenChecker())})},t.prototype._calcPlayerSize=function(){var t=612,e=1088;return this._options.width&&this._options.height?(t=this._options.width,e=this._options.height):this._options.width?e=(t=this._options.width)/.5625:this._options.height&&(t=.5625*(e=this._options.height)),{width:t,height:e}},t}(),f=function(t,e){return(f=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function y(t,e){function n(){this.constructor=t}f(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}function v(){return(v=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var m=function(){function n(t){this._listeners=[],this._eventEmitter=new i,this.on=this._eventEmitter.on.bind(this._eventEmitter),this.off=this._eventEmitter.off.bind(this._eventEmitter);var e=v({},n._defaultStoryOptions,t);this.el=this._createTemplate(),this.name=e.name,this._title=e.title,this._description=e.description,this._avatarSrc=e.avatarSrc,this._color=e.color,this._addSelectEmitter(),"function"==typeof e.onSelect&&this._eventEmitter.on("select",e.onSelect),e.container&&e.container.appendChild(this.el)}return n.prototype.destroy=function(){this.el.parentElement&&this.el.parentElement.removeChild(this.el),this._eventEmitter.off();for(var t=this._listeners.length;t--;)this._listeners[t]()},n.prototype._addSelectEmitter=function(){for(var t=this,e=this.el.querySelectorAll("[data-select-area]"),n=function(){t._eventEmitter.emit("select",t)},i=e.length;i--;)this._listeners.push(r(e[i],"click",n))},n.prototype._getElem=function(t){var e="data-"+t,n=this.el.querySelector("["+e+"]");if(n)return n.removeAttribute(e),n;throw new Error("Story does not contain element with name:"+t)},n._defaultStoryOptions={avatarSrc:"",title:"",description:"",color:"",selected:!1,titleColor:"",descriptionColor:""},n}(),_=function(n){function i(t){var e=n.call(this,t)||this;return e._selected=!1,e._elems={title:e._getElem("title"),description:e._getElem("description"),avatar:e._getElem("avatar"),avatarContainer:e._getElem("avatarContainer")},t.titleColor&&(e._elems.title.style.color=t.titleColor),t.descriptionColor&&(e._elems.description.style.color=t.descriptionColor),t.titleSize&&(e._elems.title.style.fontSize=t.titleSize),t.descriptionSize&&(e._elems.description.style.fontSize=t.descriptionSize),t.avatarSize&&(e._elems.avatarContainer.style.width=t.avatarSize),e._selected=!!t.selected,e.title=e._title,e.description=e._description,e.avatarSrc=e._avatarSrc,e.color=e._color,e}return y(i,n),Object.defineProperty(i.prototype,"avatarSrc",{get:function(){return this._avatarSrc},set:function(t){this._avatarSrc=t,this._elems.avatar.style.backgroundImage="url("+t+")"},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"title",{get:function(){return this._title},set:function(t){this._title=t,this._elems.title.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"description",{get:function(){return this._description},set:function(t){this._description=t,this._elems.description.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"color",{get:function(){return this._color},set:function(t){this._color=t,this._elems.avatarContainer.style.borderColor=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"selected",{get:function(){return this._selected},set:function(t){t?this.el.classList.add("gobi-story--selected"):this.el.classList.remove("gobi-story--selected"),this._selected=t},enumerable:!0,configurable:!0}),i.prototype._createTemplate=function(){var t="gobi-story",e=document.createElement("div");return e.classList.add(t),e.innerHTML=i._HTML,a(e.querySelectorAll("*"),t+"__"),e},Object.defineProperty(i,"_HTML",{get:function(){return'<div class="avatar-container" data-select-area data-avatarContainer><div class="avatar" data-avatar></div></div><div class="title" data-title></div><div class="description" data-description></div>'},enumerable:!0,configurable:!0}),i}(m);function b(){return(b=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var g=function(){function i(t){var e=this,n=b({},i._defaultOptions,t);this.el=this._createTemplate(),this._title=n.title,this.title=n.title,this._color=n.color,this._activeColor=n.activeColor,this.stories=this._createStories(n.stories,n),this._currentStory=this.stories[0],this._playerContainer=this.el.querySelector("[data-player]"),this.player=new h(b({storyName:this._currentStory.name,container:this._playerContainer},n.playerOptions)),this._playerContainer.style.maxWidth=Math.min(.53*window.innerHeight,350)+"px",window.addEventListener("resize",function(){e._playerContainer.style.maxWidth=Math.min(.53*window.innerHeight,350)+"px"}),this.currentStory=this._currentStory}return Object.defineProperty(i.prototype,"title",{get:function(){return this._title},set:function(t){var e=this.el.querySelector("[data-title]");e&&(this._title=t,e.textContent=t)},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"currentStory",{get:function(){return this._currentStory},set:function(t){this._currentStory.color=this._color,this._currentStory.selected=!1,this._currentStory=t,this._currentStory.selected=!0,this._currentStory.color=this._activeColor,this.player.load({storyName:this._currentStory.name})},enumerable:!0,configurable:!0}),i.prototype.append=function(t){t.appendChild(this.el)},i.prototype.remove=function(){var t=this.el.parentElement;t&&t.removeChild(this.el)},i.prototype._createStories=function(t,e){var n=this,i=this.el.querySelector("[data-stories]");return t.map(function(t){return new _({name:t.name,container:i,avatarSrc:t.avatarSrc,title:t.title,description:t.description,titleColor:t.titleColor,descriptionColor:t.descriptionColor,color:n._color,titleSize:e.titleSize,avatarSize:e.avatarSize,descriptionSize:e.descriptionSize,onSelect:n._onStorySelect.bind(n)})})},i.prototype._onStorySelect=function(t){console.log("_onStorySelect"),this.currentStory=t},i.prototype._createTemplate=function(){var t=document.createElement("div"),e="gobi-module";return t.classList.add(e),t.innerHTML=i._HTML,a(t.querySelectorAll("*"),e+"__"),t},Object.defineProperty(i,"_HTML",{get:function(){return'<div class="player-block"><div class="player" data-player></div></div><div class="stories-block"><div class="title" data-title></div><div class="stories" data-stories></div></div>'},enumerable:!0,configurable:!0}),i._defaultOptions={title:"",color:"",activeColor:"",playerOptions:{}},i}();function w(){return(w=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var O=function(){function t(t){this._isOpen=!1,this._defaultOptions={classes:"",openers:"",closers:""},this._eventEmitter=new i,this._listeners=[];var e=w({},this._defaultOptions,t);this.el=this._createDiv(e.classes),this.content=this._createDiv("gobi-popup__content"),this.iframeContainer=this._createDiv("gobi-popup__iframe-container"),this._createTemplate(),this.player=e.player,this.appendPlayer(this.player),this._initClosers(e.closers)}return Object.defineProperty(t.prototype,"isOpen",{get:function(){return this._isOpen},enumerable:!0,configurable:!0}),t.prototype.appendPlayer=function(t){this.player=t,this.iframeContainer.insertBefore(this.player.el,this.iframeContainer.lastElementChild)},t.prototype.open=function(){l.disable(),this.el.style.zIndex=(function(){for(var t=document.body.querySelectorAll("*"),e=1,n=0,i=t.length;i--;)e<(n=Number(window.getComputedStyle(t[i]).zIndex))&&(e=n);return e}()+1).toString(),this.el.classList.add("gobi-popup--active"),this._listeners.push(r(window,"keyup",this._onKeyUpClose.bind(this))),this._isOpen=!0,this._eventEmitter.emit("open",this,this)},t.prototype.close=function(){this.el.style.zIndex="",this.el.classList.remove("gobi-popup--active"),this.el.style.padding="",l.enable(),this._removeListeners(),this.player.pause(),this._isOpen=!1,this._eventEmitter.emit("close",this,this)},t.prototype.on=function(t,e){this._eventEmitter.on(t,e)},t.prototype.off=function(t,e){this._eventEmitter.off(t,e)},t.prototype._removeListeners=function(){for(var t=this._listeners.length;t--;)this._listeners[t]()},t.prototype._createTemplate=function(){var t=this._createElement("button","gobi-popup__close-btn");r(t,"click",this.close.bind(this)),this._calcPlayerSize(),this.iframeContainer.appendChild(t),this.content.appendChild(this.iframeContainer),this.el.classList.add("gobi-popup"),this.el.appendChild(this.content),window.addEventListener("resize",this._calcPlayerSize.bind(this))},t.prototype._createDiv=function(t){return this._createElement("div",t)},t.prototype._createElement=function(t,e){var n=document.createElement(t);return n.className=e,n},t.prototype._initClosers=function(t){this.el.addEventListener("click",this._onOutsideClose.bind(this)),this.content.addEventListener("click",this._onOutsideClose.bind(this))},t.prototype._onOutsideClose=function(t){t.target===t.currentTarget&&this.close()},t.prototype._onKeyUpClose=function(t){(void 0!==t.key?"Escape"===t.key||"Esc"===t.key:27===t.keyCode)&&this.close()},t.prototype._calcPlayerSize=function(){var t,e,n=window.innerHeight-100,i=window.innerWidth;e=.5625<i/n?(t=.5625*n,n):(t=i)/.5625,this.iframeContainer.style.width=t+"px",this.iframeContainer.style.height=e+"px"},t}(),S=function(n){function i(t){var e=n.call(this,t)||this;return e._elems={title:e._getElem("title"),description:e._getElem("description"),avatar:e._getElem("avatar"),avatarContainer:e._getElem("avatarContainer")},t.titleColor&&(e._elems.title.style.color=t.titleColor),t.descriptionColor&&(e._elems.description.style.color=t.descriptionColor),e.title=e._title,e.description=e._description,e.avatarSrc=e._avatarSrc,e.color=e._color,e}return y(i,n),Object.defineProperty(i.prototype,"avatarSrc",{get:function(){return this._avatarSrc},set:function(t){this._avatarSrc=t,this._elems.avatar.style.backgroundImage="url("+t+")"},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"title",{get:function(){return this._title},set:function(t){this._title=t,this._elems.title.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"description",{get:function(){return this._description},set:function(t){this._description=t,this._elems.description.textContent=t},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"color",{get:function(){return this._color},set:function(t){this._color=t,this._elems.avatarContainer.style.borderColor=t},enumerable:!0,configurable:!0}),i.prototype._createTemplate=function(){var t="gobi-popup-story",e=document.createElement("div");return e.classList.add(t),e.innerHTML=i._HTML,a(e.querySelectorAll("*"),t+"__"),e},Object.defineProperty(i,"_HTML",{get:function(){return'<div class="avatar-container" data-select-area data-avatarContainer><div class="avatar" data-avatar></div></div><div class="title" data-title></div><div class="description"><div class="description-text" data-description></div></div>'},enumerable:!0,configurable:!0}),i}(m);function C(){return(C=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var E=function(){function r(t){var e=C({},r._defaultMobileModuleOptions,t);this.el=this._createTemplate(e.verticalOrientation),this._title=e.title,this.title=e.title,this._color=e.color,this.stories=this._createStories(e.stories),this._currentStory=this.stories[0],this.player=new h(C({storyName:this.currentStory.name,checkViewPort:!1},e.playerOptions)),this.popup=new O({player:this.player})}return Object.defineProperty(r.prototype,"title",{get:function(){return this._title},set:function(t){var e=this.el.querySelector("[data-title]");e&&(this._title=t||"",e.textContent=this._title,e.style.display=this._title?"":"none")},enumerable:!0,configurable:!0}),Object.defineProperty(r.prototype,"currentStory",{get:function(){return this._currentStory},set:function(t){this._currentStory=t,this.player.load({storyName:this._currentStory.name})},enumerable:!0,configurable:!0}),r.prototype.append=function(t){document.body.appendChild(this.popup.el),t.appendChild(this.el)},r.prototype.remove=function(){var t=this.el.parentElement;t&&(document.body.removeChild(this.popup.el),t.removeChild(this.el),this.popup.close())},r.prototype._createStories=function(t){var e=this,n=this.el.querySelector("[data-stories]");return t.map(function(t){return new S({name:t.name,container:n,avatarSrc:t.avatarSrc,title:t.title,description:t.description,titleColor:t.titleColor,descriptionColor:t.descriptionColor,color:e._color,onSelect:e._onStorySelect.bind(e)})})},r.prototype._onStorySelect=function(t){this.currentStory=t,this.popup.open()},r.prototype._createTemplate=function(t){void 0===t&&(t=!1);var e=document.createElement("div"),n="gobi-popup-module";e.classList.add(n),e.innerHTML=r._HTML,a(e.querySelectorAll("*"),n+"__");var i=e.lastElementChild;return t?i.classList.add(n+"__stories--vertical"):i.classList.add(n+"__stories--horizontal"),e},Object.defineProperty(r,"_HTML",{get:function(){return'<div class="title" data-title></div>\n <div class="stories" data-stories></div>'},enumerable:!0,configurable:!0}),r._defaultMobileModuleOptions={title:"",color:"",playerOptions:{}},r}();function T(){return(T=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var k=function(){function l(t){this.load(t)}return l.prototype.load=function(s){var a=this;c(s.moduleId).then(function(t){var e=T({},l._defaultOptions,s),n=e.container,i=u(p(t),e.stories),r=window.innerWidth<768,o=a._initModules(e,i);window.innerWidth<768&&o.mobile.append(n),767<window.innerWidth&&o.desktop.append(n),window.addEventListener("resize",function(){window.innerWidth<768&&!r&&(o.desktop.remove(),o.mobile.append(n),r=!0),767<window.innerWidth&&r&&(o.mobile.remove(),o.desktop.append(n),r=!1)})})},l.prototype._initModules=function(t,e){return{desktop:new g({title:t.title,color:t.color,activeColor:t.activeColor,stories:e,playerOptions:t.playerOptions,titleSize:t.desktopStoryStyle.titleSize,avatarSize:t.desktopStoryStyle.avatarSize,descriptionSize:t.desktopStoryStyle.descriptionSize}),mobile:new E({title:t.title,color:t.activeColor,stories:e,playerOptions:t.playerOptions})}},l._defaultOptions={title:"",color:"#999999",activeColor:"#15d6ea",stories:[],desktopStoryStyle:{}},l}();function P(){return(P=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var j=function(){function r(t){this.load(t)}return r.prototype.load=function(i){c(i.moduleId).then(function(t){var e=P({},r._defaultOptions,i),n=u(p(t),e.stories);new E({verticalOrientation:e.verticalOrientation,title:i.title,color:i.color,stories:n,playerOptions:i.playerOptions}).append(e.container)})},r._defaultOptions={title:"",color:"#15d6ea",stories:[]},r}();n.d(e,"Module",function(){return I}),n.d(e,"MobileModule",function(){return L}),n.d(e,"Player",function(){return M});var I=k,L=j,M=h,x=document.createElement("div");document.body.appendChild(x),new L({moduleId:"3",container:x})}])}); |
{ | ||
"name": "@gobistories/gobi-web-integration", | ||
"version": "1.2.2", | ||
"version": "1.2.3", | ||
"description": "", | ||
@@ -5,0 +5,0 @@ "main": "dist/gobi-web-integration.js", |
195
README.md
# Gobi Web Integration | ||
The Gobi Web Integration API allows you to interact with and customize an embedded Stories Layout and Gobi Player | ||
Welcome to Gobi Web Integration. This library will let you put your Gobi stories on your site. | ||
## Installation | ||
Below follow | ||
You can install the Gobi Web Integration through either npm: **npm install --save @gobistories/gobi-web-integration** | ||
- What it will look like (screenshots) | ||
- Requirements & prerequisites | ||
- Functionality breakdown | ||
- Implementation steps | ||
- Advanced configuration (eg. vertically oriented layout) | ||
- Troubleshooting | ||
- Browser Support | ||
Alternatively, you can reference an up‐to‐date version on npm CDN: | ||
## What it will look like (demo) | ||
See a demo of this library in action at | ||
[https://gobiapp.com/external/example-module](https://gobiapp.com/external/example-module) | ||
## What it will look like (screenshots) | ||
### Bubbles (initially) | ||
![Bubbles](https://eu1media.gobitech.no/bubbles-initial.png "Optional Title") | ||
### Bubbles (while hovering) | ||
![Bubbles (while hovering)](https://eu1media.gobitech.no/bubbles-hover.png "Optional Title") | ||
### Player opened after clicking bubble | ||
![Player opened after clicking bubble](https://eu1media.gobitech.no/click-player.png "Optional Title") | ||
## Requirements & prerequisites | ||
For this library to work for you, you need to have | ||
- an account with Gobi | ||
- stories already made (or make them as you go) | ||
- be a paying customer | ||
- access to editing the source of your own webpage (and ample technical insight) | ||
### Making an account | ||
An account with Gobi can be made easily and for free by anyone. Install the Gobi app on your phone. [iOS](https://itunes.apple.com/us/app/gobi-send-snaps-in-groups/id1025344825?utm_source=gobiapp.com&utm_medium=website), [Android](https://play.google.com/store/apps/details?id=no.gobiapp.gobi&utm_source=gobiapp.com&utm_medium=website) | ||
Follow the instructions in the app to make an account. | ||
### Making stories | ||
Once inside the app and logged in with your user, you can | ||
- create a story and give it a name, | ||
- record a series of videos and photos, and add these to your story. Your story will then contain all of your content, and will play them in succession to anyone who views the story. | ||
### Be a paying customer | ||
For the time being you will also need to be a paying customer in order to have permission to publish your stories on the Web – contact us at [Gobitech](http://gobistories.co) for a tailored offer. | ||
### Access to your webpage's source | ||
You will need access to edit the source HTML and the ability to add script and link tags, in your own webpage or the webpage where you want the Gobi stories to show up. | ||
## Functionality breakdown | ||
An outline of what this library does: | ||
- exports to the global (window) scope on the browser, functions which find a placeholder element and trigger creation of story bubbles | ||
- the bubbles contain thumbnails for each story, which are automatically generated | ||
- the appearance of the ring around bubbles and other visual elements can be configured in your Javascript | ||
- the title of each story (soon-to-be equal to the story name) will appear under each respective bubble | ||
- the story bubbles, when clicked, will cause a player to load, and play the selected story | ||
- the story video player will appear either side-by-side with the bubbles, or fullscreen, depending on your configuration choices and on the device screen size | ||
- the player contains buttons for | ||
- navigating back and forth in the story (skipping), | ||
- pausing playback, | ||
- closing the player, | ||
- muting the sound | ||
## Implementation steps | ||
Steps: | ||
- Add placeholder element | ||
– link to script and CSS | ||
- write your inline script | ||
Details: | ||
- Add a placeholder element to your HTML. Put it where you want the Gobi story bubbles to appear. | ||
eg. ```<div id="container"></div>``` | ||
This placeholder is any simple div, and can have a class name instead of an ID. The important thing is that you are able to refer to it in your script code (below). | ||
- Include the library Javascript and the library CSS in your HTML page. This can be done in two ways: | ||
- by downloading ( for instance using ```npm``` (advanced)) and serving the files yourself. To install using npm, do ```npm install --save @gobistories/gobi-web-integration```. | ||
- by reference the up‐to‐date version on npm CDN, as in the example below. | ||
If you don't know what this means, just follow the example below. | ||
- Implement your custom code which should at least call the `gobi.Module` function or a related function, to get the placeholder replaced and the behavior started. | ||
```html | ||
<script> | ||
new gobi.Module({ | ||
moduleId: 'some-module-id', | ||
container: document.getElementById('container'), | ||
}); | ||
</script> | ||
``` | ||
Full example: | ||
```html | ||
<link href="https://unpkg.com/@gobistories/gobi-web-integration/dist/gobi-web-integration.css" rel="stylesheet"> | ||
<html> | ||
<head> | ||
<link href="https://unpkg.com/@gobistories/gobi-web-integration/dist/gobi-web-integration.css" | ||
rel="stylesheet"> | ||
<script src="https://unpkg.com/@gobistories/gobi-web-integration"></script> | ||
</head> | ||
<body> | ||
<div id="container"></div> | ||
<script> | ||
new gobi.Module({ | ||
moduleId: 'some-module-id', | ||
container: document.getElementById('container'), | ||
}); | ||
</script> | ||
</body> | ||
</html> | ||
``` | ||
If you want to reference a specific version, replace | ||
```html | ||
<script src="https://unpkg.com/@gobistories/gobi-web-integration"></script> | ||
``` | ||
with | ||
```html | ||
<script src="https://unpkg.com/@gobistories/gobi-web-integration@1.2.2"></script> | ||
``` | ||
where 1.2.2 is the version you require. | ||
## Browser Support | ||
The library is supported in IE 11+, Chrome, Firefox, Safari, and | ||
Opera. | ||
## Using with a bundler | ||
## Using with a module bundler | ||
If you’re using a module bundler like [webpack](https://webpack.js.org), the exported object will be the Player and Module | ||
If you’re using a bundler like [webpack](https://webpack.js.org), the exported object will be the Player and Module | ||
constructor (unlike the browser where it is attached to `window.gobi`): | ||
@@ -49,7 +169,29 @@ | ||
# Module Constructor | ||
---- | ||
## Troubleshooting | ||
- No bubbles show | ||
See the console. Can you spot any errors? Try to understand them. If there seems to be a bug in the library, please email us. | ||
## Browser Support | ||
The library will work in IE 11+, Chrome, Firefox, Safari, and Opera. | ||
---- | ||
# Technical documentation | ||
## Module Constructor | ||
Function which create module layout with already embedded player. Getting options which allow to customize layout. Doesn't return any interface. | ||
## Create | ||
### Create | ||
```html | ||
@@ -64,3 +206,3 @@ <head> | ||
new gobi.Module({ | ||
moduleId: 'some-modul-id', | ||
moduleId: 'some-module-id', | ||
container: document.getElementById('container'), | ||
@@ -71,4 +213,5 @@ }); | ||
``` | ||
## Options | ||
### Options | ||
option | default | description | ||
@@ -95,7 +238,7 @@ ----------------------------------| -------- | ----------- | ||
# MobileModule Constructor | ||
## MobileModule Constructor | ||
Function which create **mobile** module layout with already embedded player. Getting options which allow to customize layout. Doesn't return any interface. | ||
## Create | ||
### Create | ||
```html | ||
@@ -110,3 +253,3 @@ <head> | ||
new gobi.MobileModule({ | ||
moduleId: 'some-modul-id', | ||
moduleId: 'some-module-id', | ||
container: document.getElementById('container'), | ||
@@ -117,3 +260,3 @@ }); | ||
``` | ||
## Options | ||
### Options | ||
@@ -137,7 +280,7 @@ option | default | description | ||
# Player Constructor | ||
## Player Constructor | ||
Function which create and return interface for managing and listening to events of Player. | ||
## Create | ||
### Create | ||
```html | ||
@@ -162,3 +305,3 @@ <head> | ||
## Options | ||
### Options | ||
option | default | description | ||
@@ -177,3 +320,3 @@ -------------------| ------- | ----------- | ||
## Methods | ||
### Methods | ||
You can call methods on the player by calling the function on the Player object: | ||
@@ -223,3 +366,3 @@ ```js | ||
``` | ||
### off(event?:string, callback?:() => void): void | ||
#### off(event?:string, callback?:() => void): void | ||
Remove an event listener for the specified event. Will remove all listeners for that event if a `callback` isn’t passed or only that specific callback if it is passed or all listeners from all events if any of params aren't passed. | ||
@@ -238,3 +381,3 @@ ```js | ||
``` | ||
## Events | ||
### Events | ||
You can listen for events in the player by attaching a callback using .on(): | ||
@@ -314,3 +457,3 @@ ```js | ||
#### Response palyer | ||
### Responsive player | ||
Provides a class to resize the player according it parent element. | ||
@@ -317,0 +460,0 @@ ```html |
@@ -29,6 +29,7 @@ import {addPrefixToClassName} from "@/utils/utils"; | ||
set title(title:string) { | ||
const titleEl = this.el.querySelector('[data-title]'); | ||
const titleEl = this.el.querySelector('[data-title]') as HTMLElement; | ||
if (titleEl) { | ||
this._title = title; | ||
titleEl.textContent = title; | ||
this._title = title || ''; | ||
titleEl.textContent = this._title; | ||
titleEl.style.display = this._title ? '' : 'none'; | ||
} | ||
@@ -35,0 +36,0 @@ } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
123459
1336
497