@flowplayer/player 3.34.3 → 3.35.0-rc

package/package/plugins/thumbnails.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):((e="undefined"!=typeof globalThis?globalThis:e||self).flowplayer=e.flowplayer||{},e.flowplayer.thumbnails=t())}(this,function(){"use strict";var e;function t(t,n){if(function(t){return Object.values(e).includes(t)}(n=n||e.Anonymous))return t instanceof HTMLVideoElement&&(t.poster="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII="),"crossOrigin"in t?t.crossOrigin=n:t.setAttribute("crossorigin",n),t}function n(e){const t=document.createElement("a");return t.href=e,t.origin}!function(e){e.Anonymous="anonymous",e.UseCredentials="use-credentials",e.Empty=""}(e||(e={}));const r="thumbnails";function s(e,t){return e.querySelector("track[id='"+t+"']")}function o(e,r){const s=document.createElement("track");return s.src=r,function(e,t){try{return e.src.startsWith("blob:"),n(e.src)!==n(t)}catch(e){return console.error(e),!0}}(e,r)&&(t(e),t(s)),s}const i="thumbnails:render",c="thumbnails:hide";var u=Object.freeze({__proto__:null,THUMBNAILS_RENDER:i,THUMBNAILS_HIDE:c});function a(e,t){const n=e._customElements.get(t);return n&&e.root.querySelector(n)||void 0}const l="flowplayer-thumbnails-carousel",d=(e,t)=>new(((e,t)=>{const n=e.get(t);if(!n)throw new Error(`no flowplayer component with the name ${t} exists`);const r=window.customElements.get(t);if(!r)throw new Error(`no default flowplayer component with the name ${t} exists`);const s=window.customElements.get(n);return"function"!=typeof s?r:s})(e._customElements,t))(e);class FlowplayerComponent extends HTMLElement{constructor(e){super(),this.player=e}}const m="with-thumbnails";class FlowplayerThumbnails extends FlowplayerComponent{constructor(e){super(e),this.className="fp-thumbnail-carousel",this.carousel=this.makeCarousel(),this.addEventListener(i,this.renderCarousel.bind(this,e)),this.addEventListener(c,()=>e.root.classList.remove(m))}renderCarousel(e,t){const{previous:n,current:r,next:s}=t.detail;e.root.classList.add(m),n&&this.renderCarouselItem(this.carousel.previous,n),r&&this.renderCarouselItem(this.carousel.current,r),s&&this.renderCarouselItem(this.carousel.next,s)}makeCarousel(){return{previous:this.makeCarouselItem("previous"),current:this.makeCarouselItem("current"),next:this.makeCarouselItem("next")}}makeCarouselItem(e){const t=document.createElement("div");return t.classList.add("thumbnail",e),this.append(t),t}renderCarouselItem(e,t){const n=e.style;n.backgroundImage=`url("${t.url}")`,n.backgroundPositionX="-"+t.x+"px ",n.backgroundPositionY="-"+t.y+"px",n.height=t.h+"px",n.width=t.w+"px"}}function f(e){const t=document.createElement("a");return t.href=e,t}const h=/#xywh=(\d+),(\d+),(\d+),(\d+)$/,p=/^(https:|https:|\/)/;function y(e,t){const n=f(e.src),r=f(t),[s,o,i,c,u]=(r.hash.match(h)||[]).map(e=>parseInt(e,10));return{x:o,y:i,w:c,h:u,url:w(t,n)}}function w(e,t){if(e.match(p))return e;try{return new URL(e,t.href).toString()}catch(e){return""}}const A="is-source-processing";function v(e,t,n){const r=function(e,t){const n=new CustomEvent(e,{detail:t,cancelable:!0});return t&&Object.defineProperty(n,"data",{get:()=>t}),n}(t,n);return e.dispatchEvent(r),e}var b;!function(){let e=!1;try{const t=Object.defineProperty({},"passive",{get:function(){e=!0}});window.addEventListener("testPassive",null,t),window.removeEventListener("testPassive",null,t)}catch(e){}}();const g=((b=class Thumbnails{static activeThumbnails(e,t){var n,o;const i=s(e,r);if(!i)return;const c=Array.from(i.track.cues||{length:0}),u=c.find(e=>e.startTime<=t&&t<=e.endTime);if(!u)return{};const a=c.indexOf(u);return{previous:y(i,(null===(n=c[a-1])||void 0===n?void 0:n.text)||""),current:y(i,(null==u?void 0:u.text)||""),next:y(i,(null===(o=c[a+1])||void 0===o?void 0:o.text)||"")}}constructor(e){((e,t,n)=>{window.customElements.get(t)||window.customElements.define(t,n),e.customElements.get(t)||e.customElements.set(t,t)})(e,l,FlowplayerThumbnails)}init(e,t,n){const i=a(n,"flowplayer-ui"),c=d(n,l),u=a(n,"flowplayer-control");n.reaper&&i&&u&&(i.insertBefore(c,u),n.once("mount",()=>{this.attachTimelineListeners(n,c)}),n.textTracks.addEventListener("addtrack",function(e){const t=e.track;(null==t?void 0:t.id)===r&&(t.mode="hidden")}),n.on("config",function(){var t;const s=null===(t=null==e?void 0:e.thumbnails)||void 0===t?void 0:t.src;if("string"==typeof s)return function(e,t){if(function(e,t){return e.querySelector("track[src='"+t+"']")}(e,t))return;const n=o(e,t);return n.kind="metadata",n.id=r,n.src=t,e.append(n),n}(n,s)}),n.on(["playlist/advance","src"],t=>{n.currentSrc&&("src"===t.type&&["is-playlist",A].some(e=>n.root.classList.contains(e))||(delete e.thumbnails,function(e){const t=s(e,r);t&&t.remove()}(n)))}))}attachTimelineListeners(e,t){e.on("timeline/gesture/move",({data:n})=>{const r=null==n?void 0:n.percent;if("number"!=typeof r)return;if(!Number.isFinite(e.duration))return;const s=Math.max(0,Math.min(e.duration,e.duration*(r/100))),o=b.activeThumbnails(e,s);o&&requestAnimationFrame(()=>v(t,i,Object.assign(Object.assign({},o),{timestamp:s})))}),e.on("timeline/gesture/end",()=>{e.root.classList.contains(m)&&v(t,c)})}}).pluginName="thumbnails",b.events=u,b);return function(e,t){if("object"==typeof exports&&"undefined"!=typeof module)return t;if(null===document.currentScript)return t;"flowplayer"in e||(e.flowplayer={extensions:[]});const n=e.flowplayer;return"function"==typeof n?(n(t),t):(Array.isArray(n.extensions)||(n.extensions=[]),~n.extensions.indexOf(t)||n.extensions.push(t),t)}(window,g)});