videojs-trimmer/dist/videojs-trimmer.min.js

Video.js Trimmer Plugin

/*! @name videojs-trimmer @version 1.0.0-beta.29 @license MIT */
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("video.js")):"function"==typeof define&&define.amd?define(["video.js"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).videojsTrimmer=e(t.videojs)}(this,(function(t){"use strict";function e(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var i=e(t),r={},s=i.default.registerPlugin||i.default.plugin,n=function t(){var e=this,i=this.currentTime();i<0&&(this.currentTime(0),this.play()),this._offsetEnd>0&&i>this._offsetEnd-this._offsetStart&&(this.off("timeupdate",t),this.pause(),this.trigger("ended"),this.one("play",(function(){e.on("timeupdate",t)})),this._restartBeginning?(this.trigger("loadstart"),this.currentTime(0)):this.currentTime(this._offsetEnd-this._offsetStart))},a=function(t){var e=this;t=t||{};var s=this.constructor;this._offsetStart=parseFloat(t.start||"0"),this._offsetEnd=parseFloat(t.end||"0"),this._restartBeginning=t.restart_beginning||!1,s.__super__&&s.__super__.__offsetInit||(s.__super__={__offsetInit:!0,duration:s.prototype.duration,currentTime:s.prototype.currentTime,bufferedPercent:s.prototype.bufferedPercent,remainingTime:s.prototype.remainingTime,buffered:s.prototype.buffered},s.prototype.duration=function(){return void 0!==this._offsetEnd&&void 0!==this._offsetStart?this._offsetEnd>0?this._offsetEnd-this._offsetStart:s.__super__.duration.apply(this,arguments)-this._offsetStart:s.__super__.duration.apply(this,arguments)},s.prototype.currentTime=function(t){if(void 0!==t)return void 0!==this._offsetStart?s.__super__.currentTime.call(this,t+this._offsetStart):s.__super__.currentTime.call(this,t);if(void 0!==this._offsetStart){var e=s.__super__.currentTime.apply(this)-this._offsetStart;return this.getCache().currentTime=e,e}return s.__super__.currentTime.apply(this)},s.prototype.remainingTime=function(){return this.duration()-this.currentTime()},s.prototype.startOffset=function(){return this._offsetStart},s.prototype.endOffset=function(){return this._offsetEnd>0?this._offsetEnd:this.duration()},s.prototype.buffered=function(){for(var t=s.__super__.buffered.call(this),e=[],r=0;r<t.length;r++)e[r]=[Math.max(0,t.start(r)-this._offsetStart),Math.min(Math.max(0,t.end(r)-this._offsetStart),this.duration())];return i.default.createTimeRanges(e)}),this.ready((function(){var s;s=e,i.default.mergeOptions(r,t),s.one("play",(function(){s.on("timeupdate",n)}))}))};
/*! @name videojs-offset @version 2.1.3 @license MIT */s("offset",a),a.VERSION="2.1.3";const o=i.default.getPlugin("plugin");class m extends o{constructor(t,e){super(t),this.options=i.default.obj.merge(e),this.startTime=0,this.endTime=0,this.originalDuration=0,this.isDragging=!1,this.createTrimmer(),this.player.on("loadedmetadata",(()=>{this.originalDuration=this.player.duration(),this.endTime=this.originalDuration,this.options.startTime&&(this.startTime=this.options.startTime),this.options.endTimeOffset&&(this.endTime=this.originalDuration-this.options.endTimeOffset),this.updateTrimmer()})),this.player.addClass("video-js-trimmer"),this.bindEvents()}createTrimmer(){this.trimmerContainer=document.createElement("div"),this.trimmerContainer.className="vjs-trimmer-container";this.player.el().insertBefore(this.trimmerContainer,this.player.controlBar.el()),this.trimmerEl=document.createElement("div"),this.trimmerEl.className="vjs-trimmer",this.trimmerContainer.appendChild(this.trimmerEl),this.startHandle=document.createElement("div"),this.startHandle.className="vjs-trimmer-handle start",this.trimmerContainer.appendChild(this.startHandle),this.endHandle=document.createElement("div"),this.endHandle.className="vjs-trimmer-handle end",this.trimmerContainer.appendChild(this.endHandle),this.progressIndicator=document.createElement("div"),this.progressIndicator.className="vjs-trimmer-progress",this.trimmerEl.appendChild(this.progressIndicator),this.durationDisplay=document.createElement("div"),this.durationDisplay.className="vjs-trimmer-duration",this.trimmerContainer.appendChild(this.durationDisplay),this.updateTrimmer()}bindEvents(){let t=!1,e=!1,i=!1,r=0;const s=s=>{if(!this.isDragging)return;const n=performance.now();if(n-r<8)return;r=n;const a=this.trimmerContainer.getBoundingClientRect(),o=(s.clientX-a.left)/a.width*this.originalDuration;if(t)this.startTime=Math.min(Math.max(o,0),this.endTime);else if(e)this.endTime=Math.max(Math.min(o,this.originalDuration),this.startTime);else if(i){const t=this.endTime-this.startTime,e=Math.max(0,Math.min(o,this.originalDuration-t));this.startTime=e,this.endTime=e+t}this.player.currentTime(0),requestAnimationFrame((()=>{this.updateTrimmer(),this.player.trigger("trimmerchange",{startTime:this.startTime,endTime:this.endTime})}))},n=()=>{t=!1,e=!1,i=!1,this.isDragging=!1,document.removeEventListener("mousemove",s),document.removeEventListener("mouseup",n)};this.startHandle.addEventListener("mousedown",(e=>{e.preventDefault(),t=!0,this.isDragging=!0,document.addEventListener("mousemove",s),document.addEventListener("mouseup",n)})),this.endHandle.addEventListener("mousedown",(t=>{t.preventDefault(),e=!0,this.isDragging=!0,document.addEventListener("mousemove",s),document.addEventListener("mouseup",n)})),this.trimmerEl.addEventListener("mousedown",(t=>{t.target.classList.contains("vjs-trimmer-handle")||(t.preventDefault(),i=!0,this.isDragging=!0,document.addEventListener("mousemove",s),document.addEventListener("mouseup",n))})),this.player.on("timeupdate",(()=>{requestAnimationFrame((()=>{this.updateTrimmer()}))}))}updateTrimmer(){const t=this.startTime/this.originalDuration*100,e=this.endTime/this.originalDuration*100;this.trimmerEl.style.left=`${t}%`,this.trimmerEl.style.width=e-t+"%",this.startHandle.style.left=`${t}%`,this.endHandle.style.left=`${e}%`,this.player.offset({start:this.startTime,end:this.endTime});const i=this.endTime-this.startTime;this.durationDisplay.textContent=`Trimmed duration: ${this.formatTime(i)}`;const r=(this.player.currentTime()+this.startTime-this.startTime)/(this.endTime-this.startTime),s=100*Math.min(Math.max(r,0),1);this.progressIndicator.style.left=`${s}%`}createTimeMarkers(){const t=document.createElement("div");t.className="vjs-time-markers",this.trimmerContainer.appendChild(t);for(let e=0;e<=20;e++){const i=document.createElement("div");i.className="vjs-time-marker";const r=e/20*this.originalDuration;i.style.left=e/20*100+"%";const s=document.createElement("span");s.className="vjs-time-label",s.textContent=this.formatTime(r),i.appendChild(s),t.appendChild(i)}}formatTime(t){return`${Math.floor(t/60)}:${Math.floor(t%60).toString().padStart(2,"0")}`}}return i.default.registerPlugin("trimmer",m),m}));