!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.artplayer={})}(this,function(t){"use strict";"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;function e(t,e){return t(e={exports:{}},e.exports),e.exports}var r=e(function(n){function i(t,e){return n.exports=i=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t},i(t,e)}n.exports=i}),o=e(function(i){function o(t,e,n){return!function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],function(){})),!0}catch(t){return!1}}()?i.exports=o=function(t,e,n){var i=[null];i.push.apply(i,e);var o=new(Function.bind.apply(t,i));return n&&r(o,n.prototype),o}:i.exports=o=Reflect.construct,o.apply(null,arguments)}i.exports=o});var n=function(t){if(Array.isArray(t)){for(var e=0,n=new Array(t.length);e\n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
[x]
\n
\n \n ',t.$player=t.$container.querySelector(".artplayer-video-player"),t.$video=t.$container.querySelector(".artplayer-video"),t.$subtitle=t.$container.querySelector(".artplayer-subtitle"),t.$bottom=t.$container.querySelector(".artplayer-bottom"),t.$progress=t.$container.querySelector(".artplayer-progress"),t.$controls=t.$container.querySelector(".artplayer-controls"),t.$controlsLeft=t.$container.querySelector(".artplayer-controls-left"),t.$controlsRight=t.$container.querySelector(".artplayer-controls-right"),t.$layers=t.$container.querySelector(".artplayer-layers"),t.$loading=t.$container.querySelector(".artplayer-loading"),t.$notice=t.$container.querySelector(".artplayer-notice"),t.$noticeInner=t.$container.querySelector(".artplayer-notice-inner"),t.$mask=t.$container.querySelector(".artplayer-mask"),t.$info=t.$container.querySelector(".artplayer-info"),t.$infoPanel=t.$container.querySelector(".artplayer-info-panel"),t.$infoClose=t.$container.querySelector(".artplayer-info-close")}}]),e}(),q={"zh-cn":{"About author":"关于作者","Video info":"视频统计信息",Close:"关闭","Video load failed":"视频加载失败",Volume:"音量",Play:"播放",Pause:"暂停",Rate:"速度",Mute:"静音",Reconnect:"重新连接","Hide subtitle":"隐藏字幕","Show subtitle":"显示字幕",Screenshot:"截图","Play speed":"播放速度","Aspect ratio":"画面比例",Default:"默认",Normal:"正常",Switch:"切换"},"zh-tw":{"About author":"關於作者","Video info":"影片統計訊息",Close:"關閉","Video load failed":"影片載入失敗",Volume:"音量",Play:"播放",Pause:"暫停",Rate:"速度",Mute:"靜音",Reconnect:"重新連接","Hide subtitle":"隱藏字幕","Show subtitle":"顯示字幕",Screenshot:"截圖","Play speed":"播放速度","Aspect ratio":"畫面比例",Default:"默認",Normal:"正常",Switch:"切換"}},V=function(){function n(t){var e=t.option;s(this,n),this.option=e,this.init()}return l(n,[{key:"init",value:function(){this.language=q[this.option.lang.toLowerCase()]||{}}},{key:"get",value:function(t){return this.language[t]||t}},{key:"update",value:function(t){q=t(q),this.init()}}]),n}(),D=function(){function e(t){s(this,e),this.art=t,this.init(),this.eventBind(),this.firstCanplay=!1,this.reconnectTime=0,this.maxReconnectTime=5}return l(e,[{key:"init",value:function(){var t=this.art,n=t.option,i=t.refs.$video;Object.keys(n.moreVideoAttr).forEach(function(t){var e=n.moreVideoAttr[t];i[t]=e}),i.volume=$(n.volume,0,1),i.poster=n.poster,i.autoplay=n.autoplay,i.src=n.url}},{key:"eventBind",value:function(){var e=this,t=this.art,n=t.option,i=t.events.proxy,o=t.refs,r=o.$player,a=o.$video,s=t.i18n,c=t.notice;R.video.events.forEach(function(t){i(a,t,function(t){e.art.emit("video:".concat(t.type),t)})}),this.art.on("video:loadstart",function(){e.art.loading.show()}),this.art.on("video:loadeddata",function(){e.art.loading.hide()}),this.art.on("video:waiting",function(){e.art.loading.show()}),this.art.on("video:seeking",function(){e.art.loading.show()}),this.art.on("video:canplay",function(){e.firstCanplay||(e.firstCanplay=!0,e.art.emit("firstCanplay")),e.art.controls.show(),e.art.mask.show(),e.art.loading.hide(),n.autoplay&&e.play()}),this.art.on("video:playing",function(){e.art.isPlaying=!0,e.art.controls.hide(),e.art.mask.hide()}),this.art.on("video:pause",function(){e.art.isPlaying=!1,e.art.controls.show(),e.art.mask.show()}),this.art.on("video:ended",function(){e.art.isPlaying=!1,e.art.controls.show(),e.art.mask.show(),n.loop&&(e.seek(0),e.play())}),this.art.on("video:error",function(){e.reconnectTime\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n',playBig:'\n \n \n \n \n',play:'\n \n',pause:'\n \n',volume:'\n \n',volumeClose:'\n \n \n',subtitle:'\n \n \n',subtitleClose:'\n \n \n',screenshot:'\n\t\n\t\t\n\t\n\n'},G={},Object.keys(Z).forEach(function(t){var e=document.createElement("div");e.innerHTML='').concat(Z[t],"");var n=Y(e.childNodes,1);G[t]=n[0]}),G),X=function(){function e(t){s(this,e),this.option=t}return l(e,[{key:"apply",value:function(t){var e=this,n=t.events.proxy,i=t.player,o=t.i18n;this.$play=k(this.option.$control,J.play),this.$pause=k(this.option.$control,J.pause),E(this.$play,o.get("Play")),E(this.$pause,o.get("Pause")),x(this.$pause,"display","none"),n(this.$play,"click",function(){i.play()}),n(this.$pause,"click",function(){i.pause()}),t.on("video:playing",function(){x(e.$play,"display","none"),x(e.$pause,"display","block")}),t.on("video:pause",function(){x(e.$play,"display","block"),x(e.$pause,"display","none")})}}]),e}(),K=function(){function e(t){s(this,e),this.option=t,this.isDroging=!1,this.getLoaded=this.getLoaded.bind(this),this.getPlayed=this.getPlayed.bind(this),this.set=this.set.bind(this)}return l(e,[{key:"apply",value:function(t){this.art=t,this.init()}},{key:"init",value:function(){var o=this,t=this.art,e=t.option,n=e.highlight,i=e.theme,r=t.events.proxy,a=t.refs.$video,s=t.player;k(this.option.$control,'\n
\n
\n
\n
\n
\n
\n
\n ')),this.$loaded=this.option.$control.querySelector(".art-progress-loaded"),this.$played=this.option.$control.querySelector(".art-progress-played"),this.$highlight=this.option.$control.querySelector(".art-progress-highlight"),this.$indicator=this.option.$control.querySelector(".art-progress-indicator"),this.$tip=this.option.$control.querySelector(".art-progress-tip"),this.set("loaded",this.getLoaded()),n.forEach(function(t){var e=Number(t.time)/a.duration;k(o.$highlight,'\n \n '))}),this.art.on("video:progress",function(){o.set("loaded",o.getLoaded())}),this.art.on("video:timeupdate",function(){o.set("played",o.getPlayed())}),this.art.on("video:ended",function(){o.set("played",1)}),r(this.option.$control,"mousemove",function(t){x(o.$tip,"display","block"),-1this.option.$control.clientWidth-o/2?x(this.$tip,"left","".concat(this.option.$control.clientWidth-o,"px")):x(this.$tip,"left","".concat(n-o/2,"px"))}},{key:"getPlayed",value:function(){var t=this.art.refs.$video;return t.currentTime/t.duration}},{key:"getLoaded",value:function(){var t=this.art.refs.$video;return t.buffered.length?t.buffered.end(t.buffered.length-1)/t.duration:0}},{key:"getPosFromEvent",value:function(t){var e=this.art.refs,n=e.$video,i=e.$progress,o=i.getBoundingClientRect().left,r=$(t.x-o,0,i.clientWidth),a=r/i.clientWidth*n.duration;return{second:a,time:S(a),width:r,percentage:$(r/i.clientWidth,0,1)}}},{key:"set",value:function(t,e){x(this["$".concat(t)],"width","".concat(100*e,"%")),"played"===t&&x(this.$indicator,"left","calc(".concat(100*e,"% - 6.5px)"))}}]),e}(),Q=function(){function e(t){s(this,e),this.option=t}return l(e,[{key:"apply",value:function(t){var e=this,n=t.events.proxy,i=t.subtitle,o=t.i18n;this.$subtitle=k(this.option.$control,J.subtitle),this.$subtitleClose=k(this.option.$control,J.subtitleClose),E(this.$subtitle,o.get("Hide subtitle")),E(this.$subtitleClose,o.get("Show subtitle")),x(this.$subtitleClose,"display","none"),n(this.$subtitle,"click",function(){i.hide(),x(e.$subtitle,"display","none"),x(e.$subtitleClose,"display","block")}),n(this.$subtitleClose,"click",function(){i.show(),x(e.$subtitle,"display","block"),x(e.$subtitleClose,"display","none")})}}]),e}(),tt=function(){function e(t){s(this,e),this.option=t}return l(e,[{key:"apply",value:function(t){this.art=t,this.init()}},{key:"init",value:function(){var t=this;this.option.$control.innerHTML="00:00 / 00:00",this.art.on("video:canplay",function(){t.option.$control.innerHTML=t.getTime()}),this.art.on("video:timeupdate",function(){t.option.$control.innerHTML=t.getTime()}),this.art.on("video:seeking",function(){t.option.$control.innerHTML=t.getTime()})}},{key:"getTime",value:function(){var t=this.art.player;return"".concat(S(t.currentTime())," / ").concat(S(t.duration()))}}]),e}(),et=function(){function e(t){s(this,e),this.option=t,this.isDroging=!1}return l(e,[{key:"apply",value:function(t){this.art=t,this.init()}},{key:"init",value:function(){var e=this,t=this.art,n=t.events.proxy,i=t.player,o=t.i18n;this.$volume=k(this.option.$control,J.volume),this.$volumeClose=k(this.option.$control,J.volumeClose),this.$volumePanel=k(this.option.$control,'
'),this.$volumeHandle=k(this.$volumePanel,'
'),E(this.$volume,o.get("Mute")),x(this.$volumeClose,"display","none");var r=T("volume");this.setVolumeHandle(r),i.volume(r),n(this.$volume,"click",function(){x(e.$volume,"display","none"),x(e.$volumeClose,"display","block"),i.volume(0)}),n(this.$volumeClose,"click",function(){x(e.$volume,"display","block"),x(e.$volumeClose,"display","none"),i.volume(T("volume"))}),n(this.option.$control,"mouseenter",function(){e.$volumePanel.classList.add("art-volume-panel-hover"),setTimeout(function(){e.setVolumeHandle(i.volume())},200)}),n(this.option.$control,"mouseleave",function(){e.$volumePanel.classList.remove("art-volume-panel-hover")}),n(this.$volumePanel,"click",function(t){e.volumeChangeFromEvent(t)}),n(this.$volumeHandle,"mousedown",function(){e.isDroging=!0}),n(this.$volumeHandle,"mousemove",function(t){e.isDroging&&e.volumeChangeFromEvent(t)}),n(document,"mouseup",function(){e.isDroging&&(e.isDroging=!1)}),this.art.on("video:volumechange",function(){var t=i.volume();e.setVolumeHandle(t),0===t?(x(e.$volume,"display","none"),x(e.$volumeClose,"display","block")):(x(e.$volume,"display","block"),x(e.$volumeClose,"display","none"))})}},{key:"volumeChangeFromEvent",value:function(t){var e=this.art.player,n=this.$volumePanel.getBoundingClientRect(),i=n.left,o=n.width,r=this.$volumeHandle.getBoundingClientRect().width,a=$(t.x-i-r/2,0,o-r/2)/(o-r);e.volume(a)}},{key:"setVolumeHandle",value:function(){var t=0n.clientWidth-s/2?x(this.option.$control,"left","".concat(n.clientWidth-s,"px")):x(this.option.$control,"left","".concat(i-s/2,"px"))}}]),e}(),ot=function(){function e(t){s(this,e),this.option=t}return l(e,[{key:"apply",value:function(t){var e=this;this.art=t;var n=this.art,i=n.events.proxy,o=n.i18n,r=n.notice;this.$screenshot=k(this.option.$control,J.screenshot),E(this.$screenshot,o.get("Screenshot")),i(this.$screenshot,"click",function(){try{e.captureFrame()}catch(t){r.show(t)}})}},{key:"captureFrame",value:function(){var t=this.art.refs.$video,e=document.createElement("canvas");e.width=t.videoWidth,e.height=t.videoHeight,e.getContext("2d").drawImage(t,0,0);var n=e.toDataURL("image/png"),i=document.createElement("a");x(i,"display","none"),i.href=n,i.download="".concat(S(t.currentTime),".png"),document.body.appendChild(i),i.click(),document.body.removeChild(i)}}]),e}(),rt=function(){function e(t){s(this,e),this.option=t}return l(e,[{key:"apply",value:function(t){this.art=t}}]),e}(),at=0,st=function(){function n(t){var e=this;s(this,n),this.art=t,this.$map={},this.art.on("firstCanplay",function(){e.init(),e.mount()})}return l(n,[{key:"init",value:function(){var e=this;this.add(new K({disable:!1,position:"top",index:10})),this.add(new it({disable:!this.art.option.thumbnails.url,position:"top",index:20})),this.add(new X({disable:!1,position:"left",index:10})),this.add(new et({disable:!1,position:"left",index:20})),this.add(new tt({disable:!1,position:"left",index:30})),this.add(new B({disable:!1,position:"right",index:10})),this.add(new ot({disable:!this.art.option.screenshot,position:"right",index:20})),this.add(new Q({disable:!this.art.option.subtitle.url,position:"right",index:30})),this.add(new rt({disable:0===this.art.option.quality.length,position:"right",index:40})),this.add(new nt({disable:!1,position:"right",index:50})),this.add(new I({disable:!this.art.option.pip,position:"right",index:60})),this.add(new N({disable:!this.art.option.fullscreenWeb,position:"right",index:70})),this.add(new z({disable:!this.art.option.fullscreen,position:"right",index:80})),this.art.option.controls.forEach(function(t){e.add(t)})}},{key:"add",value:function(t){var e=t.option;if(e&&!e.disable){at++;var n=t.constructor.name.toLowerCase()||"control".concat(at),i=document.createElement("div");i.setAttribute("class","art-control art-control-".concat(n)),i.setAttribute("data-control-index",String(e.index)||at),e.$control=i,this.commonMethod(t),(this.$map[e.position]||(this.$map[e.position]=[])).push(i),t.apply&&t.apply(this.art),this[n]=t}}},{key:"mount",value:function(){var t=this,e=this.art.refs,n=e.$progress,i=e.$controlsLeft,o=e.$controlsRight;Object.keys(this.$map).forEach(function(e){t.$map[e].sort(function(t,e){return Number(t.dataset.controlIndex)-Number(e.dataset.controlIndex)}).forEach(function(t){switch(e){case"top":n.appendChild(t);break;case"left":i.appendChild(t);break;case"right":o.appendChild(t)}})})}},{key:"commonMethod",value:function(t){var e=this;Object.defineProperty(t,"hide",{value:function(){x(t.option.$control,"display","none"),e.art.emit("control:hide",t.option.$control)}}),Object.defineProperty(t,"show",{value:function(){x(t.option.$control,"display","block"),e.art.emit("control:show",t.option.$control)}})}},{key:"show",value:function(){this.art.refs.$player.classList.add("controls-show")}},{key:"hide",value:function(){this.art.refs.$player.classList.remove("controls-show")}}]),n}(),ct=0,lt=function(){function e(t){s(this,e),this.art=t,this.init()}return l(e,[{key:"init",value:function(){var o=this,t=this.art,e=t.option,r=t.player,n=t.i18n,i=t.refs,a=t.events.proxy;e.contextmenu.push({disable:!e.playbackRate,name:"playbackRate",html:"\n ".concat(n.get("Play speed"),':\n 0.5\n 0.75\n ').concat(n.get("Normal"),'\n 1.25\n 1.5\n 2.0\n '),click:function(t,e){var n=e.target,i=n.dataset.rate;i&&(r.playbackRate(Number(i)),A(n).forEach(function(t){return t.classList.remove("current")}),n.classList.add("current"),o.hide())}},{disable:!e.aspectRatio,name:"aspectRatio",html:"\n ".concat(n.get("Aspect ratio"),':\n ').concat(n.get("Default"),'\n 4:3\n 16:9\n '),click:function(t,e){var n=e.target,i=n.dataset.ratio;i&&(r.aspectRatio(i.split(":")),A(n).forEach(function(t){return t.classList.remove("current")}),n.classList.add("current"),o.hide())}},{disable:!1,name:"info",html:n.get("Video info"),click:function(){o.art.info.show(),o.hide()}},{disable:!1,name:"version",html:'ArtPlayer 1.0.0'},{disable:!1,name:"close",html:n.get("Close"),click:function(){o.hide()}}),a(i.$player,"contextmenu",function(t){t.preventDefault(),o.art.isFocus=!0,i.$contextmenu||o.creatMenu(),o.show(),o.setPos(t)}),a(i.$player,"click",function(t){i.$contextmenu&&!t.path.includes(i.$contextmenu)&&o.hide()})}},{key:"creatMenu",value:function(){var i=this,t=this.art,e=t.option,o=t.refs,r=t.events.proxy;o.$contextmenu=document.createElement("div"),o.$contextmenu.classList.add("artplayer-contextmenu"),e.contextmenu.filter(function(t){return!t.disable}).forEach(function(e){ct++;var n=document.createElement("div");n.setAttribute("data-art-menu-id",ct),n.setAttribute("class","art-menu art-menu-".concat(e.name||ct)),k(n,e.html),C(n,e.style||{}),e.click&&r(n,"click",function(t){t.preventDefault(),e.click(i.art,t),i.art.emit("contextmenu:click",n)}),i["$".concat(e.name||ct)]=k(o.$contextmenu,n)}),k(o.$player,o.$contextmenu)}},{key:"setPos",value:function(t){var e=this.art.refs,n=t.clientX,i=t.clientY,o=e.$player.getBoundingClientRect(),r=o.height,a=o.width,s=o.left,c=o.top,l=e.$contextmenu.getBoundingClientRect(),u=l.height,h=l.width,d=n-s,f=i-c;s+a\n
Player version:
\n
1.0.0
\n \n '),t.push('\n
\n
Video url:
\n
\n
\n '),t.push('\n
\n
Video type:
\n
\n
\n '),t.push('\n
\n
Video size:
\n
\n
\n '),t.push('\n
\n
Video volume:
\n
\n
\n '),t.push('\n
\n
Video time:
\n
\n
\n '),t.push('\n
\n
Video duration:
\n
\n
\n '),t.push('\n
\n
Video resolution:
\n
\n x \n
\n
\n '),t.join("")}},{key:"getHeader",value:function(){var t=this.art.refs,e=t.$infoPanel,n=t.$video.src,i=Array.from(e.querySelectorAll("[data-head]"));i.forEach(function(t){t.innerHTML="loading..."}),fetch(n,{method:"HEAD"}).then(function(n){i.forEach(function(t){var e=n.headers.get(t.dataset.head);t.innerHTML=void 0!==e?e:"unknown"})}).catch(function(){i.forEach(function(t){t.innerHTML="unknown"})})}},{key:"readInfo",value:function(){var t=this.art.refs,e=t.$infoPanel,n=t.$video;Array.from(e.querySelectorAll("[data-video]")).forEach(function(t){var e=n[t.dataset.video];t.innerHTML=void 0!==e?e:"unknown"})}},{key:"loop",value:function(){var t=this;this.readInfo(),this.timer=setTimeout(function(){t.readInfo(),t.loop()},1e3)}},{key:"hide",value:function(){var t=this.art.refs.$info;x(t,"display","none"),clearTimeout(this.timer),this.art.emit("info:hide",t)}}]),e}(),dt=function(){function n(t){s(this,n),this.art=t;var e=this.art.option.subtitle.url;e&&(this.checkExt(e),this.init())}return l(n,[{key:"init",value:function(){var i=this,t=this.art,e=t.events.proxy,n=t.option.subtitle,o=t.refs,r=o.$video,a=o.$subtitle;C(a,n.style||{});var s=document.createElement("track");s.default=!0,s.kind="metadata",this.load(n.url).then(function(t){if(s.src=t,r.appendChild(s),i.art.refs.$track=s,r.textTracks&&r.textTracks[0]){var n=Y(r.textTracks,1)[0];e(n,"cuechange",function(){var t=Y(n.activeCues,1)[0];if(a.innerHTML="",t){var e=document.createElement("div");e.appendChild(t.getCueAsHTML()),a.innerHTML=e.innerHTML.split(/\r?\n/).map(function(t){return"

".concat(t,"

")}).join("")}i.art.emit("subtitle:update",a)})}})}},{key:"load",value:function(e){var n,i=this;return fetch(e).then(function(t){return n=t.headers.get("Content-Type"),t.text()}).then(function(t){return/x-subrip/gi.test(n)?i.srtToVtt(t):e}).catch(function(t){throw t})}},{key:"srtToVtt",value:function(t){var e="WEBVTT \r\n\r\n".concat(t.replace(/\{\\([ibu])\}/g,"").replace(/\{\\([ibu])1\}/g,"<$1>").replace(/\{([ibu])\}/g,"<$1>").replace(/\{\/([ibu])\}/g,"").replace(/(\d\d:\d\d:\d\d),(\d\d\d)/g,"$1.$2").concat("\r\n\r\n"));return URL.createObjectURL(new Blob([e],{type:"text/vtt"}))}},{key:"checkExt",value:function(t){var e=function t(e){return e.includes("?")?t(e.split("?")[0]):e.includes("#")?t(e.split("#")[0]):e.trim().toLowerCase().split(".").pop()}(t);w("vtt"===e||"srt"===e,"'subtitle.url' option require 'vtt' or 'srt' format, but got '".concat(e,"'."))}},{key:"show",value:function(){var t=this.art.refs.$subtitle;x(t,"display","block"),this.art.emit("subtitle:show",t)}},{key:"hide",value:function(){var t=this.art.refs.$subtitle;x(t,"display","none"),this.art.emit("subtitle:hide",t)}},{key:"switch",value:function(e){var n=this,i=this.art.refs.$track;this.checkExt(e),w(i,"You need to initialize the subtitle option first."),this.load(e).then(function(t){e!==t&&(i.src=t,n.art.emit("subtitle:switch",e))})}}]),n}(),ft=function(){function e(t){s(this,e),this.art=t,this.destroyEvents=[],this.proxy=this.proxy.bind(this)}return l(e,[{key:"proxy",value:function(e,t,n){var i=this,o=3