@fancyapps/ui
Version:
Robust JavaScript UI Component Library
2 lines • 6.62 kB
JavaScript
!/*! License details at fancyapps.com/license */function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).window=e.window||{})}(this,function(e){"use strict";let t=e=>"object"==typeof e&&null!==e&&e.constructor===Object&&"[object Object]"===Object.prototype.toString.call(e),o=e=>"string"==typeof e,i=function(e){var t=new DOMParser().parseFromString(e,"text/html").body;if(t.childElementCount>1){for(var o=document.createElement("div");t.firstChild;)o.appendChild(t.firstChild);return o}let i=t.firstChild;if(i&&!(i instanceof HTMLElement)){var o=document.createElement("div");return o.appendChild(i),o}return i},n=(e,t={})=>{let o=new URLSearchParams(new URL(e).search),i=new URLSearchParams;for(let[e,n]of[...o,...Object.entries(t)]){let t=n+"";if("t"===e){let e=t.match(/((\d*)m)?(\d*)s?/);e&&i.set("start",60*parseInt(e[2]||"0")+parseInt(e[3]||"0")+"")}else i.set(e,t)}let n=i+"",l=e.match(/#t=((.*)?\d+s)/);return l&&(n+=`#t=${l[1]}`),n},l={autoplay:!1,html5videoTpl:`<video class="f-html5video" playsinline controls controlsList="nodownload" poster="{{poster}}">
<source src="{{src}}" type="{{format}}" />Sorry, your browser doesn't support embedded videos.</video>`,iframeAttr:{allow:"autoplay; fullscreen",scrolling:"auto",credentialless:""},vimeo:{byline:1,color:"00adef",controls:1,dnt:1,muted:0},youtube:{controls:1,enablejsapi:1,nocookie:1,rel:0,fs:1}};e.Video=()=>{let e,r=!1;function a(){let o=e?.getOptions().Video;return t(o)?{...l,...o}:l}function s(){return e?.getPage()?.slides[0]}let d=t=>{try{let o=JSON.parse(t.data);if("https://player.vimeo.com"===t.origin){if("ready"===o.event)for(let o of Array.from(e?.getContainer()?.getElementsByClassName("f-iframe")||[]))o instanceof HTMLIFrameElement&&o.contentWindow===t.source&&(o.dataset.ready="true")}else if(t.origin.match(/^https:\/\/(www.)?youtube(-nocookie)?.com$/)&&"onReady"===o.event){let e=document.getElementById(o.id);e&&(e.dataset.ready="true")}}catch(e){}};function c(e,t){let i=t.src;if(!o(i))return;let l=t.type;if(!l||"html5video"===l){let e=i.match(/\.(mp4|mov|ogv|webm)((\?|#).*)?$/i);e&&(l="html5video",t.html5videoFormat=t.html5videoFormat||"video/"+("ogv"===e[1]?"ogg":e[1]))}if(!l||"youtube"===l){let e=i.match(/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(?:watch\?(?:.*&)?v=|v\/|u\/|shorts\/|embed\/?)?(videoseries\?list=(?:.*)|[\w-]{11}|\?listType=(?:.*)&list=(?:.*))(?:.*)/i);if(e){let o={...a().youtube,...t.youtube||{}},r=`www.youtube${o.nocookie?"-nocookie":""}.com`,s=n(i,o),d=encodeURIComponent(e[2]);t.videoId=d,t.src=`https://${r}/embed/${d}?${s}`,t.thumb=t.thumb||`https://i.ytimg.com/vi/${d}/mqdefault.jpg`,l="youtube"}}if(!l||"vimeo"===l){let e=i.match(/^.+vimeo.com\/(?:\/)?([\d]+)((\/|\?h=)([a-z0-9]+))?(.*)?/);if(e){let o=n(i,{...a().vimeo,...t.vimeo||{}}),r=encodeURIComponent(e[1]),s=e[4]||"";t.videoId=r,t.src=`https://player.vimeo.com/video/${r}?${s?`h=${s}${o?"&":""}`:""}${o}`,l="vimeo"}}t.type=l}function m(t,n){"html5video"===n.type&&function(t){if(!e||!t.el||!t.src)return;let{el:n,src:l}=t;if(!n||!l)return;let r=t.html5videoTpl||a().html5videoTpl,s=t.html5videoFormat||a().html5videoFormat;if(!r)return;let d=t.poster||(t.thumb&&o(t.thumb)?t.thumb:""),c=i(r.replace(/\{\{src\}\}/gi,l+"").replace(/\{\{format\}\}/gi,s||"").replace(/\{\{poster\}\}/gi,d+""));if(!c)return;let m=document.createElement("div");m.classList.add("f-html"),m.append(c),t.contentEl=c,t.htmlEl=m,n.classList.add(`has-${t.type}`),n.prepend(m),h(t),e.emit("contentReady",t)}(n),("youtube"===n.type||"vimeo"===n.type)&&function(t){if(!e||!t.el||!t.src)return;let o=document.createElement("iframe");for(let[e,i]of(o.classList.add("f-iframe"),o.setAttribute("id",`f-iframe_${t.videoId}`),Object.entries(a().iframeAttr||{})))o.setAttribute(e,i);o.onload=()=>{e&&1===e.getState()&&"youtube"===t.type&&o.contentWindow?.postMessage(JSON.stringify({event:"listening",id:o.getAttribute("id")}),"*")},o.onerror=()=>{e&&1===e.getState()&&e?.showError(t,"{{IFRAME_ERROR}}")},o.src=t.src;let i=document.createElement("div");i.classList.add("f-html"),i.append(o),t.contentEl=o,t.htmlEl=i,t.el.classList.add("has-html"),t.el.classList.add("has-iframe"),t.el.classList.add(`has-${t.type}`),t.el.prepend(i),h(t),e.emit("contentReady",t)}(n)}function u(e,t){("html5video"===t.type||"youtube"===t.type||"vimeo"===t.type)&&(t.contentEl?.remove(),t.contentEl=void 0,t.htmlEl?.remove(),t.htmlEl=void 0),t.poller&&clearTimeout(t.poller)}function f(){r=!1}function p(){if(r)return;r=!0;let e=s();(e&&void 0!==e.autoplay?e.autoplay:a().autoplay)&&(!function(){let e=s(),t=e?.el;if(t&&e?.type==="html5video")try{let e=t.querySelector("video");if(e){let t=e.play();void 0!==t&&t.then(()=>{}).catch(t=>{e.muted=!0,e.play()})}}catch(e){}let o=e?.htmlEl;o instanceof HTMLIFrameElement&&o.contentWindow?.postMessage('{"event":"command","func":"stopVideo","args":""}',"*")}(),function(){let e=s(),t=e?.type;if(!(e?.el&&("youtube"===t||"vimeo"===t)))return;let o=()=>{if(e.contentEl&&e.contentEl instanceof HTMLIFrameElement&&e.contentEl.contentWindow){let t;if("true"===e.contentEl.dataset.ready){(t="youtube"===e.type?{event:"command",func:"playVideo"}:{method:"play",value:"true"})&&e.contentEl.contentWindow.postMessage(JSON.stringify(t),"*"),e.poller=void 0;return}"youtube"===e.type&&(t={event:"listening",id:e.contentEl.getAttribute("id")},e.contentEl.contentWindow.postMessage(JSON.stringify(t),"*"))}e.poller=setTimeout(o,250)};o()}())}function h(e){let t=e?.el,o=e?.htmlEl;if(!e||!o)return;o.style.aspectRatio="",o.style.width="",o.style.height="",o.style.maxWidth="",o.style.maxHeight="",o.offsetHeight;let i=o.getBoundingClientRect(),n=i.width||1,l=i.height||1;if(e.width){let t=`${e.width}`;t.match(/^\d+$/)&&(t+="px"),o.style.maxWidth=`${t}`}if(e.height){let t=`${e.height}`;t.match(/^\d+$/)&&(t+="px"),o.style.maxHeight=`${t}`}if(!t||!e.aspectRatio)return;let r=e.aspectRatio.split("/"),a=parseFloat(r[0].trim()),s=r[1]?parseFloat(r[1].trim()):0,d=(a&&s?a/s:a)<n/l;o.style.aspectRatio=`${e.aspectRatio}`,o.style.width=d?"auto":"",o.style.height=d?"":"auto"}function y(){h(s())}return{init:function(t){(e=t).on("addSlide",c),e.on("attachSlideEl",m),e.on("detachSlideEl",u),e.on("ready",p),e.on("change",f),e.on("settle",p),e.on("refresh",y),window.addEventListener("message",d)},destroy:function(){e?.off("addSlide",c),e?.off("attachSlideEl",m),e?.off("detachSlideEl",u),e?.off("ready",p),e?.off("change",f),e?.off("settle",p),e?.off("refresh",y),window.removeEventListener("message",d),e=void 0}}}});