terminalizer-player
Version:
A web player for Terminalizer's recordings
9 lines • 10.7 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("jquery"),require("xterm").Terminal):"function"==typeof define&&define.amd?define("webpackNumbers",["jquery",["xterm","Terminal"]],t):"object"==typeof exports?exports.webpackNumbers=t(require("jquery"),require("xterm").Terminal):e.webpackNumbers=t(e.$,e.Terminal)}(this,function(r,n){return a={},i.m=o=[function(e,t){e.exports=r},function(e,t,r){r(4),e.exports=r(3)},function(e,t){e.exports=n},function(e,t,r){},function(e,t,r){"use strict";r.r(t);var n=r(0),i=r.n(n);r(2);function o(e,t){var r=this;return r.element=e,r.$element=$(e),r._terminal=null,r._frames=null,r._totalDuration=0,r._currentTime=0,r._timer=null,r._lastTickTime=null,r._isPlaying=!1,r._isStarted=!1,r._isRendering=!1,r._lastRenderedFrame=-1,r._startTemplate='<?xml version="1.0" ?><svg id="Layer_1" style="enable-background:new 0 0 30 30;" version="1.1" viewBox="0 0 30 30" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="6.583,3.186 5,4.004 5,15 26,15 26.483,14.128 "/><polygon points="6.583,26.814 5,25.996 5,15 26,15 26.483,15.872 "/><circle cx="26" cy="15" r="1"/><circle cx="6" cy="4" r="1"/><circle cx="6" cy="26" r="1"/></svg>',r._playerTemplate='<div class="terminalizer-player"><div class="cover"></div><div class="start">'+r._startTemplate+'</div><div class="terminalizer"></div><div class="controller"><div class="play"><span class="icon"></span></div><div class="pause"><span class="icon"></span></div><div class="timer">00:00</div><div class="progressbar-wrapper"><div class="progressbar"><div class="progress"></div></div></div></div></div>',r._terminalTemplate='<div class="terminalizer"><div class="terminalizer-frame"><div class="terminalizer-titlebar"><div class="buttons"><div class="close-button"></div><div class="minimize-button"></div><div class="maximize-button"></div></div><div class="title"></div></div><div class="terminalizer-body"></div></div></div>',r._options=$.extend({recordingFile:null,realTiming:!1,speedFactor:1,beforeMiddleware:null,afterMiddleware:null,controls:!0,repeat:!1,autoplay:!1,autofocus:!0,thumbnailTime:0},t),r._init().then(function(e){if(r._options.autoplay)return r.play()}).catch(function(e){throw new Error(e)}),r}o.prototype._init=function(){var t=this,r=(t.element,t.$element);return t._loadJSON(t._options.recordingFile).then(function(e){if(t._frames=e.frames||e.records,t._options=$.extend(e.config,t._options),t._options.controls&&(t._options.frameBox.title=null,t._options.frameBox.type=null,t._options.frameBox.style={},"transparent"==t._options.theme.background?t._options.frameBox.style.background="black":t._options.frameBox.style.background=t._options.theme.background,t._options.frameBox.style.padding="10px",t._options.watermark.imagePath=null),t._terminal=new Terminal({cols:t._options.cols,rows:t._options.rows,cursorStyle:t._options.cursorStyle,fontFamily:t._options.fontFamily,fontSize:t._options.fontSize,lineHeight:t._options.lineHeight,letterSpacing:t._options.letterSpacing,allowTransparency:!0,scrollback:0,theme:t._options.theme}),r.html($(t._playerTemplate)),r.find(".terminalizer").replaceWith(t._terminalTemplate),t._options.frameBox.type&&r.find(".terminalizer-frame").addClass("terminalizer-"+t._options.frameBox.type),t._options.frameBox.type&&t._options.frameBox.title&&r.find(".terminalizer-frame .title").text(t._options.frameBox.title),r.find(".terminalizer-frame").css(t._options.frameBox.style),t._options.controls&&r.find(".terminalizer-player").addClass("controls"),t._options.frameBox.type&&r.find(".terminalizer-player").addClass("framed"),t._options.rows<10&&r.find(".terminalizer-player").addClass("small"),t._terminal.open(r.find(".terminalizer-body")[0]),Object.defineProperty(t._terminal._core,"isFocused",{get:function(){return!0}}),t._options.autofocus&&t._terminal.focus(),t._initController(),t._initRenderedEmitter(),t._emit("init"),t._adjustDelays(),t._calculateTiming(),t._totalDuration=t._calculateTotalDuration(),t._lastTickTime=Date.now(),t._timer=setInterval(t._tick.bind(t),1),t._options.watermark.imagePath)return t._addWatermark(t._options.watermark)}).then(function(){return t.jump(t._options.thumbnailTime,!1)}).then(function(){t._currentTime=0,t._updatePlayer()})},o.prototype._initController=function(){var n=this;n.$element.find(".controller .progressbar").on("click",function(e){if(!n._isStarted)return!1;var t=$(this).width(),r=e.offsetX;return n.jump(Math.floor(n._totalDuration*r/t)),!1}),n.$element.find(".cover, .start").on("click",function(e){return n.play(),!1}),n.$element.find(".controller .play").on("click",function(e){return n.play(),!1}),n.$element.find(".controller .pause").on("click",function(e){return n.pause(),!1})},o.prototype._initRenderedEmitter=function(){var e=this;e._terminal.on("refresh",function(){this._writeInProgress||e._emit("rendered")})},o.prototype._adjustDelays=function(){var r=this;r._frames.forEach(function(e){var t=e.delay;"auto"!=r._options.frameDelay?t=r._options.frameDelay:"auto"!=r._options.maxIdleTime&&t>r._options.maxIdleTime&&(t=r._options.maxIdleTime),t*=r._options.speedFactor,e.delay=t})},o.prototype._calculateTiming=function(){var n=0,i=this._frames.length,o=this._frames;o.forEach(function(e,t){var r=o[(t+1)%i].delay;e.duration=r,e.startTime=n,e.endTime=n+r,n+=r})},o.prototype._calculateTotalDuration=function(){return this._frames.reduce(function(e,t){return e+t.delay},0)},o.prototype._findFrameAt=function(e,t){var r=null;void 0===t&&(t=0);for(var n=t;n<this._frames.length;n++)if((r=this._frames[n]).startTime<=e&&e<r.endTime)return n;return r.startTime<=e&&e<=r.endTime?this._frames.length-1:-1},o.prototype._isFrameAt=function(e,t){var r=this._frames[t];return void 0!==r&&(r.startTime<=e&&e<r.endTime)},o.prototype._addWatermark=function(e){var t=document.createElement("img");return $(t).addClass("terminalizer-watermark"),$(t).attr("src",e.imagePath),$(t).css(e.style),this.$element.find(".terminalizer-frame").prepend(t),new Promise(function(e,t){$(".terminalizer-watermark").on("load",e)})},o.prototype._renderFrame=function(t,e,r){var n=this,i=[],o=n._frames[t];n._options.beforeMiddleware&&!e&&i.push(function(e){n._options.beforeMiddleware.call(n,o,t,e.bind(null,null,null))}),i.push(function(e){n._terminal.write(o.content),n.$element.one("rendered",function(){setTimeout(function(){e()})})}),n._options.afterMiddleware&&!e&&i.push(function(e){n._options.afterMiddleware.call(n,o,t,e.bind(null,null,null))}),n._series(i,function(e,t){r()})},o.prototype._loadJSON=function(i){return new Promise(function(e,n){$.getJSON(i).done(e).fail(function(e,t,r){n("Failed to load "+i)})})},o.prototype._tick=function(){var e,t=this;if(e=Date.now()-t._lastTickTime,t._lastTickTime=Date.now(),t._isPlaying&&!t._isRendering&&(t._currentTime<t._totalDuration&&(t._currentTime+=e,t._updatePlayer()),t._currentTime>t._totalDuration&&(t._currentTime=t._totalDuration),-1==t._lastRenderedFrame||!t._isFrameAt(t._currentTime,t._lastRenderedFrame))){if(t._lastRenderedFrame==t._frames.length-1&&t._currentTime==t._totalDuration)return t._emit("playingCompleted"),t._options.repeat?void(t._currentTime=0):t.pause();t._isFrameAt(t._currentTime,t._lastRenderedFrame+1)?t._lastRenderedFrame=t._lastRenderedFrame+1:t._lastRenderedFrame=t._findFrameAt(t._currentTime),t._isRendering=!0,t._renderFrame(t._lastRenderedFrame,!1,function(){t._lastTickTime=Date.now(),t._isRendering=!1})}},o.prototype._updatePlayer=function(){var e=this._currentTime/this._totalDuration*100,t=this._formatTime(this._currentTime);this.$element.find(".terminalizer-player .progress").width(e+"%"),this.$element.find(".terminalizer-player .timer").text(t)},o.prototype._emit=function(e,t){var r=this;void 0===t&&(t=[]),setTimeout(function(){r.$element.trigger(e,t)})},o.prototype._formatTime=function(e){var t=Math.floor(e/6e4),r=parseInt((e-6e4*t)/1e3);return t<10&&(t="0"+t),r<10&&(r="0"+r),t+":"+r},o.prototype._series=function(i,o){if(0==i.length)return o(null);!function r(n){i[n](function(e,t){return void 0!==e&&e?o(e):n==i.length-1?o(null):r(n+1)})}(0)},o.prototype.getFramesCount=function(){return this._frames.length},o.prototype.play=function(){var r=this;return new Promise(function(e,t){if(r._lastRenderedFrame==r.getFramesCount()-1&&r._currentTime==r._totalDuration||!r._isStarted)return r._currentTime=0,r._isStarted=!0,r._terminal.reset(),r.$element.one("rendered",function(){e()});e()}).then(function(){r.$element.find(".terminalizer-player").addClass("started"),r._isPlaying=!0,r._emit("playingStarted"),r.$element.find(".terminalizer-player").addClass("playing")})},o.prototype.pause=function(){this._isPlaying=!1,this.$element.find(".terminalizer-player").removeClass("playing"),this._emit("playingPaused")},o.prototype.jump=function(r,e){var n=this,i=null,o=n._isPlaying;return void 0===e&&(e=!0),n._isRendering=!0,n._isPlaying=!1,e&&(n._currentTime=r,n._updatePlayer()),new Promise(function(t,e){n.$element.one("rendered",function(){i=n._findFrameAt(r);for(var e=0;e<=i;e++)n._terminal.write(n._frames[e].content);n.$element.one("rendered",function(){n._isRendering=!1,n._isPlaying=o,t()})}),n._terminal.reset()})},
/*!
* Terminalizer Web Player
* https://terminalizer.com
*
* @author Mohammad Fares <faressoft.com@gmail.com>
*/
i.a.fn.terminalizer=function(){var e,t={},r=[];if(0==arguments.length)throw new Error("The options argument is required");if("string"!=typeof arguments[0])return void 0!==this.data("terminalizer")||(e=arguments[0],this.data("terminalizer",new o(this[0],e))),this;if(t=arguments[0],r=Array.prototype.slice.call(arguments,1),void 0===this.data("terminalizer"))throw new Error("It is not Terminalizer element");return this.data("terminalizer")[t].apply(this.data("terminalizer"),r)}}],i.c=a,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)i.d(r,n,function(e){return t[e]}.bind(null,n));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=1);function i(e){if(a[e])return a[e].exports;var t=a[e]={i:e,l:!1,exports:{}};return o[e].call(t.exports,t,t.exports,i),t.l=!0,t.exports}var o,a});
//# sourceMappingURL=terminalizer.min.js.map