Files
ArtPlayer/dist/artplayer-tool-thumbnail.js
T
2018-12-07 11:07:56 +08:00

9 lines
7.2 KiB
JavaScript

/*!
* artplayer-tool-thumbnail.js v1.0.5
* Github: https://github.com/zhw2590582/ArtPlayer#readme
* (c) 2017-2018 Harvey Zack
* Released under the MIT License.
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t["artplayer-tool-thumbnail"]={})}(this,function(t){"use strict";var o=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")};function i(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}var e=function(t,e,n){return e&&i(t.prototype,e),n&&i(t,n),t};function n(t,e){return t(e={exports:{}},e.exports),e.exports}var r=n(function(e){function n(t){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function o(t){return"function"==typeof Symbol&&"symbol"===n(Symbol.iterator)?e.exports=o=function(t){return n(t)}:e.exports=o=function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":n(t)},o(t)}e.exports=o});var u=function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t};var a=function(t,e){return!e||"object"!==r(e)&&"function"!=typeof e?u(t):e},s=n(function(e){function n(t){return e.exports=n=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)},n(t)}e.exports=n}),c=n(function(n){function o(t,e){return n.exports=o=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t},o(t,e)}n.exports=o});var l=function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&c(t,e)};function h(){}h.prototype={on:function(t,e,n){var o=this.e||(this.e={});return(o[t]||(o[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var o=this;function i(){o.off(t,i),e.apply(n,arguments)}return i._=e,this.on(t,i,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),o=0,i=n.length;o<i;o++)n[o].fn.apply(n[o].ctx,e);return this},off:function(t,e){var n=this.e||(this.e={}),o=n[t],i=[];if(o&&e)for(var r=0,u=o.length;r<u;r++)o[r].fn!==e&&o[r].fn._!==e&&i.push(o[r]);return i.length?n[t]=i:delete n[t],this}};var f=h;function p(e){return new Promise(function(t){return setTimeout(t,e)})}function d(t,e,n){return Math.max(Math.min(t,Math.max(e,n)),Math.min(e,n))}var m=function(t){function n(){var t,e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:{};return o(this,n),(t=a(this,s(n).call(this))).processing=!1,t.option={},t.setup(Object.assign({},n.DEFAULTS,e)),t.video=n.creatVideo(),t.inputChange=t.inputChange.bind(u(u(t))),t.option.fileInput.addEventListener("change",t.inputChange),t}return l(n,f),e(n,[{key:"setup",value:function(){var e=this,t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:{};this.option=Object.assign({},this.option,t);var n=this.option,o=n.fileInput,i=n.delay,r=n.number,u=n.width,a=n.height,s=n.column;return this.errorHandle("INPUT"===o.tagName&&"file"===o.type,"The 'fileInput' is not a usable file input like: <input type=\"file\">"),["delay","number","width","height","column"].forEach(function(t){e.errorHandle("number"==typeof e.option[t],"The '".concat(t,"' is not a number"))}),this.option.delay=d(i,10,1e3),this.option.number=d(r,10,1e3),this.option.width=d(u,10,1e3),this.option.height=d(a,10,1e3),this.option.column=d(s,1,1e3),this}},{key:"inputChange",value:function(){var e=this,t=this.option.delay,n=["video/mp4","audio/ogg","video/webm"],o=this.option.fileInput.files[0];if(o){this.errorHandle(n.includes(o.type),"Only file types are supported: ".concat(n.toString(),", but got ").concat(o.type));var i=URL.createObjectURL(o);this.videoUrl=i,this.file=o,this.emit("file",this.file),this.video.src=i,p(t).then(function(){e.emit("video",e.video)}).catch(function(t){e.emit("error",t.message),console.error(t)})}}},{key:"start",value:function(){var n=this,t=this.option,o=t.width,i=t.height,r=t.number,u=t.delay;this.density=r/this.video.duration,this.errorHandle(this.file&&this.video,"Please select the video file first"),this.errorHandle(!this.processing,"There is currently a task in progress, please wait a moment..."),this.errorHandle(this.density<=1,"The preview density cannot be greater than 1, but got ".concat(this.density));var e=this.creatScreenshotDate(),a=this.creatCanvas(),s=a.getContext("2d");this.emit("canvas",a);var c,l=e.map(function(t,e){return function(){return n.video.currentTime=t.time,p(u).then(function(){s.drawImage(n.video,t.x,t.y,o,i),a.toBlob(function(t){n.thumbnailUrl&&URL.revokeObjectURL(n.thumbnailUrl),n.thumbnailUrl=URL.createObjectURL(t),n.emit("update",n.thumbnailUrl,(e+1)/r)})}).catch(function(t){console.error(t)})}});return this.processing=!0,(c=l,c.reduce(function(t,e){return t.then(e)},Promise.resolve())).then(function(){return p(2*u).then(function(){n.processing=!1,n.emit("done")}).catch(function(t){n.processing=!1,n.emit("error",t.message),console.error(t)})}).catch(function(t){n.processing=!1,n.emit("error",t.message),console.error(t)})}},{key:"creatScreenshotDate",value:function(){for(var t=this.option,e=t.number,n=t.width,o=t.height,i=t.column,r=this.video.duration/e,u=[r];u.length<e;){var a=u[u.length-1];u.push(a+r)}return u.map(function(t,e){return{time:t-r/2,x:e%i*n,y:Math.floor(e/i)*o}})}},{key:"creatCanvas",value:function(){var t=this.option,e=t.number,n=t.width,o=t.height,i=t.column,r=document.createElement("canvas"),u=r.getContext("2d");return r.width=n*i,r.height=Math.ceil(e/i)*o+30,u.fillStyle="black",u.fillRect(0,0,r.width,r.height),u.font="14px Georgia",u.fillStyle="#fff",u.fillText("From: https://artplayer.org/thumbnail, Number: ".concat(e,", Width: ").concat(n,", Height: ").concat(o,", Column: ").concat(i),10,r.height-11),r}},{key:"download",value:function(){this.errorHandle(this.file&&this.thumbnailUrl,"Download does not seem to be ready, please create preview first"),this.errorHandle(!this.processing,"There is currently a task in progress, please wait a moment...");var t,e,n=document.createElement("a"),o="".concat((t=this.file.name,(e=t.split(".")).pop(),e.join(".")),".png");return n.download=o,n.href=this.thumbnailUrl,document.body.appendChild(n),n.click(),document.body.removeChild(n),this.emit("download",o),this}},{key:"errorHandle",value:function(t,e){if(!t)throw this.emit("error",e),new Error(e)}},{key:"destroy",value:function(){this.option.fileInput.removeEventListener("change",this.inputChange),document.body.removeChild(this.video),this.videoUrl&&URL.revokeObjectURL(this.videoUrl),this.thumbnailUrl&&URL.revokeObjectURL(this.thumbnailUrl),this.emit("destroy")}}],[{key:"creatVideo",value:function(){var t=document.createElement("video");return t.style.position="absolute",t.style.top="-9999px",t.style.left="-9999px",t.muted=!0,t.controls=!0,document.body.appendChild(t),t}},{key:"DEFAULTS",get:function(){return{delay:300,number:60,width:160,height:90,column:10}}}]),n}();window.ArtplayerToolThumbnail=m,t.default=m,Object.defineProperty(t,"__esModule",{value:!0})});