UNPKG

@shopgate/pwa-common

Version:

Common library for the Shopgate Connect PWA.

54 lines • 7.76 kB
function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _get(target,property,receiver){if(typeof Reflect!=="undefined"&&Reflect.get){_get=Reflect.get;}else{_get=function _get(target,property,receiver){var base=_superPropBase(target,property);if(!base)return;var desc=Object.getOwnPropertyDescriptor(base,property);if(desc.get){return desc.get.call(receiver);}return desc.value;};}return _get(target,property,receiver||target);}function _superPropBase(object,property){while(!Object.prototype.hasOwnProperty.call(object,property)){object=_getPrototypeOf(object);if(object===null)break;}return object;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}import MediaProvider from"./MediaProvider";/* eslint-disable class-methods-use-this */var scriptUrl='https://player.vimeo.com/api/player.js';/** * The Vimeo media provider class. */var VimeoMediaProvider=/*#__PURE__*/function(_MediaProvider){/** * Constructor. * @param {Object} options The provider options. * @param {boolean} [options.responsify=true] Whether to responsify the video containers. */function VimeoMediaProvider(options){var _this2;_classCallCheck(this,VimeoMediaProvider);_this2=_callSuper(this,VimeoMediaProvider,[options]);// Need to check Vimeo.Player presence later _this2.isPending=true;_this2.remoteScriptUrl=scriptUrl;_this2.deferred=[];return _this2;}/** * Retrieves a list of media containers for Vimeo. * @param {ParentNode} container A DOM container that may contain Vimeo iframes. * @returns {NodeListOf<Element>} */_inherits(VimeoMediaProvider,_MediaProvider);return _createClass(VimeoMediaProvider,[{key:"getMediaContainers",value:function getMediaContainers(container){return container.querySelectorAll('iframe[src*="vimeo.com"]');}/** * @inheritDoc */},{key:"onScriptLoaded",value:function onScriptLoaded(){var _this3=this;this.isPending=false;if(this.deferred.length){this.deferred.forEach(function(container){_this3.add(container);});this.deferred=[];}}/** * Check if the Provider script to be loaded externally is finished loading * @returns {boolean} */},{key:"checkScriptLoadingStatus",value:function checkScriptLoadingStatus(){if(this.isPending&&typeof window.Vimeo!=='undefined'){this.isPending=false;}return!this.isPending;}/** * Add a DOM container with embedded videos. * @override * @param {ParentNode} container A DOM container. * @returns {VimeoMediaProvider} */},{key:"add",value:function add(container){if(!this.checkScriptLoadingStatus()){this.deferred.push(container);return this;}var iframes=this.getMediaContainers(container);if(!iframes.length){return this;}var players=[];iframes.forEach(function(iframe){players.push(new window.Vimeo.Player(iframe));});this.containers.set(container,players);return this;}/** * Applies optimizations to embedded media iframes within the given container. * Common enhancements include adding responsive wrappers and appropriate * sandbox attributes to improve security and layout behavior. * * @param {Document} document - The DOM document containing iframes to optimize. * @returns {YouTubeMediaProvider} */},{key:"applyIframeOptimizations",value:function applyIframeOptimizations(document){var _this4=this;var iframes=this.getMediaContainers(document);if(!iframes.length){return this;}iframes.forEach(function(iframe,index){// Block clicks on Vimeo icon iframes[index].setAttribute('sandbox','allow-forms allow-scripts allow-pointer-lock allow-same-origin allow-top-navigation');_this4.responsify(iframe);});return this;}/** * Stops all playing videos within the DOM containers. * @override * @returns {VimeoMediaProvider} */},{key:"stop",value:function stop(){// Select all iframes in the document. Actually this should be done via the iframes // registered in this.containers, but that doesn't seem to work reliably anymore. // Since we had to find a quick fix for CURB-5033 we now select all iframes in the document // via the media container selector and then stop the videos. var iframes=this.getMediaContainers(document);iframes.forEach(function(iframe){try{var player=new window.Vimeo.Player(iframe);player.pause()["catch"](function(){// Ignore errors });}catch(e){// Ignore errors }});return this;}/** * Searches for embedded media and replaces it with a placeholder element when comfort cookie * consent is not accepted. * * Should be called before media container / markup is mounted to the DOM. * @param {ParentNode} container A DOM container. * @param {Object} [cookieConsentSettings] Additional settings related to cookie consent. * @param {boolean} [cookieConsentSettings.comfortCookiesAccepted] Whether comfort cookies * are accepted. * @param {boolean} [cookieConsentSettings.statisticsCookiesAccepted] Whether statistics cookies * are accepted. * @override * @returns {VimeoMediaProvider} */},{key:"handleCookieConsent",value:function handleCookieConsent(container,cookieConsentSettings){// Remove Vimeo player scripts since the VimeoMediaProvider has custom logic for it container.querySelectorAll('script[src*="vimeo.com"]').forEach(function(entry){entry.remove();});return _get(_getPrototypeOf(VimeoMediaProvider.prototype),"handleCookieConsent",this).call(this,container,cookieConsentSettings);}}]);}(MediaProvider);export default VimeoMediaProvider;/* eslint-enable class-methods-use-this */