videojs-sprite-thumbnails
Version:
Plugin to display thumbnails when hovering over the progress bar.
3 lines (2 loc) • 3.21 kB
JavaScript
/*! @name videojs-sprite-thumbnails @version 2.2.5 @license MIT */
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("video.js")):"function"==typeof define&&define.amd?define(["video.js"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).videojsSpriteThumbnails=t(e.videojs)}(this,function(e){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(e);function o(){return o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},o.apply(null,arguments)}const r=n.default.getPlugin("plugin"),i={url:"",idxTag:e=>e,urlArray:[],width:0,height:0,columns:0,rows:0,interval:1,responsive:600,downlink:1.5,initOnDemand:!1};class a extends r{constructor(e,t){super(e,t),this.options=n.default.obj.merge(i,t),this.player.ready(()=>{((e,t,r)=>{const i=window.navigator,a=n.default.dom,s=n.default.obj,l=t.log,u=l.debug,d=o({},t.state),c=()=>{t.setState(d)},h=["ControlBar","ProgressControl","SeekBar","MouseTimeDisplay","TimeTooltip"],[f,p,g,,y]=h,m=t=>{const n=h.indexOf(t),o=e.getDescendant(h.slice(0,n+1));return o||(c(),u(`component tree ${h.join(" > ")} required`)),o};let b,x;const v=e=>{const t=r.urlArray;return t.length?t[e]:r.url.replace("{index}",r.idxTag(e))},w=t=>{if(!m(y))return;const n=m(g).el(),o=a.findPosition(m(f).el()).top,i=e.currentWidth(),l=e.duration(),u=r.interval,d=r.columns,c=r.responsive,h=u*d,p=h*(r.rows||Math.ceil(l/h));let x=a.getPointerPosition(n,t).x*l;const w=Math.floor(x/p);x=(x-p*w)/u;const j=c&&i<c?i/c:1,$=r.width*j,P=r.height*j,k=Math.floor(x%d)*-$,O=Math.floor(x/d)*-P,S=a.findPosition(n).top,T=-P-Math.max(0,S-o),A={backgroundImage:`url("${v(w)}")`,backgroundRepeat:"no-repeat",backgroundPosition:`${k}px ${O}px`,backgroundSize:$*d+"px auto",top:`${T}px`,color:"#fff",textShadow:"1px 1px #000",border:"1px solid #000",width:`${$+2}px`,height:`${P+2}px`};s.each(A,(e,t)=>{b.style[t]=e})},j=e=>{const t=r[e],n="rows"!==e?1:0,o=parseInt(t,10)===t&&t>=n;return o||l.warn(`${e} must be an integer greater than ${n-1}`),o},$=()=>{const e=i.connection||i.mozConnection||i.webkitConnection,t="downlink",n=!e||e[t]>=r[t];return n||l(`connection.${t} < ${r[t]}`),n},P=n=>{e.off("loadstart",P),c();const o=t.name,i=e.currentSources().find(e=>e.hasOwnProperty(o));let a=i&&i[o];if(a){const e=a.urlArray;Object.keys(a).length?e&&e.length?a.url="":a.url&&(a.urlArray=[]):a={url:"",urlArray:[]},t.options=r=s.merge(r,a)}const l=m(y);!l||n&&"loadstart"===n.type||(b=l.el(),x=b.style,t.setState({ready:!!((r.urlArray.length||r.url)&&j("width")&&j("height")&&j("columns")&&j("rows")&&$())}))};t.on("statechanged",n=>{const o=t.state,i=["mousemove","touchmove"],a=m(p);o.ready?(u("ready to show thumbnails"),a.on(i,w)):(r.url||r.urlArray.length||u("no urls given, resetting"),a&&(a.off(i,w),b.style=x)),e.toggleClass("vjs-thumbnails-ready",o.ready)}),r.initOnDemand&&e.duration()?P():e.on(["loadstart","loadedmetadata"],P),e.addClass("vjs-sprite-thumbnails")})(this.player,this,this.options)})}}return a.defaultState={ready:!1},a.VERSION="2.2.5",n.default.registerPlugin("spriteThumbnails",a),a});