1
2
3
4
|
/*! videojs-markers - v1.0.1 - 2018-04-03
* Copyright (c) 2018 ; Licensed */
!function(e,r){if("function"==typeof define&&define.amd)define(["video.js"],r);else if("undefined"!=typeof exports)r(require("video.js"));else{r(e.videojs),e.videojsMarkers={}}}(this,function(e){"use strict";var r,h=(r=e)&&r.__esModule?r:{default:r};var x="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},b={markerStyle:{width:"7px","border-radius":"30%","background-color":"red"},markerTip:{display:!0,text:function(e){return"Break: "+e.text},time:function(e){return e.time}},breakOverlay:{display:!1,displayTime:3,text:function(e){return"Break overlay: "+e.overlayText},style:{width:"100%",height:"20%","background-color":"rgba(0,0,0,0.7)",color:"white","font-size":"17px"}},onMarkerClick:function(e){},onMarkerReached:function(e,r){},markers:[]};function T(e){var r,t={top:0,bottom:0,left:0,width:0,height:0,right:0};try{r=e.getBoundingClientRect()}catch(e){r=t}return r}var g=-1;h.default.registerPlugin("markers",function(n){if(!h.default.mergeOptions){var o=function(e){return!!e&&"object"===(void 0===e?"undefined":x(e))&&"[object Object]"===toString.call(e)&&e.constructor===Object};h.default.mergeOptions=function i(e,r){var a={};return[e,r].forEach(function(t){t&&Object.keys(t).forEach(function(e){var r=t[e];o(r)?(o(a[e])||(a[e]={}),a[e]=i(a[e],r)):a[e]=r})}),a}}h.default.dom.createEl||(h.default.dom.createEl=function(e,r,t){var i=h.default.Player.prototype.dom.createEl(e,r);return t&&Object.keys(t).forEach(function(e){i.setAttribute(e,t[e])}),i});var l=h.default.mergeOptions(b,n),u={},d=[],c=g,f=this,s=null,a=null,m=g;function r(){d.sort(function(e,r){return l.markerTip.time(e)-l.markerTip.time(r)})}function t(e){e.forEach(function(e){var t,i,a,r;e.key=(t=(new Date).getTime(),"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(e){var r=(t+16*Math.random())%16|0;return t=Math.floor(t/16),("x"==e?r:3&r|8).toString(16)})),f.el().querySelector(".vjs-progress-holder").appendChild((i=e,r=h.default.dom.createEl("div",{},{"data-marker-key":i.key,"data-marker-time":l.markerTip.time(i)}),y(i,r),r.addEventListener("click",function(e){var r=!1;if("function"==typeof l.onMarkerClick&&(r=!1===l.onMarkerClick(i)),!r){var t=this.getAttribute("data-marker-key");f.currentTime(l.markerTip.time(u[t]))}}),l.markerTip.display&&((a=r).addEventListener("mouseover",function(){var e=u[a.getAttribute("data-marker-key")];if(s){s.querySelector(".vjs-tip-inner").innerText=l.markerTip.text(e),s.style.left=v(e)+"%";var r=T(s),t=T(a);s.style.marginLeft=-parseFloat(r.width/2)+parseFloat(t.width/4)+"px",s.style.visibility="visible"}}),a.addEventListener("mouseout",function(){s&&(s.style.visibility="hidden")})),r)),u[e.key]=e,d.push(e)}),r()}function v(e){return l.markerTip.time(e)/f.duration()*100}function y(e,r){r.className="vjs-marker "+(e.class||""),Object.keys(l.markerStyle).forEach(function(e){r.style[e]=l.markerStyle[e]});var t=e.time/f.duration();if((t<0||1<t)&&(r.style.display="none"),r.style.left=v(e)+"%",e.duration)r.style.width=e.duration/f.duration()*100+"%",r.style.marginLeft="0px";else{var i=T(r);r.style.marginLeft=i.width/2+"px"}}function i(e){a&&(m=g,a.style.visibility="hidden"),c=g;var i=[];e.forEach(function(e){var r=d[e];if(r){delete u[r.key],i.push(e);var t=f.el().querySelector(".vjs-marker[data-marker-key='"+r.key+"']");t&&t.parentNode.removeChild(t)}}),i.reverse(),i.forEach(function(e){d.splice(e,1)}),r()}function e(){if(l.breakOverlay.display&&!(c<0)){var e=f.currentTime(),r=d[c],t=l.markerTip.time(r);t<=e&&e<=t+l.breakOverlay.displayTime?(m!==c&&(m=c,a&&(a.querySelector(".vjs-break-overlay-text").innerHTML=l.breakOverlay.text(r))),a&&(a.style.visibility="visible")):(m=g,a&&(a.style.visibility="hidden"))}}function k(){!function(){if(d.length){var e=function(e){return e<d.length-1?l.markerTip.time(d[e+1]):f.duration()},r=f.currentTime(),t=g;if(c!==g){var i=e(c);if(r>=l.markerTip.time(d[c])&&r<i)return;if(c===d.length-1&&r===f.duration())return}if(r<l.markerTip.time(d[0]))t=g;else for(var a=0;a<d.length;a++)if(i=e(a),r>=l.markerTip.time(d[a])&&r<i){t=a;break}t!==c&&(t!==g&&n.onMarkerReached&&n.onMarkerReached(d[t],t),c=t)}}(),e(),n.onTimeUpdateAfterMarkerUpdate&&n.onTimeUpdateAfterMarkerUpdate()}function p(){l.markerTip.display&&(s=h.default.dom.createEl("div",{className:"vjs-tip",innerHTML:"<div class='vjs-tip-arrow'></div><div class='vjs-tip-inner'></div>"}),f.el().querySelector(".vjs-progress-holder").appendChild(s)),f.markers.removeAll(),t(l.markers),l.breakOverlay.display&&(a=h.default.dom.createEl("div",{className:"vjs-break-overlay",innerHTML:"<div class='vjs-break-overlay-text'></div>"}),Object.keys(l.breakOverlay.style).forEach(function(e){a&&(a.style[e]=l.breakOverlay.style[e])}),f.el().appendChild(a),m=g),k(),f.on("timeupdate",k),f.off("loadedmetadata")}f.on("loadedmetadata",function(){p()}),f.markers={getMarkers:function(){return d},next:function(){for(var e=f.currentTime(),r=0;r<d.length;r++){var t=l.markerTip.time(d[r]);if(e<t){f.currentTime(t);break}}},prev:function(){for(var e=f.currentTime(),r=d.length-1;0<=r;r--){var t=l.markerTip.time(d[r]);if(t+.5<e)return void f.currentTime(t)}},add:function(e){t(e)},remove:function(e){i(e)},removeAll:function(){for(var e=[],r=0;r<d.length;r++)e.push(r);i(e)},updateTime:function(e){var i;i=e,d.forEach(function(e){var r=f.el().querySelector(".vjs-marker[data-marker-key='"+e.key+"']"),t=l.markerTip.time(e);(i||r.getAttribute("data-marker-time")!==t)&&(y(e,r),r.setAttribute("data-marker-time",t))}),r()},reset:function(e){f.markers.removeAll(),t(e)},destroy:function(){f.markers.removeAll(),a&&a.remove(),s&&s.remove(),f.off("timeupdate",e),delete f.markers}}})});
|