From 6aa6f9ad53834b1480da27ef4a941a39b9043260 Mon Sep 17 00:00:00 2001 From: Harvey Zhao Date: Wed, 1 Apr 2026 11:30:49 +0800 Subject: [PATCH] feat: add danmuku plugin documentation and i18n setup guide - Created a new documentation file for the danmuku plugin with code examples. - Added a comprehensive guide for language settings (i18n) including default languages, importing languages, adding new languages, and modifying existing languages. - Included code snippets for initializing the Artplayer with different language settings. feat: implement safe area insets for improved video rotation handling feat: add console log for safe area insets in autoOrientation plugin feat: enhance mobile meta tags for better web app support --- CHANGELOG.md | 2 ++ docs/assets/ts/artplayer.d.ts | 1 + docs/compiled/artplayer.js | 4 +-- docs/compiled/artplayer.legacy.js | 4 +-- docs/compiled/artplayer.mjs | 28 +++++++++++++++---- docs/document/404.html | 2 +- docs/document/advanced/built-in.html | 2 +- docs/document/advanced/class.html | 2 +- docs/document/advanced/event.html | 2 +- docs/document/advanced/global.html | 2 +- docs/document/advanced/plugin.html | 2 +- docs/document/advanced/property.html | 2 +- ...md.L9xnqmbw.js => en_index.md.DFeypQS9.js} | 8 +++--- ...w.lean.js => en_index.md.DFeypQS9.lean.js} | 0 ...gstn_9.js => en_start_i18n.md.Cg_MHRXn.js} | 2 +- ...n.js => en_start_i18n.md.Cg_MHRXn.lean.js} | 0 ...ex.md.CpfWSd2Y.js => index.md.DhvU8bFi.js} | 8 +++--- ...Sd2Y.lean.js => index.md.DhvU8bFi.lean.js} | 0 ...4PBIi.js => plugin_danmuku.md.BVV3kpeJ.js} | 2 +- ....js => plugin_danmuku.md.BVV3kpeJ.lean.js} | 0 ....uSeNmo_b.js => start_i18n.md.CWsZb7Vr.js} | 2 +- ...lean.js => start_i18n.md.CWsZb7Vr.lean.js} | 0 docs/document/component/contextmenu.html | 2 +- docs/document/component/controls.html | 2 +- docs/document/component/layers.html | 2 +- docs/document/component/setting.html | 2 +- docs/document/en/advanced/built-in.html | 2 +- docs/document/en/advanced/class.html | 2 +- docs/document/en/advanced/event.html | 2 +- docs/document/en/advanced/global.html | 2 +- docs/document/en/advanced/plugin.html | 2 +- docs/document/en/advanced/property.html | 2 +- docs/document/en/component/contextmenu.html | 2 +- docs/document/en/component/controls.html | 2 +- docs/document/en/component/layers.html | 2 +- docs/document/en/component/setting.html | 2 +- docs/document/en/index.html | 12 ++++---- docs/document/en/start/i18n.html | 6 ++-- docs/document/en/start/option.html | 2 +- docs/document/hashmap.json | 2 +- docs/document/index.html | 12 ++++---- docs/document/plugin/danmuku.html | 6 ++-- docs/document/start/i18n.html | 6 ++-- docs/document/start/option.html | 2 +- docs/mobile.html | 4 ++- docs/uncompiled/artplayer/index.js | 26 ++++++++++++++--- packages/artplayer/dist/artplayer.js | 4 +-- packages/artplayer/dist/artplayer.legacy.js | 4 +-- packages/artplayer/dist/artplayer.mjs | 28 +++++++++++++++---- packages/artplayer/package.json | 2 +- .../artplayer/src/plugins/autoOrientation.js | 11 +++++--- packages/artplayer/src/utils/dom.js | 16 +++++++++++ packages/artplayer/types/utils.d.ts | 1 + 53 files changed, 163 insertions(+), 84 deletions(-) rename docs/document/assets/{en_index.md.L9xnqmbw.js => en_index.md.DFeypQS9.js} (98%) rename docs/document/assets/{en_index.md.L9xnqmbw.lean.js => en_index.md.DFeypQS9.lean.js} (100%) rename docs/document/assets/{en_start_i18n.md.Btgstn_9.js => en_start_i18n.md.Cg_MHRXn.js} (98%) rename docs/document/assets/{en_start_i18n.md.Btgstn_9.lean.js => en_start_i18n.md.Cg_MHRXn.lean.js} (100%) rename docs/document/assets/{index.md.CpfWSd2Y.js => index.md.DhvU8bFi.js} (98%) rename docs/document/assets/{index.md.CpfWSd2Y.lean.js => index.md.DhvU8bFi.lean.js} (100%) rename docs/document/assets/{plugin_danmuku.md.NzG4PBIi.js => plugin_danmuku.md.BVV3kpeJ.js} (99%) rename docs/document/assets/{plugin_danmuku.md.NzG4PBIi.lean.js => plugin_danmuku.md.BVV3kpeJ.lean.js} (100%) rename docs/document/assets/{start_i18n.md.uSeNmo_b.js => start_i18n.md.CWsZb7Vr.js} (98%) rename docs/document/assets/{start_i18n.md.uSeNmo_b.lean.js => start_i18n.md.CWsZb7Vr.lean.js} (100%) diff --git a/CHANGELOG.md b/CHANGELOG.md index 03bce6652..25dfc9013 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +- Fix safe area issue when enter web fullscreen [#1033](https://github.com/zhw2590582/ArtPlayer/issues/1033) + ## [5.4.0] - 2026-03-12 - Refactor `Parcel` to `Vite` diff --git a/docs/assets/ts/artplayer.d.ts b/docs/assets/ts/artplayer.d.ts index 401974c9a..2843e421b 100644 --- a/docs/assets/ts/artplayer.d.ts +++ b/docs/assets/ts/artplayer.d.ts @@ -32,6 +32,7 @@ export interface Utils { tooltip: (target: HTMLElement, msg: string, pos?: string) => void isInViewport: (target: HTMLElement, offset?: number) => boolean includeFromEvent: (event: Event, target: HTMLElement) => boolean + getSafeAreaInsets: () => { top: number, right: number, bottom: number, left: number } srtToVtt: (srtText: string) => string vttToBlob: (vttText: string) => string diff --git a/docs/compiled/artplayer.js b/docs/compiled/artplayer.js index 623b028e0..858619e16 100644 --- a/docs/compiled/artplayer.js +++ b/docs/compiled/artplayer.js @@ -1,7 +1,7 @@ /*! - * artplayer.js v5.4.0 + * artplayer.js v5.4.1 * Github: https://github.com/zhw2590582/ArtPlayer * (c) 2017-2026 Harvey Zhao * Released under the MIT License. */ -!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.Artplayer=e(),define(function(){return t.Artplayer})):(t="undefined"!==typeof globalThis?globalThis:t||self).Artplayer=e()}(this,function(){"use strict";function t(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var e,r={exports:{}};var a=(e||(e=1,r.exports=function(){function t(e){return(t="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})(e)}var e=Object.prototype.toString,r=function(r){if(void 0===r)return"undefined";if(null===r)return"null";var o=t(r);if("boolean"===o)return"boolean";if("string"===o)return"string";if("number"===o)return"number";if("symbol"===o)return"symbol";if("function"===o)return"GeneratorFunction"===a(r)?"generatorfunction":"function";if(function(t){return Array.isArray?Array.isArray(t):t instanceof Array}(r))return"array";if(function(t){return!(!t.constructor||"function"!=typeof t.constructor.isBuffer)&&t.constructor.isBuffer(t)}(r))return"buffer";if(function(t){try{if("number"==typeof t.length&&"function"==typeof t.callee)return!0}catch(e){if(-1!==e.message.indexOf("callee"))return!0}return!1}(r))return"arguments";if(function(t){return t instanceof Date||"function"==typeof t.toDateString&&"function"==typeof t.getDate&&"function"==typeof t.setDate}(r))return"date";if(function(t){return t instanceof Error||"string"==typeof t.message&&t.constructor&&"number"==typeof t.constructor.stackTraceLimit}(r))return"error";if(function(t){return t instanceof RegExp||"string"==typeof t.flags&&"boolean"==typeof t.ignoreCase&&"boolean"==typeof t.multiline&&"boolean"==typeof t.global}(r))return"regexp";switch(a(r)){case"Symbol":return"symbol";case"Promise":return"promise";case"WeakMap":return"weakmap";case"WeakSet":return"weakset";case"Map":return"map";case"Set":return"set";case"Int8Array":return"int8array";case"Uint8Array":return"uint8array";case"Uint8ClampedArray":return"uint8clampedarray";case"Int16Array":return"int16array";case"Uint16Array":return"uint16array";case"Int32Array":return"int32array";case"Uint32Array":return"uint32array";case"Float32Array":return"float32array";case"Float64Array":return"float64array"}if(function(t){return"function"==typeof t.throw&&"function"==typeof t.return&&"function"==typeof t.next}(r))return"generator";switch(o=e.call(r)){case"[object Object]":return"object";case"[object Map Iterator]":return"mapiterator";case"[object Set Iterator]":return"setiterator";case"[object String Iterator]":return"stringiterator";case"[object Array Iterator]":return"arrayiterator"}return o.slice(8,-1).toLowerCase().replace(/\s/g,"")};function a(t){return t.constructor?t.constructor.name:null}function o(t,e){var a=2=1,p=/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(s)||d,h="undefined"!==typeof window&&"undefined"!==typeof document;function u(t,e=document){return e.querySelector(t)}function m(t,e=document){return Array.from(e.querySelectorAll(t))}function f(t,e){return t.classList.add(e)}function g(t,e){return t.classList.remove(e)}function v(t,e){return t.classList.contains(e)}function y(t,e){return e instanceof Element?t.appendChild(e):t.insertAdjacentHTML("beforeend",String(e)),t.lastElementChild||t.lastChild}function b(t){return t.parentNode.removeChild(t)}function w(t,e,r){return t.style[e]=r,t}function x(t,e){for(const r in e)w(t,r,e[r]);return t}function k(t){return Array.from(t.parentElement.children).filter(e=>e!==t)}function $(t,e){k(t).forEach(t=>g(t,e)),f(t,e)}function T(t,e,r="top"){p||(t.setAttribute("aria-label",e),f(t,"hint--rounded"),f(t,`hint--${r}`))}function E(t,e=0){const r=t.getBoundingClientRect(),a=window.innerHeight||document.documentElement.clientHeight,o=window.innerWidth||document.documentElement.clientWidth,n=r.top-e<=a&&r.top+r.height+e>=0,i=r.left-e<=o+e&&r.left+r.width+e>=0;return n&&i}function C(t,e){return R(t).includes(e)}function z(t,e){return e.parentNode.replaceChild(t,e),t}function L(t){return document.createElement(t)}function S(t="",e=""){const r=L("i");return f(r,"art-icon"),f(r,`art-icon-${t}`),y(r,e),r}function M(t,e){let r=document.getElementById(t);r||(r=document.createElement("style"),r.id=t,"loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>{document.head.appendChild(r)}):(document.head||document.documentElement).appendChild(r)),r.textContent=e}function I(){const t=document.createElement("div");return t.style.display="flex","flex"===t.style.display}function P(t){return t.getBoundingClientRect()}function A(t,e){return new Promise((r,a)=>{const o=new Image;o.onload=function(){if(e&&1!==e){const n=document.createElement("canvas"),i=n.getContext("2d");n.width=o.width*e,n.height=o.height*e,i.drawImage(o,0,0,n.width,n.height),n.toBlob(e=>{const o=URL.createObjectURL(e),n=new Image;n.onload=function(){r(n)},n.onerror=function(){URL.revokeObjectURL(o),a(new Error(`Image load failed: ${t}`))},n.src=o})}else r(o)},o.onerror=function(){a(new Error(`Image load failed: ${t}`))},o.src=t})}function R(t){if(t.composedPath)return t.composedPath();const e=[];let r=t.target;for(;r;)e.push(r),r=r.parentNode;return e.includes(window)||void 0===window||e.push(window),e}class O extends Error{constructor(t,e){super(t),"function"===typeof Error.captureStackTrace&&Error.captureStackTrace(this,e||this.constructor),this.name="ArtPlayerError"}}function _(t,e){if(!t)throw new O(e);return t}function V(t){return t.includes("?")?V(t.split("?")[0]):t.includes("#")?V(t.split("#")[0]):t.trim().toLowerCase().split(".").pop()}function Y(t,e){const r=document.createElement("a");r.style.display="none",r.href=t,r.download=e,document.body.appendChild(r),r.click(),document.body.removeChild(r)}function D(t,e,r){return Math.max(Math.min(t,Math.max(e,r)),Math.min(e,r))}function N(t){return t.charAt(0).toUpperCase()+t.slice(1)}function F(t){if(!t)return"00:00";const e=Math.floor(t/3600),r=Math.floor((t-3600*e)/60),a=Math.floor(t-3600*e-60*r);return(e>0?[e,r,a]:[r,a]).map(t=>t<10?`0${t}`:String(t)).join(":")}function B(t){return t.replace(/[&<>'"]/g,t=>({"&":"&","<":"<",">":">","'":"'",'"':"""}[t]||t))}const H=Object.defineProperty,{hasOwnProperty:W}=Object.prototype;function j(t,e){return W.call(t,e)}function U(t,e){return Object.getOwnPropertyDescriptor(t,e)}function q(...t){const e=t=>t&&"object"===typeof t&&!Array.isArray(t);return t.reduce((t,r)=>(Object.keys(r).forEach(a=>{const o=t[a],n=r[a];Array.isArray(o)&&Array.isArray(n)?t[a]=o.concat(...n):e(o)&&e(n)?t[a]=q(o,n):t[a]=n}),t),{})}function X(t){return"WEBVTT \r\n\r\n".concat((e=t,e.replace(/(\d\d:\d\d:\d\d)[,.](\d+)/g,(t,e,r)=>{let a=r.slice(0,3);return 1===r.length&&(a=`${r}00`),2===r.length&&(a=`${r}0`),`${e},${a}`})).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").replace(/\{[\s\S]*?\}/g,"").concat("\r\n\r\n"));var e}function G(t){return URL.createObjectURL(new Blob([t],{type:"text/vtt"}))}function K(t){const e=new RegExp("Dialogue:\\s\\d,(\\d+:\\d\\d:\\d\\d.\\d\\d),(\\d+:\\d\\d:\\d\\d.\\d\\d),([^,]*),([^,]*),(?:[^,]*,){4}([\\s\\S]*)$","i");function r(t=""){return t.split(/[:.]/).map((t,e,r)=>{if(e===r.length-1){if(1===t.length)return`.${t}00`;if(2===t.length)return`.${t}0`}else if(1===t.length)return(0===e?"0":":0")+t;return 0===e?t:e===r.length-1?`.${t}`:`:${t}`}).join("")}return`WEBVTT\n\n${t.split(/\r?\n/).map(t=>{const a=t.match(e);return a?{start:r(a[1].trim()),end:r(a[2].trim()),text:a[5].replace(/\{[\s\S]*?\}/g,"").replace(/(\\N)/g,"\n").trim().split(/\r?\n/).map(t=>t.trim()).join("\n")}:null}).filter(t=>t).map((t,e)=>t?`${e+1}\n${t.start} --\x3e ${t.end}\n${t.text}`:"").filter(t=>t.trim()).join("\n\n")}`}function Z(t=0){return new Promise(e=>setTimeout(e,t))}function J(t,e){let r;return function(...a){clearTimeout(r),r=setTimeout(()=>(r=null,t.apply(this,a)),e)}}function Q(t,e){let r=!1;return function(...a){r||(t.apply(this,a),r=!0,setTimeout(()=>{r=!1},e))}}const tt=Object.freeze(Object.defineProperty({__proto__:null,ArtPlayerError:O,addClass:f,append:y,assToVtt:K,capitalize:N,clamp:D,createElement:L,debounce:J,def:H,download:Y,errorHandle:_,escape:B,get:U,getComposedPath:R,getExt:V,getIcon:S,getRect:P,getStyle:function(t,e,r=!0){const a=window.getComputedStyle(t,null).getPropertyValue(e);return r?Number.parseFloat(a):a},has:j,hasClass:v,includeFromEvent:C,inverseClass:$,isBrowser:h,isIOS:c,isIOS13:d,isInViewport:E,isMobile:p,isSafari:l,loadImg:A,mergeDeep:q,query:u,queryAll:m,remove:b,removeClass:g,replaceElement:z,secondToTime:F,setStyle:w,setStyleText:M,setStyles:x,siblings:k,sleep:Z,srtToVtt:X,supportsFlex:I,throttle:Q,tooltip:T,unescape:function(t){const e={"&":"&","<":"<",">":">","'":"'",""":'"'},r=new RegExp(`(${Object.keys(e).join("|")})`,"g");return t.replace(r,t=>e[t]||t)},userAgent:s,vttToBlob:G},Symbol.toStringTag,{value:"Module"})),et="array",rt="boolean",at="string",ot="number",nt="object",it="function";function st(t,e,r){return _(e===at||e===ot||t instanceof Element,`${r.join(".")} require '${at}' or 'Element' type`)}const lt={html:st,disable:`?${rt}`,name:`?${at}`,index:`?${ot}`,style:`?${nt}`,click:`?${it}`,mounted:`?${it}`,tooltip:`?${at}|${ot}`,width:`?${ot}`,selector:`?${et}`,onSelect:`?${it}`,switch:`?${rt}`,onSwitch:`?${it}`,range:`?${et}`,onRange:`?${it}`,onChange:`?${it}`},ct={id:at,container:st,url:at,poster:at,type:at,theme:at,lang:at,volume:ot,isLive:rt,muted:rt,autoplay:rt,autoSize:rt,autoMini:rt,loop:rt,flip:rt,playbackRate:rt,aspectRatio:rt,screenshot:rt,setting:rt,hotkey:rt,pip:rt,mutex:rt,backdrop:rt,fullscreen:rt,fullscreenWeb:rt,subtitleOffset:rt,miniProgressBar:rt,useSSR:rt,playsInline:rt,lock:rt,gesture:rt,fastForward:rt,autoPlayback:rt,autoOrientation:rt,airplay:rt,proxy:`?${it}`,plugins:[it],layers:[lt],contextmenu:[lt],settings:[lt],controls:[{...lt,position:(t,e,r)=>{const a=["top","left","right"];return _(a.includes(t),`${r.join(".")} only accept ${a.toString()} as parameters`)}}],quality:[{default:`?${rt}`,html:at,url:at}],highlight:[{time:ot,text:at}],thumbnails:{url:at,number:ot,column:ot,width:ot,height:ot,scale:ot},subtitle:{url:at,name:at,type:at,style:nt,escape:rt,encoding:at,onVttLoad:it},moreVideoAttr:nt,i18n:nt,icons:nt,cssVar:nt,customType:nt};class dt{constructor(t){this.id=0,this.art=t,this.cache=new Map,this.add=this.add.bind(this),this.remove=this.remove.bind(this),this.update=this.update.bind(this)}get show(){return v(this.art.template.$player,`art-${this.name}-show`)}set show(t){const{$player:e}=this.art.template,r=`art-${this.name}-show`;t?f(e,r):g(e,r),this.art.emit(this.name,t)}toggle(){this.show=!this.show}add(t){const e="function"===typeof t?t(this.art):t;if(e.html=e.html||"",o(e,lt),!this.$parent||!this.name||e.disable)return;const r=e.name||`${this.name}${this.id}`;_(!this.cache.has(r),`Can't add an existing [${r}] to the [${this.name}]`),this.id+=1;const a=L("div");f(a,`art-${this.name}`),f(a,`art-${this.name}-${r}`);const n=Array.from(this.$parent.children);a.dataset.index=e.index||this.id;const i=n.find(t=>Number(t.dataset.index)>=Number(a.dataset.index));i?i.insertAdjacentElement("beforebegin",a):y(this.$parent,a),e.html&&y(a,e.html),e.style&&x(a,e.style),e.tooltip&&T(a,e.tooltip);const s=[];if(e.click){const t=this.art.events.proxy(a,"click",t=>{t.preventDefault(),e.click.call(this.art,this,t)});s.push(t)}return e.selector&&["left","right"].includes(e.position)&&this.selector(e,a,s),this[r]=a,this.cache.set(r,{$ref:a,events:s,option:e}),e.mounted&&e.mounted.call(this.art,a),a}remove(t){_(this.cache.has(t),`Can't find [${t}] from the [${this.name}]`);const e=this.cache.get(t);e.option.beforeUnmount&&e.option.beforeUnmount.call(this.art,e.$ref);for(const r of e.events)this.art.events.remove(r);this.cache.delete(t),delete this[t],b(e.$ref)}update(t){if(this.cache.has(t.name)){const e=this.cache.get(t.name);t=Object.assign(e.option,t),this.remove(t.name)}return this.add(t)}}class pt extends dt{constructor(t){super(t),this.name="contextmenu",this.$parent=t.template.$contextmenu,p||this.init()}init(){const{option:t,proxy:e,template:{$player:r,$contextmenu:a}}=this.art;t.playbackRate&&this.add(function(t){return e=>{const{i18n:r,constructor:{PLAYBACK_RATE:a}}=e,o=a.map(t=>`${1===t?r.get("Normal"):t.toFixed(1)}`).join("");return{...t,html:`${r.get("Play Speed")}: ${o}`,click:(t,r)=>{const{value:a}=r.target.dataset;a&&(e.playbackRate=Number(a),t.show=!1)},mounted:t=>{const r=u('[data-value="1"]',t);r&&$(r,"art-current"),e.on("video:ratechange",()=>{const r=m("span",t).find(t=>Number(t.dataset.value)===e.playbackRate);r&&$(r,"art-current")})}}}}({name:"playbackRate",index:10})),t.aspectRatio&&this.add(function(t){return e=>{const{i18n:r,constructor:{ASPECT_RATIO:a}}=e,o=a.map(t=>`${"default"===t?r.get("Default"):t}`).join("");return{...t,html:`${r.get("Aspect Ratio")}: ${o}`,click:(t,r)=>{const{value:a}=r.target.dataset;a&&(e.aspectRatio=a,t.show=!1)},mounted:t=>{const r=u('[data-value="default"]',t);r&&$(r,"art-current"),e.on("aspectRatio",e=>{const r=m("span",t).find(t=>t.dataset.value===e);r&&$(r,"art-current")})}}}}({name:"aspectRatio",index:20})),t.flip&&this.add(function(t){return e=>{const{i18n:r,constructor:{FLIP:a}}=e,o=a.map(t=>`${r.get(N(t))}`).join("");return{...t,html:`${r.get("Video Flip")}: ${o}`,click:(t,r)=>{const{value:a}=r.target.dataset;a&&(e.flip=a.toLowerCase(),t.show=!1)},mounted:t=>{const r=u('[data-value="normal"]',t);r&&$(r,"art-current"),e.on("flip",e=>{const r=m("span",t).find(t=>t.dataset.value===e);r&&$(r,"art-current")})}}}}({name:"flip",index:30})),this.add(function(t){return e=>({...t,html:e.i18n.get("Video Info"),click:t=>{e.info.show=!0,t.show=!1}})}({name:"info",index:40})),this.add(function(t){const e=h?location.href:"";return{...t,html:`ArtPlayer ${n}`}}({name:"version",index:50})),this.add(function(t){return e=>({...t,html:e.i18n.get("Close"),click:t=>{t.show=!1}})}({name:"close",index:60}));for(let o=0;o{if(!this.art.constructor.CONTEXTMENU)return;t.preventDefault(),this.show=!0;const e=t.clientX,o=t.clientY,{height:n,width:i,left:s,top:l}=P(r),{height:c,width:d}=P(a);let p=e-s,h=o-l;e+d>s+i&&(p=i-d),o+c>l+n&&(h=n-c),x(a,{top:`${h}px`,left:`${p}px`})}),e(r,"click",t=>{C(t,a)||(this.show=!1)}),this.art.on("blur",()=>{this.show=!1})}}function ht(t,e){const{$progress:r}=t.template,{left:a}=P(r),o=D((p?e.touches[0].clientX:e.clientX)-a,0,r.clientWidth),n=o/r.clientWidth*t.duration;return{second:n,time:F(n),width:o,percentage:D(o/r.clientWidth,0,1)}}function ut(t,e){if(t.isRotate){const r=e.touches[0].clientY/t.height,a=r*t.duration;t.emit("setBar","played",r,e),t.seek=a}else{const{second:r,percentage:a}=ht(t,e);t.emit("setBar","played",a,e),t.seek=r}}function mt(t){return e=>{const{icons:r,option:a,proxy:o}=e,{$player:n,$progress:i}=e.template;return{...t,html:'\n
\n
\n
\n
\n
\n
\n
00:00
\n
\n ',mounted:t=>{let s=null,l=!1;const c=u(".art-progress-hover",t),d=u(".art-progress-loaded",t),h=u(".art-progress-played",t),m=u(".art-progress-highlight",t),v=u(".art-progress-indicator",t),b=u(".art-progress-tip",t);function x(r,a){const{width:o,time:n}=a||ht(e,r);b.textContent=n||"00:00";const i=b.clientWidth;o<=i/2?w(b,"left",0):o>t.clientWidth-i/2?w(b,"left",t.clientWidth-i+"px"):w(b,"left",o-i/2+"px")}r.indicator?y(v,r.indicator):w(v,"backgroundColor","var(--art-theme)"),e.on("setBar",function(r,a,o){const i="played"===r&&o&&p;if("loaded"===r&&w(d,"width",100*a+"%"),"hover"===r&&(w(c,"width",100*a+"%"),C(o,m)?function(r){const{width:a}=ht(e,r),{text:o}=r.target.dataset;b.textContent=o;const n=b.clientWidth;a<=n/2?w(b,"left",0):a>t.clientWidth-n/2?w(b,"left",t.clientWidth-n+"px"):w(b,"left",a-n/2+"px")}(o):x(o),0===a?g(n,"art-progress-hover"):f(n,"art-progress-hover")),"played"===r&&(w(h,"width",100*a+"%"),w(v,"left",100*a+"%")),i){f(n,"art-progress-hover");x(o,{width:t.clientWidth*a,time:F(a*e.duration)}),clearTimeout(s),s=setTimeout(()=>{g(n,"art-progress-hover")},500)}}),e.on("video:loadedmetadata",function(){m.textContent="";for(let t=0;t`;y(m,n)}}),e.constructor.USE_RAF?e.on("raf",()=>{e.emit("setBar","played",e.played),e.emit("setBar","loaded",e.loaded)}):(e.on("video:timeupdate",()=>{e.emit("setBar","played",e.played)}),e.on("video:progress",()=>{e.emit("setBar","loaded",e.loaded)}),e.on("video:ended",()=>{e.emit("setBar","played",1)})),e.emit("setBar","loaded",e.loaded||0),p||(o(i,"click",t=>{t.target!==v&&ut(e,t)}),o(i,"mousemove",t=>{const{percentage:r}=ht(e,t);e.emit("setBar","hover",r,t)}),o(i,"mouseleave",t=>{e.emit("setBar","hover",0,t)}),o(i,"mousedown",t=>{l=0===t.button}),e.on("document:mousemove",t=>{if(l){const{second:r,percentage:a}=ht(e,t);e.emit("setBar","played",a,t),e.seek=r}}),e.on("document:mouseup",()=>{l&&(l=!1)}))}}}}class ft extends dt{constructor(t){super(t),this.isHover=!1,this.name="control",this.timer=Date.now();const{constructor:e}=t,{$player:r,$bottom:a}=this.art.template;t.on("mousemove",()=>{p||(this.show=!0)}),t.on("click",()=>{p?this.toggle():this.show=!0}),t.on("document:mousemove",t=>{this.isHover=C(t,a)}),t.on("video:timeupdate",()=>{!t.setting.show&&!this.isHover&&!t.isInput&&t.playing&&this.show&&Date.now()-this.timer>=e.CONTROL_HIDE_TIME&&(this.show=!1)}),t.on("control",t=>{t?(g(r,"art-hide-cursor"),f(r,"art-hover"),this.timer=Date.now()):(f(r,"art-hide-cursor"),g(r,"art-hover"))}),this.init()}init(){const{option:t}=this.art;t.isLive||this.add(mt({name:"progress",position:"top",index:10})),this.add({name:"thumbnails",position:"top",index:20}),this.add(function(t){return e=>({...t,mounted:t=>{const{proxy:r,icons:a,i18n:o}=e,n=y(t,a.play),i=y(t,a.pause);function s(){w(n,"display","flex"),w(i,"display","none")}function l(){w(n,"display","none"),w(i,"display","flex")}T(n,o.get("Play")),T(i,o.get("Pause")),r(n,"click",()=>{e.play()}),r(i,"click",()=>{e.pause()}),e.playing?l():s(),e.on("video:playing",()=>{l()}),e.on("video:pause",()=>{s()})}})}({name:"playAndPause",position:"left",index:10})),this.add(function(t){return e=>({...t,mounted:t=>{const{proxy:r,icons:a}=e,o=y(t,a.volume),n=y(t,a.volumeClose),i=y(t,'
'),s=y(i,'
'),l=y(s,'
'),c=y(s,'
'),d=y(c,'
'),h=y(d,'
'),u=y(c,'
');function m(t){const{top:e,height:r}=P(c);return 1-(t.clientY-e)/r}function f(){if(e.muted||0===e.volume)w(o,"display","none"),w(n,"display","flex"),w(u,"top","100%"),w(h,"top","100%"),l.textContent=0;else{const t=100*e.volume;w(o,"display","flex"),w(n,"display","none"),w(u,"top",100-t+"%"),w(h,"top",100-t+"%"),l.textContent=Math.floor(t)}}if(f(),e.on("video:volumechange",f),r(o,"click",()=>{e.muted=!0}),r(n,"click",()=>{e.muted=!1}),p)w(i,"display","none");else{let t=!1;r(c,"mousedown",r=>{t=0===r.button,e.volume=m(r)}),e.on("document:mousemove",r=>{t&&(e.muted=!1,e.volume=m(r))}),e.on("document:mouseup",()=>{t&&(t=!1)})}}})}({name:"volume",position:"left",index:20})),t.isLive||this.add(function(t){return e=>({...t,style:p?{fontSize:"12px",padding:"0 5px"}:{cursor:"auto",padding:"0 10px"},mounted:t=>{function r(){const r=`${F(e.currentTime)} / ${F(e.duration)}`;r!==t.textContent&&(t.textContent=r)}r();const a=["video:loadedmetadata","video:timeupdate","video:progress"];for(let o=0;o{this.art.quality=t.quality}),t.screenshot&&!p&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Screenshot"),mounted:t=>{const{proxy:r,icons:a}=e;y(t,a.screenshot),r(t,"click",()=>{e.screenshot()})}})}({name:"screenshot",position:"right",index:20})),t.setting&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Show Setting"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e;y(t,a.setting),r(t,"click",()=>{e.setting.toggle(),e.setting.resize()}),e.on("setting",e=>{T(t,o.get(e?"Hide Setting":"Show Setting"))})}})}({name:"setting",position:"right",index:30})),t.pip&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("PIP Mode"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e;y(t,a.pip),r(t,"click",()=>{e.pip=!e.pip}),e.on("pip",e=>{T(t,o.get(e?"Exit PIP Mode":"PIP Mode"))})}})}({name:"pip",position:"right",index:40})),t.airplay&&window.WebKitPlaybackTargetAvailabilityEvent&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("AirPlay"),mounted:t=>{const{proxy:r,icons:a}=e;y(t,a.airplay),r(t,"click",()=>e.airplay())}})}({name:"airplay",position:"right",index:50})),t.fullscreenWeb&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Web Fullscreen"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e,n=y(t,a.fullscreenWebOn),i=y(t,a.fullscreenWebOff);w(i,"display","none"),r(t,"click",()=>{e.fullscreenWeb=!e.fullscreenWeb}),e.on("fullscreenWeb",e=>{e?(T(t,o.get("Exit Web Fullscreen")),w(n,"display","none"),w(i,"display","inline-flex")):(T(t,o.get("Web Fullscreen")),w(n,"display","inline-flex"),w(i,"display","none"))})}})}({name:"fullscreenWeb",position:"right",index:60})),t.fullscreen&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Fullscreen"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e,n=y(t,a.fullscreenOn),i=y(t,a.fullscreenOff);w(i,"display","none"),r(t,"click",()=>{e.fullscreen=!e.fullscreen}),e.on("fullscreen",e=>{e?(T(t,o.get("Exit Fullscreen")),w(n,"display","none"),w(i,"display","inline-flex")):(T(t,o.get("Fullscreen")),w(n,"display","inline-flex"),w(i,"display","none"))})}})}({name:"fullscreen",position:"right",index:70}));for(let e=0;et.selector}),H(e,"$control_item",{get:()=>r}),H(e,"$control_value",{get:()=>o})}const i=a(n,"click",async e=>{const r=R(e),a=t.selector.find(t=>t.$control_item===r.find(e=>t.$control_item===e));this.check(a),t.onSelect&&(o.innerHTML=await t.onSelect.call(this.art,a,a.$control_item,e))});r.push(i)}}function gt(t,e,r,a){const o=e-a,n=r-t;let i=0;if(Math.abs(n)<2&&Math.abs(o)<2)return i;const s=function(t,e){return 180*Math.atan2(e,t)/Math.PI}(n,o);return s>=-45&&s<45?i=4:s>=45&&s<135?i=1:s>=-135&&s<-45?i=2:(s>=135&&s<=180||s>=-180&&s<-135)&&(i=3),i}class vt{constructor(t){this.destroyEvents=new Set,this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),function(t,e){const{constructor:r,template:{$player:a,$video:o}}=t;function n(e){C(e,a)?(t.isInput="INPUT"===e.target.tagName,t.isFocus=!0,t.emit("focus",e)):(t.isInput=!1,t.isFocus=!1,t.emit("blur",e))}t.on("document:click",n),t.on("document:contextmenu",n);let i=[];e.proxy(o,"click",e=>{const a=Date.now();i.push(a);const{MOBILE_CLICK_PLAY:o,DBCLICK_TIME:n,MOBILE_DBCLICK_PLAY:s,DBCLICK_FULLSCREEN:l}=r,c=i.filter(t=>a-t<=n);switch(c.length){case 1:t.emit("click",e),p?!t.isLock&&o&&t.toggle():t.toggle(),i=c;break;case 2:t.emit("dblclick",e),p?!t.isLock&&s&&t.toggle():l&&(t.fullscreen=!t.fullscreen),i=[];break;default:i=[]}})}(t,this),function(t,e){const{$player:r}=t.template;e.hover(r,e=>{f(r,"art-hover"),t.emit("hover",!0,e)},e=>{g(r,"art-hover"),t.emit("hover",!1,e)})}(t,this),function(t,e){const{$player:r}=t.template;e.proxy(r,"mousemove",e=>{t.emit("mousemove",e)})}(t,this),function(t,e){const{option:r,constructor:a}=t;t.on("resize",()=>{const{aspectRatio:e,notice:a}=t;"standard"===t.state&&r.autoSize&&t.autoSize(),t.aspectRatio=e,a.show=""});const o=J(()=>t.emit("resize"),a.RESIZE_TIME);t.on("window:orientationchange",()=>o()),t.on("window:resize",()=>o()),screen&&screen.orientation&&screen.orientation.onchange&&e.proxy(screen.orientation,"change",()=>o())}(t,this),function(t,e){if(p&&!t.option.isLive){const{$video:r,$progress:a}=t.template;let o=null,n=!1,i=0,s=0,l=0;const c=e=>{if(1===e.touches.length&&!t.isLock){o===a&&ut(t,e),n=!0;const{pageX:r,pageY:c}=e.touches[0];i=r,s=c,l=t.currentTime}},d=e=>{if(1===e.touches.length&&n&&t.duration){const{pageX:a,pageY:n}=e.touches[0],c=gt(i,s,a,n),d=[3,4].includes(c),p=[1,2].includes(c);if(d&&!t.isRotate||p&&t.isRotate){const c=D((a-i)/t.width,-1,1),d=D((n-s)/t.height,-1,1),p=t.isRotate?d:c,h=o===r?t.constructor.TOUCH_MOVE_RATIO:1,u=D(l+t.duration*p*h,0,t.duration);t.seek=u,t.emit("setBar","played",D(u/t.duration,0,1),e),t.notice.show=`${F(u)} / ${F(t.duration)}`}}},p=()=>{n&&(i=0,s=0,l=0,n=!1,o=null)};t.option.gesture&&(e.proxy(r,"touchstart",t=>{o=r,c(t)}),e.proxy(r,"touchmove",d)),e.proxy(a,"touchstart",t=>{o=a,c(t)}),e.proxy(a,"touchmove",d),t.on("document:touchend",p)}}(t,this),function(t){const{option:e,constructor:r,template:{$container:a}}=t,o=Q(()=>{t.emit("view",E(a,r.SCROLL_GAP))},r.SCROLL_TIME);t.on("window:scroll",()=>o()),t.on("view",r=>{e.autoMini&&(t.mini=!r)})}(t),function(t,e){const r=["click","mouseup","keydown","touchend","touchmove","mousemove","pointerup","contextmenu","pointermove","visibilitychange","webkitfullscreenchange"],a=["resize","scroll","orientationchange"],o=[];function n(n={}){for(let t=0;t{const a=n.document||i.ownerDocument||document,s=e.proxy(a,r,e=>{t.emit(`document:${r}`,e)});o.push(s)}),a.forEach(r=>{const a=n.window||i.ownerDocument?.defaultView||window,s=e.proxy(a,r,e=>{t.emit(`window:${r}`,e)});o.push(s)})}n(),e.bindGlobalEvents=n}(t,this),function(t){if(t.constructor.USE_RAF){let e=null;!function r(){t.playing&&t.emit("raf"),t.isDestroy||(e=requestAnimationFrame(r))}(),t.on("destroy",()=>{cancelAnimationFrame(e)})}}(t)}proxy(t,e,r,a={}){if(Array.isArray(e))return e.map(e=>this.proxy(t,e,r,a));t.addEventListener(e,r,a);const o=()=>t.removeEventListener(e,r,a);return this.destroyEvents.add(o),o}hover(t,e,r){e&&this.proxy(t,"mouseenter",e),r&&this.proxy(t,"mouseleave",r)}remove(t){if(this.destroyEvents.has(t))try{t()}catch(e){console.warn("Failed to remove event listener:",e)}finally{this.destroyEvents.delete(t)}}destroy(){for(const e of this.destroyEvents)try{e()}catch(t){console.warn("Failed to destroy event listener:",t)}this.destroyEvents.clear()}}class yt{constructor(t){this.art=t,this.keys={},p||this.init()}init(){const{constructor:t}=this.art;this.art.option.hotkey&&(this.add("Escape",()=>{this.art.fullscreenWeb&&(this.art.fullscreenWeb=!1)}),this.add("Space",()=>{this.art.toggle()}),this.add("ArrowLeft",()=>{this.art.backward=t.SEEK_STEP}),this.add("ArrowUp",()=>{this.art.volume+=t.VOLUME_STEP}),this.add("ArrowRight",()=>{this.art.forward=t.SEEK_STEP}),this.add("ArrowDown",()=>{this.art.volume-=t.VOLUME_STEP})),this.art.on("document:keydown",t=>{if(this.art.isFocus){const e=document.activeElement.tagName.toUpperCase(),r=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==r&&"true"!==r&&!t.altKey&&!t.ctrlKey&&!t.metaKey&&!t.shiftKey){const e=this.keys[t.code];if(e){t.preventDefault();for(let r=0;r\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',state:'\n\n\n',play:'\n \n',pause:'\n \n',check:'\n\n',volume:'\n \n \n',volumeClose:'\n \n \n',screenshot:'\n\t\n\n',setting:'\n \n \n',pip:'\n\n',arrowLeft:'\n \n',arrowRight:'\n \n',playbackRate:'',aspectRatio:'',config:'',lock:'\n\n\n\n\n',flip:'\n\n\n\n\n\n',unlock:'\n\n\n',fullscreenOff:'\n\n\n\n\n',fullscreenOn:'\n\n\n\n\n',fullscreenWebOff:'\n\n\n\n\n',fullscreenWebOn:'\n\n\n\n\n',switchOn:'\n\n\n \n',switchOff:'\n\n\n \n\n',error:'\n\n\n\n\n',close:'\n\n\n\n\n',airplay:'\n \n \n \n \n\n',...t.option.icons};for(const r in e)H(this,r,{get:()=>S(r,e[r])})}}class kt extends dt{constructor(t){super(t),this.name="info",p||this.init()}init(){const{proxy:t,constructor:e,template:{$infoPanel:r,$infoClose:a,$video:o}}=this.art;t(a,"click",()=>{this.show=!1});let n=null;const i=m("[data-video]",r)||[];this.art.on("destroy",()=>clearTimeout(n)),function t(){for(let e=0;e{w(o,"display","none"),w(n,"display",null)}),a.proxy(e.$state,"click",()=>t.play())}}class Ct{constructor(t){this.art=t,this.timer=null,t.on("destroy",()=>this.destroy())}destroy(){this.timer&&(clearTimeout(this.timer),this.timer=null)}set show(t){const{constructor:e,template:{$player:r,$noticeInner:a}}=this.art;t?(a.textContent=t instanceof Error?t.message.trim():t,f(r,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout(()=>{a.textContent="",g(r,"art-notice-show")},e.NOTICE_TIME)):g(r,"art-notice-show")}get show(){const{template:{$player:t}}=this.art;return t.classList.contains("art-notice-show")}}const zt=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],Lt=(()=>{if("undefined"===typeof document)return!1;const t=zt[0],e={};for(const r of zt){if(r[1]in document){for(const[a,o]of r.entries())e[t[a]]=o;return e}}return!1})(),St={change:Lt.fullscreenchange,error:Lt.fullscreenerror},Mt={request:(t=document.documentElement,e)=>new Promise((r,a)=>{const o=()=>{Mt.off("change",o),r()};Mt.on("change",o);const n=t[Lt.requestFullscreen](e);n instanceof Promise&&n.then(o).catch(a)}),exit:()=>new Promise((t,e)=>{if(!Mt.isFullscreen)return void t();const r=()=>{Mt.off("change",r),t()};Mt.on("change",r);const a=document[Lt.exitFullscreen]();a instanceof Promise&&a.then(r).catch(e)}),toggle:(t,e)=>Mt.isFullscreen?Mt.exit():Mt.request(t,e),onchange(t){Mt.on("change",t)},onerror(t){Mt.on("error",t)},on(t,e){const r=St[t];r&&document.addEventListener(r,e,!1)},off(t,e){const r=St[t];r&&document.removeEventListener(r,e,!1)},raw:Lt};function It(t){const{i18n:e,notice:r,template:{$video:a,$player:o}}=t;t.once("video:loadedmetadata",()=>{var n;Mt.isEnabled?(n=t,Mt.on("change",()=>{n.emit("fullscreen",Mt.isFullscreen),Mt.isFullscreen?(n.state="fullscreen",f(o,"art-fullscreen")):g(o,"art-fullscreen"),n.emit("resize")}),Mt.on("error",t=>{n.emit("fullscreenError",t)}),H(n,"fullscreen",{get:()=>Mt.isFullscreen,async set(t){t?await Mt.request(o):await Mt.exit()}})):a.webkitSupportsFullscreen?(t=>{t.on("document:webkitfullscreenchange",()=>{t.emit("fullscreen",t.fullscreen),t.emit("resize")}),H(t,"fullscreen",{get:()=>document.fullscreenElement===a,set(e){e?(t.state="fullscreen",a.webkitEnterFullscreen()):a.webkitExitFullscreen()}})})(t):H(t,"fullscreen",{get:()=>!1,set(){r.show=e.get("Fullscreen Not Supported")}}),H(t,"fullscreen",U(t,"fullscreen"))})}function Pt(t){const{icons:e,proxy:r,storage:a,template:{$player:o,$video:n}}=t;let i=!1,s=0,l=0;function c(){const{$mini:e}=t.template;e&&(g(o,"art-mini"),w(e,"display","none"),o.prepend(n),t.emit("mini",!1))}function d(e,r){t.playing?(w(e,"display","none"),w(r,"display","flex")):(w(e,"display","flex"),w(r,"display","none"))}function p(){const{$mini:e}=t.template,r=P(e),o=window.innerHeight-r.height-50,n=window.innerWidth-r.width-50;a.set("top",o),a.set("left",n),w(e,"top",`${o}px`),w(e,"left",`${n}px`)}H(t,"mini",{get:()=>v(o,"art-mini"),set(h){if(h){t.state="mini",f(o,"art-mini");const h=function(){const{$mini:o}=t.template;if(o)return y(o,n),w(o,"display","flex");{const o=L("div");f(o,"art-mini-popup"),y(document.body,o),t.template.$mini=o,y(o,n);const p=y(o,'
');y(p,e.close),r(p,"click",c);const h=y(o,'
'),u=y(h,e.play),m=y(h,e.pause);return r(u,"click",()=>t.play()),r(m,"click",()=>t.pause()),d(u,m),t.on("video:playing",()=>d(u,m)),t.on("video:pause",()=>d(u,m)),t.on("video:timeupdate",()=>d(u,m)),r(o,"mousedown",t=>{i=0===t.button,s=t.pageX,l=t.pageY}),t.on("document:mousemove",t=>{if(i){f(o,"art-mini-dragging");const e=t.pageX-s,r=t.pageY-l;w(o,"transform",`translate(${e}px, ${r}px)`)}}),t.on("document:mouseup",()=>{if(i){i=!1,g(o,"art-mini-dragging");const t=P(o);a.set("left",t.left),a.set("top",t.top),w(o,"left",`${t.left}px`),w(o,"top",`${t.top}px`),w(o,"transform",null)}}),o}}(),u=a.get("top"),m=a.get("left");"number"===typeof u&&"number"===typeof m?(w(h,"top",`${u}px`),w(h,"left",`${m}px`),E(h)||p()):p(),t.emit("mini",!0)}else c()}})}function At(t){const{i18n:e,notice:r,template:{$video:a}}=t;document.pictureInPictureEnabled?function(t){const{template:{$video:e},proxy:r,notice:a}=t;e.disablePictureInPicture=!1,H(t,"pip",{get:()=>document.pictureInPictureElement,set(r){r?(t.state="pip",e.requestPictureInPicture().catch(t=>{throw a.show=t,t})):document.exitPictureInPicture().catch(t=>{throw a.show=t,t})}}),r(e,"enterpictureinpicture",()=>{t.emit("pip",!0)}),r(e,"leavepictureinpicture",()=>{t.emit("pip",!1)})}(t):a.webkitSupportsPresentationMode?function(t){const{$video:e}=t.template;e.webkitSetPresentationMode("inline"),H(t,"pip",{get:()=>"picture-in-picture"===e.webkitPresentationMode,set(r){r?(t.state="pip",e.webkitSetPresentationMode("picture-in-picture"),t.emit("pip",!0)):(e.webkitSetPresentationMode("inline"),t.emit("pip",!1))}})}(t):H(t,"pip",{get:()=>!1,set(){r.show=e.get("PIP Not Supported")}})}function Rt(t){const{option:e,template:{$progress:r,$video:a}}=t;let o=null,n=!1,i=null;t.on("setBar",async(o,s,l)=>{const c=t.controls?.thumbnails,{url:d,scale:h}=e.thumbnails;if(!c||!d)return;if("hover"===o||"played"===o&&l&&p){if(i||n||(n=!0,i=await A(d,h),n=!1),!i)return;const o=r.clientWidth*s;o>0&&or.clientWidth-h/2?w(n,"left",r.clientWidth-h+"px"):w(n,"left",o-h/2+"px")}(o)}}),H(t,"thumbnails",{get:()=>t.option.thumbnails,set(e){e.url&&!t.option.isLive&&(t.option.thumbnails=e,clearTimeout(o),o=null,n=!1,i=null)}})}Object.defineProperties(Mt,{isFullscreen:{get:()=>Boolean(document[Lt.fullscreenElement])},element:{enumerable:!0,get:()=>document[Lt.fullscreenElement]},isEnabled:{enumerable:!0,get:()=>Boolean(document[Lt.fullscreenEnabled])}});class Ot{constructor(t){!function(t){const{option:e,template:{$video:r}}=t;H(t,"url",{get:()=>r.src,async set(a){if(a){const o=t.url,n=e.type||V(a),i=e.customType[n];n&&i?(await Z(),t.loading.show=!0,i.call(t,r,a,t)):(URL.revokeObjectURL(o),r.src=a),o!==t.url&&(t.option.url=a,t.isReady&&o&&t.once("video:canplay",()=>{t.emit("restart",a)}))}else await Z(),t.loading.show=!0}})}(t),function(t){const{template:{$video:e}}=t;H(t,"attr",{value(t,r){if(void 0===r)return e[t];e[t]=r}})}(t),function(t){const{i18n:e,notice:r,option:a,constructor:{instances:o},template:{$video:n}}=t;H(t,"play",{async value(){const i=await n.play();if(r.show=e.get("Play"),t.emit("play"),a.mutex)for(let e=0;et.playing?t.pause():t.play()})}(t),function(t){const{notice:e}=t;H(t,"seek",{set(r){t.currentTime=r,t.duration&&(e.show=`${F(t.currentTime)} / ${F(t.duration)}`),t.emit("seek",t.currentTime,r)}}),H(t,"forward",{set(e){t.seek=t.currentTime+e}}),H(t,"backward",{set(e){t.seek=t.currentTime-e}})}(t),function(t){const{template:{$video:e},i18n:r,notice:a,storage:o}=t;H(t,"volume",{get:()=>e.volume||0,set:t=>{e.volume=D(t,0,1),a.show=`${r.get("Volume")}: ${Number.parseInt(100*e.volume,10)}`,0!==e.volume&&o.set("volume",e.volume)}}),H(t,"muted",{get:()=>e.muted,set:r=>{e.muted=r,t.emit("muted",r)}})}(t),function(t){const{$video:e}=t.template;H(t,"currentTime",{get:()=>e.currentTime||0,set:r=>{r=Number.parseFloat(r),Number.isNaN(r)||(e.currentTime=D(r,0,t.duration))}})}(t),function(t){H(t,"duration",{get:()=>{const{duration:e}=t.template.$video;return e===1/0?0:e||0}})}(t),function(t){function e(e,r){return new Promise((a,o)=>{if(e===t.url)return void a();const{playing:n,aspectRatio:i,playbackRate:s}=t;t.pause(),t.url=e,t.notice.show="";const l={error:e=>{t.off("video:canplay",l.canplay),t.off("video:loadedmetadata",l.metadata),o(e)},metadata:()=>{t.currentTime=r},canplay:async()=>{t.off("video:error",l.error),t.playbackRate=s,t.aspectRatio=i,n&&await t.play(),t.notice.show="",a()}};t.once("video:error",l.error),t.once("video:loadedmetadata",l.metadata),t.once("video:canplay",l.canplay)})}H(t,"switchQuality",{value:r=>e(r,t.currentTime)}),H(t,"switchUrl",{value:t=>e(t,0)}),H(t,"switch",{set:t.switchUrl})}(t),function(t){const{template:{$video:e},i18n:r,notice:a}=t;H(t,"playbackRate",{get:()=>e.playbackRate,set(o){if(o){if(o===e.playbackRate)return;e.playbackRate=o,a.show=`${r.get("Rate")}: ${1===o?r.get("Normal"):`${o}x`}`}else t.playbackRate=1}})}(t),function(t){const{i18n:e,notice:r,template:{$video:a,$player:o}}=t;H(t,"aspectRatio",{get:()=>o.dataset.aspectRatio||"default",set(n){if(n||(n="default"),"default"===n)w(a,"width",null),w(a,"height",null),w(a,"margin",null),delete o.dataset.aspectRatio;else{const t=n.split(":").map(Number),{clientWidth:e,clientHeight:r}=o,i=e/r,s=t[0]/t[1];i>s?(w(a,"width",s*r+"px"),w(a,"height","100%"),w(a,"margin","0 auto")):(w(a,"width","100%"),w(a,"height",e/s+"px"),w(a,"margin","auto 0")),o.dataset.aspectRatio=n}r.show=`${e.get("Aspect Ratio")}: ${"default"===n?e.get("Default"):n}`,t.emit("aspectRatio",n)}})}(t),function(t){const{notice:e,template:{$video:r}}=t,a=L("canvas");H(t,"getDataURL",{value:()=>new Promise((t,o)=>{try{a.width=r.videoWidth,a.height=r.videoHeight,a.getContext("2d").drawImage(r,0,0),t(a.toDataURL("image/png"))}catch(n){e.show=n,o(n)}})}),H(t,"getBlobUrl",{value:()=>new Promise((t,o)=>{try{a.width=r.videoWidth,a.height=r.videoHeight,a.getContext("2d").drawImage(r,0,0),a.toBlob(e=>{t(URL.createObjectURL(e))})}catch(n){e.show=n,o(n)}})}),H(t,"screenshot",{value:async e=>{const a=await t.getDataURL();return Y(a,`${e||`artplayer_${F(r.currentTime)}`}.png`),t.emit("screenshot",a),a}})}(t),It(t),function(t){const{constructor:e,template:{$container:r,$player:a}}=t;let o="";H(t,"fullscreenWeb",{get:()=>v(a,"art-fullscreen-web"),set(n){n?(o=a.style.cssText,e.FULLSCREEN_WEB_IN_BODY&&y(document.body,a),t.state="fullscreenWeb",w(a,"width","100%"),w(a,"height","100%"),f(a,"art-fullscreen-web"),t.emit("fullscreenWeb",!0)):(e.FULLSCREEN_WEB_IN_BODY&&y(r,a),o&&(a.style.cssText=o,o=""),g(a,"art-fullscreen-web"),t.emit("fullscreenWeb",!1)),t.emit("resize")}})}(t),At(t),function(t){const{$video:e}=t.template;H(t,"loaded",{get:()=>t.loadedTime/e.duration}),H(t,"loadedTime",{get:()=>e.buffered.length?e.buffered.end(e.buffered.length-1):0})}(t),function(t){H(t,"played",{get:()=>t.currentTime/t.duration})}(t),function(t){const{$video:e}=t.template;H(t,"playing",{get:()=>"boolean"===typeof e.playing?e.playing:!!(e.currentTime>0&&!e.paused&&!e.ended&&e.readyState>2)})}(t),function(t){const{$container:e,$player:r,$video:a}=t.template;H(t,"autoSize",{value(){const{videoWidth:o,videoHeight:n}=a,{width:i,height:s}=P(e),l=o/n;if(i/s>l)w(r,"width",s*l/i*100+"%"),w(r,"height","100%");else{const t=i/l/s*100;w(r,"width","100%"),w(r,"height",`${t}%`)}t.emit("autoSize",{width:t.width,height:t.height})}})}(t),function(t){H(t,"rect",{get:()=>P(t.template.$player)});const e=["bottom","height","left","right","top","width"];for(let r=0;rt.rect[a]})}H(t,"x",{get:()=>t.left+window.pageXOffset}),H(t,"y",{get:()=>t.top+window.pageYOffset})}(t),function(t){const{template:{$player:e},i18n:r,notice:a}=t;H(t,"flip",{get:()=>e.dataset.flip||"normal",set(o){o||(o="normal"),"normal"===o?delete e.dataset.flip:e.dataset.flip=o,a.show=`${r.get("Video Flip")}: ${r.get(N(o))}`,t.emit("flip",o)}})}(t),Pt(t),function(t){const{template:{$poster:e}}=t;H(t,"poster",{get:()=>{try{return e.style.backgroundImage.match(/"(.*)"/)[1]}catch{return""}},set(t){w(e,"backgroundImage",`url(${t})`)}})}(t),function(t){const{template:{$container:e,$video:r}}=t;H(t,"autoHeight",{value(){const{clientWidth:a}=e,{videoHeight:o,videoWidth:n}=r,i=o*(a/n);w(e,"height",`${i}px`),t.emit("autoHeight",i)}})}(t),function(t){const{$player:e}=t.template;H(t,"cssVar",{value:(t,r)=>r?e.style.setProperty(t,r):getComputedStyle(e).getPropertyValue(t)})}(t),function(t){H(t,"theme",{get:()=>t.cssVar("--art-theme"),set(e){t.cssVar("--art-theme",e)}})}(t),function(t){H(t,"type",{get:()=>t.option.type,set(e){t.option.type=e}})}(t),function(t){const e=["mini","pip","fullscreen","fullscreenWeb"];H(t,"state",{get:()=>e.find(e=>t[e])||"standard",set(r){for(let a=0;aa.$track?.offset||0,set(o){const{cues:n}=t.subtitle;if(!a.$track||0===n.length)return;const i=D(o,-10,10);a.$track.offset=i;for(let e=0;e{switch(t.availability){case"available":n=!0;break;case"not-available":n=!1}}):n=!1,H(t,"airplay",{value(){n?(o.webkitShowPlaybackTargetPicker(),t.emit("airplay")):r.show=e.get("AirPlay Not Available")}})}(t),function(t){H(t,"quality",{set(e){const{controls:r,notice:a,i18n:o}=t,n=e.find(t=>t.default)||e[0];r.update({name:"quality",position:"right",index:10,style:{marginRight:"10px"},html:n?.html||"",selector:e,onSelect:async e=>(await t.switchQuality(e.url),a.show=`${o.get("Switch Video")}: ${e.html}`,e.html)})}})}(t),Rt(t),function(t){const{i18n:e,notice:r,option:a,constructor:o,proxy:n,template:{$player:s,$video:l,$poster:c}}=t;let d=0;for(let p=0;p{t.emit(`video:${e.type}`,e)});t.on("video:canplay",()=>{d=0,t.loading.show=!1}),t.once("video:canplay",()=>{t.loading.show=!1,t.controls.show=!0,t.mask.show=!0,t.isReady=!0,t.emit("ready")}),t.on("video:ended",()=>{a.loop?(t.seek=0,t.play(),t.controls.show=!1,t.mask.show=!1):(t.controls.show=!0,t.mask.show=!0)}),t.on("video:error",async n=>{d{t.emit("resize"),p&&(t.loading.show=!1,t.controls.show=!0,t.mask.show=!0)}),t.on("video:loadstart",()=>{t.loading.show=!0,t.mask.show=!1,t.controls.show=!0}),t.on("video:pause",()=>{t.controls.show=!0,t.mask.show=!0}),t.on("video:play",()=>{t.mask.show=!1,w(c,"display","none")}),t.on("video:playing",()=>{t.mask.show=!1}),t.on("video:progress",()=>{t.playing&&(t.loading.show=!1)}),t.on("video:seeked",()=>{t.loading.show=!1,t.mask.show=!0}),t.on("video:seeking",()=>{t.loading.show=!0,t.mask.show=!1}),t.on("video:timeupdate",()=>{t.mask.show=!1}),t.on("video:waiting",()=>{t.loading.show=!0,t.mask.show=!1})}(t),function(t){const{option:e,storage:r,template:{$video:a,$poster:o}}=t;for(const i in e.moreVideoAttr)t.attr(i,e.moreVideoAttr[i]);e.muted&&(t.muted=e.muted),e.volume&&(a.volume=D(e.volume,0,1));const n=r.get("volume");"number"===typeof n&&(a.volume=D(n,0,1)),e.poster&&w(o,"backgroundImage",`url(${e.poster})`),e.autoplay&&(a.autoplay=e.autoplay),e.playsInline&&(a.playsInline=!0,a["webkit-playsinline"]=!0),e.theme&&(e.cssVar["--art-theme"]=e.theme);for(const i in e.cssVar)t.cssVar(i,e.cssVar[i]);t.url=e.url}(t)}}function _t(t){const{notice:e,constructor:r,template:{$player:a,$video:o}}=t,n="art-auto-orientation",i="art-auto-orientation-fullscreen";let s=!1;function l(){const{videoWidth:t,videoHeight:e}=o,r=document.documentElement.clientWidth,a=document.documentElement.clientHeight;return t>e&&ra}return t.on("fullscreenWeb",e=>{if(e){if(l()){const e=Number(r.AUTO_ORIENTATION_TIME??0);setTimeout(()=>{t.fullscreenWeb&&!v(a,n)&&function(){const e=document.documentElement.clientWidth,r=document.documentElement.clientHeight;w(a,"width",`${r}px`),w(a,"height",`${e}px`),w(a,"transform-origin","0 0"),w(a,"transform",`rotate(90deg) translate(0, -${e}px)`),f(a,n),t.isRotate=!0,t.emit("resize")}()},e)}}else v(a,n)&&(w(a,"width",""),w(a,"height",""),w(a,"transform-origin",""),w(a,"transform",""),g(a,n),t.isRotate=!1,t.emit("resize"))}),t.on("fullscreen",async t=>{const r=!!screen?.orientation?.lock;if(t){if(r&&l())try{const t=screen.orientation.type.startsWith("portrait")?"landscape":"portrait";await screen.orientation.lock(t),s=!0,f(a,i)}catch(o){s=!1,e.show=o}}else if(v(a,i)&&g(a,i),r&&s){try{screen.orientation.unlock()}catch{}s=!1}}),{name:"autoOrientation",get state(){return v(a,n)}}}function Vt(t){const{i18n:e,icons:r,storage:a,constructor:o,proxy:n,template:{$poster:i}}=t,s=t.layers.add({name:"auto-playback",html:'\n
\n
\n
\n '}),l=u(".art-auto-playback-last",s),c=u(".art-auto-playback-jump",s),d=u(".art-auto-playback-close",s);y(d,r.close);let p=null;function h(){const r=(a.get("times")||{})[t.option.id||t.option.url];clearTimeout(p),w(s,"display","none"),r&&r>=o.AUTO_PLAYBACK_MIN&&(w(s,"display","flex"),l.textContent=`${e.get("Last Seen")} ${F(r)}`,c.textContent=e.get("Jump Play"),n(d,"click",()=>{w(s,"display","none")}),n(c,"click",()=>{t.seek=r,t.play(),w(i,"display","none"),w(s,"display","none")}),t.once("video:timeupdate",()=>{p=setTimeout(()=>{w(s,"display","none")},o.AUTO_PLAYBACK_TIMEOUT)}))}return t.on("video:timeupdate",()=>{if(t.playing){const e=a.get("times")||{},r=Object.keys(e);r.length>o.AUTO_PLAYBACK_MAX&&delete e[r[0]],e[t.option.id||t.option.url]=t.currentTime,a.set("times",e)}}),t.on("ready",h),t.on("restart",h),{name:"auto-playback",get times(){return a.get("times")||{}},clear:()=>a.del("times"),delete(t){const e=a.get("times")||{};return delete e[t],a.set("times",e),e}}}function Yt(t){const{constructor:e,proxy:r,template:{$player:a,$video:o}}=t;let n=null,i=!1,s=1;const l=()=>{clearTimeout(n),i&&(i=!1,t.playbackRate=s,g(a,"art-fast-forward"))};return r(o,"touchstart",r=>{1===r.touches.length&&t.playing&&!t.isLock&&(n=setTimeout(()=>{i=!0,s=t.playbackRate,t.playbackRate=e.FAST_FORWARD_VALUE,f(a,"art-fast-forward")},e.FAST_FORWARD_TIME))}),t.on("document:touchmove",l),t.on("document:touchend",l),{name:"fastForward",get state(){return v(a,"art-fast-forward")}}}function Dt(t){const{layers:e,icons:r,template:{$player:a}}=t;function o(){return v(a,"art-lock")}function n(){f(a,"art-lock"),t.isLock=!0,t.emit("lock",!0)}function i(){g(a,"art-lock"),t.isLock=!1,t.emit("lock",!1)}return e.add({name:"lock",mounted(e){const a=y(e,r.lock),o=y(e,r.unlock);w(a,"display","none"),t.on("lock",t=>{t?(w(a,"display","inline-flex"),w(o,"display","none")):(w(a,"display","none"),w(o,"display","inline-flex"))})},click(){o()?i():n()}}),{name:"lock",get state(){return o()},set state(t){t?n():i()}}}function Nt(t){return t.on("control",e=>{e?g(t.template.$player,"art-mini-progress-bar"):f(t.template.$player,"art-mini-progress-bar")}),{name:"mini-progress-bar"}}class Ft{constructor(t){this.art=t,this.id=0;const{option:e}=t;e.miniProgressBar&&!e.isLive&&this.add(Nt),e.lock&&p&&this.add(Dt),e.autoPlayback&&!e.isLive&&this.add(Vt),e.autoOrientation&&p&&this.add(_t),e.fastForward&&p&&!e.isLive&&this.add(Yt);for(let r=0;rthis.next(t,e)):this.next(t,e)}next(t,e){const r=e&&e.name||t.name||`plugin${this.id}`;return _(!j(this,r),`Cannot add a plugin that already has the same name: ${r}`),H(this,r,{value:e}),this}}class Bt extends dt{constructor(t){super(t);const{option:e,controls:r,template:{$setting:a}}=t;this.name="setting",this.$parent=a,this.id=0,this.active=null,this.cache=new Map,this.option=[...this.builtin,...e.settings],e.setting&&(this.format(),this.render(),t.on("blur",()=>{this.show&&(this.show=!1,this.render())}),t.on("focus",t=>{const e=C(t,r.setting),a=C(t,this.$parent);!this.show||e||a||(this.show=!1,this.render())}),t.on("resize",()=>this.resize()))}get builtin(){const t=[],{option:e}=this.art;return e.playbackRate&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:a,PLAYBACK_RATE:o}}=t;function n(t){return 1===t?e.get("Normal"):t.toFixed(1)}function i(){const e=t.setting.find(`playback-rate-${t.playbackRate}`);t.setting.check(e)}return{width:a,name:"playback-rate",html:e.get("Play Speed"),tooltip:n(t.playbackRate),icon:r.playbackRate,selector:o.map(e=>({value:e,name:`playback-rate-${e}`,default:e===t.playbackRate,html:n(e)})),onSelect:e=>(t.playbackRate=e.value,e.html),mounted:()=>{i(),t.on("video:ratechange",()=>i())}}}(this.art)),e.aspectRatio&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:a,ASPECT_RATIO:o}}=t;function n(t){return"default"===t?e.get("Default"):t}function i(){const e=t.setting.find(`aspect-ratio-${t.aspectRatio}`);t.setting.check(e)}return{width:a,name:"aspect-ratio",html:e.get("Aspect Ratio"),icon:r.aspectRatio,tooltip:n(t.aspectRatio),selector:o.map(e=>({value:e,name:`aspect-ratio-${e}`,default:e===t.aspectRatio,html:n(e)})),onSelect:e=>(t.aspectRatio=e.value,e.html),mounted:()=>{i(),t.on("aspectRatio",()=>i())}}}(this.art)),e.flip&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:a,FLIP:o}}=t;function n(t){return e.get(N(t))}function i(){const e=t.setting.find(`flip-${t.flip}`);t.setting.check(e)}return{width:a,name:"flip",html:e.get("Video Flip"),tooltip:n(t.flip),icon:r.flip,selector:o.map(e=>({value:e,name:`flip-${e}`,default:e===t.flip,html:n(e)})),onSelect:e=>(t.flip=e.value,e.html),mounted:()=>{i(),t.on("flip",()=>i())}}}(this.art)),e.subtitleOffset&&t.push(function(t){const{i18n:e,icons:r,constructor:a}=t;return{width:a.SETTING_ITEM_WIDTH,name:"subtitle-offset",html:e.get("Subtitle Offset"),icon:r.subtitle,tooltip:"0s",range:[0,-10,10,.1],onChange:e=>(t.subtitleOffset=e.range[0],`${e.range[0]}s`),mounted:(e,r)=>{t.on("subtitleOffset",t=>{r.$range.value=t,r.tooltip=`${t}s`})}}}(this.art)),t}traverse(t,e=this.option){for(let r=0;r{e.default=e===t,e.default&&e.$item&&$(e.$item,"art-current")},t.$option),this.render(t.$parents))}format(t=this.option,e,r,a=[]){for(let o=0;oe}),H(n,"$parents",{get:()=>r}),H(n,"$option",{get:()=>t});const a=[];H(n,"$events",{get:()=>a}),H(n,"$formatted",{get:()=>!0})}this.format(n.selector||[],n,t,a)}this.option=t}find(t=""){let e=null;return this.traverse(r=>{r.name===t&&(e=r)}),e}resize(){const{controls:t,constructor:{SETTING_WIDTH:e,SETTING_ITEM_HEIGHT:r},template:{$player:a,$setting:o}}=this.art;if(t.setting&&this.show){const n=this.active[0]?.$parent?.width||e,{left:i,width:s}=P(t.setting),{left:l,width:c}=P(a),d=i-l+s/2-n/2;if(w(o,"height",`${this.active===this.option?this.active.length*r:(this.active.length+1)*r}px`),w(o,"width",`${n}px`),this.art.isRotate||p)return;d+n>c?(w(o,"left",null),w(o,"right",null)):(w(o,"left",`${d}px`),w(o,"right","auto"))}}inactivate(t){for(let e=0;e'),s=L("div");f(s,"art-setting-item-left-icon"),y(s,a),y(i,s),y(i,t.$parent.html);const l=r(n,"click",()=>this.render(t.$parents));t.$parent.$events.push(l),y(e,n)}createItem(t,e=!1){if(!this.cache.has(t.$option))return;const r=this.cache.get(t.$option),a=t.$item;let o="selector";j(t,"switch")&&(o="switch"),j(t,"range")&&(o="range"),j(t,"onClick")&&(o="button");const{icons:n,proxy:i,constructor:s}=this.art,l=L("div");f(l,"art-setting-item"),w(l,"height",`${s.SETTING_ITEM_HEIGHT}px`),l.dataset.name=t.name||"",l.dataset.value=t.value||"";const c=y(l,'
'),d=y(l,'
'),p=L("div");switch(f(p,"art-setting-item-left-icon"),o){case"button":case"switch":case"range":y(p,t.icon||n.config);break;case"selector":t.selector?.length?y(p,t.icon||n.config):y(p,n.check)}y(c,p),H(t,"$icon",{configurable:!0,get:()=>p}),H(t,"icon",{configurable:!0,get:()=>p.innerHTML,set(t){p.innerHTML="",y(p,t)}});const h=L("div");f(h,"art-setting-item-left-text"),y(h,t.html||""),y(c,h),H(t,"$html",{configurable:!0,get:()=>h}),H(t,"html",{configurable:!0,get:()=>h.innerHTML,set(t){h.innerHTML="",y(h,t)}});const u=L("div");switch(f(u,"art-setting-item-right-tooltip"),y(u,t.tooltip||""),y(d,u),H(t,"$tooltip",{configurable:!0,get:()=>u}),H(t,"tooltip",{configurable:!0,get:()=>u.innerHTML,set(t){u.innerHTML="",y(u,t)}}),o){case"switch":{const e=L("div");f(e,"art-setting-item-right-icon");const r=y(e,n.switchOn),a=y(e,n.switchOff);w(t.switch?a:r,"display","none"),y(d,e),H(t,"$switch",{configurable:!0,get:()=>e});let o=t.switch;H(t,"switch",{configurable:!0,get:()=>o,set(t){o=t,t?(w(a,"display","none"),w(r,"display",null)):(w(a,"display",null),w(r,"display","none"))}});break}case"range":{const e=L("div");f(e,"art-setting-item-right-icon");const r=y(e,'');r.value=t.range[0],r.min=t.range[1],r.max=t.range[2],r.step=t.range[3],f(r,"art-setting-range"),y(d,e),H(t,"$range",{configurable:!0,get:()=>r});let a=[...t.range];H(t,"range",{configurable:!0,get:()=>a,set(t){a=[...t],r.value=t[0],r.min=t[1],r.max=t[2],r.step=t[3]}})}break;case"selector":if(t.selector?.length){const t=L("div");f(t,"art-setting-item-right-icon"),y(t,n.arrowRight),y(d,t)}}switch(o){case"switch":if(t.onSwitch){const e=i(l,"click",async e=>{t.switch=await t.onSwitch.call(this.art,t,l,e)});t.$events.push(e)}break;case"range":if(t.$range){if(t.onRange){const e=i(t.$range,"change",async e=>{t.range[0]=t.$range.valueAsNumber,t.tooltip=await t.onRange.call(this.art,t,l,e)});t.$events.push(e)}if(t.onChange){const e=i(t.$range,"input",async e=>{t.range[0]=t.$range.valueAsNumber,t.tooltip=await t.onChange.call(this.art,t,l,e)});t.$events.push(e)}}break;case"selector":{const e=i(l,"click",async e=>{t.selector?.length?this.render(t.selector):(this.check(t),t.$parent.onSelect&&(t.$parent.tooltip=await t.$parent.onSelect.call(this.art,t,l,e)))});t.$events.push(e),t.default&&f(l,"art-current")}break;case"button":if(t.onClick){const e=i(l,"click",async e=>{t.tooltip=await t.onClick.call(this.art,t,l,e)});t.$events.push(e)}}H(t,"$item",{configurable:!0,get:()=>l}),e?z(l,a):y(r,l),t.mounted&&setTimeout(()=>t.mounted.call(this.art,t.$item,t),0)}render(t=this.option){if(this.active=t,this.cache.has(t)){$(this.cache.get(t),"art-current")}else{const e=L("div");this.cache.set(t,e),f(e,"art-setting-panel"),y(this.$parent,e),$(e,"art-current"),t[0]?.$parent&&this.createHeader(t[0]);for(let r=0;rnull,this.init(t.option.subtitle);let e=!1;t.on("video:timeupdate",()=>{if(!this.url)return;const t=this.art.template.$video.webkitDisplayingFullscreen;"boolean"===typeof t&&t!==e&&(e=t,this.createTrack(t?"subtitles":"metadata",this.url))})}get url(){return this.art.template.$track.src}set url(t){this.switch(t)}get textTrack(){return this.art.template.$video?.textTracks?.[0]}get activeCues(){return this.textTrack?Array.from(this.textTrack.activeCues):[]}get cues(){return this.textTrack?Array.from(this.textTrack.cues):[]}style(t,e){const{$subtitle:r}=this.art.template;return"object"===typeof t?x(r,t):w(r,t,e)}update(){const{option:{subtitle:t},template:{$subtitle:e}}=this.art;e.innerHTML="",this.activeCues.length&&(this.art.emit("subtitleBeforeUpdate",this.activeCues),e.innerHTML=this.activeCues.map((e,r)=>e.text.split(/\r?\n/).filter(t=>t.trim()).map(e=>`
\n ${t.escape?B(e):e}\n
`).join("")).join(""),this.art.emit("subtitleAfterUpdate",this.activeCues))}async switch(t,e={}){const{i18n:r,notice:a,option:o}=this.art,n={...o.subtitle,...e,url:t},i=await this.init(n);return e.name&&(a.show=`${r.get("Switch Subtitle")}: ${e.name}`),i}createTrack(t,e){const{template:r,proxy:a,option:o}=this.art,{$video:n,$track:i}=r,s=L("track");s.default=!0,s.kind=t,s.src=e,s.label=o.subtitle.name||"Artplayer",s.track.mode="hidden",s.onload=()=>{this.art.emit("subtitleLoad",this.cues,this.option)},this.art.events.remove(this.destroyEvent),i.onload=null,b(i),y(n,s),r.$track=s,this.destroyEvent=a(this.textTrack,"cuechange",()=>this.update())}async init(t){const{notice:e,template:{$subtitle:r}}=this.art;return this.textTrack?(o(t,ct.subtitle),t.url?(this.option=t,this.style(t.style),fetch(t.url).then(t=>t.arrayBuffer()).then(e=>{const r=new TextDecoder(t.encoding).decode(e);switch(t.type||V(t.url)){case"srt":{const e=X(r);return G(t.onVttLoad(e))}case"ass":{const e=K(r);return G(t.onVttLoad(e))}case"vtt":return G(t.onVttLoad(r));default:return t.url}}).then(t=>(r.innerHTML="",this.url===t||(URL.revokeObjectURL(this.url),this.createTrack("metadata",t)),t)).catch(t=>{throw r.innerHTML="",e.show=t,t})):void 0):null}}class Ut{constructor(t){this.art=t;const{option:e,constructor:r}=t;e.container instanceof Element?this.$container=e.container:(this.$container=u(e.container),_(this.$container,`No container element found by ${e.container}`)),_(I(),"The current browser does not support flex layout");const a=this.$container.tagName.toLowerCase();_("div"===a,`Unsupported container element type, only support 'div' but got '${a}'`),_(r.instances.every(t=>t.template.$container!==this.$container),"Cannot mount multiple instances on the same dom element"),this.query=this.query.bind(this),this.$container.dataset.artId=t.id,this.init()}static get html(){return`\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
Player version:
\n
${n}
\n
\n
\n
Video url:
\n
\n
\n
\n
Video volume:
\n
\n
\n
\n
Video time:
\n
\n
\n
\n
Video duration:
\n
\n
\n
\n
Video resolution:
\n
\n x \n
\n
\n
\n
[x]
\n
\n
\n
\n `}query(t){return u(t,this.$container)}init(){const{option:t}=this.art;if(t.useSSR||(this.$container.innerHTML=Ut.html),this.$player=this.query(".art-video-player"),this.$video=this.query(".art-video"),this.$track=this.query("track"),this.$poster=this.query(".art-poster"),this.$subtitle=this.query(".art-subtitle"),this.$danmuku=this.query(".art-danmuku"),this.$bottom=this.query(".art-bottom"),this.$progress=this.query(".art-progress"),this.$controls=this.query(".art-controls"),this.$controlsLeft=this.query(".art-controls-left"),this.$controlsCenter=this.query(".art-controls-center"),this.$controlsRight=this.query(".art-controls-right"),this.$layer=this.query(".art-layers"),this.$loading=this.query(".art-loading"),this.$notice=this.query(".art-notice"),this.$noticeInner=this.query(".art-notice-inner"),this.$mask=this.query(".art-mask"),this.$state=this.query(".art-state"),this.$setting=this.query(".art-settings"),this.$info=this.query(".art-info"),this.$infoPanel=this.query(".art-info-panel"),this.$infoClose=this.query(".art-info-close"),this.$contextmenu=this.query(".art-contextmenus"),t.proxy){const e=t.proxy.call(this.art,this.art);_(e instanceof HTMLVideoElement||e instanceof HTMLCanvasElement,"Function 'option.proxy' needs to return 'HTMLVideoElement' or 'HTMLCanvasElement'"),z(e,this.$video),e.className="art-video",this.$video=e}t.backdrop&&f(this.$player,"art-backdrop"),p&&f(this.$player,"art-mobile")}destroy(t){t?this.$container.innerHTML="":f(this.$player,"art-destroy")}}class qt{on(t,e,r){const a=this.e||(this.e={});return(a[t]||(a[t]=[])).push({fn:e,ctx:r}),this}once(t,e,r){const a=this;function o(...n){a.off(t,o),e.apply(r,n)}return o._=e,this.on(t,o,r)}emit(t,...e){const r=((this.e||(this.e={}))[t]||[]).slice();for(let a=0;ae.call(this,this)),Kt.DEBUG){const t=t=>console.log(`[ART.${this.id}] -> ${t}`);t(`Version@${Kt.version}`);for(let e=0;et(`Event@${e.type}`))}Gt.push(this)}static get instances(){return Gt}static get version(){return n}static get config(){return i}static get utils(){return tt}static get scheme(){return ct}static get Emitter(){return qt}static get validator(){return o}static get kindOf(){return o.kindOf}static get html(){return Ut.html}static get option(){return{id:"",container:"#artplayer",url:"",poster:"",type:"",theme:"#f00",volume:.7,isLive:!1,muted:!1,autoplay:!1,autoSize:!1,autoMini:!1,loop:!1,flip:!1,playbackRate:!1,aspectRatio:!1,screenshot:!1,setting:!1,hotkey:!0,pip:!1,mutex:!0,backdrop:!0,fullscreen:!1,fullscreenWeb:!1,subtitleOffset:!1,miniProgressBar:!1,useSSR:!1,playsInline:!0,lock:!1,gesture:!0,fastForward:!1,autoPlayback:!1,autoOrientation:!1,airplay:!1,proxy:void 0,layers:[],contextmenu:[],controls:[],settings:[],quality:[],highlight:[],plugins:[],thumbnails:{url:"",number:60,column:10,width:0,height:0,scale:1},subtitle:{url:"",type:"",style:{},name:"",escape:!0,encoding:"utf-8",onVttLoad:t=>t},moreVideoAttr:{controls:!1,preload:l?"auto":"metadata"},i18n:{},icons:{},cssVar:{},customType:{},lang:navigator?.language.toLowerCase()}}get proxy(){return this.events.proxy}get query(){return this.template.query}get video(){return this.template.$video}reset(){this.video.removeAttribute("src"),this.video.load()}destroy(t=!0){Kt.REMOVE_SRC_WHEN_DESTROY&&this.reset(),this.events.destroy(),this.template.destroy(t),Gt.splice(Gt.indexOf(this),1),this.isDestroy=!0,this.emit("destroy")}}return Kt.STYLE=Wt,Kt.DEBUG=!1,Kt.CONTEXTMENU=!0,Kt.NOTICE_TIME=2e3,Kt.SETTING_WIDTH=250,Kt.SETTING_ITEM_WIDTH=200,Kt.SETTING_ITEM_HEIGHT=35,Kt.RESIZE_TIME=200,Kt.SCROLL_TIME=200,Kt.SCROLL_GAP=50,Kt.AUTO_PLAYBACK_MAX=10,Kt.AUTO_PLAYBACK_MIN=5,Kt.AUTO_PLAYBACK_TIMEOUT=3e3,Kt.RECONNECT_TIME_MAX=5,Kt.RECONNECT_SLEEP_TIME=1e3,Kt.CONTROL_HIDE_TIME=3e3,Kt.DBCLICK_TIME=300,Kt.DBCLICK_FULLSCREEN=!0,Kt.MOBILE_DBCLICK_PLAY=!0,Kt.MOBILE_CLICK_PLAY=!1,Kt.AUTO_ORIENTATION_TIME=200,Kt.INFO_LOOP_TIME=1e3,Kt.FAST_FORWARD_VALUE=3,Kt.FAST_FORWARD_TIME=1e3,Kt.TOUCH_MOVE_RATIO=.5,Kt.VOLUME_STEP=.1,Kt.SEEK_STEP=5,Kt.PLAYBACK_RATE=[.5,.75,1,1.25,1.5,2],Kt.ASPECT_RATIO=["default","4:3","16:9"],Kt.FLIP=["normal","horizontal","vertical"],Kt.FULLSCREEN_WEB_IN_BODY=!0,Kt.LOG_VERSION=!0,Kt.USE_RAF=!1,Kt.REMOVE_SRC_WHEN_DESTROY=!0,h&&(M("artplayer-style",Wt),setTimeout(()=>{Kt.LOG_VERSION&&console.log(`%c ArtPlayer %c ${Kt.version} %c https://artplayer.org`,"color: #fff; background: #5f5f5f","color: #fff; background: #4bc729","")},100)),Kt}); +!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.Artplayer=e(),define(function(){return t.Artplayer})):(t="undefined"!==typeof globalThis?globalThis:t||self).Artplayer=e()}(this,function(){"use strict";function t(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var e,r={exports:{}};var a=(e||(e=1,r.exports=function(){function t(e){return(t="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})(e)}var e=Object.prototype.toString,r=function(r){if(void 0===r)return"undefined";if(null===r)return"null";var o=t(r);if("boolean"===o)return"boolean";if("string"===o)return"string";if("number"===o)return"number";if("symbol"===o)return"symbol";if("function"===o)return"GeneratorFunction"===a(r)?"generatorfunction":"function";if(function(t){return Array.isArray?Array.isArray(t):t instanceof Array}(r))return"array";if(function(t){return!(!t.constructor||"function"!=typeof t.constructor.isBuffer)&&t.constructor.isBuffer(t)}(r))return"buffer";if(function(t){try{if("number"==typeof t.length&&"function"==typeof t.callee)return!0}catch(e){if(-1!==e.message.indexOf("callee"))return!0}return!1}(r))return"arguments";if(function(t){return t instanceof Date||"function"==typeof t.toDateString&&"function"==typeof t.getDate&&"function"==typeof t.setDate}(r))return"date";if(function(t){return t instanceof Error||"string"==typeof t.message&&t.constructor&&"number"==typeof t.constructor.stackTraceLimit}(r))return"error";if(function(t){return t instanceof RegExp||"string"==typeof t.flags&&"boolean"==typeof t.ignoreCase&&"boolean"==typeof t.multiline&&"boolean"==typeof t.global}(r))return"regexp";switch(a(r)){case"Symbol":return"symbol";case"Promise":return"promise";case"WeakMap":return"weakmap";case"WeakSet":return"weakset";case"Map":return"map";case"Set":return"set";case"Int8Array":return"int8array";case"Uint8Array":return"uint8array";case"Uint8ClampedArray":return"uint8clampedarray";case"Int16Array":return"int16array";case"Uint16Array":return"uint16array";case"Int32Array":return"int32array";case"Uint32Array":return"uint32array";case"Float32Array":return"float32array";case"Float64Array":return"float64array"}if(function(t){return"function"==typeof t.throw&&"function"==typeof t.return&&"function"==typeof t.next}(r))return"generator";switch(o=e.call(r)){case"[object Object]":return"object";case"[object Map Iterator]":return"mapiterator";case"[object Set Iterator]":return"setiterator";case"[object String Iterator]":return"stringiterator";case"[object Array Iterator]":return"arrayiterator"}return o.slice(8,-1).toLowerCase().replace(/\s/g,"")};function a(t){return t.constructor?t.constructor.name:null}function o(t,e){var a=2=1,p=/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(s)||d,h="undefined"!==typeof window&&"undefined"!==typeof document;function u(t,e=document){return e.querySelector(t)}function m(t,e=document){return Array.from(e.querySelectorAll(t))}function f(t,e){return t.classList.add(e)}function g(t,e){return t.classList.remove(e)}function v(t,e){return t.classList.contains(e)}function y(t,e){return e instanceof Element?t.appendChild(e):t.insertAdjacentHTML("beforeend",String(e)),t.lastElementChild||t.lastChild}function b(t){return t.parentNode.removeChild(t)}function w(t,e,r){return t.style[e]=r,t}function x(t,e){for(const r in e)w(t,r,e[r]);return t}function k(t){return Array.from(t.parentElement.children).filter(e=>e!==t)}function $(t,e){k(t).forEach(t=>g(t,e)),f(t,e)}function T(t,e,r="top"){p||(t.setAttribute("aria-label",e),f(t,"hint--rounded"),f(t,`hint--${r}`))}function E(t,e=0){const r=t.getBoundingClientRect(),a=window.innerHeight||document.documentElement.clientHeight,o=window.innerWidth||document.documentElement.clientWidth,n=r.top-e<=a&&r.top+r.height+e>=0,i=r.left-e<=o+e&&r.left+r.width+e>=0;return n&&i}function C(t,e){return R(t).includes(e)}function z(t,e){return e.parentNode.replaceChild(t,e),t}function L(t){return document.createElement(t)}function S(t="",e=""){const r=L("i");return f(r,"art-icon"),f(r,`art-icon-${t}`),y(r,e),r}function M(t,e){let r=document.getElementById(t);r||(r=document.createElement("style"),r.id=t,"loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>{document.head.appendChild(r)}):(document.head||document.documentElement).appendChild(r)),r.textContent=e}function I(){const t=document.createElement("div");return t.style.display="flex","flex"===t.style.display}function A(t){return t.getBoundingClientRect()}function P(t,e){return new Promise((r,a)=>{const o=new Image;o.onload=function(){if(e&&1!==e){const n=document.createElement("canvas"),i=n.getContext("2d");n.width=o.width*e,n.height=o.height*e,i.drawImage(o,0,0,n.width,n.height),n.toBlob(e=>{const o=URL.createObjectURL(e),n=new Image;n.onload=function(){r(n)},n.onerror=function(){URL.revokeObjectURL(o),a(new Error(`Image load failed: ${t}`))},n.src=o})}else r(o)},o.onerror=function(){a(new Error(`Image load failed: ${t}`))},o.src=t})}function R(t){if(t.composedPath)return t.composedPath();const e=[];let r=t.target;for(;r;)e.push(r),r=r.parentNode;return e.includes(window)||void 0===window||e.push(window),e}function O(){const t=document.createElement("div");t.style.cssText="position:fixed;top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);pointer-events:none;visibility:hidden;",document.body.appendChild(t);const e=getComputedStyle(t),r={top:Number.parseFloat(e.top)||0,right:Number.parseFloat(e.right)||0,bottom:Number.parseFloat(e.bottom)||0,left:Number.parseFloat(e.left)||0};return t.remove(),r}class _ extends Error{constructor(t,e){super(t),"function"===typeof Error.captureStackTrace&&Error.captureStackTrace(this,e||this.constructor),this.name="ArtPlayerError"}}function V(t,e){if(!t)throw new _(e);return t}function Y(t){return t.includes("?")?Y(t.split("?")[0]):t.includes("#")?Y(t.split("#")[0]):t.trim().toLowerCase().split(".").pop()}function N(t,e){const r=document.createElement("a");r.style.display="none",r.href=t,r.download=e,document.body.appendChild(r),r.click(),document.body.removeChild(r)}function D(t,e,r){return Math.max(Math.min(t,Math.max(e,r)),Math.min(e,r))}function F(t){return t.charAt(0).toUpperCase()+t.slice(1)}function B(t){if(!t)return"00:00";const e=Math.floor(t/3600),r=Math.floor((t-3600*e)/60),a=Math.floor(t-3600*e-60*r);return(e>0?[e,r,a]:[r,a]).map(t=>t<10?`0${t}`:String(t)).join(":")}function H(t){return t.replace(/[&<>'"]/g,t=>({"&":"&","<":"<",">":">","'":"'",'"':"""}[t]||t))}const W=Object.defineProperty,{hasOwnProperty:j}=Object.prototype;function U(t,e){return j.call(t,e)}function q(t,e){return Object.getOwnPropertyDescriptor(t,e)}function X(...t){const e=t=>t&&"object"===typeof t&&!Array.isArray(t);return t.reduce((t,r)=>(Object.keys(r).forEach(a=>{const o=t[a],n=r[a];Array.isArray(o)&&Array.isArray(n)?t[a]=o.concat(...n):e(o)&&e(n)?t[a]=X(o,n):t[a]=n}),t),{})}function G(t){return"WEBVTT \r\n\r\n".concat((e=t,e.replace(/(\d\d:\d\d:\d\d)[,.](\d+)/g,(t,e,r)=>{let a=r.slice(0,3);return 1===r.length&&(a=`${r}00`),2===r.length&&(a=`${r}0`),`${e},${a}`})).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").replace(/\{[\s\S]*?\}/g,"").concat("\r\n\r\n"));var e}function K(t){return URL.createObjectURL(new Blob([t],{type:"text/vtt"}))}function Z(t){const e=new RegExp("Dialogue:\\s\\d,(\\d+:\\d\\d:\\d\\d.\\d\\d),(\\d+:\\d\\d:\\d\\d.\\d\\d),([^,]*),([^,]*),(?:[^,]*,){4}([\\s\\S]*)$","i");function r(t=""){return t.split(/[:.]/).map((t,e,r)=>{if(e===r.length-1){if(1===t.length)return`.${t}00`;if(2===t.length)return`.${t}0`}else if(1===t.length)return(0===e?"0":":0")+t;return 0===e?t:e===r.length-1?`.${t}`:`:${t}`}).join("")}return`WEBVTT\n\n${t.split(/\r?\n/).map(t=>{const a=t.match(e);return a?{start:r(a[1].trim()),end:r(a[2].trim()),text:a[5].replace(/\{[\s\S]*?\}/g,"").replace(/(\\N)/g,"\n").trim().split(/\r?\n/).map(t=>t.trim()).join("\n")}:null}).filter(t=>t).map((t,e)=>t?`${e+1}\n${t.start} --\x3e ${t.end}\n${t.text}`:"").filter(t=>t.trim()).join("\n\n")}`}function J(t=0){return new Promise(e=>setTimeout(e,t))}function Q(t,e){let r;return function(...a){clearTimeout(r),r=setTimeout(()=>(r=null,t.apply(this,a)),e)}}function tt(t,e){let r=!1;return function(...a){r||(t.apply(this,a),r=!0,setTimeout(()=>{r=!1},e))}}const et=Object.freeze(Object.defineProperty({__proto__:null,ArtPlayerError:_,addClass:f,append:y,assToVtt:Z,capitalize:F,clamp:D,createElement:L,debounce:Q,def:W,download:N,errorHandle:V,escape:H,get:q,getComposedPath:R,getExt:Y,getIcon:S,getRect:A,getSafeAreaInsets:O,getStyle:function(t,e,r=!0){const a=window.getComputedStyle(t,null).getPropertyValue(e);return r?Number.parseFloat(a):a},has:U,hasClass:v,includeFromEvent:C,inverseClass:$,isBrowser:h,isIOS:c,isIOS13:d,isInViewport:E,isMobile:p,isSafari:l,loadImg:P,mergeDeep:X,query:u,queryAll:m,remove:b,removeClass:g,replaceElement:z,secondToTime:B,setStyle:w,setStyleText:M,setStyles:x,siblings:k,sleep:J,srtToVtt:G,supportsFlex:I,throttle:tt,tooltip:T,unescape:function(t){const e={"&":"&","<":"<",">":">","'":"'",""":'"'},r=new RegExp(`(${Object.keys(e).join("|")})`,"g");return t.replace(r,t=>e[t]||t)},userAgent:s,vttToBlob:K},Symbol.toStringTag,{value:"Module"})),rt="array",at="boolean",ot="string",nt="number",it="object",st="function";function lt(t,e,r){return V(e===ot||e===nt||t instanceof Element,`${r.join(".")} require '${ot}' or 'Element' type`)}const ct={html:lt,disable:`?${at}`,name:`?${ot}`,index:`?${nt}`,style:`?${it}`,click:`?${st}`,mounted:`?${st}`,tooltip:`?${ot}|${nt}`,width:`?${nt}`,selector:`?${rt}`,onSelect:`?${st}`,switch:`?${at}`,onSwitch:`?${st}`,range:`?${rt}`,onRange:`?${st}`,onChange:`?${st}`},dt={id:ot,container:lt,url:ot,poster:ot,type:ot,theme:ot,lang:ot,volume:nt,isLive:at,muted:at,autoplay:at,autoSize:at,autoMini:at,loop:at,flip:at,playbackRate:at,aspectRatio:at,screenshot:at,setting:at,hotkey:at,pip:at,mutex:at,backdrop:at,fullscreen:at,fullscreenWeb:at,subtitleOffset:at,miniProgressBar:at,useSSR:at,playsInline:at,lock:at,gesture:at,fastForward:at,autoPlayback:at,autoOrientation:at,airplay:at,proxy:`?${st}`,plugins:[st],layers:[ct],contextmenu:[ct],settings:[ct],controls:[{...ct,position:(t,e,r)=>{const a=["top","left","right"];return V(a.includes(t),`${r.join(".")} only accept ${a.toString()} as parameters`)}}],quality:[{default:`?${at}`,html:ot,url:ot}],highlight:[{time:nt,text:ot}],thumbnails:{url:ot,number:nt,column:nt,width:nt,height:nt,scale:nt},subtitle:{url:ot,name:ot,type:ot,style:it,escape:at,encoding:ot,onVttLoad:st},moreVideoAttr:it,i18n:it,icons:it,cssVar:it,customType:it};class pt{constructor(t){this.id=0,this.art=t,this.cache=new Map,this.add=this.add.bind(this),this.remove=this.remove.bind(this),this.update=this.update.bind(this)}get show(){return v(this.art.template.$player,`art-${this.name}-show`)}set show(t){const{$player:e}=this.art.template,r=`art-${this.name}-show`;t?f(e,r):g(e,r),this.art.emit(this.name,t)}toggle(){this.show=!this.show}add(t){const e="function"===typeof t?t(this.art):t;if(e.html=e.html||"",o(e,ct),!this.$parent||!this.name||e.disable)return;const r=e.name||`${this.name}${this.id}`;V(!this.cache.has(r),`Can't add an existing [${r}] to the [${this.name}]`),this.id+=1;const a=L("div");f(a,`art-${this.name}`),f(a,`art-${this.name}-${r}`);const n=Array.from(this.$parent.children);a.dataset.index=e.index||this.id;const i=n.find(t=>Number(t.dataset.index)>=Number(a.dataset.index));i?i.insertAdjacentElement("beforebegin",a):y(this.$parent,a),e.html&&y(a,e.html),e.style&&x(a,e.style),e.tooltip&&T(a,e.tooltip);const s=[];if(e.click){const t=this.art.events.proxy(a,"click",t=>{t.preventDefault(),e.click.call(this.art,this,t)});s.push(t)}return e.selector&&["left","right"].includes(e.position)&&this.selector(e,a,s),this[r]=a,this.cache.set(r,{$ref:a,events:s,option:e}),e.mounted&&e.mounted.call(this.art,a),a}remove(t){V(this.cache.has(t),`Can't find [${t}] from the [${this.name}]`);const e=this.cache.get(t);e.option.beforeUnmount&&e.option.beforeUnmount.call(this.art,e.$ref);for(const r of e.events)this.art.events.remove(r);this.cache.delete(t),delete this[t],b(e.$ref)}update(t){if(this.cache.has(t.name)){const e=this.cache.get(t.name);t=Object.assign(e.option,t),this.remove(t.name)}return this.add(t)}}class ht extends pt{constructor(t){super(t),this.name="contextmenu",this.$parent=t.template.$contextmenu,p||this.init()}init(){const{option:t,proxy:e,template:{$player:r,$contextmenu:a}}=this.art;t.playbackRate&&this.add(function(t){return e=>{const{i18n:r,constructor:{PLAYBACK_RATE:a}}=e,o=a.map(t=>`${1===t?r.get("Normal"):t.toFixed(1)}`).join("");return{...t,html:`${r.get("Play Speed")}: ${o}`,click:(t,r)=>{const{value:a}=r.target.dataset;a&&(e.playbackRate=Number(a),t.show=!1)},mounted:t=>{const r=u('[data-value="1"]',t);r&&$(r,"art-current"),e.on("video:ratechange",()=>{const r=m("span",t).find(t=>Number(t.dataset.value)===e.playbackRate);r&&$(r,"art-current")})}}}}({name:"playbackRate",index:10})),t.aspectRatio&&this.add(function(t){return e=>{const{i18n:r,constructor:{ASPECT_RATIO:a}}=e,o=a.map(t=>`${"default"===t?r.get("Default"):t}`).join("");return{...t,html:`${r.get("Aspect Ratio")}: ${o}`,click:(t,r)=>{const{value:a}=r.target.dataset;a&&(e.aspectRatio=a,t.show=!1)},mounted:t=>{const r=u('[data-value="default"]',t);r&&$(r,"art-current"),e.on("aspectRatio",e=>{const r=m("span",t).find(t=>t.dataset.value===e);r&&$(r,"art-current")})}}}}({name:"aspectRatio",index:20})),t.flip&&this.add(function(t){return e=>{const{i18n:r,constructor:{FLIP:a}}=e,o=a.map(t=>`${r.get(F(t))}`).join("");return{...t,html:`${r.get("Video Flip")}: ${o}`,click:(t,r)=>{const{value:a}=r.target.dataset;a&&(e.flip=a.toLowerCase(),t.show=!1)},mounted:t=>{const r=u('[data-value="normal"]',t);r&&$(r,"art-current"),e.on("flip",e=>{const r=m("span",t).find(t=>t.dataset.value===e);r&&$(r,"art-current")})}}}}({name:"flip",index:30})),this.add(function(t){return e=>({...t,html:e.i18n.get("Video Info"),click:t=>{e.info.show=!0,t.show=!1}})}({name:"info",index:40})),this.add(function(t){const e=h?location.href:"";return{...t,html:`ArtPlayer ${n}`}}({name:"version",index:50})),this.add(function(t){return e=>({...t,html:e.i18n.get("Close"),click:t=>{t.show=!1}})}({name:"close",index:60}));for(let o=0;o{if(!this.art.constructor.CONTEXTMENU)return;t.preventDefault(),this.show=!0;const e=t.clientX,o=t.clientY,{height:n,width:i,left:s,top:l}=A(r),{height:c,width:d}=A(a);let p=e-s,h=o-l;e+d>s+i&&(p=i-d),o+c>l+n&&(h=n-c),x(a,{top:`${h}px`,left:`${p}px`})}),e(r,"click",t=>{C(t,a)||(this.show=!1)}),this.art.on("blur",()=>{this.show=!1})}}function ut(t,e){const{$progress:r}=t.template,{left:a}=A(r),o=D((p?e.touches[0].clientX:e.clientX)-a,0,r.clientWidth),n=o/r.clientWidth*t.duration;return{second:n,time:B(n),width:o,percentage:D(o/r.clientWidth,0,1)}}function mt(t,e){if(t.isRotate){const r=e.touches[0].clientY/t.height,a=r*t.duration;t.emit("setBar","played",r,e),t.seek=a}else{const{second:r,percentage:a}=ut(t,e);t.emit("setBar","played",a,e),t.seek=r}}function ft(t){return e=>{const{icons:r,option:a,proxy:o}=e,{$player:n,$progress:i}=e.template;return{...t,html:'\n
\n
\n
\n
\n
\n
\n
00:00
\n
\n ',mounted:t=>{let s=null,l=!1;const c=u(".art-progress-hover",t),d=u(".art-progress-loaded",t),h=u(".art-progress-played",t),m=u(".art-progress-highlight",t),v=u(".art-progress-indicator",t),b=u(".art-progress-tip",t);function x(r,a){const{width:o,time:n}=a||ut(e,r);b.textContent=n||"00:00";const i=b.clientWidth;o<=i/2?w(b,"left",0):o>t.clientWidth-i/2?w(b,"left",t.clientWidth-i+"px"):w(b,"left",o-i/2+"px")}r.indicator?y(v,r.indicator):w(v,"backgroundColor","var(--art-theme)"),e.on("setBar",function(r,a,o){const i="played"===r&&o&&p;if("loaded"===r&&w(d,"width",100*a+"%"),"hover"===r&&(w(c,"width",100*a+"%"),C(o,m)?function(r){const{width:a}=ut(e,r),{text:o}=r.target.dataset;b.textContent=o;const n=b.clientWidth;a<=n/2?w(b,"left",0):a>t.clientWidth-n/2?w(b,"left",t.clientWidth-n+"px"):w(b,"left",a-n/2+"px")}(o):x(o),0===a?g(n,"art-progress-hover"):f(n,"art-progress-hover")),"played"===r&&(w(h,"width",100*a+"%"),w(v,"left",100*a+"%")),i){f(n,"art-progress-hover");x(o,{width:t.clientWidth*a,time:B(a*e.duration)}),clearTimeout(s),s=setTimeout(()=>{g(n,"art-progress-hover")},500)}}),e.on("video:loadedmetadata",function(){m.textContent="";for(let t=0;t`;y(m,n)}}),e.constructor.USE_RAF?e.on("raf",()=>{e.emit("setBar","played",e.played),e.emit("setBar","loaded",e.loaded)}):(e.on("video:timeupdate",()=>{e.emit("setBar","played",e.played)}),e.on("video:progress",()=>{e.emit("setBar","loaded",e.loaded)}),e.on("video:ended",()=>{e.emit("setBar","played",1)})),e.emit("setBar","loaded",e.loaded||0),p||(o(i,"click",t=>{t.target!==v&&mt(e,t)}),o(i,"mousemove",t=>{const{percentage:r}=ut(e,t);e.emit("setBar","hover",r,t)}),o(i,"mouseleave",t=>{e.emit("setBar","hover",0,t)}),o(i,"mousedown",t=>{l=0===t.button}),e.on("document:mousemove",t=>{if(l){const{second:r,percentage:a}=ut(e,t);e.emit("setBar","played",a,t),e.seek=r}}),e.on("document:mouseup",()=>{l&&(l=!1)}))}}}}class gt extends pt{constructor(t){super(t),this.isHover=!1,this.name="control",this.timer=Date.now();const{constructor:e}=t,{$player:r,$bottom:a}=this.art.template;t.on("mousemove",()=>{p||(this.show=!0)}),t.on("click",()=>{p?this.toggle():this.show=!0}),t.on("document:mousemove",t=>{this.isHover=C(t,a)}),t.on("video:timeupdate",()=>{!t.setting.show&&!this.isHover&&!t.isInput&&t.playing&&this.show&&Date.now()-this.timer>=e.CONTROL_HIDE_TIME&&(this.show=!1)}),t.on("control",t=>{t?(g(r,"art-hide-cursor"),f(r,"art-hover"),this.timer=Date.now()):(f(r,"art-hide-cursor"),g(r,"art-hover"))}),this.init()}init(){const{option:t}=this.art;t.isLive||this.add(ft({name:"progress",position:"top",index:10})),this.add({name:"thumbnails",position:"top",index:20}),this.add(function(t){return e=>({...t,mounted:t=>{const{proxy:r,icons:a,i18n:o}=e,n=y(t,a.play),i=y(t,a.pause);function s(){w(n,"display","flex"),w(i,"display","none")}function l(){w(n,"display","none"),w(i,"display","flex")}T(n,o.get("Play")),T(i,o.get("Pause")),r(n,"click",()=>{e.play()}),r(i,"click",()=>{e.pause()}),e.playing?l():s(),e.on("video:playing",()=>{l()}),e.on("video:pause",()=>{s()})}})}({name:"playAndPause",position:"left",index:10})),this.add(function(t){return e=>({...t,mounted:t=>{const{proxy:r,icons:a}=e,o=y(t,a.volume),n=y(t,a.volumeClose),i=y(t,'
'),s=y(i,'
'),l=y(s,'
'),c=y(s,'
'),d=y(c,'
'),h=y(d,'
'),u=y(c,'
');function m(t){const{top:e,height:r}=A(c);return 1-(t.clientY-e)/r}function f(){if(e.muted||0===e.volume)w(o,"display","none"),w(n,"display","flex"),w(u,"top","100%"),w(h,"top","100%"),l.textContent=0;else{const t=100*e.volume;w(o,"display","flex"),w(n,"display","none"),w(u,"top",100-t+"%"),w(h,"top",100-t+"%"),l.textContent=Math.floor(t)}}if(f(),e.on("video:volumechange",f),r(o,"click",()=>{e.muted=!0}),r(n,"click",()=>{e.muted=!1}),p)w(i,"display","none");else{let t=!1;r(c,"mousedown",r=>{t=0===r.button,e.volume=m(r)}),e.on("document:mousemove",r=>{t&&(e.muted=!1,e.volume=m(r))}),e.on("document:mouseup",()=>{t&&(t=!1)})}}})}({name:"volume",position:"left",index:20})),t.isLive||this.add(function(t){return e=>({...t,style:p?{fontSize:"12px",padding:"0 5px"}:{cursor:"auto",padding:"0 10px"},mounted:t=>{function r(){const r=`${B(e.currentTime)} / ${B(e.duration)}`;r!==t.textContent&&(t.textContent=r)}r();const a=["video:loadedmetadata","video:timeupdate","video:progress"];for(let o=0;o{this.art.quality=t.quality}),t.screenshot&&!p&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Screenshot"),mounted:t=>{const{proxy:r,icons:a}=e;y(t,a.screenshot),r(t,"click",()=>{e.screenshot()})}})}({name:"screenshot",position:"right",index:20})),t.setting&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Show Setting"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e;y(t,a.setting),r(t,"click",()=>{e.setting.toggle(),e.setting.resize()}),e.on("setting",e=>{T(t,o.get(e?"Hide Setting":"Show Setting"))})}})}({name:"setting",position:"right",index:30})),t.pip&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("PIP Mode"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e;y(t,a.pip),r(t,"click",()=>{e.pip=!e.pip}),e.on("pip",e=>{T(t,o.get(e?"Exit PIP Mode":"PIP Mode"))})}})}({name:"pip",position:"right",index:40})),t.airplay&&window.WebKitPlaybackTargetAvailabilityEvent&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("AirPlay"),mounted:t=>{const{proxy:r,icons:a}=e;y(t,a.airplay),r(t,"click",()=>e.airplay())}})}({name:"airplay",position:"right",index:50})),t.fullscreenWeb&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Web Fullscreen"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e,n=y(t,a.fullscreenWebOn),i=y(t,a.fullscreenWebOff);w(i,"display","none"),r(t,"click",()=>{e.fullscreenWeb=!e.fullscreenWeb}),e.on("fullscreenWeb",e=>{e?(T(t,o.get("Exit Web Fullscreen")),w(n,"display","none"),w(i,"display","inline-flex")):(T(t,o.get("Web Fullscreen")),w(n,"display","inline-flex"),w(i,"display","none"))})}})}({name:"fullscreenWeb",position:"right",index:60})),t.fullscreen&&this.add(function(t){return e=>({...t,tooltip:e.i18n.get("Fullscreen"),mounted:t=>{const{proxy:r,icons:a,i18n:o}=e,n=y(t,a.fullscreenOn),i=y(t,a.fullscreenOff);w(i,"display","none"),r(t,"click",()=>{e.fullscreen=!e.fullscreen}),e.on("fullscreen",e=>{e?(T(t,o.get("Exit Fullscreen")),w(n,"display","none"),w(i,"display","inline-flex")):(T(t,o.get("Fullscreen")),w(n,"display","inline-flex"),w(i,"display","none"))})}})}({name:"fullscreen",position:"right",index:70}));for(let e=0;et.selector}),W(e,"$control_item",{get:()=>r}),W(e,"$control_value",{get:()=>o})}const i=a(n,"click",async e=>{const r=R(e),a=t.selector.find(t=>t.$control_item===r.find(e=>t.$control_item===e));this.check(a),t.onSelect&&(o.innerHTML=await t.onSelect.call(this.art,a,a.$control_item,e))});r.push(i)}}function vt(t,e,r,a){const o=e-a,n=r-t;let i=0;if(Math.abs(n)<2&&Math.abs(o)<2)return i;const s=function(t,e){return 180*Math.atan2(e,t)/Math.PI}(n,o);return s>=-45&&s<45?i=4:s>=45&&s<135?i=1:s>=-135&&s<-45?i=2:(s>=135&&s<=180||s>=-180&&s<-135)&&(i=3),i}class yt{constructor(t){this.destroyEvents=new Set,this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),function(t,e){const{constructor:r,template:{$player:a,$video:o}}=t;function n(e){C(e,a)?(t.isInput="INPUT"===e.target.tagName,t.isFocus=!0,t.emit("focus",e)):(t.isInput=!1,t.isFocus=!1,t.emit("blur",e))}t.on("document:click",n),t.on("document:contextmenu",n);let i=[];e.proxy(o,"click",e=>{const a=Date.now();i.push(a);const{MOBILE_CLICK_PLAY:o,DBCLICK_TIME:n,MOBILE_DBCLICK_PLAY:s,DBCLICK_FULLSCREEN:l}=r,c=i.filter(t=>a-t<=n);switch(c.length){case 1:t.emit("click",e),p?!t.isLock&&o&&t.toggle():t.toggle(),i=c;break;case 2:t.emit("dblclick",e),p?!t.isLock&&s&&t.toggle():l&&(t.fullscreen=!t.fullscreen),i=[];break;default:i=[]}})}(t,this),function(t,e){const{$player:r}=t.template;e.hover(r,e=>{f(r,"art-hover"),t.emit("hover",!0,e)},e=>{g(r,"art-hover"),t.emit("hover",!1,e)})}(t,this),function(t,e){const{$player:r}=t.template;e.proxy(r,"mousemove",e=>{t.emit("mousemove",e)})}(t,this),function(t,e){const{option:r,constructor:a}=t;t.on("resize",()=>{const{aspectRatio:e,notice:a}=t;"standard"===t.state&&r.autoSize&&t.autoSize(),t.aspectRatio=e,a.show=""});const o=Q(()=>t.emit("resize"),a.RESIZE_TIME);t.on("window:orientationchange",()=>o()),t.on("window:resize",()=>o()),screen&&screen.orientation&&screen.orientation.onchange&&e.proxy(screen.orientation,"change",()=>o())}(t,this),function(t,e){if(p&&!t.option.isLive){const{$video:r,$progress:a}=t.template;let o=null,n=!1,i=0,s=0,l=0;const c=e=>{if(1===e.touches.length&&!t.isLock){o===a&&mt(t,e),n=!0;const{pageX:r,pageY:c}=e.touches[0];i=r,s=c,l=t.currentTime}},d=e=>{if(1===e.touches.length&&n&&t.duration){const{pageX:a,pageY:n}=e.touches[0],c=vt(i,s,a,n),d=[3,4].includes(c),p=[1,2].includes(c);if(d&&!t.isRotate||p&&t.isRotate){const c=D((a-i)/t.width,-1,1),d=D((n-s)/t.height,-1,1),p=t.isRotate?d:c,h=o===r?t.constructor.TOUCH_MOVE_RATIO:1,u=D(l+t.duration*p*h,0,t.duration);t.seek=u,t.emit("setBar","played",D(u/t.duration,0,1),e),t.notice.show=`${B(u)} / ${B(t.duration)}`}}},p=()=>{n&&(i=0,s=0,l=0,n=!1,o=null)};t.option.gesture&&(e.proxy(r,"touchstart",t=>{o=r,c(t)}),e.proxy(r,"touchmove",d)),e.proxy(a,"touchstart",t=>{o=a,c(t)}),e.proxy(a,"touchmove",d),t.on("document:touchend",p)}}(t,this),function(t){const{option:e,constructor:r,template:{$container:a}}=t,o=tt(()=>{t.emit("view",E(a,r.SCROLL_GAP))},r.SCROLL_TIME);t.on("window:scroll",()=>o()),t.on("view",r=>{e.autoMini&&(t.mini=!r)})}(t),function(t,e){const r=["click","mouseup","keydown","touchend","touchmove","mousemove","pointerup","contextmenu","pointermove","visibilitychange","webkitfullscreenchange"],a=["resize","scroll","orientationchange"],o=[];function n(n={}){for(let t=0;t{const a=n.document||i.ownerDocument||document,s=e.proxy(a,r,e=>{t.emit(`document:${r}`,e)});o.push(s)}),a.forEach(r=>{const a=n.window||i.ownerDocument?.defaultView||window,s=e.proxy(a,r,e=>{t.emit(`window:${r}`,e)});o.push(s)})}n(),e.bindGlobalEvents=n}(t,this),function(t){if(t.constructor.USE_RAF){let e=null;!function r(){t.playing&&t.emit("raf"),t.isDestroy||(e=requestAnimationFrame(r))}(),t.on("destroy",()=>{cancelAnimationFrame(e)})}}(t)}proxy(t,e,r,a={}){if(Array.isArray(e))return e.map(e=>this.proxy(t,e,r,a));t.addEventListener(e,r,a);const o=()=>t.removeEventListener(e,r,a);return this.destroyEvents.add(o),o}hover(t,e,r){e&&this.proxy(t,"mouseenter",e),r&&this.proxy(t,"mouseleave",r)}remove(t){if(this.destroyEvents.has(t))try{t()}catch(e){console.warn("Failed to remove event listener:",e)}finally{this.destroyEvents.delete(t)}}destroy(){for(const e of this.destroyEvents)try{e()}catch(t){console.warn("Failed to destroy event listener:",t)}this.destroyEvents.clear()}}class bt{constructor(t){this.art=t,this.keys={},p||this.init()}init(){const{constructor:t}=this.art;this.art.option.hotkey&&(this.add("Escape",()=>{this.art.fullscreenWeb&&(this.art.fullscreenWeb=!1)}),this.add("Space",()=>{this.art.toggle()}),this.add("ArrowLeft",()=>{this.art.backward=t.SEEK_STEP}),this.add("ArrowUp",()=>{this.art.volume+=t.VOLUME_STEP}),this.add("ArrowRight",()=>{this.art.forward=t.SEEK_STEP}),this.add("ArrowDown",()=>{this.art.volume-=t.VOLUME_STEP})),this.art.on("document:keydown",t=>{if(this.art.isFocus){const e=document.activeElement.tagName.toUpperCase(),r=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==r&&"true"!==r&&!t.altKey&&!t.ctrlKey&&!t.metaKey&&!t.shiftKey){const e=this.keys[t.code];if(e){t.preventDefault();for(let r=0;r\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',state:'\n\n\n',play:'\n \n',pause:'\n \n',check:'\n\n',volume:'\n \n \n',volumeClose:'\n \n \n',screenshot:'\n\t\n\n',setting:'\n \n \n',pip:'\n\n',arrowLeft:'\n \n',arrowRight:'\n \n',playbackRate:'',aspectRatio:'',config:'',lock:'\n\n\n\n\n',flip:'\n\n\n\n\n\n',unlock:'\n\n\n',fullscreenOff:'\n\n\n\n\n',fullscreenOn:'\n\n\n\n\n',fullscreenWebOff:'\n\n\n\n\n',fullscreenWebOn:'\n\n\n\n\n',switchOn:'\n\n\n \n',switchOff:'\n\n\n \n\n',error:'\n\n\n\n\n',close:'\n\n\n\n\n',airplay:'\n \n \n \n \n\n',...t.option.icons};for(const r in e)W(this,r,{get:()=>S(r,e[r])})}}class $t extends pt{constructor(t){super(t),this.name="info",p||this.init()}init(){const{proxy:t,constructor:e,template:{$infoPanel:r,$infoClose:a,$video:o}}=this.art;t(a,"click",()=>{this.show=!1});let n=null;const i=m("[data-video]",r)||[];this.art.on("destroy",()=>clearTimeout(n)),function t(){for(let e=0;e{w(o,"display","none"),w(n,"display",null)}),a.proxy(e.$state,"click",()=>t.play())}}class zt{constructor(t){this.art=t,this.timer=null,t.on("destroy",()=>this.destroy())}destroy(){this.timer&&(clearTimeout(this.timer),this.timer=null)}set show(t){const{constructor:e,template:{$player:r,$noticeInner:a}}=this.art;t?(a.textContent=t instanceof Error?t.message.trim():t,f(r,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout(()=>{a.textContent="",g(r,"art-notice-show")},e.NOTICE_TIME)):g(r,"art-notice-show")}get show(){const{template:{$player:t}}=this.art;return t.classList.contains("art-notice-show")}}const Lt=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],St=(()=>{if("undefined"===typeof document)return!1;const t=Lt[0],e={};for(const r of Lt){if(r[1]in document){for(const[a,o]of r.entries())e[t[a]]=o;return e}}return!1})(),Mt={change:St.fullscreenchange,error:St.fullscreenerror},It={request:(t=document.documentElement,e)=>new Promise((r,a)=>{const o=()=>{It.off("change",o),r()};It.on("change",o);const n=t[St.requestFullscreen](e);n instanceof Promise&&n.then(o).catch(a)}),exit:()=>new Promise((t,e)=>{if(!It.isFullscreen)return void t();const r=()=>{It.off("change",r),t()};It.on("change",r);const a=document[St.exitFullscreen]();a instanceof Promise&&a.then(r).catch(e)}),toggle:(t,e)=>It.isFullscreen?It.exit():It.request(t,e),onchange(t){It.on("change",t)},onerror(t){It.on("error",t)},on(t,e){const r=Mt[t];r&&document.addEventListener(r,e,!1)},off(t,e){const r=Mt[t];r&&document.removeEventListener(r,e,!1)},raw:St};function At(t){const{i18n:e,notice:r,template:{$video:a,$player:o}}=t;t.once("video:loadedmetadata",()=>{var n;It.isEnabled?(n=t,It.on("change",()=>{n.emit("fullscreen",It.isFullscreen),It.isFullscreen?(n.state="fullscreen",f(o,"art-fullscreen")):g(o,"art-fullscreen"),n.emit("resize")}),It.on("error",t=>{n.emit("fullscreenError",t)}),W(n,"fullscreen",{get:()=>It.isFullscreen,async set(t){t?await It.request(o):await It.exit()}})):a.webkitSupportsFullscreen?(t=>{t.on("document:webkitfullscreenchange",()=>{t.emit("fullscreen",t.fullscreen),t.emit("resize")}),W(t,"fullscreen",{get:()=>document.fullscreenElement===a,set(e){e?(t.state="fullscreen",a.webkitEnterFullscreen()):a.webkitExitFullscreen()}})})(t):W(t,"fullscreen",{get:()=>!1,set(){r.show=e.get("Fullscreen Not Supported")}}),W(t,"fullscreen",q(t,"fullscreen"))})}function Pt(t){const{icons:e,proxy:r,storage:a,template:{$player:o,$video:n}}=t;let i=!1,s=0,l=0;function c(){const{$mini:e}=t.template;e&&(g(o,"art-mini"),w(e,"display","none"),o.prepend(n),t.emit("mini",!1))}function d(e,r){t.playing?(w(e,"display","none"),w(r,"display","flex")):(w(e,"display","flex"),w(r,"display","none"))}function p(){const{$mini:e}=t.template,r=A(e),o=window.innerHeight-r.height-50,n=window.innerWidth-r.width-50;a.set("top",o),a.set("left",n),w(e,"top",`${o}px`),w(e,"left",`${n}px`)}W(t,"mini",{get:()=>v(o,"art-mini"),set(h){if(h){t.state="mini",f(o,"art-mini");const h=function(){const{$mini:o}=t.template;if(o)return y(o,n),w(o,"display","flex");{const o=L("div");f(o,"art-mini-popup"),y(document.body,o),t.template.$mini=o,y(o,n);const p=y(o,'
');y(p,e.close),r(p,"click",c);const h=y(o,'
'),u=y(h,e.play),m=y(h,e.pause);return r(u,"click",()=>t.play()),r(m,"click",()=>t.pause()),d(u,m),t.on("video:playing",()=>d(u,m)),t.on("video:pause",()=>d(u,m)),t.on("video:timeupdate",()=>d(u,m)),r(o,"mousedown",t=>{i=0===t.button,s=t.pageX,l=t.pageY}),t.on("document:mousemove",t=>{if(i){f(o,"art-mini-dragging");const e=t.pageX-s,r=t.pageY-l;w(o,"transform",`translate(${e}px, ${r}px)`)}}),t.on("document:mouseup",()=>{if(i){i=!1,g(o,"art-mini-dragging");const t=A(o);a.set("left",t.left),a.set("top",t.top),w(o,"left",`${t.left}px`),w(o,"top",`${t.top}px`),w(o,"transform",null)}}),o}}(),u=a.get("top"),m=a.get("left");"number"===typeof u&&"number"===typeof m?(w(h,"top",`${u}px`),w(h,"left",`${m}px`),E(h)||p()):p(),t.emit("mini",!0)}else c()}})}function Rt(t){const{i18n:e,notice:r,template:{$video:a}}=t;document.pictureInPictureEnabled?function(t){const{template:{$video:e},proxy:r,notice:a}=t;e.disablePictureInPicture=!1,W(t,"pip",{get:()=>document.pictureInPictureElement,set(r){r?(t.state="pip",e.requestPictureInPicture().catch(t=>{throw a.show=t,t})):document.exitPictureInPicture().catch(t=>{throw a.show=t,t})}}),r(e,"enterpictureinpicture",()=>{t.emit("pip",!0)}),r(e,"leavepictureinpicture",()=>{t.emit("pip",!1)})}(t):a.webkitSupportsPresentationMode?function(t){const{$video:e}=t.template;e.webkitSetPresentationMode("inline"),W(t,"pip",{get:()=>"picture-in-picture"===e.webkitPresentationMode,set(r){r?(t.state="pip",e.webkitSetPresentationMode("picture-in-picture"),t.emit("pip",!0)):(e.webkitSetPresentationMode("inline"),t.emit("pip",!1))}})}(t):W(t,"pip",{get:()=>!1,set(){r.show=e.get("PIP Not Supported")}})}function Ot(t){const{option:e,template:{$progress:r,$video:a}}=t;let o=null,n=!1,i=null;t.on("setBar",async(o,s,l)=>{const c=t.controls?.thumbnails,{url:d,scale:h}=e.thumbnails;if(!c||!d)return;if("hover"===o||"played"===o&&l&&p){if(i||n||(n=!0,i=await P(d,h),n=!1),!i)return;const o=r.clientWidth*s;o>0&&or.clientWidth-h/2?w(n,"left",r.clientWidth-h+"px"):w(n,"left",o-h/2+"px")}(o)}}),W(t,"thumbnails",{get:()=>t.option.thumbnails,set(e){e.url&&!t.option.isLive&&(t.option.thumbnails=e,clearTimeout(o),o=null,n=!1,i=null)}})}Object.defineProperties(It,{isFullscreen:{get:()=>Boolean(document[St.fullscreenElement])},element:{enumerable:!0,get:()=>document[St.fullscreenElement]},isEnabled:{enumerable:!0,get:()=>Boolean(document[St.fullscreenEnabled])}});class _t{constructor(t){!function(t){const{option:e,template:{$video:r}}=t;W(t,"url",{get:()=>r.src,async set(a){if(a){const o=t.url,n=e.type||Y(a),i=e.customType[n];n&&i?(await J(),t.loading.show=!0,i.call(t,r,a,t)):(URL.revokeObjectURL(o),r.src=a),o!==t.url&&(t.option.url=a,t.isReady&&o&&t.once("video:canplay",()=>{t.emit("restart",a)}))}else await J(),t.loading.show=!0}})}(t),function(t){const{template:{$video:e}}=t;W(t,"attr",{value(t,r){if(void 0===r)return e[t];e[t]=r}})}(t),function(t){const{i18n:e,notice:r,option:a,constructor:{instances:o},template:{$video:n}}=t;W(t,"play",{async value(){const i=await n.play();if(r.show=e.get("Play"),t.emit("play"),a.mutex)for(let e=0;et.playing?t.pause():t.play()})}(t),function(t){const{notice:e}=t;W(t,"seek",{set(r){t.currentTime=r,t.duration&&(e.show=`${B(t.currentTime)} / ${B(t.duration)}`),t.emit("seek",t.currentTime,r)}}),W(t,"forward",{set(e){t.seek=t.currentTime+e}}),W(t,"backward",{set(e){t.seek=t.currentTime-e}})}(t),function(t){const{template:{$video:e},i18n:r,notice:a,storage:o}=t;W(t,"volume",{get:()=>e.volume||0,set:t=>{e.volume=D(t,0,1),a.show=`${r.get("Volume")}: ${Number.parseInt(100*e.volume,10)}`,0!==e.volume&&o.set("volume",e.volume)}}),W(t,"muted",{get:()=>e.muted,set:r=>{e.muted=r,t.emit("muted",r)}})}(t),function(t){const{$video:e}=t.template;W(t,"currentTime",{get:()=>e.currentTime||0,set:r=>{r=Number.parseFloat(r),Number.isNaN(r)||(e.currentTime=D(r,0,t.duration))}})}(t),function(t){W(t,"duration",{get:()=>{const{duration:e}=t.template.$video;return e===1/0?0:e||0}})}(t),function(t){function e(e,r){return new Promise((a,o)=>{if(e===t.url)return void a();const{playing:n,aspectRatio:i,playbackRate:s}=t;t.pause(),t.url=e,t.notice.show="";const l={error:e=>{t.off("video:canplay",l.canplay),t.off("video:loadedmetadata",l.metadata),o(e)},metadata:()=>{t.currentTime=r},canplay:async()=>{t.off("video:error",l.error),t.playbackRate=s,t.aspectRatio=i,n&&await t.play(),t.notice.show="",a()}};t.once("video:error",l.error),t.once("video:loadedmetadata",l.metadata),t.once("video:canplay",l.canplay)})}W(t,"switchQuality",{value:r=>e(r,t.currentTime)}),W(t,"switchUrl",{value:t=>e(t,0)}),W(t,"switch",{set:t.switchUrl})}(t),function(t){const{template:{$video:e},i18n:r,notice:a}=t;W(t,"playbackRate",{get:()=>e.playbackRate,set(o){if(o){if(o===e.playbackRate)return;e.playbackRate=o,a.show=`${r.get("Rate")}: ${1===o?r.get("Normal"):`${o}x`}`}else t.playbackRate=1}})}(t),function(t){const{i18n:e,notice:r,template:{$video:a,$player:o}}=t;W(t,"aspectRatio",{get:()=>o.dataset.aspectRatio||"default",set(n){if(n||(n="default"),"default"===n)w(a,"width",null),w(a,"height",null),w(a,"margin",null),delete o.dataset.aspectRatio;else{const t=n.split(":").map(Number),{clientWidth:e,clientHeight:r}=o,i=e/r,s=t[0]/t[1];i>s?(w(a,"width",s*r+"px"),w(a,"height","100%"),w(a,"margin","0 auto")):(w(a,"width","100%"),w(a,"height",e/s+"px"),w(a,"margin","auto 0")),o.dataset.aspectRatio=n}r.show=`${e.get("Aspect Ratio")}: ${"default"===n?e.get("Default"):n}`,t.emit("aspectRatio",n)}})}(t),function(t){const{notice:e,template:{$video:r}}=t,a=L("canvas");W(t,"getDataURL",{value:()=>new Promise((t,o)=>{try{a.width=r.videoWidth,a.height=r.videoHeight,a.getContext("2d").drawImage(r,0,0),t(a.toDataURL("image/png"))}catch(n){e.show=n,o(n)}})}),W(t,"getBlobUrl",{value:()=>new Promise((t,o)=>{try{a.width=r.videoWidth,a.height=r.videoHeight,a.getContext("2d").drawImage(r,0,0),a.toBlob(e=>{t(URL.createObjectURL(e))})}catch(n){e.show=n,o(n)}})}),W(t,"screenshot",{value:async e=>{const a=await t.getDataURL();return N(a,`${e||`artplayer_${B(r.currentTime)}`}.png`),t.emit("screenshot",a),a}})}(t),At(t),function(t){const{constructor:e,template:{$container:r,$player:a}}=t;let o="";W(t,"fullscreenWeb",{get:()=>v(a,"art-fullscreen-web"),set(n){n?(o=a.style.cssText,e.FULLSCREEN_WEB_IN_BODY&&y(document.body,a),t.state="fullscreenWeb",w(a,"width","100%"),w(a,"height","100%"),f(a,"art-fullscreen-web"),t.emit("fullscreenWeb",!0)):(e.FULLSCREEN_WEB_IN_BODY&&y(r,a),o&&(a.style.cssText=o,o=""),g(a,"art-fullscreen-web"),t.emit("fullscreenWeb",!1)),t.emit("resize")}})}(t),Rt(t),function(t){const{$video:e}=t.template;W(t,"loaded",{get:()=>t.loadedTime/e.duration}),W(t,"loadedTime",{get:()=>e.buffered.length?e.buffered.end(e.buffered.length-1):0})}(t),function(t){W(t,"played",{get:()=>t.currentTime/t.duration})}(t),function(t){const{$video:e}=t.template;W(t,"playing",{get:()=>"boolean"===typeof e.playing?e.playing:!!(e.currentTime>0&&!e.paused&&!e.ended&&e.readyState>2)})}(t),function(t){const{$container:e,$player:r,$video:a}=t.template;W(t,"autoSize",{value(){const{videoWidth:o,videoHeight:n}=a,{width:i,height:s}=A(e),l=o/n;if(i/s>l)w(r,"width",s*l/i*100+"%"),w(r,"height","100%");else{const t=i/l/s*100;w(r,"width","100%"),w(r,"height",`${t}%`)}t.emit("autoSize",{width:t.width,height:t.height})}})}(t),function(t){W(t,"rect",{get:()=>A(t.template.$player)});const e=["bottom","height","left","right","top","width"];for(let r=0;rt.rect[a]})}W(t,"x",{get:()=>t.left+window.pageXOffset}),W(t,"y",{get:()=>t.top+window.pageYOffset})}(t),function(t){const{template:{$player:e},i18n:r,notice:a}=t;W(t,"flip",{get:()=>e.dataset.flip||"normal",set(o){o||(o="normal"),"normal"===o?delete e.dataset.flip:e.dataset.flip=o,a.show=`${r.get("Video Flip")}: ${r.get(F(o))}`,t.emit("flip",o)}})}(t),Pt(t),function(t){const{template:{$poster:e}}=t;W(t,"poster",{get:()=>{try{return e.style.backgroundImage.match(/"(.*)"/)[1]}catch{return""}},set(t){w(e,"backgroundImage",`url(${t})`)}})}(t),function(t){const{template:{$container:e,$video:r}}=t;W(t,"autoHeight",{value(){const{clientWidth:a}=e,{videoHeight:o,videoWidth:n}=r,i=o*(a/n);w(e,"height",`${i}px`),t.emit("autoHeight",i)}})}(t),function(t){const{$player:e}=t.template;W(t,"cssVar",{value:(t,r)=>r?e.style.setProperty(t,r):getComputedStyle(e).getPropertyValue(t)})}(t),function(t){W(t,"theme",{get:()=>t.cssVar("--art-theme"),set(e){t.cssVar("--art-theme",e)}})}(t),function(t){W(t,"type",{get:()=>t.option.type,set(e){t.option.type=e}})}(t),function(t){const e=["mini","pip","fullscreen","fullscreenWeb"];W(t,"state",{get:()=>e.find(e=>t[e])||"standard",set(r){for(let a=0;aa.$track?.offset||0,set(o){const{cues:n}=t.subtitle;if(!a.$track||0===n.length)return;const i=D(o,-10,10);a.$track.offset=i;for(let e=0;e{switch(t.availability){case"available":n=!0;break;case"not-available":n=!1}}):n=!1,W(t,"airplay",{value(){n?(o.webkitShowPlaybackTargetPicker(),t.emit("airplay")):r.show=e.get("AirPlay Not Available")}})}(t),function(t){W(t,"quality",{set(e){const{controls:r,notice:a,i18n:o}=t,n=e.find(t=>t.default)||e[0];r.update({name:"quality",position:"right",index:10,style:{marginRight:"10px"},html:n?.html||"",selector:e,onSelect:async e=>(await t.switchQuality(e.url),a.show=`${o.get("Switch Video")}: ${e.html}`,e.html)})}})}(t),Ot(t),function(t){const{i18n:e,notice:r,option:a,constructor:o,proxy:n,template:{$player:s,$video:l,$poster:c}}=t;let d=0;for(let p=0;p{t.emit(`video:${e.type}`,e)});t.on("video:canplay",()=>{d=0,t.loading.show=!1}),t.once("video:canplay",()=>{t.loading.show=!1,t.controls.show=!0,t.mask.show=!0,t.isReady=!0,t.emit("ready")}),t.on("video:ended",()=>{a.loop?(t.seek=0,t.play(),t.controls.show=!1,t.mask.show=!1):(t.controls.show=!0,t.mask.show=!0)}),t.on("video:error",async n=>{d{t.emit("resize"),p&&(t.loading.show=!1,t.controls.show=!0,t.mask.show=!0)}),t.on("video:loadstart",()=>{t.loading.show=!0,t.mask.show=!1,t.controls.show=!0}),t.on("video:pause",()=>{t.controls.show=!0,t.mask.show=!0}),t.on("video:play",()=>{t.mask.show=!1,w(c,"display","none")}),t.on("video:playing",()=>{t.mask.show=!1}),t.on("video:progress",()=>{t.playing&&(t.loading.show=!1)}),t.on("video:seeked",()=>{t.loading.show=!1,t.mask.show=!0}),t.on("video:seeking",()=>{t.loading.show=!0,t.mask.show=!1}),t.on("video:timeupdate",()=>{t.mask.show=!1}),t.on("video:waiting",()=>{t.loading.show=!0,t.mask.show=!1})}(t),function(t){const{option:e,storage:r,template:{$video:a,$poster:o}}=t;for(const i in e.moreVideoAttr)t.attr(i,e.moreVideoAttr[i]);e.muted&&(t.muted=e.muted),e.volume&&(a.volume=D(e.volume,0,1));const n=r.get("volume");"number"===typeof n&&(a.volume=D(n,0,1)),e.poster&&w(o,"backgroundImage",`url(${e.poster})`),e.autoplay&&(a.autoplay=e.autoplay),e.playsInline&&(a.playsInline=!0,a["webkit-playsinline"]=!0),e.theme&&(e.cssVar["--art-theme"]=e.theme);for(const i in e.cssVar)t.cssVar(i,e.cssVar[i]);t.url=e.url}(t)}}function Vt(t){const{notice:e,constructor:r,template:{$player:a,$video:o}}=t,n="art-auto-orientation",i="art-auto-orientation-fullscreen";let s=!1;function l(){const{videoWidth:t,videoHeight:e}=o,r=document.documentElement.clientWidth,a=document.documentElement.clientHeight;return t>e&&ra}return t.on("fullscreenWeb",e=>{if(e){if(l()){const e=Number(r.AUTO_ORIENTATION_TIME??0);setTimeout(()=>{t.fullscreenWeb&&!v(a,n)&&function(){const e=O(),r=document.documentElement.clientWidth,o=document.documentElement.clientHeight-e.top-e.bottom,i=r-e.left-e.right;w(a,"width",`${o}px`),w(a,"height",`${i}px`),w(a,"transform-origin","0 0"),w(a,"transform",`rotate(90deg) translate(${e.top}px, -${r-e.right}px)`),f(a,n),t.isRotate=!0,t.emit("resize")}()},e)}}else v(a,n)&&(w(a,"width",""),w(a,"height",""),w(a,"transform-origin",""),w(a,"transform",""),g(a,n),t.isRotate=!1,t.emit("resize"))}),t.on("fullscreen",async t=>{const r=!!screen?.orientation?.lock;if(t){if(r&&l())try{const t=screen.orientation.type.startsWith("portrait")?"landscape":"portrait";await screen.orientation.lock(t),s=!0,f(a,i)}catch(o){s=!1,e.show=o}}else if(v(a,i)&&g(a,i),r&&s){try{screen.orientation.unlock()}catch{}s=!1}}),{name:"autoOrientation",get state(){return v(a,n)}}}function Yt(t){const{i18n:e,icons:r,storage:a,constructor:o,proxy:n,template:{$poster:i}}=t,s=t.layers.add({name:"auto-playback",html:'\n
\n
\n
\n '}),l=u(".art-auto-playback-last",s),c=u(".art-auto-playback-jump",s),d=u(".art-auto-playback-close",s);y(d,r.close);let p=null;function h(){const r=(a.get("times")||{})[t.option.id||t.option.url];clearTimeout(p),w(s,"display","none"),r&&r>=o.AUTO_PLAYBACK_MIN&&(w(s,"display","flex"),l.textContent=`${e.get("Last Seen")} ${B(r)}`,c.textContent=e.get("Jump Play"),n(d,"click",()=>{w(s,"display","none")}),n(c,"click",()=>{t.seek=r,t.play(),w(i,"display","none"),w(s,"display","none")}),t.once("video:timeupdate",()=>{p=setTimeout(()=>{w(s,"display","none")},o.AUTO_PLAYBACK_TIMEOUT)}))}return t.on("video:timeupdate",()=>{if(t.playing){const e=a.get("times")||{},r=Object.keys(e);r.length>o.AUTO_PLAYBACK_MAX&&delete e[r[0]],e[t.option.id||t.option.url]=t.currentTime,a.set("times",e)}}),t.on("ready",h),t.on("restart",h),{name:"auto-playback",get times(){return a.get("times")||{}},clear:()=>a.del("times"),delete(t){const e=a.get("times")||{};return delete e[t],a.set("times",e),e}}}function Nt(t){const{constructor:e,proxy:r,template:{$player:a,$video:o}}=t;let n=null,i=!1,s=1;const l=()=>{clearTimeout(n),i&&(i=!1,t.playbackRate=s,g(a,"art-fast-forward"))};return r(o,"touchstart",r=>{1===r.touches.length&&t.playing&&!t.isLock&&(n=setTimeout(()=>{i=!0,s=t.playbackRate,t.playbackRate=e.FAST_FORWARD_VALUE,f(a,"art-fast-forward")},e.FAST_FORWARD_TIME))}),t.on("document:touchmove",l),t.on("document:touchend",l),{name:"fastForward",get state(){return v(a,"art-fast-forward")}}}function Dt(t){const{layers:e,icons:r,template:{$player:a}}=t;function o(){return v(a,"art-lock")}function n(){f(a,"art-lock"),t.isLock=!0,t.emit("lock",!0)}function i(){g(a,"art-lock"),t.isLock=!1,t.emit("lock",!1)}return e.add({name:"lock",mounted(e){const a=y(e,r.lock),o=y(e,r.unlock);w(a,"display","none"),t.on("lock",t=>{t?(w(a,"display","inline-flex"),w(o,"display","none")):(w(a,"display","none"),w(o,"display","inline-flex"))})},click(){o()?i():n()}}),{name:"lock",get state(){return o()},set state(t){t?n():i()}}}function Ft(t){return t.on("control",e=>{e?g(t.template.$player,"art-mini-progress-bar"):f(t.template.$player,"art-mini-progress-bar")}),{name:"mini-progress-bar"}}class Bt{constructor(t){this.art=t,this.id=0;const{option:e}=t;e.miniProgressBar&&!e.isLive&&this.add(Ft),e.lock&&p&&this.add(Dt),e.autoPlayback&&!e.isLive&&this.add(Yt),e.autoOrientation&&p&&this.add(Vt),e.fastForward&&p&&!e.isLive&&this.add(Nt);for(let r=0;rthis.next(t,e)):this.next(t,e)}next(t,e){const r=e&&e.name||t.name||`plugin${this.id}`;return V(!U(this,r),`Cannot add a plugin that already has the same name: ${r}`),W(this,r,{value:e}),this}}class Ht extends pt{constructor(t){super(t);const{option:e,controls:r,template:{$setting:a}}=t;this.name="setting",this.$parent=a,this.id=0,this.active=null,this.cache=new Map,this.option=[...this.builtin,...e.settings],e.setting&&(this.format(),this.render(),t.on("blur",()=>{this.show&&(this.show=!1,this.render())}),t.on("focus",t=>{const e=C(t,r.setting),a=C(t,this.$parent);!this.show||e||a||(this.show=!1,this.render())}),t.on("resize",()=>this.resize()))}get builtin(){const t=[],{option:e}=this.art;return e.playbackRate&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:a,PLAYBACK_RATE:o}}=t;function n(t){return 1===t?e.get("Normal"):t.toFixed(1)}function i(){const e=t.setting.find(`playback-rate-${t.playbackRate}`);t.setting.check(e)}return{width:a,name:"playback-rate",html:e.get("Play Speed"),tooltip:n(t.playbackRate),icon:r.playbackRate,selector:o.map(e=>({value:e,name:`playback-rate-${e}`,default:e===t.playbackRate,html:n(e)})),onSelect:e=>(t.playbackRate=e.value,e.html),mounted:()=>{i(),t.on("video:ratechange",()=>i())}}}(this.art)),e.aspectRatio&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:a,ASPECT_RATIO:o}}=t;function n(t){return"default"===t?e.get("Default"):t}function i(){const e=t.setting.find(`aspect-ratio-${t.aspectRatio}`);t.setting.check(e)}return{width:a,name:"aspect-ratio",html:e.get("Aspect Ratio"),icon:r.aspectRatio,tooltip:n(t.aspectRatio),selector:o.map(e=>({value:e,name:`aspect-ratio-${e}`,default:e===t.aspectRatio,html:n(e)})),onSelect:e=>(t.aspectRatio=e.value,e.html),mounted:()=>{i(),t.on("aspectRatio",()=>i())}}}(this.art)),e.flip&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:a,FLIP:o}}=t;function n(t){return e.get(F(t))}function i(){const e=t.setting.find(`flip-${t.flip}`);t.setting.check(e)}return{width:a,name:"flip",html:e.get("Video Flip"),tooltip:n(t.flip),icon:r.flip,selector:o.map(e=>({value:e,name:`flip-${e}`,default:e===t.flip,html:n(e)})),onSelect:e=>(t.flip=e.value,e.html),mounted:()=>{i(),t.on("flip",()=>i())}}}(this.art)),e.subtitleOffset&&t.push(function(t){const{i18n:e,icons:r,constructor:a}=t;return{width:a.SETTING_ITEM_WIDTH,name:"subtitle-offset",html:e.get("Subtitle Offset"),icon:r.subtitle,tooltip:"0s",range:[0,-10,10,.1],onChange:e=>(t.subtitleOffset=e.range[0],`${e.range[0]}s`),mounted:(e,r)=>{t.on("subtitleOffset",t=>{r.$range.value=t,r.tooltip=`${t}s`})}}}(this.art)),t}traverse(t,e=this.option){for(let r=0;r{e.default=e===t,e.default&&e.$item&&$(e.$item,"art-current")},t.$option),this.render(t.$parents))}format(t=this.option,e,r,a=[]){for(let o=0;oe}),W(n,"$parents",{get:()=>r}),W(n,"$option",{get:()=>t});const a=[];W(n,"$events",{get:()=>a}),W(n,"$formatted",{get:()=>!0})}this.format(n.selector||[],n,t,a)}this.option=t}find(t=""){let e=null;return this.traverse(r=>{r.name===t&&(e=r)}),e}resize(){const{controls:t,constructor:{SETTING_WIDTH:e,SETTING_ITEM_HEIGHT:r},template:{$player:a,$setting:o}}=this.art;if(t.setting&&this.show){const n=this.active[0]?.$parent?.width||e,{left:i,width:s}=A(t.setting),{left:l,width:c}=A(a),d=i-l+s/2-n/2;if(w(o,"height",`${this.active===this.option?this.active.length*r:(this.active.length+1)*r}px`),w(o,"width",`${n}px`),this.art.isRotate||p)return;d+n>c?(w(o,"left",null),w(o,"right",null)):(w(o,"left",`${d}px`),w(o,"right","auto"))}}inactivate(t){for(let e=0;e'),s=L("div");f(s,"art-setting-item-left-icon"),y(s,a),y(i,s),y(i,t.$parent.html);const l=r(n,"click",()=>this.render(t.$parents));t.$parent.$events.push(l),y(e,n)}createItem(t,e=!1){if(!this.cache.has(t.$option))return;const r=this.cache.get(t.$option),a=t.$item;let o="selector";U(t,"switch")&&(o="switch"),U(t,"range")&&(o="range"),U(t,"onClick")&&(o="button");const{icons:n,proxy:i,constructor:s}=this.art,l=L("div");f(l,"art-setting-item"),w(l,"height",`${s.SETTING_ITEM_HEIGHT}px`),l.dataset.name=t.name||"",l.dataset.value=t.value||"";const c=y(l,'
'),d=y(l,'
'),p=L("div");switch(f(p,"art-setting-item-left-icon"),o){case"button":case"switch":case"range":y(p,t.icon||n.config);break;case"selector":t.selector?.length?y(p,t.icon||n.config):y(p,n.check)}y(c,p),W(t,"$icon",{configurable:!0,get:()=>p}),W(t,"icon",{configurable:!0,get:()=>p.innerHTML,set(t){p.innerHTML="",y(p,t)}});const h=L("div");f(h,"art-setting-item-left-text"),y(h,t.html||""),y(c,h),W(t,"$html",{configurable:!0,get:()=>h}),W(t,"html",{configurable:!0,get:()=>h.innerHTML,set(t){h.innerHTML="",y(h,t)}});const u=L("div");switch(f(u,"art-setting-item-right-tooltip"),y(u,t.tooltip||""),y(d,u),W(t,"$tooltip",{configurable:!0,get:()=>u}),W(t,"tooltip",{configurable:!0,get:()=>u.innerHTML,set(t){u.innerHTML="",y(u,t)}}),o){case"switch":{const e=L("div");f(e,"art-setting-item-right-icon");const r=y(e,n.switchOn),a=y(e,n.switchOff);w(t.switch?a:r,"display","none"),y(d,e),W(t,"$switch",{configurable:!0,get:()=>e});let o=t.switch;W(t,"switch",{configurable:!0,get:()=>o,set(t){o=t,t?(w(a,"display","none"),w(r,"display",null)):(w(a,"display",null),w(r,"display","none"))}});break}case"range":{const e=L("div");f(e,"art-setting-item-right-icon");const r=y(e,'');r.value=t.range[0],r.min=t.range[1],r.max=t.range[2],r.step=t.range[3],f(r,"art-setting-range"),y(d,e),W(t,"$range",{configurable:!0,get:()=>r});let a=[...t.range];W(t,"range",{configurable:!0,get:()=>a,set(t){a=[...t],r.value=t[0],r.min=t[1],r.max=t[2],r.step=t[3]}})}break;case"selector":if(t.selector?.length){const t=L("div");f(t,"art-setting-item-right-icon"),y(t,n.arrowRight),y(d,t)}}switch(o){case"switch":if(t.onSwitch){const e=i(l,"click",async e=>{t.switch=await t.onSwitch.call(this.art,t,l,e)});t.$events.push(e)}break;case"range":if(t.$range){if(t.onRange){const e=i(t.$range,"change",async e=>{t.range[0]=t.$range.valueAsNumber,t.tooltip=await t.onRange.call(this.art,t,l,e)});t.$events.push(e)}if(t.onChange){const e=i(t.$range,"input",async e=>{t.range[0]=t.$range.valueAsNumber,t.tooltip=await t.onChange.call(this.art,t,l,e)});t.$events.push(e)}}break;case"selector":{const e=i(l,"click",async e=>{t.selector?.length?this.render(t.selector):(this.check(t),t.$parent.onSelect&&(t.$parent.tooltip=await t.$parent.onSelect.call(this.art,t,l,e)))});t.$events.push(e),t.default&&f(l,"art-current")}break;case"button":if(t.onClick){const e=i(l,"click",async e=>{t.tooltip=await t.onClick.call(this.art,t,l,e)});t.$events.push(e)}}W(t,"$item",{configurable:!0,get:()=>l}),e?z(l,a):y(r,l),t.mounted&&setTimeout(()=>t.mounted.call(this.art,t.$item,t),0)}render(t=this.option){if(this.active=t,this.cache.has(t)){$(this.cache.get(t),"art-current")}else{const e=L("div");this.cache.set(t,e),f(e,"art-setting-panel"),y(this.$parent,e),$(e,"art-current"),t[0]?.$parent&&this.createHeader(t[0]);for(let r=0;rnull,this.init(t.option.subtitle);let e=!1;t.on("video:timeupdate",()=>{if(!this.url)return;const t=this.art.template.$video.webkitDisplayingFullscreen;"boolean"===typeof t&&t!==e&&(e=t,this.createTrack(t?"subtitles":"metadata",this.url))})}get url(){return this.art.template.$track.src}set url(t){this.switch(t)}get textTrack(){return this.art.template.$video?.textTracks?.[0]}get activeCues(){return this.textTrack?Array.from(this.textTrack.activeCues):[]}get cues(){return this.textTrack?Array.from(this.textTrack.cues):[]}style(t,e){const{$subtitle:r}=this.art.template;return"object"===typeof t?x(r,t):w(r,t,e)}update(){const{option:{subtitle:t},template:{$subtitle:e}}=this.art;e.innerHTML="",this.activeCues.length&&(this.art.emit("subtitleBeforeUpdate",this.activeCues),e.innerHTML=this.activeCues.map((e,r)=>e.text.split(/\r?\n/).filter(t=>t.trim()).map(e=>`
\n ${t.escape?H(e):e}\n
`).join("")).join(""),this.art.emit("subtitleAfterUpdate",this.activeCues))}async switch(t,e={}){const{i18n:r,notice:a,option:o}=this.art,n={...o.subtitle,...e,url:t},i=await this.init(n);return e.name&&(a.show=`${r.get("Switch Subtitle")}: ${e.name}`),i}createTrack(t,e){const{template:r,proxy:a,option:o}=this.art,{$video:n,$track:i}=r,s=L("track");s.default=!0,s.kind=t,s.src=e,s.label=o.subtitle.name||"Artplayer",s.track.mode="hidden",s.onload=()=>{this.art.emit("subtitleLoad",this.cues,this.option)},this.art.events.remove(this.destroyEvent),i.onload=null,b(i),y(n,s),r.$track=s,this.destroyEvent=a(this.textTrack,"cuechange",()=>this.update())}async init(t){const{notice:e,template:{$subtitle:r}}=this.art;return this.textTrack?(o(t,dt.subtitle),t.url?(this.option=t,this.style(t.style),fetch(t.url).then(t=>t.arrayBuffer()).then(e=>{const r=new TextDecoder(t.encoding).decode(e);switch(t.type||Y(t.url)){case"srt":{const e=G(r);return K(t.onVttLoad(e))}case"ass":{const e=Z(r);return K(t.onVttLoad(e))}case"vtt":return K(t.onVttLoad(r));default:return t.url}}).then(t=>(r.innerHTML="",this.url===t||(URL.revokeObjectURL(this.url),this.createTrack("metadata",t)),t)).catch(t=>{throw r.innerHTML="",e.show=t,t})):void 0):null}}class qt{constructor(t){this.art=t;const{option:e,constructor:r}=t;e.container instanceof Element?this.$container=e.container:(this.$container=u(e.container),V(this.$container,`No container element found by ${e.container}`)),V(I(),"The current browser does not support flex layout");const a=this.$container.tagName.toLowerCase();V("div"===a,`Unsupported container element type, only support 'div' but got '${a}'`),V(r.instances.every(t=>t.template.$container!==this.$container),"Cannot mount multiple instances on the same dom element"),this.query=this.query.bind(this),this.$container.dataset.artId=t.id,this.init()}static get html(){return`\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
Player version:
\n
${n}
\n
\n
\n
Video url:
\n
\n
\n
\n
Video volume:
\n
\n
\n
\n
Video time:
\n
\n
\n
\n
Video duration:
\n
\n
\n
\n
Video resolution:
\n
\n x \n
\n
\n
\n
[x]
\n
\n
\n
\n `}query(t){return u(t,this.$container)}init(){const{option:t}=this.art;if(t.useSSR||(this.$container.innerHTML=qt.html),this.$player=this.query(".art-video-player"),this.$video=this.query(".art-video"),this.$track=this.query("track"),this.$poster=this.query(".art-poster"),this.$subtitle=this.query(".art-subtitle"),this.$danmuku=this.query(".art-danmuku"),this.$bottom=this.query(".art-bottom"),this.$progress=this.query(".art-progress"),this.$controls=this.query(".art-controls"),this.$controlsLeft=this.query(".art-controls-left"),this.$controlsCenter=this.query(".art-controls-center"),this.$controlsRight=this.query(".art-controls-right"),this.$layer=this.query(".art-layers"),this.$loading=this.query(".art-loading"),this.$notice=this.query(".art-notice"),this.$noticeInner=this.query(".art-notice-inner"),this.$mask=this.query(".art-mask"),this.$state=this.query(".art-state"),this.$setting=this.query(".art-settings"),this.$info=this.query(".art-info"),this.$infoPanel=this.query(".art-info-panel"),this.$infoClose=this.query(".art-info-close"),this.$contextmenu=this.query(".art-contextmenus"),t.proxy){const e=t.proxy.call(this.art,this.art);V(e instanceof HTMLVideoElement||e instanceof HTMLCanvasElement,"Function 'option.proxy' needs to return 'HTMLVideoElement' or 'HTMLCanvasElement'"),z(e,this.$video),e.className="art-video",this.$video=e}t.backdrop&&f(this.$player,"art-backdrop"),p&&f(this.$player,"art-mobile")}destroy(t){t?this.$container.innerHTML="":f(this.$player,"art-destroy")}}class Xt{on(t,e,r){const a=this.e||(this.e={});return(a[t]||(a[t]=[])).push({fn:e,ctx:r}),this}once(t,e,r){const a=this;function o(...n){a.off(t,o),e.apply(r,n)}return o._=e,this.on(t,o,r)}emit(t,...e){const r=((this.e||(this.e={}))[t]||[]).slice();for(let a=0;ae.call(this,this)),Zt.DEBUG){const t=t=>console.log(`[ART.${this.id}] -> ${t}`);t(`Version@${Zt.version}`);for(let e=0;et(`Event@${e.type}`))}Kt.push(this)}static get instances(){return Kt}static get version(){return n}static get config(){return i}static get utils(){return et}static get scheme(){return dt}static get Emitter(){return Xt}static get validator(){return o}static get kindOf(){return o.kindOf}static get html(){return qt.html}static get option(){return{id:"",container:"#artplayer",url:"",poster:"",type:"",theme:"#f00",volume:.7,isLive:!1,muted:!1,autoplay:!1,autoSize:!1,autoMini:!1,loop:!1,flip:!1,playbackRate:!1,aspectRatio:!1,screenshot:!1,setting:!1,hotkey:!0,pip:!1,mutex:!0,backdrop:!0,fullscreen:!1,fullscreenWeb:!1,subtitleOffset:!1,miniProgressBar:!1,useSSR:!1,playsInline:!0,lock:!1,gesture:!0,fastForward:!1,autoPlayback:!1,autoOrientation:!1,airplay:!1,proxy:void 0,layers:[],contextmenu:[],controls:[],settings:[],quality:[],highlight:[],plugins:[],thumbnails:{url:"",number:60,column:10,width:0,height:0,scale:1},subtitle:{url:"",type:"",style:{},name:"",escape:!0,encoding:"utf-8",onVttLoad:t=>t},moreVideoAttr:{controls:!1,preload:l?"auto":"metadata"},i18n:{},icons:{},cssVar:{},customType:{},lang:navigator?.language.toLowerCase()}}get proxy(){return this.events.proxy}get query(){return this.template.query}get video(){return this.template.$video}reset(){this.video.removeAttribute("src"),this.video.load()}destroy(t=!0){Zt.REMOVE_SRC_WHEN_DESTROY&&this.reset(),this.events.destroy(),this.template.destroy(t),Kt.splice(Kt.indexOf(this),1),this.isDestroy=!0,this.emit("destroy")}}return Zt.STYLE=jt,Zt.DEBUG=!1,Zt.CONTEXTMENU=!0,Zt.NOTICE_TIME=2e3,Zt.SETTING_WIDTH=250,Zt.SETTING_ITEM_WIDTH=200,Zt.SETTING_ITEM_HEIGHT=35,Zt.RESIZE_TIME=200,Zt.SCROLL_TIME=200,Zt.SCROLL_GAP=50,Zt.AUTO_PLAYBACK_MAX=10,Zt.AUTO_PLAYBACK_MIN=5,Zt.AUTO_PLAYBACK_TIMEOUT=3e3,Zt.RECONNECT_TIME_MAX=5,Zt.RECONNECT_SLEEP_TIME=1e3,Zt.CONTROL_HIDE_TIME=3e3,Zt.DBCLICK_TIME=300,Zt.DBCLICK_FULLSCREEN=!0,Zt.MOBILE_DBCLICK_PLAY=!0,Zt.MOBILE_CLICK_PLAY=!1,Zt.AUTO_ORIENTATION_TIME=200,Zt.INFO_LOOP_TIME=1e3,Zt.FAST_FORWARD_VALUE=3,Zt.FAST_FORWARD_TIME=1e3,Zt.TOUCH_MOVE_RATIO=.5,Zt.VOLUME_STEP=.1,Zt.SEEK_STEP=5,Zt.PLAYBACK_RATE=[.5,.75,1,1.25,1.5,2],Zt.ASPECT_RATIO=["default","4:3","16:9"],Zt.FLIP=["normal","horizontal","vertical"],Zt.FULLSCREEN_WEB_IN_BODY=!0,Zt.LOG_VERSION=!0,Zt.USE_RAF=!1,Zt.REMOVE_SRC_WHEN_DESTROY=!0,h&&(M("artplayer-style",jt),setTimeout(()=>{Zt.LOG_VERSION&&console.log(`%c ArtPlayer %c ${Zt.version} %c https://artplayer.org`,"color: #fff; background: #5f5f5f","color: #fff; background: #4bc729","")},100)),Zt}); diff --git a/docs/compiled/artplayer.legacy.js b/docs/compiled/artplayer.legacy.js index fca0a796e..deb358eb6 100644 --- a/docs/compiled/artplayer.legacy.js +++ b/docs/compiled/artplayer.legacy.js @@ -1,7 +1,7 @@ /*! - * artplayer.js v5.4.0 + * artplayer.js v5.4.1 * Github: https://github.com/zhw2590582/ArtPlayer * (c) 2017-2026 Harvey Zhao * Released under the MIT License. */ -!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.Artplayer=e(),define(function(){return t.Artplayer})):(t="undefined"!==typeof globalThis?globalThis:t||self).Artplayer=e()}(this,function(){"use strict";var t,e=Object.defineProperty,r=Object.defineProperties,o=Object.getOwnPropertyDescriptors,a=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,s=(t,r,o)=>r in t?e(t,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[r]=o,l=(t,e)=>{for(var r in e||(e={}))n.call(e,r)&&s(t,r,e[r]);if(a)for(var r of a(e))i.call(e,r)&&s(t,r,e[r]);return t},c=(t,e)=>r(t,o(e)),d=(t,e,r)=>new Promise((o,a)=>{var n=t=>{try{s(r.next(t))}catch(e){a(e)}},i=t=>{try{s(r.throw(t))}catch(e){a(e)}},s=t=>t.done?o(t.value):Promise.resolve(t.value).then(n,i);s((r=r.apply(t,e)).next())});function p(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var h,u={exports:{}};var m=(h||(h=1,u.exports=function(){function t(e){return(t="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})(e)}var e=Object.prototype.toString,r=function(r){if(void 0===r)return"undefined";if(null===r)return"null";var a=t(r);if("boolean"===a)return"boolean";if("string"===a)return"string";if("number"===a)return"number";if("symbol"===a)return"symbol";if("function"===a)return"GeneratorFunction"===o(r)?"generatorfunction":"function";if(function(t){return Array.isArray?Array.isArray(t):t instanceof Array}(r))return"array";if(function(t){return!(!t.constructor||"function"!=typeof t.constructor.isBuffer)&&t.constructor.isBuffer(t)}(r))return"buffer";if(function(t){try{if("number"==typeof t.length&&"function"==typeof t.callee)return!0}catch(e){if(-1!==e.message.indexOf("callee"))return!0}return!1}(r))return"arguments";if(function(t){return t instanceof Date||"function"==typeof t.toDateString&&"function"==typeof t.getDate&&"function"==typeof t.setDate}(r))return"date";if(function(t){return t instanceof Error||"string"==typeof t.message&&t.constructor&&"number"==typeof t.constructor.stackTraceLimit}(r))return"error";if(function(t){return t instanceof RegExp||"string"==typeof t.flags&&"boolean"==typeof t.ignoreCase&&"boolean"==typeof t.multiline&&"boolean"==typeof t.global}(r))return"regexp";switch(o(r)){case"Symbol":return"symbol";case"Promise":return"promise";case"WeakMap":return"weakmap";case"WeakSet":return"weakset";case"Map":return"map";case"Set":return"set";case"Int8Array":return"int8array";case"Uint8Array":return"uint8array";case"Uint8ClampedArray":return"uint8clampedarray";case"Int16Array":return"int16array";case"Uint16Array":return"uint16array";case"Int32Array":return"int32array";case"Uint32Array":return"uint32array";case"Float32Array":return"float32array";case"Float64Array":return"float64array"}if(function(t){return"function"==typeof t.throw&&"function"==typeof t.return&&"function"==typeof t.next}(r))return"generator";switch(a=e.call(r)){case"[object Object]":return"object";case"[object Map Iterator]":return"mapiterator";case"[object Set Iterator]":return"setiterator";case"[object String Iterator]":return"stringiterator";case"[object Array Iterator]":return"arrayiterator"}return a.slice(8,-1).toLowerCase().replace(/\s/g,"")};function o(t){return t.constructor?t.constructor.name:null}function a(t,e){var o=2=1,k=/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(y)||x,$="undefined"!==typeof window&&"undefined"!==typeof document;function T(t,e=document){return e.querySelector(t)}function E(t,e=document){return Array.from(e.querySelectorAll(t))}function C(t,e){return t.classList.add(e)}function z(t,e){return t.classList.remove(e)}function L(t,e){return t.classList.contains(e)}function S(t,e){return e instanceof Element?t.appendChild(e):t.insertAdjacentHTML("beforeend",String(e)),t.lastElementChild||t.lastChild}function M(t){return t.parentNode.removeChild(t)}function I(t,e,r){return t.style[e]=r,t}function P(t,e){for(const r in e)I(t,r,e[r]);return t}function A(t){return Array.from(t.parentElement.children).filter(e=>e!==t)}function O(t,e){A(t).forEach(t=>z(t,e)),C(t,e)}function R(t,e,r="top"){k||(t.setAttribute("aria-label",e),C(t,"hint--rounded"),C(t,`hint--${r}`))}function _(t,e=0){const r=t.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight,a=window.innerWidth||document.documentElement.clientWidth,n=r.top-e<=o&&r.top+r.height+e>=0,i=r.left-e<=a+e&&r.left+r.width+e>=0;return n&&i}function V(t,e){return j(t).includes(e)}function Y(t,e){return e.parentNode.replaceChild(t,e),t}function D(t){return document.createElement(t)}function N(t="",e=""){const r=D("i");return C(r,"art-icon"),C(r,`art-icon-${t}`),S(r,e),r}function F(t,e){let r=document.getElementById(t);r||(r=document.createElement("style"),r.id=t,"loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>{document.head.appendChild(r)}):(document.head||document.documentElement).appendChild(r)),r.textContent=e}function B(){const t=document.createElement("div");return t.style.display="flex","flex"===t.style.display}function H(t){return t.getBoundingClientRect()}function W(t,e){return new Promise((r,o)=>{const a=new Image;a.onload=function(){if(e&&1!==e){const n=document.createElement("canvas"),i=n.getContext("2d");n.width=a.width*e,n.height=a.height*e,i.drawImage(a,0,0,n.width,n.height),n.toBlob(e=>{const a=URL.createObjectURL(e),n=new Image;n.onload=function(){r(n)},n.onerror=function(){URL.revokeObjectURL(a),o(new Error(`Image load failed: ${t}`))},n.src=a})}else r(a)},a.onerror=function(){o(new Error(`Image load failed: ${t}`))},a.src=t})}function j(t){if(t.composedPath)return t.composedPath();const e=[];let r=t.target;for(;r;)e.push(r),r=r.parentNode;return e.includes(window)||void 0===window||e.push(window),e}class U extends Error{constructor(t,e){super(t),"function"===typeof Error.captureStackTrace&&Error.captureStackTrace(this,e||this.constructor),this.name="ArtPlayerError"}}function q(t,e){if(!t)throw new U(e);return t}function X(t){return t.includes("?")?X(t.split("?")[0]):t.includes("#")?X(t.split("#")[0]):t.trim().toLowerCase().split(".").pop()}function G(t,e){const r=document.createElement("a");r.style.display="none",r.href=t,r.download=e,document.body.appendChild(r),r.click(),document.body.removeChild(r)}function K(t,e,r){return Math.max(Math.min(t,Math.max(e,r)),Math.min(e,r))}function Z(t){return t.charAt(0).toUpperCase()+t.slice(1)}function J(t){if(!t)return"00:00";const e=Math.floor(t/3600),r=Math.floor((t-3600*e)/60),o=Math.floor(t-3600*e-60*r);return(e>0?[e,r,o]:[r,o]).map(t=>t<10?`0${t}`:String(t)).join(":")}function Q(t){return t.replace(/[&<>'"]/g,t=>({"&":"&","<":"<",">":">","'":"'",'"':"""}[t]||t))}const tt=Object.defineProperty,{hasOwnProperty:et}=Object.prototype;function rt(t,e){return et.call(t,e)}function ot(t,e){return Object.getOwnPropertyDescriptor(t,e)}function at(...t){const e=t=>t&&"object"===typeof t&&!Array.isArray(t);return t.reduce((t,r)=>(Object.keys(r).forEach(o=>{const a=t[o],n=r[o];Array.isArray(a)&&Array.isArray(n)?t[o]=a.concat(...n):e(a)&&e(n)?t[o]=at(a,n):t[o]=n}),t),{})}function nt(t){return"WEBVTT \r\n\r\n".concat((e=t,e.replace(/(\d\d:\d\d:\d\d)[,.](\d+)/g,(t,e,r)=>{let o=r.slice(0,3);return 1===r.length&&(o=`${r}00`),2===r.length&&(o=`${r}0`),`${e},${o}`})).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").replace(/\{[\s\S]*?\}/g,"").concat("\r\n\r\n"));var e}function it(t){return URL.createObjectURL(new Blob([t],{type:"text/vtt"}))}function st(t){const e=new RegExp("Dialogue:\\s\\d,(\\d+:\\d\\d:\\d\\d.\\d\\d),(\\d+:\\d\\d:\\d\\d.\\d\\d),([^,]*),([^,]*),(?:[^,]*,){4}([\\s\\S]*)$","i");function r(t=""){return t.split(/[:.]/).map((t,e,r)=>{if(e===r.length-1){if(1===t.length)return`.${t}00`;if(2===t.length)return`.${t}0`}else if(1===t.length)return(0===e?"0":":0")+t;return 0===e?t:e===r.length-1?`.${t}`:`:${t}`}).join("")}return`WEBVTT\n\n${t.split(/\r?\n/).map(t=>{const o=t.match(e);return o?{start:r(o[1].trim()),end:r(o[2].trim()),text:o[5].replace(/\{[\s\S]*?\}/g,"").replace(/(\\N)/g,"\n").trim().split(/\r?\n/).map(t=>t.trim()).join("\n")}:null}).filter(t=>t).map((t,e)=>t?`${e+1}\n${t.start} --\x3e ${t.end}\n${t.text}`:"").filter(t=>t.trim()).join("\n\n")}`}function lt(t=0){return new Promise(e=>setTimeout(e,t))}function ct(t,e){let r;return function(...o){clearTimeout(r),r=setTimeout(()=>(r=null,t.apply(this,o)),e)}}function dt(t,e){let r=!1;return function(...o){r||(t.apply(this,o),r=!0,setTimeout(()=>{r=!1},e))}}const pt=Object.freeze(Object.defineProperty({__proto__:null,ArtPlayerError:U,addClass:C,append:S,assToVtt:st,capitalize:Z,clamp:K,createElement:D,debounce:ct,def:tt,download:G,errorHandle:q,escape:Q,get:ot,getComposedPath:j,getExt:X,getIcon:N,getRect:H,getStyle:function(t,e,r=!0){const o=window.getComputedStyle(t,null).getPropertyValue(e);return r?Number.parseFloat(o):o},has:rt,hasClass:L,includeFromEvent:V,inverseClass:O,isBrowser:$,isIOS:w,isIOS13:x,isInViewport:_,isMobile:k,isSafari:b,loadImg:W,mergeDeep:at,query:T,queryAll:E,remove:M,removeClass:z,replaceElement:Y,secondToTime:J,setStyle:I,setStyleText:F,setStyles:P,siblings:A,sleep:lt,srtToVtt:nt,supportsFlex:B,throttle:dt,tooltip:R,unescape:function(t){const e={"&":"&","<":"<",">":">","'":"'",""":'"'},r=new RegExp(`(${Object.keys(e).join("|")})`,"g");return t.replace(r,t=>e[t]||t)},userAgent:y,vttToBlob:it},Symbol.toStringTag,{value:"Module"})),ht="array",ut="boolean",mt="string",ft="number",gt="object",vt="function";function yt(t,e,r){return q(e===mt||e===ft||t instanceof Element,`${r.join(".")} require '${mt}' or 'Element' type`)}const bt={html:yt,disable:`?${ut}`,name:`?${mt}`,index:`?${ft}`,style:`?${gt}`,click:`?${vt}`,mounted:`?${vt}`,tooltip:`?${mt}|${ft}`,width:`?${ft}`,selector:`?${ht}`,onSelect:`?${vt}`,switch:`?${ut}`,onSwitch:`?${vt}`,range:`?${ht}`,onRange:`?${vt}`,onChange:`?${vt}`},wt={id:mt,container:yt,url:mt,poster:mt,type:mt,theme:mt,lang:mt,volume:ft,isLive:ut,muted:ut,autoplay:ut,autoSize:ut,autoMini:ut,loop:ut,flip:ut,playbackRate:ut,aspectRatio:ut,screenshot:ut,setting:ut,hotkey:ut,pip:ut,mutex:ut,backdrop:ut,fullscreen:ut,fullscreenWeb:ut,subtitleOffset:ut,miniProgressBar:ut,useSSR:ut,playsInline:ut,lock:ut,gesture:ut,fastForward:ut,autoPlayback:ut,autoOrientation:ut,airplay:ut,proxy:`?${vt}`,plugins:[vt],layers:[bt],contextmenu:[bt],settings:[bt],controls:[c(l({},bt),{position:(t,e,r)=>{const o=["top","left","right"];return q(o.includes(t),`${r.join(".")} only accept ${o.toString()} as parameters`)}})],quality:[{default:`?${ut}`,html:mt,url:mt}],highlight:[{time:ft,text:mt}],thumbnails:{url:mt,number:ft,column:ft,width:ft,height:ft,scale:ft},subtitle:{url:mt,name:mt,type:mt,style:gt,escape:ut,encoding:mt,onVttLoad:vt},moreVideoAttr:gt,i18n:gt,icons:gt,cssVar:gt,customType:gt};class xt{constructor(t){this.id=0,this.art=t,this.cache=new Map,this.add=this.add.bind(this),this.remove=this.remove.bind(this),this.update=this.update.bind(this)}get show(){return L(this.art.template.$player,`art-${this.name}-show`)}set show(t){const{$player:e}=this.art.template,r=`art-${this.name}-show`;t?C(e,r):z(e,r),this.art.emit(this.name,t)}toggle(){this.show=!this.show}add(t){const e="function"===typeof t?t(this.art):t;if(e.html=e.html||"",f(e,bt),!this.$parent||!this.name||e.disable)return;const r=e.name||`${this.name}${this.id}`;q(!this.cache.has(r),`Can't add an existing [${r}] to the [${this.name}]`),this.id+=1;const o=D("div");C(o,`art-${this.name}`),C(o,`art-${this.name}-${r}`);const a=Array.from(this.$parent.children);o.dataset.index=e.index||this.id;const n=a.find(t=>Number(t.dataset.index)>=Number(o.dataset.index));n?n.insertAdjacentElement("beforebegin",o):S(this.$parent,o),e.html&&S(o,e.html),e.style&&P(o,e.style),e.tooltip&&R(o,e.tooltip);const i=[];if(e.click){const t=this.art.events.proxy(o,"click",t=>{t.preventDefault(),e.click.call(this.art,this,t)});i.push(t)}return e.selector&&["left","right"].includes(e.position)&&this.selector(e,o,i),this[r]=o,this.cache.set(r,{$ref:o,events:i,option:e}),e.mounted&&e.mounted.call(this.art,o),o}remove(t){q(this.cache.has(t),`Can't find [${t}] from the [${this.name}]`);const e=this.cache.get(t);e.option.beforeUnmount&&e.option.beforeUnmount.call(this.art,e.$ref);for(const r of e.events)this.art.events.remove(r);this.cache.delete(t),delete this[t],M(e.$ref)}update(t){if(this.cache.has(t.name)){const e=this.cache.get(t.name);t=Object.assign(e.option,t),this.remove(t.name)}return this.add(t)}}class kt extends xt{constructor(t){super(t),this.name="contextmenu",this.$parent=t.template.$contextmenu,k||this.init()}init(){const{option:t,proxy:e,template:{$player:r,$contextmenu:o}}=this.art;t.playbackRate&&this.add(function(t){return e=>{const{i18n:r,constructor:{PLAYBACK_RATE:o}}=e,a=o.map(t=>`${1===t?r.get("Normal"):t.toFixed(1)}`).join("");return c(l({},t),{html:`${r.get("Play Speed")}: ${a}`,click:(t,r)=>{const{value:o}=r.target.dataset;o&&(e.playbackRate=Number(o),t.show=!1)},mounted:t=>{const r=T('[data-value="1"]',t);r&&O(r,"art-current"),e.on("video:ratechange",()=>{const r=E("span",t).find(t=>Number(t.dataset.value)===e.playbackRate);r&&O(r,"art-current")})}})}}({name:"playbackRate",index:10})),t.aspectRatio&&this.add(function(t){return e=>{const{i18n:r,constructor:{ASPECT_RATIO:o}}=e,a=o.map(t=>`${"default"===t?r.get("Default"):t}`).join("");return c(l({},t),{html:`${r.get("Aspect Ratio")}: ${a}`,click:(t,r)=>{const{value:o}=r.target.dataset;o&&(e.aspectRatio=o,t.show=!1)},mounted:t=>{const r=T('[data-value="default"]',t);r&&O(r,"art-current"),e.on("aspectRatio",e=>{const r=E("span",t).find(t=>t.dataset.value===e);r&&O(r,"art-current")})}})}}({name:"aspectRatio",index:20})),t.flip&&this.add(function(t){return e=>{const{i18n:r,constructor:{FLIP:o}}=e,a=o.map(t=>`${r.get(Z(t))}`).join("");return c(l({},t),{html:`${r.get("Video Flip")}: ${a}`,click:(t,r)=>{const{value:o}=r.target.dataset;o&&(e.flip=o.toLowerCase(),t.show=!1)},mounted:t=>{const r=T('[data-value="normal"]',t);r&&O(r,"art-current"),e.on("flip",e=>{const r=E("span",t).find(t=>t.dataset.value===e);r&&O(r,"art-current")})}})}}({name:"flip",index:30})),this.add(function(t){return e=>c(l({},t),{html:e.i18n.get("Video Info"),click:t=>{e.info.show=!0,t.show=!1}})}({name:"info",index:40})),this.add(function(t){const e=$?location.href:"";return c(l({},t),{html:`ArtPlayer ${g}`})}({name:"version",index:50})),this.add(function(t){return e=>c(l({},t),{html:e.i18n.get("Close"),click:t=>{t.show=!1}})}({name:"close",index:60}));for(let a=0;a{if(!this.art.constructor.CONTEXTMENU)return;t.preventDefault(),this.show=!0;const e=t.clientX,a=t.clientY,{height:n,width:i,left:s,top:l}=H(r),{height:c,width:d}=H(o);let p=e-s,h=a-l;e+d>s+i&&(p=i-d),a+c>l+n&&(h=n-c),P(o,{top:`${h}px`,left:`${p}px`})}),e(r,"click",t=>{V(t,o)||(this.show=!1)}),this.art.on("blur",()=>{this.show=!1})}}function $t(t,e){const{$progress:r}=t.template,{left:o}=H(r),a=K((k?e.touches[0].clientX:e.clientX)-o,0,r.clientWidth),n=a/r.clientWidth*t.duration;return{second:n,time:J(n),width:a,percentage:K(a/r.clientWidth,0,1)}}function Tt(t,e){if(t.isRotate){const r=e.touches[0].clientY/t.height,o=r*t.duration;t.emit("setBar","played",r,e),t.seek=o}else{const{second:r,percentage:o}=$t(t,e);t.emit("setBar","played",o,e),t.seek=r}}function Et(t){return e=>{const{icons:r,option:o,proxy:a}=e,{$player:n,$progress:i}=e.template;return c(l({},t),{html:'\n
\n
\n
\n
\n
\n
\n
00:00
\n
\n ',mounted:t=>{let s=null,l=!1;const c=T(".art-progress-hover",t),d=T(".art-progress-loaded",t),p=T(".art-progress-played",t),h=T(".art-progress-highlight",t),u=T(".art-progress-indicator",t),m=T(".art-progress-tip",t);function f(r,o){const{width:a,time:n}=o||$t(e,r);m.textContent=n||"00:00";const i=m.clientWidth;a<=i/2?I(m,"left",0):a>t.clientWidth-i/2?I(m,"left",t.clientWidth-i+"px"):I(m,"left",a-i/2+"px")}r.indicator?S(u,r.indicator):I(u,"backgroundColor","var(--art-theme)"),e.on("setBar",function(r,o,a){const i="played"===r&&a&&k;if("loaded"===r&&I(d,"width",100*o+"%"),"hover"===r&&(I(c,"width",100*o+"%"),V(a,h)?function(r){const{width:o}=$t(e,r),{text:a}=r.target.dataset;m.textContent=a;const n=m.clientWidth;o<=n/2?I(m,"left",0):o>t.clientWidth-n/2?I(m,"left",t.clientWidth-n+"px"):I(m,"left",o-n/2+"px")}(a):f(a),0===o?z(n,"art-progress-hover"):C(n,"art-progress-hover")),"played"===r&&(I(p,"width",100*o+"%"),I(u,"left",100*o+"%")),i){C(n,"art-progress-hover");f(a,{width:t.clientWidth*o,time:J(o*e.duration)}),clearTimeout(s),s=setTimeout(()=>{z(n,"art-progress-hover")},500)}}),e.on("video:loadedmetadata",function(){h.textContent="";for(let t=0;t`;S(h,n)}}),e.constructor.USE_RAF?e.on("raf",()=>{e.emit("setBar","played",e.played),e.emit("setBar","loaded",e.loaded)}):(e.on("video:timeupdate",()=>{e.emit("setBar","played",e.played)}),e.on("video:progress",()=>{e.emit("setBar","loaded",e.loaded)}),e.on("video:ended",()=>{e.emit("setBar","played",1)})),e.emit("setBar","loaded",e.loaded||0),k||(a(i,"click",t=>{t.target!==u&&Tt(e,t)}),a(i,"mousemove",t=>{const{percentage:r}=$t(e,t);e.emit("setBar","hover",r,t)}),a(i,"mouseleave",t=>{e.emit("setBar","hover",0,t)}),a(i,"mousedown",t=>{l=0===t.button}),e.on("document:mousemove",t=>{if(l){const{second:r,percentage:o}=$t(e,t);e.emit("setBar","played",o,t),e.seek=r}}),e.on("document:mouseup",()=>{l&&(l=!1)}))}})}}class Ct extends xt{constructor(t){super(t),this.isHover=!1,this.name="control",this.timer=Date.now();const{constructor:e}=t,{$player:r,$bottom:o}=this.art.template;t.on("mousemove",()=>{k||(this.show=!0)}),t.on("click",()=>{k?this.toggle():this.show=!0}),t.on("document:mousemove",t=>{this.isHover=V(t,o)}),t.on("video:timeupdate",()=>{!t.setting.show&&!this.isHover&&!t.isInput&&t.playing&&this.show&&Date.now()-this.timer>=e.CONTROL_HIDE_TIME&&(this.show=!1)}),t.on("control",t=>{t?(z(r,"art-hide-cursor"),C(r,"art-hover"),this.timer=Date.now()):(C(r,"art-hide-cursor"),z(r,"art-hover"))}),this.init()}init(){const{option:t}=this.art;t.isLive||this.add(Et({name:"progress",position:"top",index:10})),this.add({name:"thumbnails",position:"top",index:20}),this.add(function(t){return e=>c(l({},t),{mounted:t=>{const{proxy:r,icons:o,i18n:a}=e,n=S(t,o.play),i=S(t,o.pause);function s(){I(n,"display","flex"),I(i,"display","none")}function l(){I(n,"display","none"),I(i,"display","flex")}R(n,a.get("Play")),R(i,a.get("Pause")),r(n,"click",()=>{e.play()}),r(i,"click",()=>{e.pause()}),e.playing?l():s(),e.on("video:playing",()=>{l()}),e.on("video:pause",()=>{s()})}})}({name:"playAndPause",position:"left",index:10})),this.add(function(t){return e=>c(l({},t),{mounted:t=>{const{proxy:r,icons:o}=e,a=S(t,o.volume),n=S(t,o.volumeClose),i=S(t,'
'),s=S(i,'
'),l=S(s,'
'),c=S(s,'
'),d=S(c,'
'),p=S(d,'
'),h=S(c,'
');function u(t){const{top:e,height:r}=H(c);return 1-(t.clientY-e)/r}function m(){if(e.muted||0===e.volume)I(a,"display","none"),I(n,"display","flex"),I(h,"top","100%"),I(p,"top","100%"),l.textContent=0;else{const t=100*e.volume;I(a,"display","flex"),I(n,"display","none"),I(h,"top",100-t+"%"),I(p,"top",100-t+"%"),l.textContent=Math.floor(t)}}if(m(),e.on("video:volumechange",m),r(a,"click",()=>{e.muted=!0}),r(n,"click",()=>{e.muted=!1}),k)I(i,"display","none");else{let t=!1;r(c,"mousedown",r=>{t=0===r.button,e.volume=u(r)}),e.on("document:mousemove",r=>{t&&(e.muted=!1,e.volume=u(r))}),e.on("document:mouseup",()=>{t&&(t=!1)})}}})}({name:"volume",position:"left",index:20})),t.isLive||this.add(function(t){return e=>c(l({},t),{style:k?{fontSize:"12px",padding:"0 5px"}:{cursor:"auto",padding:"0 10px"},mounted:t=>{function r(){const r=`${J(e.currentTime)} / ${J(e.duration)}`;r!==t.textContent&&(t.textContent=r)}r();const o=["video:loadedmetadata","video:timeupdate","video:progress"];for(let a=0;a{this.art.quality=t.quality}),t.screenshot&&!k&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Screenshot"),mounted:t=>{const{proxy:r,icons:o}=e;S(t,o.screenshot),r(t,"click",()=>{e.screenshot()})}})}({name:"screenshot",position:"right",index:20})),t.setting&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Show Setting"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e;S(t,o.setting),r(t,"click",()=>{e.setting.toggle(),e.setting.resize()}),e.on("setting",e=>{R(t,a.get(e?"Hide Setting":"Show Setting"))})}})}({name:"setting",position:"right",index:30})),t.pip&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("PIP Mode"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e;S(t,o.pip),r(t,"click",()=>{e.pip=!e.pip}),e.on("pip",e=>{R(t,a.get(e?"Exit PIP Mode":"PIP Mode"))})}})}({name:"pip",position:"right",index:40})),t.airplay&&window.WebKitPlaybackTargetAvailabilityEvent&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("AirPlay"),mounted:t=>{const{proxy:r,icons:o}=e;S(t,o.airplay),r(t,"click",()=>e.airplay())}})}({name:"airplay",position:"right",index:50})),t.fullscreenWeb&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Web Fullscreen"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e,n=S(t,o.fullscreenWebOn),i=S(t,o.fullscreenWebOff);I(i,"display","none"),r(t,"click",()=>{e.fullscreenWeb=!e.fullscreenWeb}),e.on("fullscreenWeb",e=>{e?(R(t,a.get("Exit Web Fullscreen")),I(n,"display","none"),I(i,"display","inline-flex")):(R(t,a.get("Web Fullscreen")),I(n,"display","inline-flex"),I(i,"display","none"))})}})}({name:"fullscreenWeb",position:"right",index:60})),t.fullscreen&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Fullscreen"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e,n=S(t,o.fullscreenOn),i=S(t,o.fullscreenOff);I(i,"display","none"),r(t,"click",()=>{e.fullscreen=!e.fullscreen}),e.on("fullscreen",e=>{e?(R(t,a.get("Exit Fullscreen")),I(n,"display","none"),I(i,"display","inline-flex")):(R(t,a.get("Fullscreen")),I(n,"display","inline-flex"),I(i,"display","none"))})}})}({name:"fullscreen",position:"right",index:70}));for(let e=0;et.selector}),tt(e,"$control_item",{get:()=>r}),tt(e,"$control_value",{get:()=>a})}const i=o(n,"click",e=>d(this,null,function*(){const r=j(e),o=t.selector.find(t=>t.$control_item===r.find(e=>t.$control_item===e));this.check(o),t.onSelect&&(a.innerHTML=yield t.onSelect.call(this.art,o,o.$control_item,e))}));r.push(i)}}function zt(t,e,r,o){const a=e-o,n=r-t;let i=0;if(Math.abs(n)<2&&Math.abs(a)<2)return i;const s=function(t,e){return 180*Math.atan2(e,t)/Math.PI}(n,a);return s>=-45&&s<45?i=4:s>=45&&s<135?i=1:s>=-135&&s<-45?i=2:(s>=135&&s<=180||s>=-180&&s<-135)&&(i=3),i}class Lt{constructor(t){this.destroyEvents=new Set,this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),function(t,e){const{constructor:r,template:{$player:o,$video:a}}=t;function n(e){V(e,o)?(t.isInput="INPUT"===e.target.tagName,t.isFocus=!0,t.emit("focus",e)):(t.isInput=!1,t.isFocus=!1,t.emit("blur",e))}t.on("document:click",n),t.on("document:contextmenu",n);let i=[];e.proxy(a,"click",e=>{const o=Date.now();i.push(o);const{MOBILE_CLICK_PLAY:a,DBCLICK_TIME:n,MOBILE_DBCLICK_PLAY:s,DBCLICK_FULLSCREEN:l}=r,c=i.filter(t=>o-t<=n);switch(c.length){case 1:t.emit("click",e),k?!t.isLock&&a&&t.toggle():t.toggle(),i=c;break;case 2:t.emit("dblclick",e),k?!t.isLock&&s&&t.toggle():l&&(t.fullscreen=!t.fullscreen),i=[];break;default:i=[]}})}(t,this),function(t,e){const{$player:r}=t.template;e.hover(r,e=>{C(r,"art-hover"),t.emit("hover",!0,e)},e=>{z(r,"art-hover"),t.emit("hover",!1,e)})}(t,this),function(t,e){const{$player:r}=t.template;e.proxy(r,"mousemove",e=>{t.emit("mousemove",e)})}(t,this),function(t,e){const{option:r,constructor:o}=t;t.on("resize",()=>{const{aspectRatio:e,notice:o}=t;"standard"===t.state&&r.autoSize&&t.autoSize(),t.aspectRatio=e,o.show=""});const a=ct(()=>t.emit("resize"),o.RESIZE_TIME);t.on("window:orientationchange",()=>a()),t.on("window:resize",()=>a()),screen&&screen.orientation&&screen.orientation.onchange&&e.proxy(screen.orientation,"change",()=>a())}(t,this),function(t,e){if(k&&!t.option.isLive){const{$video:r,$progress:o}=t.template;let a=null,n=!1,i=0,s=0,l=0;const c=e=>{if(1===e.touches.length&&!t.isLock){a===o&&Tt(t,e),n=!0;const{pageX:r,pageY:c}=e.touches[0];i=r,s=c,l=t.currentTime}},d=e=>{if(1===e.touches.length&&n&&t.duration){const{pageX:o,pageY:n}=e.touches[0],c=zt(i,s,o,n),d=[3,4].includes(c),p=[1,2].includes(c);if(d&&!t.isRotate||p&&t.isRotate){const c=K((o-i)/t.width,-1,1),d=K((n-s)/t.height,-1,1),p=t.isRotate?d:c,h=a===r?t.constructor.TOUCH_MOVE_RATIO:1,u=K(l+t.duration*p*h,0,t.duration);t.seek=u,t.emit("setBar","played",K(u/t.duration,0,1),e),t.notice.show=`${J(u)} / ${J(t.duration)}`}}},p=()=>{n&&(i=0,s=0,l=0,n=!1,a=null)};t.option.gesture&&(e.proxy(r,"touchstart",t=>{a=r,c(t)}),e.proxy(r,"touchmove",d)),e.proxy(o,"touchstart",t=>{a=o,c(t)}),e.proxy(o,"touchmove",d),t.on("document:touchend",p)}}(t,this),function(t){const{option:e,constructor:r,template:{$container:o}}=t,a=dt(()=>{t.emit("view",_(o,r.SCROLL_GAP))},r.SCROLL_TIME);t.on("window:scroll",()=>a()),t.on("view",r=>{e.autoMini&&(t.mini=!r)})}(t),function(t,e){const r=["click","mouseup","keydown","touchend","touchmove","mousemove","pointerup","contextmenu","pointermove","visibilitychange","webkitfullscreenchange"],o=["resize","scroll","orientationchange"],a=[];function n(n={}){for(let t=0;t{const o=n.document||i.ownerDocument||document,s=e.proxy(o,r,e=>{t.emit(`document:${r}`,e)});a.push(s)}),o.forEach(r=>{var o;const s=n.window||(null==(o=i.ownerDocument)?void 0:o.defaultView)||window,l=e.proxy(s,r,e=>{t.emit(`window:${r}`,e)});a.push(l)})}n(),e.bindGlobalEvents=n}(t,this),function(t){if(t.constructor.USE_RAF){let e=null;!function r(){t.playing&&t.emit("raf"),t.isDestroy||(e=requestAnimationFrame(r))}(),t.on("destroy",()=>{cancelAnimationFrame(e)})}}(t)}proxy(t,e,r,o={}){if(Array.isArray(e))return e.map(e=>this.proxy(t,e,r,o));t.addEventListener(e,r,o);const a=()=>t.removeEventListener(e,r,o);return this.destroyEvents.add(a),a}hover(t,e,r){e&&this.proxy(t,"mouseenter",e),r&&this.proxy(t,"mouseleave",r)}remove(t){if(this.destroyEvents.has(t))try{t()}catch(e){console.warn("Failed to remove event listener:",e)}finally{this.destroyEvents.delete(t)}}destroy(){for(const e of this.destroyEvents)try{e()}catch(t){console.warn("Failed to destroy event listener:",t)}this.destroyEvents.clear()}}class St{constructor(t){this.art=t,this.keys={},k||this.init()}init(){const{constructor:t}=this.art;this.art.option.hotkey&&(this.add("Escape",()=>{this.art.fullscreenWeb&&(this.art.fullscreenWeb=!1)}),this.add("Space",()=>{this.art.toggle()}),this.add("ArrowLeft",()=>{this.art.backward=t.SEEK_STEP}),this.add("ArrowUp",()=>{this.art.volume+=t.VOLUME_STEP}),this.add("ArrowRight",()=>{this.art.forward=t.SEEK_STEP}),this.add("ArrowDown",()=>{this.art.volume-=t.VOLUME_STEP})),this.art.on("document:keydown",t=>{if(this.art.isFocus){const e=document.activeElement.tagName.toUpperCase(),r=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==r&&"true"!==r&&!t.altKey&&!t.ctrlKey&&!t.metaKey&&!t.shiftKey){const e=this.keys[t.code];if(e){t.preventDefault();for(let r=0;r\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',state:'\n\n\n',play:'\n \n',pause:'\n \n',check:'\n\n',volume:'\n \n \n',volumeClose:'\n \n \n',screenshot:'\n\t\n\n',setting:'\n \n \n',pip:'\n\n',arrowLeft:'\n \n',arrowRight:'\n \n',playbackRate:'',aspectRatio:'',config:'',lock:'\n\n\n\n\n',flip:'\n\n\n\n\n\n',unlock:'\n\n\n',fullscreenOff:'\n\n\n\n\n',fullscreenOn:'\n\n\n\n\n',fullscreenWebOff:'\n\n\n\n\n',fullscreenWebOn:'\n\n\n\n\n',switchOn:'\n\n\n \n',switchOff:'\n\n\n \n\n',error:'\n\n\n\n\n',close:'\n\n\n\n\n',airplay:'\n \n \n \n \n\n'},t.option.icons);for(const r in e)tt(this,r,{get:()=>N(r,e[r])})}}class At extends xt{constructor(t){super(t),this.name="info",k||this.init()}init(){const{proxy:t,constructor:e,template:{$infoPanel:r,$infoClose:o,$video:a}}=this.art;t(o,"click",()=>{this.show=!1});let n=null;const i=E("[data-video]",r)||[];this.art.on("destroy",()=>clearTimeout(n)),function t(){for(let e=0;e{I(a,"display","none"),I(n,"display",null)}),o.proxy(e.$state,"click",()=>t.play())}}class Vt{constructor(t){this.art=t,this.timer=null,t.on("destroy",()=>this.destroy())}destroy(){this.timer&&(clearTimeout(this.timer),this.timer=null)}set show(t){const{constructor:e,template:{$player:r,$noticeInner:o}}=this.art;t?(o.textContent=t instanceof Error?t.message.trim():t,C(r,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout(()=>{o.textContent="",z(r,"art-notice-show")},e.NOTICE_TIME)):z(r,"art-notice-show")}get show(){const{template:{$player:t}}=this.art;return t.classList.contains("art-notice-show")}}const Yt=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],Dt=(()=>{if("undefined"===typeof document)return!1;const t=Yt[0],e={};for(const r of Yt){if(r[1]in document){for(const[o,a]of r.entries())e[t[o]]=a;return e}}return!1})(),Nt={change:Dt.fullscreenchange,error:Dt.fullscreenerror},Ft={request:(t=document.documentElement,e)=>new Promise((r,o)=>{const a=()=>{Ft.off("change",a),r()};Ft.on("change",a);const n=t[Dt.requestFullscreen](e);n instanceof Promise&&n.then(a).catch(o)}),exit:()=>new Promise((t,e)=>{if(!Ft.isFullscreen)return void t();const r=()=>{Ft.off("change",r),t()};Ft.on("change",r);const o=document[Dt.exitFullscreen]();o instanceof Promise&&o.then(r).catch(e)}),toggle:(t,e)=>Ft.isFullscreen?Ft.exit():Ft.request(t,e),onchange(t){Ft.on("change",t)},onerror(t){Ft.on("error",t)},on(t,e){const r=Nt[t];r&&document.addEventListener(r,e,!1)},off(t,e){const r=Nt[t];r&&document.removeEventListener(r,e,!1)},raw:Dt};function Bt(t){const{i18n:e,notice:r,template:{$video:o,$player:a}}=t,n=t=>{Ft.on("change",()=>{t.emit("fullscreen",Ft.isFullscreen),Ft.isFullscreen?(t.state="fullscreen",C(a,"art-fullscreen")):z(a,"art-fullscreen"),t.emit("resize")}),Ft.on("error",e=>{t.emit("fullscreenError",e)}),tt(t,"fullscreen",{get:()=>Ft.isFullscreen,set(t){return d(this,null,function*(){t?yield Ft.request(a):yield Ft.exit()})}})};t.once("video:loadedmetadata",()=>{var a;Ft.isEnabled?n(t):o.webkitSupportsFullscreen?((a=t).on("document:webkitfullscreenchange",()=>{a.emit("fullscreen",a.fullscreen),a.emit("resize")}),tt(a,"fullscreen",{get:()=>document.fullscreenElement===o,set(t){t?(a.state="fullscreen",o.webkitEnterFullscreen()):o.webkitExitFullscreen()}})):tt(t,"fullscreen",{get:()=>!1,set(){r.show=e.get("Fullscreen Not Supported")}}),tt(t,"fullscreen",ot(t,"fullscreen"))})}function Ht(t){const{icons:e,proxy:r,storage:o,template:{$player:a,$video:n}}=t;let i=!1,s=0,l=0;function c(){const{$mini:e}=t.template;e&&(z(a,"art-mini"),I(e,"display","none"),a.prepend(n),t.emit("mini",!1))}function d(e,r){t.playing?(I(e,"display","none"),I(r,"display","flex")):(I(e,"display","flex"),I(r,"display","none"))}function p(){const{$mini:e}=t.template,r=H(e),a=window.innerHeight-r.height-50,n=window.innerWidth-r.width-50;o.set("top",a),o.set("left",n),I(e,"top",`${a}px`),I(e,"left",`${n}px`)}tt(t,"mini",{get:()=>L(a,"art-mini"),set(h){if(h){t.state="mini",C(a,"art-mini");const h=function(){const{$mini:a}=t.template;if(a)return S(a,n),I(a,"display","flex");{const a=D("div");C(a,"art-mini-popup"),S(document.body,a),t.template.$mini=a,S(a,n);const p=S(a,'
');S(p,e.close),r(p,"click",c);const h=S(a,'
'),u=S(h,e.play),m=S(h,e.pause);return r(u,"click",()=>t.play()),r(m,"click",()=>t.pause()),d(u,m),t.on("video:playing",()=>d(u,m)),t.on("video:pause",()=>d(u,m)),t.on("video:timeupdate",()=>d(u,m)),r(a,"mousedown",t=>{i=0===t.button,s=t.pageX,l=t.pageY}),t.on("document:mousemove",t=>{if(i){C(a,"art-mini-dragging");const e=t.pageX-s,r=t.pageY-l;I(a,"transform",`translate(${e}px, ${r}px)`)}}),t.on("document:mouseup",()=>{if(i){i=!1,z(a,"art-mini-dragging");const t=H(a);o.set("left",t.left),o.set("top",t.top),I(a,"left",`${t.left}px`),I(a,"top",`${t.top}px`),I(a,"transform",null)}}),a}}(),u=o.get("top"),m=o.get("left");"number"===typeof u&&"number"===typeof m?(I(h,"top",`${u}px`),I(h,"left",`${m}px`),_(h)||p()):p(),t.emit("mini",!0)}else c()}})}function Wt(t){const{i18n:e,notice:r,template:{$video:o}}=t;document.pictureInPictureEnabled?function(t){const{template:{$video:e},proxy:r,notice:o}=t;e.disablePictureInPicture=!1,tt(t,"pip",{get:()=>document.pictureInPictureElement,set(r){r?(t.state="pip",e.requestPictureInPicture().catch(t=>{throw o.show=t,t})):document.exitPictureInPicture().catch(t=>{throw o.show=t,t})}}),r(e,"enterpictureinpicture",()=>{t.emit("pip",!0)}),r(e,"leavepictureinpicture",()=>{t.emit("pip",!1)})}(t):o.webkitSupportsPresentationMode?function(t){const{$video:e}=t.template;e.webkitSetPresentationMode("inline"),tt(t,"pip",{get:()=>"picture-in-picture"===e.webkitPresentationMode,set(r){r?(t.state="pip",e.webkitSetPresentationMode("picture-in-picture"),t.emit("pip",!0)):(e.webkitSetPresentationMode("inline"),t.emit("pip",!1))}})}(t):tt(t,"pip",{get:()=>!1,set(){r.show=e.get("PIP Not Supported")}})}function jt(t){const{option:e,template:{$progress:r,$video:o}}=t;let a=null,n=!1,i=null;t.on("setBar",(a,s,l)=>d(null,null,function*(){var c;const d=null==(c=t.controls)?void 0:c.thumbnails,{url:p,scale:h}=e.thumbnails;if(!d||!p)return;if("hover"===a||"played"===a&&l&&k){if(i||n||(n=!0,i=yield W(p,h),n=!1),!i)return;const a=r.clientWidth*s;a>0&&ar.clientWidth-u/2?I(s,"left",r.clientWidth-u+"px"):I(s,"left",a-u/2+"px")}(a)}})),tt(t,"thumbnails",{get:()=>t.option.thumbnails,set(e){e.url&&!t.option.isLive&&(t.option.thumbnails=e,clearTimeout(a),a=null,n=!1,i=null)}})}Object.defineProperties(Ft,{isFullscreen:{get:()=>Boolean(document[Dt.fullscreenElement])},element:{enumerable:!0,get:()=>document[Dt.fullscreenElement]},isEnabled:{enumerable:!0,get:()=>Boolean(document[Dt.fullscreenEnabled])}});class Ut{constructor(t){!function(t){const{option:e,template:{$video:r}}=t;tt(t,"url",{get:()=>r.src,set(o){return d(this,null,function*(){if(o){const a=t.url,n=e.type||X(o),i=e.customType[n];n&&i?(yield lt(),t.loading.show=!0,i.call(t,r,o,t)):(URL.revokeObjectURL(a),r.src=o),a!==t.url&&(t.option.url=o,t.isReady&&a&&t.once("video:canplay",()=>{t.emit("restart",o)}))}else yield lt(),t.loading.show=!0})}})}(t),function(t){const{template:{$video:e}}=t;tt(t,"attr",{value(t,r){if(void 0===r)return e[t];e[t]=r}})}(t),function(t){const{i18n:e,notice:r,option:o,constructor:{instances:a},template:{$video:n}}=t;tt(t,"play",{value(){return d(this,null,function*(){const i=yield n.play();if(r.show=e.get("Play"),t.emit("play"),o.mutex)for(let e=0;et.playing?t.pause():t.play()})}(t),function(t){const{notice:e}=t;tt(t,"seek",{set(r){t.currentTime=r,t.duration&&(e.show=`${J(t.currentTime)} / ${J(t.duration)}`),t.emit("seek",t.currentTime,r)}}),tt(t,"forward",{set(e){t.seek=t.currentTime+e}}),tt(t,"backward",{set(e){t.seek=t.currentTime-e}})}(t),function(t){const{template:{$video:e},i18n:r,notice:o,storage:a}=t;tt(t,"volume",{get:()=>e.volume||0,set:t=>{e.volume=K(t,0,1),o.show=`${r.get("Volume")}: ${Number.parseInt(100*e.volume,10)}`,0!==e.volume&&a.set("volume",e.volume)}}),tt(t,"muted",{get:()=>e.muted,set:r=>{e.muted=r,t.emit("muted",r)}})}(t),function(t){const{$video:e}=t.template;tt(t,"currentTime",{get:()=>e.currentTime||0,set:r=>{r=Number.parseFloat(r),Number.isNaN(r)||(e.currentTime=K(r,0,t.duration))}})}(t),function(t){tt(t,"duration",{get:()=>{const{duration:e}=t.template.$video;return e===1/0?0:e||0}})}(t),function(t){function e(e,r){return new Promise((o,a)=>{if(e===t.url)return void o();const{playing:n,aspectRatio:i,playbackRate:s}=t;t.pause(),t.url=e,t.notice.show="";const l={error:e=>{t.off("video:canplay",l.canplay),t.off("video:loadedmetadata",l.metadata),a(e)},metadata:()=>{t.currentTime=r},canplay:()=>d(null,null,function*(){t.off("video:error",l.error),t.playbackRate=s,t.aspectRatio=i,n&&(yield t.play()),t.notice.show="",o()})};t.once("video:error",l.error),t.once("video:loadedmetadata",l.metadata),t.once("video:canplay",l.canplay)})}tt(t,"switchQuality",{value:r=>e(r,t.currentTime)}),tt(t,"switchUrl",{value:t=>e(t,0)}),tt(t,"switch",{set:t.switchUrl})}(t),function(t){const{template:{$video:e},i18n:r,notice:o}=t;tt(t,"playbackRate",{get:()=>e.playbackRate,set(a){if(a){if(a===e.playbackRate)return;e.playbackRate=a,o.show=`${r.get("Rate")}: ${1===a?r.get("Normal"):`${a}x`}`}else t.playbackRate=1}})}(t),function(t){const{i18n:e,notice:r,template:{$video:o,$player:a}}=t;tt(t,"aspectRatio",{get:()=>a.dataset.aspectRatio||"default",set(n){if(n||(n="default"),"default"===n)I(o,"width",null),I(o,"height",null),I(o,"margin",null),delete a.dataset.aspectRatio;else{const t=n.split(":").map(Number),{clientWidth:e,clientHeight:r}=a,i=e/r,s=t[0]/t[1];i>s?(I(o,"width",s*r+"px"),I(o,"height","100%"),I(o,"margin","0 auto")):(I(o,"width","100%"),I(o,"height",e/s+"px"),I(o,"margin","auto 0")),a.dataset.aspectRatio=n}r.show=`${e.get("Aspect Ratio")}: ${"default"===n?e.get("Default"):n}`,t.emit("aspectRatio",n)}})}(t),function(t){const{notice:e,template:{$video:r}}=t,o=D("canvas");tt(t,"getDataURL",{value:()=>new Promise((t,a)=>{try{o.width=r.videoWidth,o.height=r.videoHeight,o.getContext("2d").drawImage(r,0,0),t(o.toDataURL("image/png"))}catch(n){e.show=n,a(n)}})}),tt(t,"getBlobUrl",{value:()=>new Promise((t,a)=>{try{o.width=r.videoWidth,o.height=r.videoHeight,o.getContext("2d").drawImage(r,0,0),o.toBlob(e=>{t(URL.createObjectURL(e))})}catch(n){e.show=n,a(n)}})}),tt(t,"screenshot",{value:e=>d(null,null,function*(){const o=yield t.getDataURL();return G(o,`${e||`artplayer_${J(r.currentTime)}`}.png`),t.emit("screenshot",o),o})})}(t),Bt(t),function(t){const{constructor:e,template:{$container:r,$player:o}}=t;let a="";tt(t,"fullscreenWeb",{get:()=>L(o,"art-fullscreen-web"),set(n){n?(a=o.style.cssText,e.FULLSCREEN_WEB_IN_BODY&&S(document.body,o),t.state="fullscreenWeb",I(o,"width","100%"),I(o,"height","100%"),C(o,"art-fullscreen-web"),t.emit("fullscreenWeb",!0)):(e.FULLSCREEN_WEB_IN_BODY&&S(r,o),a&&(o.style.cssText=a,a=""),z(o,"art-fullscreen-web"),t.emit("fullscreenWeb",!1)),t.emit("resize")}})}(t),Wt(t),function(t){const{$video:e}=t.template;tt(t,"loaded",{get:()=>t.loadedTime/e.duration}),tt(t,"loadedTime",{get:()=>e.buffered.length?e.buffered.end(e.buffered.length-1):0})}(t),function(t){tt(t,"played",{get:()=>t.currentTime/t.duration})}(t),function(t){const{$video:e}=t.template;tt(t,"playing",{get:()=>"boolean"===typeof e.playing?e.playing:!!(e.currentTime>0&&!e.paused&&!e.ended&&e.readyState>2)})}(t),function(t){const{$container:e,$player:r,$video:o}=t.template;tt(t,"autoSize",{value(){const{videoWidth:a,videoHeight:n}=o,{width:i,height:s}=H(e),l=a/n;if(i/s>l)I(r,"width",s*l/i*100+"%"),I(r,"height","100%");else{const t=i/l/s*100;I(r,"width","100%"),I(r,"height",`${t}%`)}t.emit("autoSize",{width:t.width,height:t.height})}})}(t),function(t){tt(t,"rect",{get:()=>H(t.template.$player)});const e=["bottom","height","left","right","top","width"];for(let r=0;rt.rect[o]})}tt(t,"x",{get:()=>t.left+window.pageXOffset}),tt(t,"y",{get:()=>t.top+window.pageYOffset})}(t),function(t){const{template:{$player:e},i18n:r,notice:o}=t;tt(t,"flip",{get:()=>e.dataset.flip||"normal",set(a){a||(a="normal"),"normal"===a?delete e.dataset.flip:e.dataset.flip=a,o.show=`${r.get("Video Flip")}: ${r.get(Z(a))}`,t.emit("flip",a)}})}(t),Ht(t),function(t){const{template:{$poster:e}}=t;tt(t,"poster",{get:()=>{try{return e.style.backgroundImage.match(/"(.*)"/)[1]}catch(t){return""}},set(t){I(e,"backgroundImage",`url(${t})`)}})}(t),function(t){const{template:{$container:e,$video:r}}=t;tt(t,"autoHeight",{value(){const{clientWidth:o}=e,{videoHeight:a,videoWidth:n}=r,i=a*(o/n);I(e,"height",`${i}px`),t.emit("autoHeight",i)}})}(t),function(t){const{$player:e}=t.template;tt(t,"cssVar",{value:(t,r)=>r?e.style.setProperty(t,r):getComputedStyle(e).getPropertyValue(t)})}(t),function(t){tt(t,"theme",{get:()=>t.cssVar("--art-theme"),set(e){t.cssVar("--art-theme",e)}})}(t),function(t){tt(t,"type",{get:()=>t.option.type,set(e){t.option.type=e}})}(t),function(t){const e=["mini","pip","fullscreen","fullscreenWeb"];tt(t,"state",{get:()=>e.find(e=>t[e])||"standard",set(r){for(let o=0;o{switch(t.availability){case"available":n=!0;break;case"not-available":n=!1}}):n=!1,tt(t,"airplay",{value(){n?(a.webkitShowPlaybackTargetPicker(),t.emit("airplay")):r.show=e.get("AirPlay Not Available")}})}(t),function(t){tt(t,"quality",{set(e){const{controls:r,notice:o,i18n:a}=t,n=e.find(t=>t.default)||e[0];r.update({name:"quality",position:"right",index:10,style:{marginRight:"10px"},html:(null==n?void 0:n.html)||"",selector:e,onSelect(e){return d(this,null,function*(){return yield t.switchQuality(e.url),o.show=`${a.get("Switch Video")}: ${e.html}`,e.html})}})}})}(t),jt(t),function(t){const{i18n:e,notice:r,option:o,constructor:a,proxy:n,template:{$player:i,$video:s,$poster:l}}=t;let c=0;for(let d=0;d{t.emit(`video:${e.type}`,e)});t.on("video:canplay",()=>{c=0,t.loading.show=!1}),t.once("video:canplay",()=>{t.loading.show=!1,t.controls.show=!0,t.mask.show=!0,t.isReady=!0,t.emit("ready")}),t.on("video:ended",()=>{o.loop?(t.seek=0,t.play(),t.controls.show=!1,t.mask.show=!1):(t.controls.show=!0,t.mask.show=!0)}),t.on("video:error",n=>d(null,null,function*(){c{t.emit("resize"),k&&(t.loading.show=!1,t.controls.show=!0,t.mask.show=!0)}),t.on("video:loadstart",()=>{t.loading.show=!0,t.mask.show=!1,t.controls.show=!0}),t.on("video:pause",()=>{t.controls.show=!0,t.mask.show=!0}),t.on("video:play",()=>{t.mask.show=!1,I(l,"display","none")}),t.on("video:playing",()=>{t.mask.show=!1}),t.on("video:progress",()=>{t.playing&&(t.loading.show=!1)}),t.on("video:seeked",()=>{t.loading.show=!1,t.mask.show=!0}),t.on("video:seeking",()=>{t.loading.show=!0,t.mask.show=!1}),t.on("video:timeupdate",()=>{t.mask.show=!1}),t.on("video:waiting",()=>{t.loading.show=!0,t.mask.show=!1})}(t),function(t){const{option:e,storage:r,template:{$video:o,$poster:a}}=t;for(const i in e.moreVideoAttr)t.attr(i,e.moreVideoAttr[i]);e.muted&&(t.muted=e.muted),e.volume&&(o.volume=K(e.volume,0,1));const n=r.get("volume");"number"===typeof n&&(o.volume=K(n,0,1)),e.poster&&I(a,"backgroundImage",`url(${e.poster})`),e.autoplay&&(o.autoplay=e.autoplay),e.playsInline&&(o.playsInline=!0,o["webkit-playsinline"]=!0),e.theme&&(e.cssVar["--art-theme"]=e.theme);for(const i in e.cssVar)t.cssVar(i,e.cssVar[i]);t.url=e.url}(t)}}function qt(t){const{notice:e,constructor:r,template:{$player:o,$video:a}}=t,n="art-auto-orientation",i="art-auto-orientation-fullscreen";let s=!1;function l(){const{videoWidth:t,videoHeight:e}=a,r=document.documentElement.clientWidth,o=document.documentElement.clientHeight;return t>e&&ro}return t.on("fullscreenWeb",e=>{var a;if(e){if(l()){const e=Number(null!=(a=r.AUTO_ORIENTATION_TIME)?a:0);setTimeout(()=>{t.fullscreenWeb&&!L(o,n)&&function(){const e=document.documentElement.clientWidth,r=document.documentElement.clientHeight;I(o,"width",`${r}px`),I(o,"height",`${e}px`),I(o,"transform-origin","0 0"),I(o,"transform",`rotate(90deg) translate(0, -${e}px)`),C(o,n),t.isRotate=!0,t.emit("resize")}()},e)}}else L(o,n)&&(I(o,"width",""),I(o,"height",""),I(o,"transform-origin",""),I(o,"transform",""),z(o,n),t.isRotate=!1,t.emit("resize"))}),t.on("fullscreen",t=>d(null,null,function*(){var r;const a=!!(null==(r=null==screen?void 0:screen.orientation)?void 0:r.lock);if(t){if(a&&l())try{const t=screen.orientation.type.startsWith("portrait")?"landscape":"portrait";yield screen.orientation.lock(t),s=!0,C(o,i)}catch(n){s=!1,e.show=n}}else if(L(o,i)&&z(o,i),a&&s){try{screen.orientation.unlock()}catch(c){}s=!1}})),{name:"autoOrientation",get state(){return L(o,n)}}}function Xt(t){const{i18n:e,icons:r,storage:o,constructor:a,proxy:n,template:{$poster:i}}=t,s=t.layers.add({name:"auto-playback",html:'\n
\n
\n
\n '}),l=T(".art-auto-playback-last",s),c=T(".art-auto-playback-jump",s),d=T(".art-auto-playback-close",s);S(d,r.close);let p=null;function h(){const r=(o.get("times")||{})[t.option.id||t.option.url];clearTimeout(p),I(s,"display","none"),r&&r>=a.AUTO_PLAYBACK_MIN&&(I(s,"display","flex"),l.textContent=`${e.get("Last Seen")} ${J(r)}`,c.textContent=e.get("Jump Play"),n(d,"click",()=>{I(s,"display","none")}),n(c,"click",()=>{t.seek=r,t.play(),I(i,"display","none"),I(s,"display","none")}),t.once("video:timeupdate",()=>{p=setTimeout(()=>{I(s,"display","none")},a.AUTO_PLAYBACK_TIMEOUT)}))}return t.on("video:timeupdate",()=>{if(t.playing){const e=o.get("times")||{},r=Object.keys(e);r.length>a.AUTO_PLAYBACK_MAX&&delete e[r[0]],e[t.option.id||t.option.url]=t.currentTime,o.set("times",e)}}),t.on("ready",h),t.on("restart",h),{name:"auto-playback",get times(){return o.get("times")||{}},clear:()=>o.del("times"),delete(t){const e=o.get("times")||{};return delete e[t],o.set("times",e),e}}}function Gt(t){const{constructor:e,proxy:r,template:{$player:o,$video:a}}=t;let n=null,i=!1,s=1;const l=()=>{clearTimeout(n),i&&(i=!1,t.playbackRate=s,z(o,"art-fast-forward"))};return r(a,"touchstart",r=>{1===r.touches.length&&t.playing&&!t.isLock&&(n=setTimeout(()=>{i=!0,s=t.playbackRate,t.playbackRate=e.FAST_FORWARD_VALUE,C(o,"art-fast-forward")},e.FAST_FORWARD_TIME))}),t.on("document:touchmove",l),t.on("document:touchend",l),{name:"fastForward",get state(){return L(o,"art-fast-forward")}}}function Kt(t){const{layers:e,icons:r,template:{$player:o}}=t;function a(){return L(o,"art-lock")}function n(){C(o,"art-lock"),t.isLock=!0,t.emit("lock",!0)}function i(){z(o,"art-lock"),t.isLock=!1,t.emit("lock",!1)}return e.add({name:"lock",mounted(e){const o=S(e,r.lock),a=S(e,r.unlock);I(o,"display","none"),t.on("lock",t=>{t?(I(o,"display","inline-flex"),I(a,"display","none")):(I(o,"display","none"),I(a,"display","inline-flex"))})},click(){a()?i():n()}}),{name:"lock",get state(){return a()},set state(t){t?n():i()}}}function Zt(t){return t.on("control",e=>{e?z(t.template.$player,"art-mini-progress-bar"):C(t.template.$player,"art-mini-progress-bar")}),{name:"mini-progress-bar"}}class Jt{constructor(t){this.art=t,this.id=0;const{option:e}=t;e.miniProgressBar&&!e.isLive&&this.add(Zt),e.lock&&k&&this.add(Kt),e.autoPlayback&&!e.isLive&&this.add(Xt),e.autoOrientation&&k&&this.add(qt),e.fastForward&&k&&!e.isLive&&this.add(Gt);for(let r=0;rthis.next(t,e)):this.next(t,e)}next(t,e){const r=e&&e.name||t.name||`plugin${this.id}`;return q(!rt(this,r),`Cannot add a plugin that already has the same name: ${r}`),tt(this,r,{value:e}),this}}class Qt extends xt{constructor(t){super(t);const{option:e,controls:r,template:{$setting:o}}=t;this.name="setting",this.$parent=o,this.id=0,this.active=null,this.cache=new Map,this.option=[...this.builtin,...e.settings],e.setting&&(this.format(),this.render(),t.on("blur",()=>{this.show&&(this.show=!1,this.render())}),t.on("focus",t=>{const e=V(t,r.setting),o=V(t,this.$parent);!this.show||e||o||(this.show=!1,this.render())}),t.on("resize",()=>this.resize()))}get builtin(){const t=[],{option:e}=this.art;return e.playbackRate&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:o,PLAYBACK_RATE:a}}=t;function n(t){return 1===t?e.get("Normal"):t.toFixed(1)}function i(){const e=t.setting.find(`playback-rate-${t.playbackRate}`);t.setting.check(e)}return{width:o,name:"playback-rate",html:e.get("Play Speed"),tooltip:n(t.playbackRate),icon:r.playbackRate,selector:a.map(e=>({value:e,name:`playback-rate-${e}`,default:e===t.playbackRate,html:n(e)})),onSelect:e=>(t.playbackRate=e.value,e.html),mounted:()=>{i(),t.on("video:ratechange",()=>i())}}}(this.art)),e.aspectRatio&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:o,ASPECT_RATIO:a}}=t;function n(t){return"default"===t?e.get("Default"):t}function i(){const e=t.setting.find(`aspect-ratio-${t.aspectRatio}`);t.setting.check(e)}return{width:o,name:"aspect-ratio",html:e.get("Aspect Ratio"),icon:r.aspectRatio,tooltip:n(t.aspectRatio),selector:a.map(e=>({value:e,name:`aspect-ratio-${e}`,default:e===t.aspectRatio,html:n(e)})),onSelect:e=>(t.aspectRatio=e.value,e.html),mounted:()=>{i(),t.on("aspectRatio",()=>i())}}}(this.art)),e.flip&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:o,FLIP:a}}=t;function n(t){return e.get(Z(t))}function i(){const e=t.setting.find(`flip-${t.flip}`);t.setting.check(e)}return{width:o,name:"flip",html:e.get("Video Flip"),tooltip:n(t.flip),icon:r.flip,selector:a.map(e=>({value:e,name:`flip-${e}`,default:e===t.flip,html:n(e)})),onSelect:e=>(t.flip=e.value,e.html),mounted:()=>{i(),t.on("flip",()=>i())}}}(this.art)),e.subtitleOffset&&t.push(function(t){const{i18n:e,icons:r,constructor:o}=t;return{width:o.SETTING_ITEM_WIDTH,name:"subtitle-offset",html:e.get("Subtitle Offset"),icon:r.subtitle,tooltip:"0s",range:[0,-10,10,.1],onChange:e=>(t.subtitleOffset=e.range[0],`${e.range[0]}s`),mounted:(e,r)=>{t.on("subtitleOffset",t=>{r.$range.value=t,r.tooltip=`${t}s`})}}}(this.art)),t}traverse(t,e=this.option){var r;for(let o=0;o{e.default=e===t,e.default&&e.$item&&O(e.$item,"art-current")},t.$option),this.render(t.$parents))}format(t=this.option,e,r,o=[]){for(let a=0;ae}),tt(n,"$parents",{get:()=>r}),tt(n,"$option",{get:()=>t});const o=[];tt(n,"$events",{get:()=>o}),tt(n,"$formatted",{get:()=>!0})}this.format(n.selector||[],n,t,o)}this.option=t}find(t=""){let e=null;return this.traverse(r=>{r.name===t&&(e=r)}),e}resize(){var t,e;const{controls:r,constructor:{SETTING_WIDTH:o,SETTING_ITEM_HEIGHT:a},template:{$player:n,$setting:i}}=this.art;if(r.setting&&this.show){const s=(null==(e=null==(t=this.active[0])?void 0:t.$parent)?void 0:e.width)||o,{left:l,width:c}=H(r.setting),{left:d,width:p}=H(n),h=l-d+c/2-s/2;if(I(i,"height",`${this.active===this.option?this.active.length*a:(this.active.length+1)*a}px`),I(i,"width",`${s}px`),this.art.isRotate||k)return;h+s>p?(I(i,"left",null),I(i,"right",null)):(I(i,"left",`${h}px`),I(i,"right","auto"))}}inactivate(t){for(let e=0;e'),s=D("div");C(s,"art-setting-item-left-icon"),S(s,o),S(i,s),S(i,t.$parent.html);const l=r(n,"click",()=>this.render(t.$parents));t.$parent.$events.push(l),S(e,n)}createItem(t,e=!1){var r,o;if(!this.cache.has(t.$option))return;const a=this.cache.get(t.$option),n=t.$item;let i="selector";rt(t,"switch")&&(i="switch"),rt(t,"range")&&(i="range"),rt(t,"onClick")&&(i="button");const{icons:s,proxy:l,constructor:c}=this.art,p=D("div");C(p,"art-setting-item"),I(p,"height",`${c.SETTING_ITEM_HEIGHT}px`),p.dataset.name=t.name||"",p.dataset.value=t.value||"";const h=S(p,'
'),u=S(p,'
'),m=D("div");switch(C(m,"art-setting-item-left-icon"),i){case"button":case"switch":case"range":S(m,t.icon||s.config);break;case"selector":(null==(r=t.selector)?void 0:r.length)?S(m,t.icon||s.config):S(m,s.check)}S(h,m),tt(t,"$icon",{configurable:!0,get:()=>m}),tt(t,"icon",{configurable:!0,get:()=>m.innerHTML,set(t){m.innerHTML="",S(m,t)}});const f=D("div");C(f,"art-setting-item-left-text"),S(f,t.html||""),S(h,f),tt(t,"$html",{configurable:!0,get:()=>f}),tt(t,"html",{configurable:!0,get:()=>f.innerHTML,set(t){f.innerHTML="",S(f,t)}});const g=D("div");switch(C(g,"art-setting-item-right-tooltip"),S(g,t.tooltip||""),S(u,g),tt(t,"$tooltip",{configurable:!0,get:()=>g}),tt(t,"tooltip",{configurable:!0,get:()=>g.innerHTML,set(t){g.innerHTML="",S(g,t)}}),i){case"switch":{const e=D("div");C(e,"art-setting-item-right-icon");const r=S(e,s.switchOn),o=S(e,s.switchOff);I(t.switch?o:r,"display","none"),S(u,e),tt(t,"$switch",{configurable:!0,get:()=>e});let a=t.switch;tt(t,"switch",{configurable:!0,get:()=>a,set(t){a=t,t?(I(o,"display","none"),I(r,"display",null)):(I(o,"display",null),I(r,"display","none"))}});break}case"range":{const e=D("div");C(e,"art-setting-item-right-icon");const r=S(e,'');r.value=t.range[0],r.min=t.range[1],r.max=t.range[2],r.step=t.range[3],C(r,"art-setting-range"),S(u,e),tt(t,"$range",{configurable:!0,get:()=>r});let o=[...t.range];tt(t,"range",{configurable:!0,get:()=>o,set(t){o=[...t],r.value=t[0],r.min=t[1],r.max=t[2],r.step=t[3]}})}break;case"selector":if(null==(o=t.selector)?void 0:o.length){const t=D("div");C(t,"art-setting-item-right-icon"),S(t,s.arrowRight),S(u,t)}}switch(i){case"switch":if(t.onSwitch){const e=l(p,"click",e=>d(this,null,function*(){t.switch=yield t.onSwitch.call(this.art,t,p,e)}));t.$events.push(e)}break;case"range":if(t.$range){if(t.onRange){const e=l(t.$range,"change",e=>d(this,null,function*(){t.range[0]=t.$range.valueAsNumber,t.tooltip=yield t.onRange.call(this.art,t,p,e)}));t.$events.push(e)}if(t.onChange){const e=l(t.$range,"input",e=>d(this,null,function*(){t.range[0]=t.$range.valueAsNumber,t.tooltip=yield t.onChange.call(this.art,t,p,e)}));t.$events.push(e)}}break;case"selector":{const e=l(p,"click",e=>d(this,null,function*(){var r;(null==(r=t.selector)?void 0:r.length)?this.render(t.selector):(this.check(t),t.$parent.onSelect&&(t.$parent.tooltip=yield t.$parent.onSelect.call(this.art,t,p,e)))}));t.$events.push(e),t.default&&C(p,"art-current")}break;case"button":if(t.onClick){const e=l(p,"click",e=>d(this,null,function*(){t.tooltip=yield t.onClick.call(this.art,t,p,e)}));t.$events.push(e)}}tt(t,"$item",{configurable:!0,get:()=>p}),e?Y(p,n):S(a,p),t.mounted&&setTimeout(()=>t.mounted.call(this.art,t.$item,t),0)}render(t=this.option){var e;if(this.active=t,this.cache.has(t)){O(this.cache.get(t),"art-current")}else{const r=D("div");this.cache.set(t,r),C(r,"art-setting-panel"),S(this.$parent,r),O(r,"art-current"),(null==(e=t[0])?void 0:e.$parent)&&this.createHeader(t[0]);for(let e=0;enull,this.init(t.option.subtitle);let e=!1;t.on("video:timeupdate",()=>{if(!this.url)return;const t=this.art.template.$video.webkitDisplayingFullscreen;"boolean"===typeof t&&t!==e&&(e=t,this.createTrack(t?"subtitles":"metadata",this.url))})}get url(){return this.art.template.$track.src}set url(t){this.switch(t)}get textTrack(){var t,e;return null==(e=null==(t=this.art.template.$video)?void 0:t.textTracks)?void 0:e[0]}get activeCues(){return this.textTrack?Array.from(this.textTrack.activeCues):[]}get cues(){return this.textTrack?Array.from(this.textTrack.cues):[]}style(t,e){const{$subtitle:r}=this.art.template;return"object"===typeof t?P(r,t):I(r,t,e)}update(){const{option:{subtitle:t},template:{$subtitle:e}}=this.art;e.innerHTML="",this.activeCues.length&&(this.art.emit("subtitleBeforeUpdate",this.activeCues),e.innerHTML=this.activeCues.map((e,r)=>e.text.split(/\r?\n/).filter(t=>t.trim()).map(e=>`
\n ${t.escape?Q(e):e}\n
`).join("")).join(""),this.art.emit("subtitleAfterUpdate",this.activeCues))}switch(t){return d(this,arguments,function*(t,e={}){const{i18n:r,notice:o,option:a}=this.art,n=c(l(l({},a.subtitle),e),{url:t}),i=yield this.init(n);return e.name&&(o.show=`${r.get("Switch Subtitle")}: ${e.name}`),i})}createTrack(t,e){const{template:r,proxy:o,option:a}=this.art,{$video:n,$track:i}=r,s=D("track");s.default=!0,s.kind=t,s.src=e,s.label=a.subtitle.name||"Artplayer",s.track.mode="hidden",s.onload=()=>{this.art.emit("subtitleLoad",this.cues,this.option)},this.art.events.remove(this.destroyEvent),i.onload=null,M(i),S(n,s),r.$track=s,this.destroyEvent=o(this.textTrack,"cuechange",()=>this.update())}init(t){return d(this,null,function*(){const{notice:e,template:{$subtitle:r}}=this.art;return this.textTrack?(f(t,wt.subtitle),t.url?(this.option=t,this.style(t.style),fetch(t.url).then(t=>t.arrayBuffer()).then(e=>{const r=new TextDecoder(t.encoding).decode(e);switch(t.type||X(t.url)){case"srt":{const e=nt(r);return it(t.onVttLoad(e))}case"ass":{const e=st(r);return it(t.onVttLoad(e))}case"vtt":return it(t.onVttLoad(r));default:return t.url}}).then(t=>(r.innerHTML="",this.url===t||(URL.revokeObjectURL(this.url),this.createTrack("metadata",t)),t)).catch(t=>{throw r.innerHTML="",e.show=t,t})):void 0):null})}}class oe{constructor(t){this.art=t;const{option:e,constructor:r}=t;e.container instanceof Element?this.$container=e.container:(this.$container=T(e.container),q(this.$container,`No container element found by ${e.container}`)),q(B(),"The current browser does not support flex layout");const o=this.$container.tagName.toLowerCase();q("div"===o,`Unsupported container element type, only support 'div' but got '${o}'`),q(r.instances.every(t=>t.template.$container!==this.$container),"Cannot mount multiple instances on the same dom element"),this.query=this.query.bind(this),this.$container.dataset.artId=t.id,this.init()}static get html(){return`\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
Player version:
\n
${g}
\n
\n
\n
Video url:
\n
\n
\n
\n
Video volume:
\n
\n
\n
\n
Video time:
\n
\n
\n
\n
Video duration:
\n
\n
\n
\n
Video resolution:
\n
\n x \n
\n
\n
\n
[x]
\n
\n
\n
\n `}query(t){return T(t,this.$container)}init(){const{option:t}=this.art;if(t.useSSR||(this.$container.innerHTML=oe.html),this.$player=this.query(".art-video-player"),this.$video=this.query(".art-video"),this.$track=this.query("track"),this.$poster=this.query(".art-poster"),this.$subtitle=this.query(".art-subtitle"),this.$danmuku=this.query(".art-danmuku"),this.$bottom=this.query(".art-bottom"),this.$progress=this.query(".art-progress"),this.$controls=this.query(".art-controls"),this.$controlsLeft=this.query(".art-controls-left"),this.$controlsCenter=this.query(".art-controls-center"),this.$controlsRight=this.query(".art-controls-right"),this.$layer=this.query(".art-layers"),this.$loading=this.query(".art-loading"),this.$notice=this.query(".art-notice"),this.$noticeInner=this.query(".art-notice-inner"),this.$mask=this.query(".art-mask"),this.$state=this.query(".art-state"),this.$setting=this.query(".art-settings"),this.$info=this.query(".art-info"),this.$infoPanel=this.query(".art-info-panel"),this.$infoClose=this.query(".art-info-close"),this.$contextmenu=this.query(".art-contextmenus"),t.proxy){const e=t.proxy.call(this.art,this.art);q(e instanceof HTMLVideoElement||e instanceof HTMLCanvasElement,"Function 'option.proxy' needs to return 'HTMLVideoElement' or 'HTMLCanvasElement'"),Y(e,this.$video),e.className="art-video",this.$video=e}t.backdrop&&C(this.$player,"art-backdrop"),k&&C(this.$player,"art-mobile")}destroy(t){t?this.$container.innerHTML="":C(this.$player,"art-destroy")}}class ae{on(t,e,r){const o=this.e||(this.e={});return(o[t]||(o[t]=[])).push({fn:e,ctx:r}),this}once(t,e,r){const o=this;function a(...n){o.off(t,a),e.apply(r,n)}return a._=e,this.on(t,a,r)}emit(t,...e){const r=((this.e||(this.e={}))[t]||[]).slice();for(let o=0;oe.call(this,this)),se.DEBUG){const t=t=>console.log(`[ART.${this.id}] -> ${t}`);t(`Version@${se.version}`);for(let e=0;et(`Event@${e.type}`))}ie.push(this)}static get instances(){return ie}static get version(){return g}static get config(){return v}static get utils(){return pt}static get scheme(){return wt}static get Emitter(){return ae}static get validator(){return f}static get kindOf(){return f.kindOf}static get html(){return oe.html}static get option(){return{id:"",container:"#artplayer",url:"",poster:"",type:"",theme:"#f00",volume:.7,isLive:!1,muted:!1,autoplay:!1,autoSize:!1,autoMini:!1,loop:!1,flip:!1,playbackRate:!1,aspectRatio:!1,screenshot:!1,setting:!1,hotkey:!0,pip:!1,mutex:!0,backdrop:!0,fullscreen:!1,fullscreenWeb:!1,subtitleOffset:!1,miniProgressBar:!1,useSSR:!1,playsInline:!0,lock:!1,gesture:!0,fastForward:!1,autoPlayback:!1,autoOrientation:!1,airplay:!1,proxy:void 0,layers:[],contextmenu:[],controls:[],settings:[],quality:[],highlight:[],plugins:[],thumbnails:{url:"",number:60,column:10,width:0,height:0,scale:1},subtitle:{url:"",type:"",style:{},name:"",escape:!0,encoding:"utf-8",onVttLoad:t=>t},moreVideoAttr:{controls:!1,preload:b?"auto":"metadata"},i18n:{},icons:{},cssVar:{},customType:{},lang:null==navigator?void 0:navigator.language.toLowerCase()}}get proxy(){return this.events.proxy}get query(){return this.template.query}get video(){return this.template.$video}reset(){this.video.removeAttribute("src"),this.video.load()}destroy(t=!0){se.REMOVE_SRC_WHEN_DESTROY&&this.reset(),this.events.destroy(),this.template.destroy(t),ie.splice(ie.indexOf(this),1),this.isDestroy=!0,this.emit("destroy")}}return se.STYLE=ee,se.DEBUG=!1,se.CONTEXTMENU=!0,se.NOTICE_TIME=2e3,se.SETTING_WIDTH=250,se.SETTING_ITEM_WIDTH=200,se.SETTING_ITEM_HEIGHT=35,se.RESIZE_TIME=200,se.SCROLL_TIME=200,se.SCROLL_GAP=50,se.AUTO_PLAYBACK_MAX=10,se.AUTO_PLAYBACK_MIN=5,se.AUTO_PLAYBACK_TIMEOUT=3e3,se.RECONNECT_TIME_MAX=5,se.RECONNECT_SLEEP_TIME=1e3,se.CONTROL_HIDE_TIME=3e3,se.DBCLICK_TIME=300,se.DBCLICK_FULLSCREEN=!0,se.MOBILE_DBCLICK_PLAY=!0,se.MOBILE_CLICK_PLAY=!1,se.AUTO_ORIENTATION_TIME=200,se.INFO_LOOP_TIME=1e3,se.FAST_FORWARD_VALUE=3,se.FAST_FORWARD_TIME=1e3,se.TOUCH_MOVE_RATIO=.5,se.VOLUME_STEP=.1,se.SEEK_STEP=5,se.PLAYBACK_RATE=[.5,.75,1,1.25,1.5,2],se.ASPECT_RATIO=["default","4:3","16:9"],se.FLIP=["normal","horizontal","vertical"],se.FULLSCREEN_WEB_IN_BODY=!0,se.LOG_VERSION=!0,se.USE_RAF=!1,se.REMOVE_SRC_WHEN_DESTROY=!0,$&&(F("artplayer-style",ee),setTimeout(()=>{se.LOG_VERSION&&console.log(`%c ArtPlayer %c ${se.version} %c https://artplayer.org`,"color: #fff; background: #5f5f5f","color: #fff; background: #4bc729","")},100)),se}); +!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.Artplayer=e(),define(function(){return t.Artplayer})):(t="undefined"!==typeof globalThis?globalThis:t||self).Artplayer=e()}(this,function(){"use strict";var t,e=Object.defineProperty,r=Object.defineProperties,o=Object.getOwnPropertyDescriptors,a=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,s=(t,r,o)=>r in t?e(t,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[r]=o,l=(t,e)=>{for(var r in e||(e={}))n.call(e,r)&&s(t,r,e[r]);if(a)for(var r of a(e))i.call(e,r)&&s(t,r,e[r]);return t},c=(t,e)=>r(t,o(e)),d=(t,e,r)=>new Promise((o,a)=>{var n=t=>{try{s(r.next(t))}catch(e){a(e)}},i=t=>{try{s(r.throw(t))}catch(e){a(e)}},s=t=>t.done?o(t.value):Promise.resolve(t.value).then(n,i);s((r=r.apply(t,e)).next())});function p(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var h,u={exports:{}};var m=(h||(h=1,u.exports=function(){function t(e){return(t="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})(e)}var e=Object.prototype.toString,r=function(r){if(void 0===r)return"undefined";if(null===r)return"null";var a=t(r);if("boolean"===a)return"boolean";if("string"===a)return"string";if("number"===a)return"number";if("symbol"===a)return"symbol";if("function"===a)return"GeneratorFunction"===o(r)?"generatorfunction":"function";if(function(t){return Array.isArray?Array.isArray(t):t instanceof Array}(r))return"array";if(function(t){return!(!t.constructor||"function"!=typeof t.constructor.isBuffer)&&t.constructor.isBuffer(t)}(r))return"buffer";if(function(t){try{if("number"==typeof t.length&&"function"==typeof t.callee)return!0}catch(e){if(-1!==e.message.indexOf("callee"))return!0}return!1}(r))return"arguments";if(function(t){return t instanceof Date||"function"==typeof t.toDateString&&"function"==typeof t.getDate&&"function"==typeof t.setDate}(r))return"date";if(function(t){return t instanceof Error||"string"==typeof t.message&&t.constructor&&"number"==typeof t.constructor.stackTraceLimit}(r))return"error";if(function(t){return t instanceof RegExp||"string"==typeof t.flags&&"boolean"==typeof t.ignoreCase&&"boolean"==typeof t.multiline&&"boolean"==typeof t.global}(r))return"regexp";switch(o(r)){case"Symbol":return"symbol";case"Promise":return"promise";case"WeakMap":return"weakmap";case"WeakSet":return"weakset";case"Map":return"map";case"Set":return"set";case"Int8Array":return"int8array";case"Uint8Array":return"uint8array";case"Uint8ClampedArray":return"uint8clampedarray";case"Int16Array":return"int16array";case"Uint16Array":return"uint16array";case"Int32Array":return"int32array";case"Uint32Array":return"uint32array";case"Float32Array":return"float32array";case"Float64Array":return"float64array"}if(function(t){return"function"==typeof t.throw&&"function"==typeof t.return&&"function"==typeof t.next}(r))return"generator";switch(a=e.call(r)){case"[object Object]":return"object";case"[object Map Iterator]":return"mapiterator";case"[object Set Iterator]":return"setiterator";case"[object String Iterator]":return"stringiterator";case"[object Array Iterator]":return"arrayiterator"}return a.slice(8,-1).toLowerCase().replace(/\s/g,"")};function o(t){return t.constructor?t.constructor.name:null}function a(t,e){var o=2=1,k=/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(y)||x,$="undefined"!==typeof window&&"undefined"!==typeof document;function T(t,e=document){return e.querySelector(t)}function E(t,e=document){return Array.from(e.querySelectorAll(t))}function C(t,e){return t.classList.add(e)}function z(t,e){return t.classList.remove(e)}function L(t,e){return t.classList.contains(e)}function S(t,e){return e instanceof Element?t.appendChild(e):t.insertAdjacentHTML("beforeend",String(e)),t.lastElementChild||t.lastChild}function M(t){return t.parentNode.removeChild(t)}function I(t,e,r){return t.style[e]=r,t}function P(t,e){for(const r in e)I(t,r,e[r]);return t}function A(t){return Array.from(t.parentElement.children).filter(e=>e!==t)}function O(t,e){A(t).forEach(t=>z(t,e)),C(t,e)}function R(t,e,r="top"){k||(t.setAttribute("aria-label",e),C(t,"hint--rounded"),C(t,`hint--${r}`))}function _(t,e=0){const r=t.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight,a=window.innerWidth||document.documentElement.clientWidth,n=r.top-e<=o&&r.top+r.height+e>=0,i=r.left-e<=a+e&&r.left+r.width+e>=0;return n&&i}function V(t,e){return j(t).includes(e)}function Y(t,e){return e.parentNode.replaceChild(t,e),t}function N(t){return document.createElement(t)}function D(t="",e=""){const r=N("i");return C(r,"art-icon"),C(r,`art-icon-${t}`),S(r,e),r}function F(t,e){let r=document.getElementById(t);r||(r=document.createElement("style"),r.id=t,"loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>{document.head.appendChild(r)}):(document.head||document.documentElement).appendChild(r)),r.textContent=e}function B(){const t=document.createElement("div");return t.style.display="flex","flex"===t.style.display}function H(t){return t.getBoundingClientRect()}function W(t,e){return new Promise((r,o)=>{const a=new Image;a.onload=function(){if(e&&1!==e){const n=document.createElement("canvas"),i=n.getContext("2d");n.width=a.width*e,n.height=a.height*e,i.drawImage(a,0,0,n.width,n.height),n.toBlob(e=>{const a=URL.createObjectURL(e),n=new Image;n.onload=function(){r(n)},n.onerror=function(){URL.revokeObjectURL(a),o(new Error(`Image load failed: ${t}`))},n.src=a})}else r(a)},a.onerror=function(){o(new Error(`Image load failed: ${t}`))},a.src=t})}function j(t){if(t.composedPath)return t.composedPath();const e=[];let r=t.target;for(;r;)e.push(r),r=r.parentNode;return e.includes(window)||void 0===window||e.push(window),e}function U(){const t=document.createElement("div");t.style.cssText="position:fixed;top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);pointer-events:none;visibility:hidden;",document.body.appendChild(t);const e=getComputedStyle(t),r={top:Number.parseFloat(e.top)||0,right:Number.parseFloat(e.right)||0,bottom:Number.parseFloat(e.bottom)||0,left:Number.parseFloat(e.left)||0};return t.remove(),r}class q extends Error{constructor(t,e){super(t),"function"===typeof Error.captureStackTrace&&Error.captureStackTrace(this,e||this.constructor),this.name="ArtPlayerError"}}function X(t,e){if(!t)throw new q(e);return t}function G(t){return t.includes("?")?G(t.split("?")[0]):t.includes("#")?G(t.split("#")[0]):t.trim().toLowerCase().split(".").pop()}function K(t,e){const r=document.createElement("a");r.style.display="none",r.href=t,r.download=e,document.body.appendChild(r),r.click(),document.body.removeChild(r)}function Z(t,e,r){return Math.max(Math.min(t,Math.max(e,r)),Math.min(e,r))}function J(t){return t.charAt(0).toUpperCase()+t.slice(1)}function Q(t){if(!t)return"00:00";const e=Math.floor(t/3600),r=Math.floor((t-3600*e)/60),o=Math.floor(t-3600*e-60*r);return(e>0?[e,r,o]:[r,o]).map(t=>t<10?`0${t}`:String(t)).join(":")}function tt(t){return t.replace(/[&<>'"]/g,t=>({"&":"&","<":"<",">":">","'":"'",'"':"""}[t]||t))}const et=Object.defineProperty,{hasOwnProperty:rt}=Object.prototype;function ot(t,e){return rt.call(t,e)}function at(t,e){return Object.getOwnPropertyDescriptor(t,e)}function nt(...t){const e=t=>t&&"object"===typeof t&&!Array.isArray(t);return t.reduce((t,r)=>(Object.keys(r).forEach(o=>{const a=t[o],n=r[o];Array.isArray(a)&&Array.isArray(n)?t[o]=a.concat(...n):e(a)&&e(n)?t[o]=nt(a,n):t[o]=n}),t),{})}function it(t){return"WEBVTT \r\n\r\n".concat((e=t,e.replace(/(\d\d:\d\d:\d\d)[,.](\d+)/g,(t,e,r)=>{let o=r.slice(0,3);return 1===r.length&&(o=`${r}00`),2===r.length&&(o=`${r}0`),`${e},${o}`})).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").replace(/\{[\s\S]*?\}/g,"").concat("\r\n\r\n"));var e}function st(t){return URL.createObjectURL(new Blob([t],{type:"text/vtt"}))}function lt(t){const e=new RegExp("Dialogue:\\s\\d,(\\d+:\\d\\d:\\d\\d.\\d\\d),(\\d+:\\d\\d:\\d\\d.\\d\\d),([^,]*),([^,]*),(?:[^,]*,){4}([\\s\\S]*)$","i");function r(t=""){return t.split(/[:.]/).map((t,e,r)=>{if(e===r.length-1){if(1===t.length)return`.${t}00`;if(2===t.length)return`.${t}0`}else if(1===t.length)return(0===e?"0":":0")+t;return 0===e?t:e===r.length-1?`.${t}`:`:${t}`}).join("")}return`WEBVTT\n\n${t.split(/\r?\n/).map(t=>{const o=t.match(e);return o?{start:r(o[1].trim()),end:r(o[2].trim()),text:o[5].replace(/\{[\s\S]*?\}/g,"").replace(/(\\N)/g,"\n").trim().split(/\r?\n/).map(t=>t.trim()).join("\n")}:null}).filter(t=>t).map((t,e)=>t?`${e+1}\n${t.start} --\x3e ${t.end}\n${t.text}`:"").filter(t=>t.trim()).join("\n\n")}`}function ct(t=0){return new Promise(e=>setTimeout(e,t))}function dt(t,e){let r;return function(...o){clearTimeout(r),r=setTimeout(()=>(r=null,t.apply(this,o)),e)}}function pt(t,e){let r=!1;return function(...o){r||(t.apply(this,o),r=!0,setTimeout(()=>{r=!1},e))}}const ht=Object.freeze(Object.defineProperty({__proto__:null,ArtPlayerError:q,addClass:C,append:S,assToVtt:lt,capitalize:J,clamp:Z,createElement:N,debounce:dt,def:et,download:K,errorHandle:X,escape:tt,get:at,getComposedPath:j,getExt:G,getIcon:D,getRect:H,getSafeAreaInsets:U,getStyle:function(t,e,r=!0){const o=window.getComputedStyle(t,null).getPropertyValue(e);return r?Number.parseFloat(o):o},has:ot,hasClass:L,includeFromEvent:V,inverseClass:O,isBrowser:$,isIOS:w,isIOS13:x,isInViewport:_,isMobile:k,isSafari:b,loadImg:W,mergeDeep:nt,query:T,queryAll:E,remove:M,removeClass:z,replaceElement:Y,secondToTime:Q,setStyle:I,setStyleText:F,setStyles:P,siblings:A,sleep:ct,srtToVtt:it,supportsFlex:B,throttle:pt,tooltip:R,unescape:function(t){const e={"&":"&","<":"<",">":">","'":"'",""":'"'},r=new RegExp(`(${Object.keys(e).join("|")})`,"g");return t.replace(r,t=>e[t]||t)},userAgent:y,vttToBlob:st},Symbol.toStringTag,{value:"Module"})),ut="array",mt="boolean",ft="string",gt="number",vt="object",yt="function";function bt(t,e,r){return X(e===ft||e===gt||t instanceof Element,`${r.join(".")} require '${ft}' or 'Element' type`)}const wt={html:bt,disable:`?${mt}`,name:`?${ft}`,index:`?${gt}`,style:`?${vt}`,click:`?${yt}`,mounted:`?${yt}`,tooltip:`?${ft}|${gt}`,width:`?${gt}`,selector:`?${ut}`,onSelect:`?${yt}`,switch:`?${mt}`,onSwitch:`?${yt}`,range:`?${ut}`,onRange:`?${yt}`,onChange:`?${yt}`},xt={id:ft,container:bt,url:ft,poster:ft,type:ft,theme:ft,lang:ft,volume:gt,isLive:mt,muted:mt,autoplay:mt,autoSize:mt,autoMini:mt,loop:mt,flip:mt,playbackRate:mt,aspectRatio:mt,screenshot:mt,setting:mt,hotkey:mt,pip:mt,mutex:mt,backdrop:mt,fullscreen:mt,fullscreenWeb:mt,subtitleOffset:mt,miniProgressBar:mt,useSSR:mt,playsInline:mt,lock:mt,gesture:mt,fastForward:mt,autoPlayback:mt,autoOrientation:mt,airplay:mt,proxy:`?${yt}`,plugins:[yt],layers:[wt],contextmenu:[wt],settings:[wt],controls:[c(l({},wt),{position:(t,e,r)=>{const o=["top","left","right"];return X(o.includes(t),`${r.join(".")} only accept ${o.toString()} as parameters`)}})],quality:[{default:`?${mt}`,html:ft,url:ft}],highlight:[{time:gt,text:ft}],thumbnails:{url:ft,number:gt,column:gt,width:gt,height:gt,scale:gt},subtitle:{url:ft,name:ft,type:ft,style:vt,escape:mt,encoding:ft,onVttLoad:yt},moreVideoAttr:vt,i18n:vt,icons:vt,cssVar:vt,customType:vt};class kt{constructor(t){this.id=0,this.art=t,this.cache=new Map,this.add=this.add.bind(this),this.remove=this.remove.bind(this),this.update=this.update.bind(this)}get show(){return L(this.art.template.$player,`art-${this.name}-show`)}set show(t){const{$player:e}=this.art.template,r=`art-${this.name}-show`;t?C(e,r):z(e,r),this.art.emit(this.name,t)}toggle(){this.show=!this.show}add(t){const e="function"===typeof t?t(this.art):t;if(e.html=e.html||"",f(e,wt),!this.$parent||!this.name||e.disable)return;const r=e.name||`${this.name}${this.id}`;X(!this.cache.has(r),`Can't add an existing [${r}] to the [${this.name}]`),this.id+=1;const o=N("div");C(o,`art-${this.name}`),C(o,`art-${this.name}-${r}`);const a=Array.from(this.$parent.children);o.dataset.index=e.index||this.id;const n=a.find(t=>Number(t.dataset.index)>=Number(o.dataset.index));n?n.insertAdjacentElement("beforebegin",o):S(this.$parent,o),e.html&&S(o,e.html),e.style&&P(o,e.style),e.tooltip&&R(o,e.tooltip);const i=[];if(e.click){const t=this.art.events.proxy(o,"click",t=>{t.preventDefault(),e.click.call(this.art,this,t)});i.push(t)}return e.selector&&["left","right"].includes(e.position)&&this.selector(e,o,i),this[r]=o,this.cache.set(r,{$ref:o,events:i,option:e}),e.mounted&&e.mounted.call(this.art,o),o}remove(t){X(this.cache.has(t),`Can't find [${t}] from the [${this.name}]`);const e=this.cache.get(t);e.option.beforeUnmount&&e.option.beforeUnmount.call(this.art,e.$ref);for(const r of e.events)this.art.events.remove(r);this.cache.delete(t),delete this[t],M(e.$ref)}update(t){if(this.cache.has(t.name)){const e=this.cache.get(t.name);t=Object.assign(e.option,t),this.remove(t.name)}return this.add(t)}}class $t extends kt{constructor(t){super(t),this.name="contextmenu",this.$parent=t.template.$contextmenu,k||this.init()}init(){const{option:t,proxy:e,template:{$player:r,$contextmenu:o}}=this.art;t.playbackRate&&this.add(function(t){return e=>{const{i18n:r,constructor:{PLAYBACK_RATE:o}}=e,a=o.map(t=>`${1===t?r.get("Normal"):t.toFixed(1)}`).join("");return c(l({},t),{html:`${r.get("Play Speed")}: ${a}`,click:(t,r)=>{const{value:o}=r.target.dataset;o&&(e.playbackRate=Number(o),t.show=!1)},mounted:t=>{const r=T('[data-value="1"]',t);r&&O(r,"art-current"),e.on("video:ratechange",()=>{const r=E("span",t).find(t=>Number(t.dataset.value)===e.playbackRate);r&&O(r,"art-current")})}})}}({name:"playbackRate",index:10})),t.aspectRatio&&this.add(function(t){return e=>{const{i18n:r,constructor:{ASPECT_RATIO:o}}=e,a=o.map(t=>`${"default"===t?r.get("Default"):t}`).join("");return c(l({},t),{html:`${r.get("Aspect Ratio")}: ${a}`,click:(t,r)=>{const{value:o}=r.target.dataset;o&&(e.aspectRatio=o,t.show=!1)},mounted:t=>{const r=T('[data-value="default"]',t);r&&O(r,"art-current"),e.on("aspectRatio",e=>{const r=E("span",t).find(t=>t.dataset.value===e);r&&O(r,"art-current")})}})}}({name:"aspectRatio",index:20})),t.flip&&this.add(function(t){return e=>{const{i18n:r,constructor:{FLIP:o}}=e,a=o.map(t=>`${r.get(J(t))}`).join("");return c(l({},t),{html:`${r.get("Video Flip")}: ${a}`,click:(t,r)=>{const{value:o}=r.target.dataset;o&&(e.flip=o.toLowerCase(),t.show=!1)},mounted:t=>{const r=T('[data-value="normal"]',t);r&&O(r,"art-current"),e.on("flip",e=>{const r=E("span",t).find(t=>t.dataset.value===e);r&&O(r,"art-current")})}})}}({name:"flip",index:30})),this.add(function(t){return e=>c(l({},t),{html:e.i18n.get("Video Info"),click:t=>{e.info.show=!0,t.show=!1}})}({name:"info",index:40})),this.add(function(t){const e=$?location.href:"";return c(l({},t),{html:`ArtPlayer ${g}`})}({name:"version",index:50})),this.add(function(t){return e=>c(l({},t),{html:e.i18n.get("Close"),click:t=>{t.show=!1}})}({name:"close",index:60}));for(let a=0;a{if(!this.art.constructor.CONTEXTMENU)return;t.preventDefault(),this.show=!0;const e=t.clientX,a=t.clientY,{height:n,width:i,left:s,top:l}=H(r),{height:c,width:d}=H(o);let p=e-s,h=a-l;e+d>s+i&&(p=i-d),a+c>l+n&&(h=n-c),P(o,{top:`${h}px`,left:`${p}px`})}),e(r,"click",t=>{V(t,o)||(this.show=!1)}),this.art.on("blur",()=>{this.show=!1})}}function Tt(t,e){const{$progress:r}=t.template,{left:o}=H(r),a=Z((k?e.touches[0].clientX:e.clientX)-o,0,r.clientWidth),n=a/r.clientWidth*t.duration;return{second:n,time:Q(n),width:a,percentage:Z(a/r.clientWidth,0,1)}}function Et(t,e){if(t.isRotate){const r=e.touches[0].clientY/t.height,o=r*t.duration;t.emit("setBar","played",r,e),t.seek=o}else{const{second:r,percentage:o}=Tt(t,e);t.emit("setBar","played",o,e),t.seek=r}}function Ct(t){return e=>{const{icons:r,option:o,proxy:a}=e,{$player:n,$progress:i}=e.template;return c(l({},t),{html:'\n
\n
\n
\n
\n
\n
\n
00:00
\n
\n ',mounted:t=>{let s=null,l=!1;const c=T(".art-progress-hover",t),d=T(".art-progress-loaded",t),p=T(".art-progress-played",t),h=T(".art-progress-highlight",t),u=T(".art-progress-indicator",t),m=T(".art-progress-tip",t);function f(r,o){const{width:a,time:n}=o||Tt(e,r);m.textContent=n||"00:00";const i=m.clientWidth;a<=i/2?I(m,"left",0):a>t.clientWidth-i/2?I(m,"left",t.clientWidth-i+"px"):I(m,"left",a-i/2+"px")}r.indicator?S(u,r.indicator):I(u,"backgroundColor","var(--art-theme)"),e.on("setBar",function(r,o,a){const i="played"===r&&a&&k;if("loaded"===r&&I(d,"width",100*o+"%"),"hover"===r&&(I(c,"width",100*o+"%"),V(a,h)?function(r){const{width:o}=Tt(e,r),{text:a}=r.target.dataset;m.textContent=a;const n=m.clientWidth;o<=n/2?I(m,"left",0):o>t.clientWidth-n/2?I(m,"left",t.clientWidth-n+"px"):I(m,"left",o-n/2+"px")}(a):f(a),0===o?z(n,"art-progress-hover"):C(n,"art-progress-hover")),"played"===r&&(I(p,"width",100*o+"%"),I(u,"left",100*o+"%")),i){C(n,"art-progress-hover");f(a,{width:t.clientWidth*o,time:Q(o*e.duration)}),clearTimeout(s),s=setTimeout(()=>{z(n,"art-progress-hover")},500)}}),e.on("video:loadedmetadata",function(){h.textContent="";for(let t=0;t`;S(h,n)}}),e.constructor.USE_RAF?e.on("raf",()=>{e.emit("setBar","played",e.played),e.emit("setBar","loaded",e.loaded)}):(e.on("video:timeupdate",()=>{e.emit("setBar","played",e.played)}),e.on("video:progress",()=>{e.emit("setBar","loaded",e.loaded)}),e.on("video:ended",()=>{e.emit("setBar","played",1)})),e.emit("setBar","loaded",e.loaded||0),k||(a(i,"click",t=>{t.target!==u&&Et(e,t)}),a(i,"mousemove",t=>{const{percentage:r}=Tt(e,t);e.emit("setBar","hover",r,t)}),a(i,"mouseleave",t=>{e.emit("setBar","hover",0,t)}),a(i,"mousedown",t=>{l=0===t.button}),e.on("document:mousemove",t=>{if(l){const{second:r,percentage:o}=Tt(e,t);e.emit("setBar","played",o,t),e.seek=r}}),e.on("document:mouseup",()=>{l&&(l=!1)}))}})}}class zt extends kt{constructor(t){super(t),this.isHover=!1,this.name="control",this.timer=Date.now();const{constructor:e}=t,{$player:r,$bottom:o}=this.art.template;t.on("mousemove",()=>{k||(this.show=!0)}),t.on("click",()=>{k?this.toggle():this.show=!0}),t.on("document:mousemove",t=>{this.isHover=V(t,o)}),t.on("video:timeupdate",()=>{!t.setting.show&&!this.isHover&&!t.isInput&&t.playing&&this.show&&Date.now()-this.timer>=e.CONTROL_HIDE_TIME&&(this.show=!1)}),t.on("control",t=>{t?(z(r,"art-hide-cursor"),C(r,"art-hover"),this.timer=Date.now()):(C(r,"art-hide-cursor"),z(r,"art-hover"))}),this.init()}init(){const{option:t}=this.art;t.isLive||this.add(Ct({name:"progress",position:"top",index:10})),this.add({name:"thumbnails",position:"top",index:20}),this.add(function(t){return e=>c(l({},t),{mounted:t=>{const{proxy:r,icons:o,i18n:a}=e,n=S(t,o.play),i=S(t,o.pause);function s(){I(n,"display","flex"),I(i,"display","none")}function l(){I(n,"display","none"),I(i,"display","flex")}R(n,a.get("Play")),R(i,a.get("Pause")),r(n,"click",()=>{e.play()}),r(i,"click",()=>{e.pause()}),e.playing?l():s(),e.on("video:playing",()=>{l()}),e.on("video:pause",()=>{s()})}})}({name:"playAndPause",position:"left",index:10})),this.add(function(t){return e=>c(l({},t),{mounted:t=>{const{proxy:r,icons:o}=e,a=S(t,o.volume),n=S(t,o.volumeClose),i=S(t,'
'),s=S(i,'
'),l=S(s,'
'),c=S(s,'
'),d=S(c,'
'),p=S(d,'
'),h=S(c,'
');function u(t){const{top:e,height:r}=H(c);return 1-(t.clientY-e)/r}function m(){if(e.muted||0===e.volume)I(a,"display","none"),I(n,"display","flex"),I(h,"top","100%"),I(p,"top","100%"),l.textContent=0;else{const t=100*e.volume;I(a,"display","flex"),I(n,"display","none"),I(h,"top",100-t+"%"),I(p,"top",100-t+"%"),l.textContent=Math.floor(t)}}if(m(),e.on("video:volumechange",m),r(a,"click",()=>{e.muted=!0}),r(n,"click",()=>{e.muted=!1}),k)I(i,"display","none");else{let t=!1;r(c,"mousedown",r=>{t=0===r.button,e.volume=u(r)}),e.on("document:mousemove",r=>{t&&(e.muted=!1,e.volume=u(r))}),e.on("document:mouseup",()=>{t&&(t=!1)})}}})}({name:"volume",position:"left",index:20})),t.isLive||this.add(function(t){return e=>c(l({},t),{style:k?{fontSize:"12px",padding:"0 5px"}:{cursor:"auto",padding:"0 10px"},mounted:t=>{function r(){const r=`${Q(e.currentTime)} / ${Q(e.duration)}`;r!==t.textContent&&(t.textContent=r)}r();const o=["video:loadedmetadata","video:timeupdate","video:progress"];for(let a=0;a{this.art.quality=t.quality}),t.screenshot&&!k&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Screenshot"),mounted:t=>{const{proxy:r,icons:o}=e;S(t,o.screenshot),r(t,"click",()=>{e.screenshot()})}})}({name:"screenshot",position:"right",index:20})),t.setting&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Show Setting"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e;S(t,o.setting),r(t,"click",()=>{e.setting.toggle(),e.setting.resize()}),e.on("setting",e=>{R(t,a.get(e?"Hide Setting":"Show Setting"))})}})}({name:"setting",position:"right",index:30})),t.pip&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("PIP Mode"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e;S(t,o.pip),r(t,"click",()=>{e.pip=!e.pip}),e.on("pip",e=>{R(t,a.get(e?"Exit PIP Mode":"PIP Mode"))})}})}({name:"pip",position:"right",index:40})),t.airplay&&window.WebKitPlaybackTargetAvailabilityEvent&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("AirPlay"),mounted:t=>{const{proxy:r,icons:o}=e;S(t,o.airplay),r(t,"click",()=>e.airplay())}})}({name:"airplay",position:"right",index:50})),t.fullscreenWeb&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Web Fullscreen"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e,n=S(t,o.fullscreenWebOn),i=S(t,o.fullscreenWebOff);I(i,"display","none"),r(t,"click",()=>{e.fullscreenWeb=!e.fullscreenWeb}),e.on("fullscreenWeb",e=>{e?(R(t,a.get("Exit Web Fullscreen")),I(n,"display","none"),I(i,"display","inline-flex")):(R(t,a.get("Web Fullscreen")),I(n,"display","inline-flex"),I(i,"display","none"))})}})}({name:"fullscreenWeb",position:"right",index:60})),t.fullscreen&&this.add(function(t){return e=>c(l({},t),{tooltip:e.i18n.get("Fullscreen"),mounted:t=>{const{proxy:r,icons:o,i18n:a}=e,n=S(t,o.fullscreenOn),i=S(t,o.fullscreenOff);I(i,"display","none"),r(t,"click",()=>{e.fullscreen=!e.fullscreen}),e.on("fullscreen",e=>{e?(R(t,a.get("Exit Fullscreen")),I(n,"display","none"),I(i,"display","inline-flex")):(R(t,a.get("Fullscreen")),I(n,"display","inline-flex"),I(i,"display","none"))})}})}({name:"fullscreen",position:"right",index:70}));for(let e=0;et.selector}),et(e,"$control_item",{get:()=>r}),et(e,"$control_value",{get:()=>a})}const i=o(n,"click",e=>d(this,null,function*(){const r=j(e),o=t.selector.find(t=>t.$control_item===r.find(e=>t.$control_item===e));this.check(o),t.onSelect&&(a.innerHTML=yield t.onSelect.call(this.art,o,o.$control_item,e))}));r.push(i)}}function Lt(t,e,r,o){const a=e-o,n=r-t;let i=0;if(Math.abs(n)<2&&Math.abs(a)<2)return i;const s=function(t,e){return 180*Math.atan2(e,t)/Math.PI}(n,a);return s>=-45&&s<45?i=4:s>=45&&s<135?i=1:s>=-135&&s<-45?i=2:(s>=135&&s<=180||s>=-180&&s<-135)&&(i=3),i}class St{constructor(t){this.destroyEvents=new Set,this.proxy=this.proxy.bind(this),this.hover=this.hover.bind(this),function(t,e){const{constructor:r,template:{$player:o,$video:a}}=t;function n(e){V(e,o)?(t.isInput="INPUT"===e.target.tagName,t.isFocus=!0,t.emit("focus",e)):(t.isInput=!1,t.isFocus=!1,t.emit("blur",e))}t.on("document:click",n),t.on("document:contextmenu",n);let i=[];e.proxy(a,"click",e=>{const o=Date.now();i.push(o);const{MOBILE_CLICK_PLAY:a,DBCLICK_TIME:n,MOBILE_DBCLICK_PLAY:s,DBCLICK_FULLSCREEN:l}=r,c=i.filter(t=>o-t<=n);switch(c.length){case 1:t.emit("click",e),k?!t.isLock&&a&&t.toggle():t.toggle(),i=c;break;case 2:t.emit("dblclick",e),k?!t.isLock&&s&&t.toggle():l&&(t.fullscreen=!t.fullscreen),i=[];break;default:i=[]}})}(t,this),function(t,e){const{$player:r}=t.template;e.hover(r,e=>{C(r,"art-hover"),t.emit("hover",!0,e)},e=>{z(r,"art-hover"),t.emit("hover",!1,e)})}(t,this),function(t,e){const{$player:r}=t.template;e.proxy(r,"mousemove",e=>{t.emit("mousemove",e)})}(t,this),function(t,e){const{option:r,constructor:o}=t;t.on("resize",()=>{const{aspectRatio:e,notice:o}=t;"standard"===t.state&&r.autoSize&&t.autoSize(),t.aspectRatio=e,o.show=""});const a=dt(()=>t.emit("resize"),o.RESIZE_TIME);t.on("window:orientationchange",()=>a()),t.on("window:resize",()=>a()),screen&&screen.orientation&&screen.orientation.onchange&&e.proxy(screen.orientation,"change",()=>a())}(t,this),function(t,e){if(k&&!t.option.isLive){const{$video:r,$progress:o}=t.template;let a=null,n=!1,i=0,s=0,l=0;const c=e=>{if(1===e.touches.length&&!t.isLock){a===o&&Et(t,e),n=!0;const{pageX:r,pageY:c}=e.touches[0];i=r,s=c,l=t.currentTime}},d=e=>{if(1===e.touches.length&&n&&t.duration){const{pageX:o,pageY:n}=e.touches[0],c=Lt(i,s,o,n),d=[3,4].includes(c),p=[1,2].includes(c);if(d&&!t.isRotate||p&&t.isRotate){const c=Z((o-i)/t.width,-1,1),d=Z((n-s)/t.height,-1,1),p=t.isRotate?d:c,h=a===r?t.constructor.TOUCH_MOVE_RATIO:1,u=Z(l+t.duration*p*h,0,t.duration);t.seek=u,t.emit("setBar","played",Z(u/t.duration,0,1),e),t.notice.show=`${Q(u)} / ${Q(t.duration)}`}}},p=()=>{n&&(i=0,s=0,l=0,n=!1,a=null)};t.option.gesture&&(e.proxy(r,"touchstart",t=>{a=r,c(t)}),e.proxy(r,"touchmove",d)),e.proxy(o,"touchstart",t=>{a=o,c(t)}),e.proxy(o,"touchmove",d),t.on("document:touchend",p)}}(t,this),function(t){const{option:e,constructor:r,template:{$container:o}}=t,a=pt(()=>{t.emit("view",_(o,r.SCROLL_GAP))},r.SCROLL_TIME);t.on("window:scroll",()=>a()),t.on("view",r=>{e.autoMini&&(t.mini=!r)})}(t),function(t,e){const r=["click","mouseup","keydown","touchend","touchmove","mousemove","pointerup","contextmenu","pointermove","visibilitychange","webkitfullscreenchange"],o=["resize","scroll","orientationchange"],a=[];function n(n={}){for(let t=0;t{const o=n.document||i.ownerDocument||document,s=e.proxy(o,r,e=>{t.emit(`document:${r}`,e)});a.push(s)}),o.forEach(r=>{var o;const s=n.window||(null==(o=i.ownerDocument)?void 0:o.defaultView)||window,l=e.proxy(s,r,e=>{t.emit(`window:${r}`,e)});a.push(l)})}n(),e.bindGlobalEvents=n}(t,this),function(t){if(t.constructor.USE_RAF){let e=null;!function r(){t.playing&&t.emit("raf"),t.isDestroy||(e=requestAnimationFrame(r))}(),t.on("destroy",()=>{cancelAnimationFrame(e)})}}(t)}proxy(t,e,r,o={}){if(Array.isArray(e))return e.map(e=>this.proxy(t,e,r,o));t.addEventListener(e,r,o);const a=()=>t.removeEventListener(e,r,o);return this.destroyEvents.add(a),a}hover(t,e,r){e&&this.proxy(t,"mouseenter",e),r&&this.proxy(t,"mouseleave",r)}remove(t){if(this.destroyEvents.has(t))try{t()}catch(e){console.warn("Failed to remove event listener:",e)}finally{this.destroyEvents.delete(t)}}destroy(){for(const e of this.destroyEvents)try{e()}catch(t){console.warn("Failed to destroy event listener:",t)}this.destroyEvents.clear()}}class Mt{constructor(t){this.art=t,this.keys={},k||this.init()}init(){const{constructor:t}=this.art;this.art.option.hotkey&&(this.add("Escape",()=>{this.art.fullscreenWeb&&(this.art.fullscreenWeb=!1)}),this.add("Space",()=>{this.art.toggle()}),this.add("ArrowLeft",()=>{this.art.backward=t.SEEK_STEP}),this.add("ArrowUp",()=>{this.art.volume+=t.VOLUME_STEP}),this.add("ArrowRight",()=>{this.art.forward=t.SEEK_STEP}),this.add("ArrowDown",()=>{this.art.volume-=t.VOLUME_STEP})),this.art.on("document:keydown",t=>{if(this.art.isFocus){const e=document.activeElement.tagName.toUpperCase(),r=document.activeElement.getAttribute("contenteditable");if("INPUT"!==e&&"TEXTAREA"!==e&&""!==r&&"true"!==r&&!t.altKey&&!t.ctrlKey&&!t.metaKey&&!t.shiftKey){const e=this.keys[t.code];if(e){t.preventDefault();for(let r=0;r\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',state:'\n\n\n',play:'\n \n',pause:'\n \n',check:'\n\n',volume:'\n \n \n',volumeClose:'\n \n \n',screenshot:'\n\t\n\n',setting:'\n \n \n',pip:'\n\n',arrowLeft:'\n \n',arrowRight:'\n \n',playbackRate:'',aspectRatio:'',config:'',lock:'\n\n\n\n\n',flip:'\n\n\n\n\n\n',unlock:'\n\n\n',fullscreenOff:'\n\n\n\n\n',fullscreenOn:'\n\n\n\n\n',fullscreenWebOff:'\n\n\n\n\n',fullscreenWebOn:'\n\n\n\n\n',switchOn:'\n\n\n \n',switchOff:'\n\n\n \n\n',error:'\n\n\n\n\n',close:'\n\n\n\n\n',airplay:'\n \n \n \n \n\n'},t.option.icons);for(const r in e)et(this,r,{get:()=>D(r,e[r])})}}class Ot extends kt{constructor(t){super(t),this.name="info",k||this.init()}init(){const{proxy:t,constructor:e,template:{$infoPanel:r,$infoClose:o,$video:a}}=this.art;t(o,"click",()=>{this.show=!1});let n=null;const i=E("[data-video]",r)||[];this.art.on("destroy",()=>clearTimeout(n)),function t(){for(let e=0;e{I(a,"display","none"),I(n,"display",null)}),o.proxy(e.$state,"click",()=>t.play())}}class Yt{constructor(t){this.art=t,this.timer=null,t.on("destroy",()=>this.destroy())}destroy(){this.timer&&(clearTimeout(this.timer),this.timer=null)}set show(t){const{constructor:e,template:{$player:r,$noticeInner:o}}=this.art;t?(o.textContent=t instanceof Error?t.message.trim():t,C(r,"art-notice-show"),clearTimeout(this.timer),this.timer=setTimeout(()=>{o.textContent="",z(r,"art-notice-show")},e.NOTICE_TIME)):z(r,"art-notice-show")}get show(){const{template:{$player:t}}=this.art;return t.classList.contains("art-notice-show")}}const Nt=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],Dt=(()=>{if("undefined"===typeof document)return!1;const t=Nt[0],e={};for(const r of Nt){if(r[1]in document){for(const[o,a]of r.entries())e[t[o]]=a;return e}}return!1})(),Ft={change:Dt.fullscreenchange,error:Dt.fullscreenerror},Bt={request:(t=document.documentElement,e)=>new Promise((r,o)=>{const a=()=>{Bt.off("change",a),r()};Bt.on("change",a);const n=t[Dt.requestFullscreen](e);n instanceof Promise&&n.then(a).catch(o)}),exit:()=>new Promise((t,e)=>{if(!Bt.isFullscreen)return void t();const r=()=>{Bt.off("change",r),t()};Bt.on("change",r);const o=document[Dt.exitFullscreen]();o instanceof Promise&&o.then(r).catch(e)}),toggle:(t,e)=>Bt.isFullscreen?Bt.exit():Bt.request(t,e),onchange(t){Bt.on("change",t)},onerror(t){Bt.on("error",t)},on(t,e){const r=Ft[t];r&&document.addEventListener(r,e,!1)},off(t,e){const r=Ft[t];r&&document.removeEventListener(r,e,!1)},raw:Dt};function Ht(t){const{i18n:e,notice:r,template:{$video:o,$player:a}}=t,n=t=>{Bt.on("change",()=>{t.emit("fullscreen",Bt.isFullscreen),Bt.isFullscreen?(t.state="fullscreen",C(a,"art-fullscreen")):z(a,"art-fullscreen"),t.emit("resize")}),Bt.on("error",e=>{t.emit("fullscreenError",e)}),et(t,"fullscreen",{get:()=>Bt.isFullscreen,set(t){return d(this,null,function*(){t?yield Bt.request(a):yield Bt.exit()})}})};t.once("video:loadedmetadata",()=>{var a;Bt.isEnabled?n(t):o.webkitSupportsFullscreen?((a=t).on("document:webkitfullscreenchange",()=>{a.emit("fullscreen",a.fullscreen),a.emit("resize")}),et(a,"fullscreen",{get:()=>document.fullscreenElement===o,set(t){t?(a.state="fullscreen",o.webkitEnterFullscreen()):o.webkitExitFullscreen()}})):et(t,"fullscreen",{get:()=>!1,set(){r.show=e.get("Fullscreen Not Supported")}}),et(t,"fullscreen",at(t,"fullscreen"))})}function Wt(t){const{icons:e,proxy:r,storage:o,template:{$player:a,$video:n}}=t;let i=!1,s=0,l=0;function c(){const{$mini:e}=t.template;e&&(z(a,"art-mini"),I(e,"display","none"),a.prepend(n),t.emit("mini",!1))}function d(e,r){t.playing?(I(e,"display","none"),I(r,"display","flex")):(I(e,"display","flex"),I(r,"display","none"))}function p(){const{$mini:e}=t.template,r=H(e),a=window.innerHeight-r.height-50,n=window.innerWidth-r.width-50;o.set("top",a),o.set("left",n),I(e,"top",`${a}px`),I(e,"left",`${n}px`)}et(t,"mini",{get:()=>L(a,"art-mini"),set(h){if(h){t.state="mini",C(a,"art-mini");const h=function(){const{$mini:a}=t.template;if(a)return S(a,n),I(a,"display","flex");{const a=N("div");C(a,"art-mini-popup"),S(document.body,a),t.template.$mini=a,S(a,n);const p=S(a,'
');S(p,e.close),r(p,"click",c);const h=S(a,'
'),u=S(h,e.play),m=S(h,e.pause);return r(u,"click",()=>t.play()),r(m,"click",()=>t.pause()),d(u,m),t.on("video:playing",()=>d(u,m)),t.on("video:pause",()=>d(u,m)),t.on("video:timeupdate",()=>d(u,m)),r(a,"mousedown",t=>{i=0===t.button,s=t.pageX,l=t.pageY}),t.on("document:mousemove",t=>{if(i){C(a,"art-mini-dragging");const e=t.pageX-s,r=t.pageY-l;I(a,"transform",`translate(${e}px, ${r}px)`)}}),t.on("document:mouseup",()=>{if(i){i=!1,z(a,"art-mini-dragging");const t=H(a);o.set("left",t.left),o.set("top",t.top),I(a,"left",`${t.left}px`),I(a,"top",`${t.top}px`),I(a,"transform",null)}}),a}}(),u=o.get("top"),m=o.get("left");"number"===typeof u&&"number"===typeof m?(I(h,"top",`${u}px`),I(h,"left",`${m}px`),_(h)||p()):p(),t.emit("mini",!0)}else c()}})}function jt(t){const{i18n:e,notice:r,template:{$video:o}}=t;document.pictureInPictureEnabled?function(t){const{template:{$video:e},proxy:r,notice:o}=t;e.disablePictureInPicture=!1,et(t,"pip",{get:()=>document.pictureInPictureElement,set(r){r?(t.state="pip",e.requestPictureInPicture().catch(t=>{throw o.show=t,t})):document.exitPictureInPicture().catch(t=>{throw o.show=t,t})}}),r(e,"enterpictureinpicture",()=>{t.emit("pip",!0)}),r(e,"leavepictureinpicture",()=>{t.emit("pip",!1)})}(t):o.webkitSupportsPresentationMode?function(t){const{$video:e}=t.template;e.webkitSetPresentationMode("inline"),et(t,"pip",{get:()=>"picture-in-picture"===e.webkitPresentationMode,set(r){r?(t.state="pip",e.webkitSetPresentationMode("picture-in-picture"),t.emit("pip",!0)):(e.webkitSetPresentationMode("inline"),t.emit("pip",!1))}})}(t):et(t,"pip",{get:()=>!1,set(){r.show=e.get("PIP Not Supported")}})}function Ut(t){const{option:e,template:{$progress:r,$video:o}}=t;let a=null,n=!1,i=null;t.on("setBar",(a,s,l)=>d(null,null,function*(){var c;const d=null==(c=t.controls)?void 0:c.thumbnails,{url:p,scale:h}=e.thumbnails;if(!d||!p)return;if("hover"===a||"played"===a&&l&&k){if(i||n||(n=!0,i=yield W(p,h),n=!1),!i)return;const a=r.clientWidth*s;a>0&&ar.clientWidth-u/2?I(s,"left",r.clientWidth-u+"px"):I(s,"left",a-u/2+"px")}(a)}})),et(t,"thumbnails",{get:()=>t.option.thumbnails,set(e){e.url&&!t.option.isLive&&(t.option.thumbnails=e,clearTimeout(a),a=null,n=!1,i=null)}})}Object.defineProperties(Bt,{isFullscreen:{get:()=>Boolean(document[Dt.fullscreenElement])},element:{enumerable:!0,get:()=>document[Dt.fullscreenElement]},isEnabled:{enumerable:!0,get:()=>Boolean(document[Dt.fullscreenEnabled])}});class qt{constructor(t){!function(t){const{option:e,template:{$video:r}}=t;et(t,"url",{get:()=>r.src,set(o){return d(this,null,function*(){if(o){const a=t.url,n=e.type||G(o),i=e.customType[n];n&&i?(yield ct(),t.loading.show=!0,i.call(t,r,o,t)):(URL.revokeObjectURL(a),r.src=o),a!==t.url&&(t.option.url=o,t.isReady&&a&&t.once("video:canplay",()=>{t.emit("restart",o)}))}else yield ct(),t.loading.show=!0})}})}(t),function(t){const{template:{$video:e}}=t;et(t,"attr",{value(t,r){if(void 0===r)return e[t];e[t]=r}})}(t),function(t){const{i18n:e,notice:r,option:o,constructor:{instances:a},template:{$video:n}}=t;et(t,"play",{value(){return d(this,null,function*(){const i=yield n.play();if(r.show=e.get("Play"),t.emit("play"),o.mutex)for(let e=0;et.playing?t.pause():t.play()})}(t),function(t){const{notice:e}=t;et(t,"seek",{set(r){t.currentTime=r,t.duration&&(e.show=`${Q(t.currentTime)} / ${Q(t.duration)}`),t.emit("seek",t.currentTime,r)}}),et(t,"forward",{set(e){t.seek=t.currentTime+e}}),et(t,"backward",{set(e){t.seek=t.currentTime-e}})}(t),function(t){const{template:{$video:e},i18n:r,notice:o,storage:a}=t;et(t,"volume",{get:()=>e.volume||0,set:t=>{e.volume=Z(t,0,1),o.show=`${r.get("Volume")}: ${Number.parseInt(100*e.volume,10)}`,0!==e.volume&&a.set("volume",e.volume)}}),et(t,"muted",{get:()=>e.muted,set:r=>{e.muted=r,t.emit("muted",r)}})}(t),function(t){const{$video:e}=t.template;et(t,"currentTime",{get:()=>e.currentTime||0,set:r=>{r=Number.parseFloat(r),Number.isNaN(r)||(e.currentTime=Z(r,0,t.duration))}})}(t),function(t){et(t,"duration",{get:()=>{const{duration:e}=t.template.$video;return e===1/0?0:e||0}})}(t),function(t){function e(e,r){return new Promise((o,a)=>{if(e===t.url)return void o();const{playing:n,aspectRatio:i,playbackRate:s}=t;t.pause(),t.url=e,t.notice.show="";const l={error:e=>{t.off("video:canplay",l.canplay),t.off("video:loadedmetadata",l.metadata),a(e)},metadata:()=>{t.currentTime=r},canplay:()=>d(null,null,function*(){t.off("video:error",l.error),t.playbackRate=s,t.aspectRatio=i,n&&(yield t.play()),t.notice.show="",o()})};t.once("video:error",l.error),t.once("video:loadedmetadata",l.metadata),t.once("video:canplay",l.canplay)})}et(t,"switchQuality",{value:r=>e(r,t.currentTime)}),et(t,"switchUrl",{value:t=>e(t,0)}),et(t,"switch",{set:t.switchUrl})}(t),function(t){const{template:{$video:e},i18n:r,notice:o}=t;et(t,"playbackRate",{get:()=>e.playbackRate,set(a){if(a){if(a===e.playbackRate)return;e.playbackRate=a,o.show=`${r.get("Rate")}: ${1===a?r.get("Normal"):`${a}x`}`}else t.playbackRate=1}})}(t),function(t){const{i18n:e,notice:r,template:{$video:o,$player:a}}=t;et(t,"aspectRatio",{get:()=>a.dataset.aspectRatio||"default",set(n){if(n||(n="default"),"default"===n)I(o,"width",null),I(o,"height",null),I(o,"margin",null),delete a.dataset.aspectRatio;else{const t=n.split(":").map(Number),{clientWidth:e,clientHeight:r}=a,i=e/r,s=t[0]/t[1];i>s?(I(o,"width",s*r+"px"),I(o,"height","100%"),I(o,"margin","0 auto")):(I(o,"width","100%"),I(o,"height",e/s+"px"),I(o,"margin","auto 0")),a.dataset.aspectRatio=n}r.show=`${e.get("Aspect Ratio")}: ${"default"===n?e.get("Default"):n}`,t.emit("aspectRatio",n)}})}(t),function(t){const{notice:e,template:{$video:r}}=t,o=N("canvas");et(t,"getDataURL",{value:()=>new Promise((t,a)=>{try{o.width=r.videoWidth,o.height=r.videoHeight,o.getContext("2d").drawImage(r,0,0),t(o.toDataURL("image/png"))}catch(n){e.show=n,a(n)}})}),et(t,"getBlobUrl",{value:()=>new Promise((t,a)=>{try{o.width=r.videoWidth,o.height=r.videoHeight,o.getContext("2d").drawImage(r,0,0),o.toBlob(e=>{t(URL.createObjectURL(e))})}catch(n){e.show=n,a(n)}})}),et(t,"screenshot",{value:e=>d(null,null,function*(){const o=yield t.getDataURL();return K(o,`${e||`artplayer_${Q(r.currentTime)}`}.png`),t.emit("screenshot",o),o})})}(t),Ht(t),function(t){const{constructor:e,template:{$container:r,$player:o}}=t;let a="";et(t,"fullscreenWeb",{get:()=>L(o,"art-fullscreen-web"),set(n){n?(a=o.style.cssText,e.FULLSCREEN_WEB_IN_BODY&&S(document.body,o),t.state="fullscreenWeb",I(o,"width","100%"),I(o,"height","100%"),C(o,"art-fullscreen-web"),t.emit("fullscreenWeb",!0)):(e.FULLSCREEN_WEB_IN_BODY&&S(r,o),a&&(o.style.cssText=a,a=""),z(o,"art-fullscreen-web"),t.emit("fullscreenWeb",!1)),t.emit("resize")}})}(t),jt(t),function(t){const{$video:e}=t.template;et(t,"loaded",{get:()=>t.loadedTime/e.duration}),et(t,"loadedTime",{get:()=>e.buffered.length?e.buffered.end(e.buffered.length-1):0})}(t),function(t){et(t,"played",{get:()=>t.currentTime/t.duration})}(t),function(t){const{$video:e}=t.template;et(t,"playing",{get:()=>"boolean"===typeof e.playing?e.playing:!!(e.currentTime>0&&!e.paused&&!e.ended&&e.readyState>2)})}(t),function(t){const{$container:e,$player:r,$video:o}=t.template;et(t,"autoSize",{value(){const{videoWidth:a,videoHeight:n}=o,{width:i,height:s}=H(e),l=a/n;if(i/s>l)I(r,"width",s*l/i*100+"%"),I(r,"height","100%");else{const t=i/l/s*100;I(r,"width","100%"),I(r,"height",`${t}%`)}t.emit("autoSize",{width:t.width,height:t.height})}})}(t),function(t){et(t,"rect",{get:()=>H(t.template.$player)});const e=["bottom","height","left","right","top","width"];for(let r=0;rt.rect[o]})}et(t,"x",{get:()=>t.left+window.pageXOffset}),et(t,"y",{get:()=>t.top+window.pageYOffset})}(t),function(t){const{template:{$player:e},i18n:r,notice:o}=t;et(t,"flip",{get:()=>e.dataset.flip||"normal",set(a){a||(a="normal"),"normal"===a?delete e.dataset.flip:e.dataset.flip=a,o.show=`${r.get("Video Flip")}: ${r.get(J(a))}`,t.emit("flip",a)}})}(t),Wt(t),function(t){const{template:{$poster:e}}=t;et(t,"poster",{get:()=>{try{return e.style.backgroundImage.match(/"(.*)"/)[1]}catch(t){return""}},set(t){I(e,"backgroundImage",`url(${t})`)}})}(t),function(t){const{template:{$container:e,$video:r}}=t;et(t,"autoHeight",{value(){const{clientWidth:o}=e,{videoHeight:a,videoWidth:n}=r,i=a*(o/n);I(e,"height",`${i}px`),t.emit("autoHeight",i)}})}(t),function(t){const{$player:e}=t.template;et(t,"cssVar",{value:(t,r)=>r?e.style.setProperty(t,r):getComputedStyle(e).getPropertyValue(t)})}(t),function(t){et(t,"theme",{get:()=>t.cssVar("--art-theme"),set(e){t.cssVar("--art-theme",e)}})}(t),function(t){et(t,"type",{get:()=>t.option.type,set(e){t.option.type=e}})}(t),function(t){const e=["mini","pip","fullscreen","fullscreenWeb"];et(t,"state",{get:()=>e.find(e=>t[e])||"standard",set(r){for(let o=0;o{switch(t.availability){case"available":n=!0;break;case"not-available":n=!1}}):n=!1,et(t,"airplay",{value(){n?(a.webkitShowPlaybackTargetPicker(),t.emit("airplay")):r.show=e.get("AirPlay Not Available")}})}(t),function(t){et(t,"quality",{set(e){const{controls:r,notice:o,i18n:a}=t,n=e.find(t=>t.default)||e[0];r.update({name:"quality",position:"right",index:10,style:{marginRight:"10px"},html:(null==n?void 0:n.html)||"",selector:e,onSelect(e){return d(this,null,function*(){return yield t.switchQuality(e.url),o.show=`${a.get("Switch Video")}: ${e.html}`,e.html})}})}})}(t),Ut(t),function(t){const{i18n:e,notice:r,option:o,constructor:a,proxy:n,template:{$player:i,$video:s,$poster:l}}=t;let c=0;for(let d=0;d{t.emit(`video:${e.type}`,e)});t.on("video:canplay",()=>{c=0,t.loading.show=!1}),t.once("video:canplay",()=>{t.loading.show=!1,t.controls.show=!0,t.mask.show=!0,t.isReady=!0,t.emit("ready")}),t.on("video:ended",()=>{o.loop?(t.seek=0,t.play(),t.controls.show=!1,t.mask.show=!1):(t.controls.show=!0,t.mask.show=!0)}),t.on("video:error",n=>d(null,null,function*(){c{t.emit("resize"),k&&(t.loading.show=!1,t.controls.show=!0,t.mask.show=!0)}),t.on("video:loadstart",()=>{t.loading.show=!0,t.mask.show=!1,t.controls.show=!0}),t.on("video:pause",()=>{t.controls.show=!0,t.mask.show=!0}),t.on("video:play",()=>{t.mask.show=!1,I(l,"display","none")}),t.on("video:playing",()=>{t.mask.show=!1}),t.on("video:progress",()=>{t.playing&&(t.loading.show=!1)}),t.on("video:seeked",()=>{t.loading.show=!1,t.mask.show=!0}),t.on("video:seeking",()=>{t.loading.show=!0,t.mask.show=!1}),t.on("video:timeupdate",()=>{t.mask.show=!1}),t.on("video:waiting",()=>{t.loading.show=!0,t.mask.show=!1})}(t),function(t){const{option:e,storage:r,template:{$video:o,$poster:a}}=t;for(const i in e.moreVideoAttr)t.attr(i,e.moreVideoAttr[i]);e.muted&&(t.muted=e.muted),e.volume&&(o.volume=Z(e.volume,0,1));const n=r.get("volume");"number"===typeof n&&(o.volume=Z(n,0,1)),e.poster&&I(a,"backgroundImage",`url(${e.poster})`),e.autoplay&&(o.autoplay=e.autoplay),e.playsInline&&(o.playsInline=!0,o["webkit-playsinline"]=!0),e.theme&&(e.cssVar["--art-theme"]=e.theme);for(const i in e.cssVar)t.cssVar(i,e.cssVar[i]);t.url=e.url}(t)}}function Xt(t){const{notice:e,constructor:r,template:{$player:o,$video:a}}=t,n="art-auto-orientation",i="art-auto-orientation-fullscreen";let s=!1;function l(){const{videoWidth:t,videoHeight:e}=a,r=document.documentElement.clientWidth,o=document.documentElement.clientHeight;return t>e&&ro}return t.on("fullscreenWeb",e=>{var a;if(e){if(l()){const e=Number(null!=(a=r.AUTO_ORIENTATION_TIME)?a:0);setTimeout(()=>{t.fullscreenWeb&&!L(o,n)&&function(){const e=U(),r=document.documentElement.clientWidth,a=document.documentElement.clientHeight-e.top-e.bottom,i=r-e.left-e.right;I(o,"width",`${a}px`),I(o,"height",`${i}px`),I(o,"transform-origin","0 0"),I(o,"transform",`rotate(90deg) translate(${e.top}px, -${r-e.right}px)`),C(o,n),t.isRotate=!0,t.emit("resize")}()},e)}}else L(o,n)&&(I(o,"width",""),I(o,"height",""),I(o,"transform-origin",""),I(o,"transform",""),z(o,n),t.isRotate=!1,t.emit("resize"))}),t.on("fullscreen",t=>d(null,null,function*(){var r;const a=!!(null==(r=null==screen?void 0:screen.orientation)?void 0:r.lock);if(t){if(a&&l())try{const t=screen.orientation.type.startsWith("portrait")?"landscape":"portrait";yield screen.orientation.lock(t),s=!0,C(o,i)}catch(n){s=!1,e.show=n}}else if(L(o,i)&&z(o,i),a&&s){try{screen.orientation.unlock()}catch(c){}s=!1}})),{name:"autoOrientation",get state(){return L(o,n)}}}function Gt(t){const{i18n:e,icons:r,storage:o,constructor:a,proxy:n,template:{$poster:i}}=t,s=t.layers.add({name:"auto-playback",html:'\n
\n
\n
\n '}),l=T(".art-auto-playback-last",s),c=T(".art-auto-playback-jump",s),d=T(".art-auto-playback-close",s);S(d,r.close);let p=null;function h(){const r=(o.get("times")||{})[t.option.id||t.option.url];clearTimeout(p),I(s,"display","none"),r&&r>=a.AUTO_PLAYBACK_MIN&&(I(s,"display","flex"),l.textContent=`${e.get("Last Seen")} ${Q(r)}`,c.textContent=e.get("Jump Play"),n(d,"click",()=>{I(s,"display","none")}),n(c,"click",()=>{t.seek=r,t.play(),I(i,"display","none"),I(s,"display","none")}),t.once("video:timeupdate",()=>{p=setTimeout(()=>{I(s,"display","none")},a.AUTO_PLAYBACK_TIMEOUT)}))}return t.on("video:timeupdate",()=>{if(t.playing){const e=o.get("times")||{},r=Object.keys(e);r.length>a.AUTO_PLAYBACK_MAX&&delete e[r[0]],e[t.option.id||t.option.url]=t.currentTime,o.set("times",e)}}),t.on("ready",h),t.on("restart",h),{name:"auto-playback",get times(){return o.get("times")||{}},clear:()=>o.del("times"),delete(t){const e=o.get("times")||{};return delete e[t],o.set("times",e),e}}}function Kt(t){const{constructor:e,proxy:r,template:{$player:o,$video:a}}=t;let n=null,i=!1,s=1;const l=()=>{clearTimeout(n),i&&(i=!1,t.playbackRate=s,z(o,"art-fast-forward"))};return r(a,"touchstart",r=>{1===r.touches.length&&t.playing&&!t.isLock&&(n=setTimeout(()=>{i=!0,s=t.playbackRate,t.playbackRate=e.FAST_FORWARD_VALUE,C(o,"art-fast-forward")},e.FAST_FORWARD_TIME))}),t.on("document:touchmove",l),t.on("document:touchend",l),{name:"fastForward",get state(){return L(o,"art-fast-forward")}}}function Zt(t){const{layers:e,icons:r,template:{$player:o}}=t;function a(){return L(o,"art-lock")}function n(){C(o,"art-lock"),t.isLock=!0,t.emit("lock",!0)}function i(){z(o,"art-lock"),t.isLock=!1,t.emit("lock",!1)}return e.add({name:"lock",mounted(e){const o=S(e,r.lock),a=S(e,r.unlock);I(o,"display","none"),t.on("lock",t=>{t?(I(o,"display","inline-flex"),I(a,"display","none")):(I(o,"display","none"),I(a,"display","inline-flex"))})},click(){a()?i():n()}}),{name:"lock",get state(){return a()},set state(t){t?n():i()}}}function Jt(t){return t.on("control",e=>{e?z(t.template.$player,"art-mini-progress-bar"):C(t.template.$player,"art-mini-progress-bar")}),{name:"mini-progress-bar"}}class Qt{constructor(t){this.art=t,this.id=0;const{option:e}=t;e.miniProgressBar&&!e.isLive&&this.add(Jt),e.lock&&k&&this.add(Zt),e.autoPlayback&&!e.isLive&&this.add(Gt),e.autoOrientation&&k&&this.add(Xt),e.fastForward&&k&&!e.isLive&&this.add(Kt);for(let r=0;rthis.next(t,e)):this.next(t,e)}next(t,e){const r=e&&e.name||t.name||`plugin${this.id}`;return X(!ot(this,r),`Cannot add a plugin that already has the same name: ${r}`),et(this,r,{value:e}),this}}class te extends kt{constructor(t){super(t);const{option:e,controls:r,template:{$setting:o}}=t;this.name="setting",this.$parent=o,this.id=0,this.active=null,this.cache=new Map,this.option=[...this.builtin,...e.settings],e.setting&&(this.format(),this.render(),t.on("blur",()=>{this.show&&(this.show=!1,this.render())}),t.on("focus",t=>{const e=V(t,r.setting),o=V(t,this.$parent);!this.show||e||o||(this.show=!1,this.render())}),t.on("resize",()=>this.resize()))}get builtin(){const t=[],{option:e}=this.art;return e.playbackRate&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:o,PLAYBACK_RATE:a}}=t;function n(t){return 1===t?e.get("Normal"):t.toFixed(1)}function i(){const e=t.setting.find(`playback-rate-${t.playbackRate}`);t.setting.check(e)}return{width:o,name:"playback-rate",html:e.get("Play Speed"),tooltip:n(t.playbackRate),icon:r.playbackRate,selector:a.map(e=>({value:e,name:`playback-rate-${e}`,default:e===t.playbackRate,html:n(e)})),onSelect:e=>(t.playbackRate=e.value,e.html),mounted:()=>{i(),t.on("video:ratechange",()=>i())}}}(this.art)),e.aspectRatio&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:o,ASPECT_RATIO:a}}=t;function n(t){return"default"===t?e.get("Default"):t}function i(){const e=t.setting.find(`aspect-ratio-${t.aspectRatio}`);t.setting.check(e)}return{width:o,name:"aspect-ratio",html:e.get("Aspect Ratio"),icon:r.aspectRatio,tooltip:n(t.aspectRatio),selector:a.map(e=>({value:e,name:`aspect-ratio-${e}`,default:e===t.aspectRatio,html:n(e)})),onSelect:e=>(t.aspectRatio=e.value,e.html),mounted:()=>{i(),t.on("aspectRatio",()=>i())}}}(this.art)),e.flip&&t.push(function(t){const{i18n:e,icons:r,constructor:{SETTING_ITEM_WIDTH:o,FLIP:a}}=t;function n(t){return e.get(J(t))}function i(){const e=t.setting.find(`flip-${t.flip}`);t.setting.check(e)}return{width:o,name:"flip",html:e.get("Video Flip"),tooltip:n(t.flip),icon:r.flip,selector:a.map(e=>({value:e,name:`flip-${e}`,default:e===t.flip,html:n(e)})),onSelect:e=>(t.flip=e.value,e.html),mounted:()=>{i(),t.on("flip",()=>i())}}}(this.art)),e.subtitleOffset&&t.push(function(t){const{i18n:e,icons:r,constructor:o}=t;return{width:o.SETTING_ITEM_WIDTH,name:"subtitle-offset",html:e.get("Subtitle Offset"),icon:r.subtitle,tooltip:"0s",range:[0,-10,10,.1],onChange:e=>(t.subtitleOffset=e.range[0],`${e.range[0]}s`),mounted:(e,r)=>{t.on("subtitleOffset",t=>{r.$range.value=t,r.tooltip=`${t}s`})}}}(this.art)),t}traverse(t,e=this.option){var r;for(let o=0;o{e.default=e===t,e.default&&e.$item&&O(e.$item,"art-current")},t.$option),this.render(t.$parents))}format(t=this.option,e,r,o=[]){for(let a=0;ae}),et(n,"$parents",{get:()=>r}),et(n,"$option",{get:()=>t});const o=[];et(n,"$events",{get:()=>o}),et(n,"$formatted",{get:()=>!0})}this.format(n.selector||[],n,t,o)}this.option=t}find(t=""){let e=null;return this.traverse(r=>{r.name===t&&(e=r)}),e}resize(){var t,e;const{controls:r,constructor:{SETTING_WIDTH:o,SETTING_ITEM_HEIGHT:a},template:{$player:n,$setting:i}}=this.art;if(r.setting&&this.show){const s=(null==(e=null==(t=this.active[0])?void 0:t.$parent)?void 0:e.width)||o,{left:l,width:c}=H(r.setting),{left:d,width:p}=H(n),h=l-d+c/2-s/2;if(I(i,"height",`${this.active===this.option?this.active.length*a:(this.active.length+1)*a}px`),I(i,"width",`${s}px`),this.art.isRotate||k)return;h+s>p?(I(i,"left",null),I(i,"right",null)):(I(i,"left",`${h}px`),I(i,"right","auto"))}}inactivate(t){for(let e=0;e'),s=N("div");C(s,"art-setting-item-left-icon"),S(s,o),S(i,s),S(i,t.$parent.html);const l=r(n,"click",()=>this.render(t.$parents));t.$parent.$events.push(l),S(e,n)}createItem(t,e=!1){var r,o;if(!this.cache.has(t.$option))return;const a=this.cache.get(t.$option),n=t.$item;let i="selector";ot(t,"switch")&&(i="switch"),ot(t,"range")&&(i="range"),ot(t,"onClick")&&(i="button");const{icons:s,proxy:l,constructor:c}=this.art,p=N("div");C(p,"art-setting-item"),I(p,"height",`${c.SETTING_ITEM_HEIGHT}px`),p.dataset.name=t.name||"",p.dataset.value=t.value||"";const h=S(p,'
'),u=S(p,'
'),m=N("div");switch(C(m,"art-setting-item-left-icon"),i){case"button":case"switch":case"range":S(m,t.icon||s.config);break;case"selector":(null==(r=t.selector)?void 0:r.length)?S(m,t.icon||s.config):S(m,s.check)}S(h,m),et(t,"$icon",{configurable:!0,get:()=>m}),et(t,"icon",{configurable:!0,get:()=>m.innerHTML,set(t){m.innerHTML="",S(m,t)}});const f=N("div");C(f,"art-setting-item-left-text"),S(f,t.html||""),S(h,f),et(t,"$html",{configurable:!0,get:()=>f}),et(t,"html",{configurable:!0,get:()=>f.innerHTML,set(t){f.innerHTML="",S(f,t)}});const g=N("div");switch(C(g,"art-setting-item-right-tooltip"),S(g,t.tooltip||""),S(u,g),et(t,"$tooltip",{configurable:!0,get:()=>g}),et(t,"tooltip",{configurable:!0,get:()=>g.innerHTML,set(t){g.innerHTML="",S(g,t)}}),i){case"switch":{const e=N("div");C(e,"art-setting-item-right-icon");const r=S(e,s.switchOn),o=S(e,s.switchOff);I(t.switch?o:r,"display","none"),S(u,e),et(t,"$switch",{configurable:!0,get:()=>e});let a=t.switch;et(t,"switch",{configurable:!0,get:()=>a,set(t){a=t,t?(I(o,"display","none"),I(r,"display",null)):(I(o,"display",null),I(r,"display","none"))}});break}case"range":{const e=N("div");C(e,"art-setting-item-right-icon");const r=S(e,'');r.value=t.range[0],r.min=t.range[1],r.max=t.range[2],r.step=t.range[3],C(r,"art-setting-range"),S(u,e),et(t,"$range",{configurable:!0,get:()=>r});let o=[...t.range];et(t,"range",{configurable:!0,get:()=>o,set(t){o=[...t],r.value=t[0],r.min=t[1],r.max=t[2],r.step=t[3]}})}break;case"selector":if(null==(o=t.selector)?void 0:o.length){const t=N("div");C(t,"art-setting-item-right-icon"),S(t,s.arrowRight),S(u,t)}}switch(i){case"switch":if(t.onSwitch){const e=l(p,"click",e=>d(this,null,function*(){t.switch=yield t.onSwitch.call(this.art,t,p,e)}));t.$events.push(e)}break;case"range":if(t.$range){if(t.onRange){const e=l(t.$range,"change",e=>d(this,null,function*(){t.range[0]=t.$range.valueAsNumber,t.tooltip=yield t.onRange.call(this.art,t,p,e)}));t.$events.push(e)}if(t.onChange){const e=l(t.$range,"input",e=>d(this,null,function*(){t.range[0]=t.$range.valueAsNumber,t.tooltip=yield t.onChange.call(this.art,t,p,e)}));t.$events.push(e)}}break;case"selector":{const e=l(p,"click",e=>d(this,null,function*(){var r;(null==(r=t.selector)?void 0:r.length)?this.render(t.selector):(this.check(t),t.$parent.onSelect&&(t.$parent.tooltip=yield t.$parent.onSelect.call(this.art,t,p,e)))}));t.$events.push(e),t.default&&C(p,"art-current")}break;case"button":if(t.onClick){const e=l(p,"click",e=>d(this,null,function*(){t.tooltip=yield t.onClick.call(this.art,t,p,e)}));t.$events.push(e)}}et(t,"$item",{configurable:!0,get:()=>p}),e?Y(p,n):S(a,p),t.mounted&&setTimeout(()=>t.mounted.call(this.art,t.$item,t),0)}render(t=this.option){var e;if(this.active=t,this.cache.has(t)){O(this.cache.get(t),"art-current")}else{const r=N("div");this.cache.set(t,r),C(r,"art-setting-panel"),S(this.$parent,r),O(r,"art-current"),(null==(e=t[0])?void 0:e.$parent)&&this.createHeader(t[0]);for(let e=0;enull,this.init(t.option.subtitle);let e=!1;t.on("video:timeupdate",()=>{if(!this.url)return;const t=this.art.template.$video.webkitDisplayingFullscreen;"boolean"===typeof t&&t!==e&&(e=t,this.createTrack(t?"subtitles":"metadata",this.url))})}get url(){return this.art.template.$track.src}set url(t){this.switch(t)}get textTrack(){var t,e;return null==(e=null==(t=this.art.template.$video)?void 0:t.textTracks)?void 0:e[0]}get activeCues(){return this.textTrack?Array.from(this.textTrack.activeCues):[]}get cues(){return this.textTrack?Array.from(this.textTrack.cues):[]}style(t,e){const{$subtitle:r}=this.art.template;return"object"===typeof t?P(r,t):I(r,t,e)}update(){const{option:{subtitle:t},template:{$subtitle:e}}=this.art;e.innerHTML="",this.activeCues.length&&(this.art.emit("subtitleBeforeUpdate",this.activeCues),e.innerHTML=this.activeCues.map((e,r)=>e.text.split(/\r?\n/).filter(t=>t.trim()).map(e=>`
\n ${t.escape?tt(e):e}\n
`).join("")).join(""),this.art.emit("subtitleAfterUpdate",this.activeCues))}switch(t){return d(this,arguments,function*(t,e={}){const{i18n:r,notice:o,option:a}=this.art,n=c(l(l({},a.subtitle),e),{url:t}),i=yield this.init(n);return e.name&&(o.show=`${r.get("Switch Subtitle")}: ${e.name}`),i})}createTrack(t,e){const{template:r,proxy:o,option:a}=this.art,{$video:n,$track:i}=r,s=N("track");s.default=!0,s.kind=t,s.src=e,s.label=a.subtitle.name||"Artplayer",s.track.mode="hidden",s.onload=()=>{this.art.emit("subtitleLoad",this.cues,this.option)},this.art.events.remove(this.destroyEvent),i.onload=null,M(i),S(n,s),r.$track=s,this.destroyEvent=o(this.textTrack,"cuechange",()=>this.update())}init(t){return d(this,null,function*(){const{notice:e,template:{$subtitle:r}}=this.art;return this.textTrack?(f(t,xt.subtitle),t.url?(this.option=t,this.style(t.style),fetch(t.url).then(t=>t.arrayBuffer()).then(e=>{const r=new TextDecoder(t.encoding).decode(e);switch(t.type||G(t.url)){case"srt":{const e=it(r);return st(t.onVttLoad(e))}case"ass":{const e=lt(r);return st(t.onVttLoad(e))}case"vtt":return st(t.onVttLoad(r));default:return t.url}}).then(t=>(r.innerHTML="",this.url===t||(URL.revokeObjectURL(this.url),this.createTrack("metadata",t)),t)).catch(t=>{throw r.innerHTML="",e.show=t,t})):void 0):null})}}class ae{constructor(t){this.art=t;const{option:e,constructor:r}=t;e.container instanceof Element?this.$container=e.container:(this.$container=T(e.container),X(this.$container,`No container element found by ${e.container}`)),X(B(),"The current browser does not support flex layout");const o=this.$container.tagName.toLowerCase();X("div"===o,`Unsupported container element type, only support 'div' but got '${o}'`),X(r.instances.every(t=>t.template.$container!==this.$container),"Cannot mount multiple instances on the same dom element"),this.query=this.query.bind(this),this.$container.dataset.artId=t.id,this.init()}static get html(){return`\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
Player version:
\n
${g}
\n
\n
\n
Video url:
\n
\n
\n
\n
Video volume:
\n
\n
\n
\n
Video time:
\n
\n
\n
\n
Video duration:
\n
\n
\n
\n
Video resolution:
\n
\n x \n
\n
\n
\n
[x]
\n
\n
\n
\n `}query(t){return T(t,this.$container)}init(){const{option:t}=this.art;if(t.useSSR||(this.$container.innerHTML=ae.html),this.$player=this.query(".art-video-player"),this.$video=this.query(".art-video"),this.$track=this.query("track"),this.$poster=this.query(".art-poster"),this.$subtitle=this.query(".art-subtitle"),this.$danmuku=this.query(".art-danmuku"),this.$bottom=this.query(".art-bottom"),this.$progress=this.query(".art-progress"),this.$controls=this.query(".art-controls"),this.$controlsLeft=this.query(".art-controls-left"),this.$controlsCenter=this.query(".art-controls-center"),this.$controlsRight=this.query(".art-controls-right"),this.$layer=this.query(".art-layers"),this.$loading=this.query(".art-loading"),this.$notice=this.query(".art-notice"),this.$noticeInner=this.query(".art-notice-inner"),this.$mask=this.query(".art-mask"),this.$state=this.query(".art-state"),this.$setting=this.query(".art-settings"),this.$info=this.query(".art-info"),this.$infoPanel=this.query(".art-info-panel"),this.$infoClose=this.query(".art-info-close"),this.$contextmenu=this.query(".art-contextmenus"),t.proxy){const e=t.proxy.call(this.art,this.art);X(e instanceof HTMLVideoElement||e instanceof HTMLCanvasElement,"Function 'option.proxy' needs to return 'HTMLVideoElement' or 'HTMLCanvasElement'"),Y(e,this.$video),e.className="art-video",this.$video=e}t.backdrop&&C(this.$player,"art-backdrop"),k&&C(this.$player,"art-mobile")}destroy(t){t?this.$container.innerHTML="":C(this.$player,"art-destroy")}}class ne{on(t,e,r){const o=this.e||(this.e={});return(o[t]||(o[t]=[])).push({fn:e,ctx:r}),this}once(t,e,r){const o=this;function a(...n){o.off(t,a),e.apply(r,n)}return a._=e,this.on(t,a,r)}emit(t,...e){const r=((this.e||(this.e={}))[t]||[]).slice();for(let o=0;oe.call(this,this)),le.DEBUG){const t=t=>console.log(`[ART.${this.id}] -> ${t}`);t(`Version@${le.version}`);for(let e=0;et(`Event@${e.type}`))}se.push(this)}static get instances(){return se}static get version(){return g}static get config(){return v}static get utils(){return ht}static get scheme(){return xt}static get Emitter(){return ne}static get validator(){return f}static get kindOf(){return f.kindOf}static get html(){return ae.html}static get option(){return{id:"",container:"#artplayer",url:"",poster:"",type:"",theme:"#f00",volume:.7,isLive:!1,muted:!1,autoplay:!1,autoSize:!1,autoMini:!1,loop:!1,flip:!1,playbackRate:!1,aspectRatio:!1,screenshot:!1,setting:!1,hotkey:!0,pip:!1,mutex:!0,backdrop:!0,fullscreen:!1,fullscreenWeb:!1,subtitleOffset:!1,miniProgressBar:!1,useSSR:!1,playsInline:!0,lock:!1,gesture:!0,fastForward:!1,autoPlayback:!1,autoOrientation:!1,airplay:!1,proxy:void 0,layers:[],contextmenu:[],controls:[],settings:[],quality:[],highlight:[],plugins:[],thumbnails:{url:"",number:60,column:10,width:0,height:0,scale:1},subtitle:{url:"",type:"",style:{},name:"",escape:!0,encoding:"utf-8",onVttLoad:t=>t},moreVideoAttr:{controls:!1,preload:b?"auto":"metadata"},i18n:{},icons:{},cssVar:{},customType:{},lang:null==navigator?void 0:navigator.language.toLowerCase()}}get proxy(){return this.events.proxy}get query(){return this.template.query}get video(){return this.template.$video}reset(){this.video.removeAttribute("src"),this.video.load()}destroy(t=!0){le.REMOVE_SRC_WHEN_DESTROY&&this.reset(),this.events.destroy(),this.template.destroy(t),se.splice(se.indexOf(this),1),this.isDestroy=!0,this.emit("destroy")}}return le.STYLE=re,le.DEBUG=!1,le.CONTEXTMENU=!0,le.NOTICE_TIME=2e3,le.SETTING_WIDTH=250,le.SETTING_ITEM_WIDTH=200,le.SETTING_ITEM_HEIGHT=35,le.RESIZE_TIME=200,le.SCROLL_TIME=200,le.SCROLL_GAP=50,le.AUTO_PLAYBACK_MAX=10,le.AUTO_PLAYBACK_MIN=5,le.AUTO_PLAYBACK_TIMEOUT=3e3,le.RECONNECT_TIME_MAX=5,le.RECONNECT_SLEEP_TIME=1e3,le.CONTROL_HIDE_TIME=3e3,le.DBCLICK_TIME=300,le.DBCLICK_FULLSCREEN=!0,le.MOBILE_DBCLICK_PLAY=!0,le.MOBILE_CLICK_PLAY=!1,le.AUTO_ORIENTATION_TIME=200,le.INFO_LOOP_TIME=1e3,le.FAST_FORWARD_VALUE=3,le.FAST_FORWARD_TIME=1e3,le.TOUCH_MOVE_RATIO=.5,le.VOLUME_STEP=.1,le.SEEK_STEP=5,le.PLAYBACK_RATE=[.5,.75,1,1.25,1.5,2],le.ASPECT_RATIO=["default","4:3","16:9"],le.FLIP=["normal","horizontal","vertical"],le.FULLSCREEN_WEB_IN_BODY=!0,le.LOG_VERSION=!0,le.USE_RAF=!1,le.REMOVE_SRC_WHEN_DESTROY=!0,$&&(F("artplayer-style",re),setTimeout(()=>{le.LOG_VERSION&&console.log(`%c ArtPlayer %c ${le.version} %c https://artplayer.org`,"color: #fff; background: #5f5f5f","color: #fff; background: #4bc729","")},100)),le}); diff --git a/docs/compiled/artplayer.mjs b/docs/compiled/artplayer.mjs index 24305d13a..49f7546c5 100644 --- a/docs/compiled/artplayer.mjs +++ b/docs/compiled/artplayer.mjs @@ -1,5 +1,5 @@ /*! - * artplayer.js v5.4.0 + * artplayer.js v5.4.1 * Github: https://github.com/zhw2590582/ArtPlayer * (c) 2017-2026 Harvey Zhao * Released under the MIT License. @@ -157,7 +157,7 @@ function requireOptionValidator() { } var optionValidatorExports = requireOptionValidator(); const validator = /* @__PURE__ */ getDefaultExportFromCjs(optionValidatorExports); -const version$1 = "5.4.0"; +const version$1 = "5.4.1"; const config$1 = { properties: [ "audioTracks", @@ -393,6 +393,20 @@ function getComposedPath(event) { } return path; } +function getSafeAreaInsets() { + const div = document.createElement("div"); + div.style.cssText = "position:fixed;top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);pointer-events:none;visibility:hidden;"; + document.body.appendChild(div); + const style2 = getComputedStyle(div); + const insets = { + top: Number.parseFloat(style2.top) || 0, + right: Number.parseFloat(style2.right) || 0, + bottom: Number.parseFloat(style2.bottom) || 0, + left: Number.parseFloat(style2.left) || 0 + }; + div.remove(); + return insets; +} class ArtPlayerError extends Error { constructor(message, context) { super(message); @@ -598,6 +612,7 @@ const utils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert getExt, getIcon, getRect, + getSafeAreaInsets, getStyle, has, hasClass, @@ -3559,12 +3574,15 @@ function autoOrientation(art) { const FS_CLASS = "art-auto-orientation-fullscreen"; let fsLocked = false; function applyWebRotate() { + const insets = getSafeAreaInsets(); const viewWidth = document.documentElement.clientWidth; const viewHeight = document.documentElement.clientHeight; - setStyle($player, "width", `${viewHeight}px`); - setStyle($player, "height", `${viewWidth}px`); + const safeWidth = viewHeight - insets.top - insets.bottom; + const safeHeight = viewWidth - insets.left - insets.right; + setStyle($player, "width", `${safeWidth}px`); + setStyle($player, "height", `${safeHeight}px`); setStyle($player, "transform-origin", "0 0"); - setStyle($player, "transform", `rotate(90deg) translate(0, -${viewWidth}px)`); + setStyle($player, "transform", `rotate(90deg) translate(${insets.top}px, -${viewWidth - insets.right}px)`); addClass($player, WEB_CLASS); art.isRotate = true; art.emit("resize"); diff --git a/docs/document/404.html b/docs/document/404.html index 146d6940c..e8a9e14bf 100644 --- a/docs/document/404.html +++ b/docs/document/404.html @@ -21,7 +21,7 @@
- + \ No newline at end of file diff --git a/docs/document/advanced/built-in.html b/docs/document/advanced/built-in.html index fdfd5160b..e54608964 100644 --- a/docs/document/advanced/built-in.html +++ b/docs/document/advanced/built-in.html @@ -217,7 +217,7 @@ art.on('ready', () => { art.plugins.add(myPlugin); }); - + \ No newline at end of file diff --git a/docs/document/advanced/class.html b/docs/document/advanced/class.html index 4cddf95ab..f85ad135b 100644 --- a/docs/document/advanced/class.html +++ b/docs/document/advanced/class.html @@ -31,7 +31,7 @@ }); console.info([...Artplayer.instances]);

version ​

返回播放器的版本信息

▶ Run Code
js
console.info(Artplayer.version);

env ​

返回播放器的环境变量

▶ Run Code
js
console.info(Artplayer.env);

build ​

返回播放器的打包时间

▶ Run Code
js
console.info(Artplayer.build);

config ​

返回视频的默认配置

▶ Run Code
js
console.info(Artplayer.config);

utils ​

返回播放器的工具函数集合

▶ Run Code
js
console.info(Artplayer.utils);

全部工具函数请参考以下地址：

artplayer/types/utils.d.ts

scheme ​

返回播放器选项的校验方案

▶ Run Code
js
console.info(Artplayer.scheme);

Emitter ​

返回事件分发器的构造函数

▶ Run Code
js
console.info(Artplayer.Emitter);

validator ​

返回选项的校验函数

▶ Run Code
js
console.info(Artplayer.validator);

kindOf ​

返回类型检测的函数工具

▶ Run Code
js
console.info(Artplayer.kindOf);

html ​

返回播放器所需的 html 字符串

▶ Run Code
js
console.info(Artplayer.html);

option ​

返回播放器的默认选项

▶ Run Code
js
console.info(Artplayer.option);
- + \ No newline at end of file diff --git a/docs/document/advanced/event.html b/docs/document/advanced/event.html index ab5198b48..702530cca 100644 --- a/docs/document/advanced/event.html +++ b/docs/document/advanced/event.html @@ -385,7 +385,7 @@ art.on('keydown', (event) => { console.log(event.code); });

video:canplay ​

浏览器可以播放媒体文件了，但估计没有足够的数据来支撑播放到结束，不必停下来进一步缓冲内容

video:canplaythrough ​

浏览器估计它可以在不停止内容缓冲的情况下播放媒体直到结束

video:complete ​

OfflineAudioContext 渲染完成

video:durationchange ​

duration 属性的值改变时触发

video:emptied ​

媒体内容变为空；例如，当这个 media 已经加载完成（或者部分加载完成），则发送此事件，并调用 load() 方法重新加载它

video:ended ​

视频停止播放，因为 media 已经到达结束点

video:error ​

获取媒体数据时出错，或者资源类型不是受支持的媒体格式

video:loadeddata ​

media 中的首帧已经完成加载

video:loadedmetadata ​

已加载元数据

video:pause ​

播放已暂停

video:play ​

播放已开始

video:playing ​

由于缺乏数据而暂停或延迟后，播放准备开始

video:progress ​

在浏览器加载资源时周期性触发

video:ratechange ​

播放速率发生变化

video:seeked ​

跳帧（seek）操作完成

video:seeking ​

跳帧（seek）操作开始

video:stalled ​

用户代理（user agent）正在尝试获取媒体数据，但数据意外未出现

video:suspend ​

媒体数据加载已暂停

video:timeupdate ​

currentTime 属性指定的时间发生变化

video:volumechange ​

音量发生变化

video:waiting ​

由于暂时缺少数据，播放已停止

- + \ No newline at end of file diff --git a/docs/document/advanced/global.html b/docs/document/advanced/global.html index 034c3730e..1428dc1ac 100644 --- a/docs/document/advanced/global.html +++ b/docs/document/advanced/global.html @@ -248,7 +248,7 @@ // 只销毁界面，不主动清空 src art.destroy(); - + \ No newline at end of file diff --git a/docs/document/advanced/plugin.html b/docs/document/advanced/plugin.html index e96ba73fb..693e54253 100644 --- a/docs/document/advanced/plugin.html +++ b/docs/document/advanced/plugin.html @@ -122,7 +122,7 @@ }) ], }); - + \ No newline at end of file diff --git a/docs/document/advanced/property.html b/docs/document/advanced/property.html index 04bb2a885..44cbbe023 100644 --- a/docs/document/advanced/property.html +++ b/docs/document/advanced/property.html @@ -457,7 +457,7 @@ art.on('ready', () => { art.subtitleOffset = 1; }); - + \ No newline at end of file diff --git a/docs/document/assets/en_index.md.L9xnqmbw.js b/docs/document/assets/en_index.md.DFeypQS9.js similarity index 98% rename from docs/document/assets/en_index.md.L9xnqmbw.js rename to docs/document/assets/en_index.md.DFeypQS9.js index eff59f8d0..61c00e6d4 100644 --- a/docs/document/assets/en_index.md.L9xnqmbw.js +++ b/docs/document/assets/en_index.md.DFeypQS9.js @@ -1,4 +1,4 @@ -import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g=JSON.parse('{"title":"Installation and Usage","description":"","frontmatter":{},"headers":[],"relativePath":"en/index.md","filePath":"en/index.md","lastUpdated":1772946913000}'),p={name:"en/index.md"};function t(e,s,h,k,r,E){return n(),a("div",null,s[0]||(s[0]=[l(`

Installation and Usage ​

Installation ​

bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>

CDN ​

bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js

Usage ​

html
<html>
+import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g=JSON.parse('{"title":"Installation and Usage","description":"","frontmatter":{},"headers":[],"relativePath":"en/index.md","filePath":"en/index.md","lastUpdated":1772946913000}'),p={name:"en/index.md"};function t(e,s,h,k,r,E){return n(),a("div",null,s[0]||(s[0]=[l(`
Installation and Usage ​
Installation ​
bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js
Usage ​
html
<html>
     <head>
         <title>ArtPlayer Demo</title>
         <meta charset="UTF-8" />
@@ -19,7 +19,7 @@ import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
           });
         </script>
     </body>
-</html>
Note
The player's dimensions depend on the dimensions of its container. Therefore, your container must have defined dimensions.
See more usage examples at the following link
/example
Vue.js ​
vue
<template>
+</html>
Note
The player's dimensions depend on the dimensions of its container. Therefore, your container must have defined dimensions.
See more usage examples at the following link
/example
Vue.js ​
vue
<template>
   <div ref="$container" />
 </template>
 
@@ -71,7 +71,7 @@ import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 function getInstance(art) {
   console.log(art)
 }
-</script>
Artplayer is not reactive:
Directly modifying the option in Vue.js will not update the player.
React.js ​
jsx
import Artplayer from 'artplayer'
+</script>
Artplayer is not reactive:
Directly modifying the option in Vue.js will not update the player.
React.js ​
jsx
import Artplayer from 'artplayer'
 import { useEffect, useRef } from 'react'
 
 export default function Player({ option, getInstance, ...rest }) {
@@ -154,7 +154,7 @@ import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 
 option.volume = 0.5;
 
-const art8 = new Artplayer(option);
Legacy Browsers ​
The production build artplayer.js only supports the latest major version of Chrome: last 1 Chrome version.
For legacy browsers, you can use the artplayer.legacy.js file, which is compatible down to: IE 11.
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
If you need to support even older browsers, modify the following configuration and build it yourself:
Build configuration: scripts/build.js
Reference documentation: browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
Starting from version 5.2.6, artplayer and all plugins also provide an ESM version in mjs format, such as:
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
+const art8 = new Artplayer(option);
Legacy Browsers ​
The production build artplayer.js only supports the latest major version of Chrome: last 1 Chrome version.
For legacy browsers, you can use the artplayer.legacy.js file, which is compatible down to: IE 11.
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
If you need to support even older browsers, modify the following configuration and build it yourself:
Build configuration: scripts/build.js
Reference documentation: browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
Starting from version 5.2.6, artplayer and all plugins also provide an ESM version in mjs format, such as:
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
 <html lang="en">
 
 <head>
diff --git a/docs/document/assets/en_index.md.L9xnqmbw.lean.js b/docs/document/assets/en_index.md.DFeypQS9.lean.js
similarity index 100%
rename from docs/document/assets/en_index.md.L9xnqmbw.lean.js
rename to docs/document/assets/en_index.md.DFeypQS9.lean.js
diff --git a/docs/document/assets/en_start_i18n.md.Btgstn_9.js b/docs/document/assets/en_start_i18n.md.Cg_MHRXn.js
similarity index 98%
rename from docs/document/assets/en_start_i18n.md.Btgstn_9.js
rename to docs/document/assets/en_start_i18n.md.Cg_MHRXn.js
index 6f00492da..720a91acf 100644
--- a/docs/document/assets/en_start_i18n.md.Btgstn_9.js
+++ b/docs/document/assets/en_start_i18n.md.Cg_MHRXn.js
@@ -2,7 +2,7 @@ import{_ as a,c as i,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
     container: '.artplayer-app',
     url: '/assets/sample/video.mp4',
     lang: 'zh-cn', // or 'en'
-});
Importing Languages ​
Language files before bundling are located at: artplayer/src/i18n/*.js. Contributions for new languages are welcome.
Bundled language files are located at: artplayer/dist/i18n/*.js
js
import id from 'artplayer/i18n/id';
+});
Importing Languages ​
Language files before bundling are located at: artplayer/src/i18n/*.js. Contributions for new languages are welcome.
Bundled language files are located at: artplayer/dist/i18n/*.js
js
import id from 'artplayer/i18n/id';
 import zhTw from 'artplayer/i18n/zh-tw';
 
 var art = new Artplayer({
diff --git a/docs/document/assets/en_start_i18n.md.Btgstn_9.lean.js b/docs/document/assets/en_start_i18n.md.Cg_MHRXn.lean.js
similarity index 100%
rename from docs/document/assets/en_start_i18n.md.Btgstn_9.lean.js
rename to docs/document/assets/en_start_i18n.md.Cg_MHRXn.lean.js
diff --git a/docs/document/assets/index.md.CpfWSd2Y.js b/docs/document/assets/index.md.DhvU8bFi.js
similarity index 98%
rename from docs/document/assets/index.md.CpfWSd2Y.js
rename to docs/document/assets/index.md.DhvU8bFi.js
index ec6c0c95a..898bd1c4b 100644
--- a/docs/document/assets/index.md.CpfWSd2Y.js
+++ b/docs/document/assets/index.md.DhvU8bFi.js
@@ -1,4 +1,4 @@
-import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g=JSON.parse('{"title":"安装使用","description":"","frontmatter":{},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1767420511000}'),p={name:"index.md"};function t(e,s,h,k,r,E){return n(),a("div",null,s[0]||(s[0]=[l(`
安装使用 ​
安装 ​
bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js
使用 ​
html
<html>
+import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g=JSON.parse('{"title":"安装使用","description":"","frontmatter":{},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1767420511000}'),p={name:"index.md"};function t(e,s,h,k,r,E){return n(),a("div",null,s[0]||(s[0]=[l(`
安装使用 ​
安装 ​
bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js
使用 ​
html
<html>
     <head>
         <title>ArtPlayer Demo</title>
         <meta charset="UTF-8" />
@@ -19,7 +19,7 @@ import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
           });
         </script>
     </body>
-</html>
提示
播放器的尺寸依赖于容器 container 的尺寸，所以你的容器 container 必须是有尺寸的
以下链接可以看到更多的使用例子
/example
Vue.js ​
vue
<template>
+</html>
提示
播放器的尺寸依赖于容器 container 的尺寸，所以你的容器 container 必须是有尺寸的
以下链接可以看到更多的使用例子
/example
Vue.js ​
vue
<template>
   <div ref="$container" />
 </template>
 
@@ -71,7 +71,7 @@ import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 function getInstance(art) {
   console.log(art)
 }
-</script>
Artplayer 非响应式：
在 Vue.js 里直接修改 option 是不会改变播放器的
React.js ​
jsx
import Artplayer from 'artplayer'
+</script>
Artplayer 非响应式：
在 Vue.js 里直接修改 option 是不会改变播放器的
React.js ​
jsx
import Artplayer from 'artplayer'
 import { useEffect, useRef } from 'react'
 
 export default function Player({ option, getInstance, ...rest }) {
@@ -154,7 +154,7 @@ import{_ as i,c as a,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 
 option.volume = 0.5;
 
-const art8 = new Artplayer(option);
古老的浏览器 ​
生产构建的 artplayer.js 只兼容最新一个主版本的 Chrome：last 1 Chrome version
对于古老的浏览器，可以使用 artplayer.legacy.js 文件，可以兼容到：IE 11
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：
构建配置：scripts/build.js
参考文档：browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
从 5.2.6 开始，artplayer 和所有插件还会提供一个 ESM 版本的 mjs，如：
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
+const art8 = new Artplayer(option);
古老的浏览器 ​
生产构建的 artplayer.js 只兼容最新一个主版本的 Chrome：last 1 Chrome version
对于古老的浏览器，可以使用 artplayer.legacy.js 文件，可以兼容到：IE 11
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：
构建配置：scripts/build.js
参考文档：browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
从 5.2.6 开始，artplayer 和所有插件还会提供一个 ESM 版本的 mjs，如：
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
 <html lang="en">
 
 <head>
diff --git a/docs/document/assets/index.md.CpfWSd2Y.lean.js b/docs/document/assets/index.md.DhvU8bFi.lean.js
similarity index 100%
rename from docs/document/assets/index.md.CpfWSd2Y.lean.js
rename to docs/document/assets/index.md.DhvU8bFi.lean.js
diff --git a/docs/document/assets/plugin_danmuku.md.NzG4PBIi.js b/docs/document/assets/plugin_danmuku.md.BVV3kpeJ.js
similarity index 99%
rename from docs/document/assets/plugin_danmuku.md.NzG4PBIi.js
rename to docs/document/assets/plugin_danmuku.md.BVV3kpeJ.js
index c33049b6e..e87fede44 100644
--- a/docs/document/assets/plugin_danmuku.md.NzG4PBIi.js
+++ b/docs/document/assets/plugin_danmuku.md.BVV3kpeJ.js
@@ -1,4 +1,4 @@
-import{_ as n,c as l,o as p,ak as s,j as i}from"./chunks/framework.xxfEszSJ.js";const y=JSON.parse('{"title":"弹幕库","description":"","frontmatter":{},"headers":[],"relativePath":"plugin/danmuku.md","filePath":"plugin/danmuku.md","lastUpdated":1734270991000}'),h={name:"plugin/danmuku.md"};function e(k,a,t,r,E,d){return p(),l("div",null,a[0]||(a[0]=[s(`
弹幕库 ​
演示 ​
👉 查看完整演示
安装 ​
bash
npm install artplayer-plugin-danmuku
bash
yarn add artplayer-plugin-danmuku
bash
pnpm add artplayer-plugin-danmuku
html
<script src="path/to/artplayer-plugin-danmuku.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
bash
https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
弹幕结构 ​
每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要text就可以发送一个弹幕，其余都是非必要参数
js
{
+import{_ as n,c as l,o as p,ak as s,j as i}from"./chunks/framework.xxfEszSJ.js";const y=JSON.parse('{"title":"弹幕库","description":"","frontmatter":{},"headers":[],"relativePath":"plugin/danmuku.md","filePath":"plugin/danmuku.md","lastUpdated":1734270991000}'),h={name:"plugin/danmuku.md"};function e(k,a,t,r,E,d){return p(),l("div",null,a[0]||(a[0]=[s(`
弹幕库 ​
演示 ​
👉 查看完整演示
安装 ​
bash
npm install artplayer-plugin-danmuku
bash
yarn add artplayer-plugin-danmuku
bash
pnpm add artplayer-plugin-danmuku
html
<script src="path/to/artplayer-plugin-danmuku.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
bash
https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
弹幕结构 ​
每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要text就可以发送一个弹幕，其余都是非必要参数
js
{
     text: '', // 弹幕文本
     time: 10, // 弹幕时间, 默认为当前播放器时间
     mode: 0, // 弹幕模式: 0: 滚动(默认)，1: 顶部，2: 底部
diff --git a/docs/document/assets/plugin_danmuku.md.NzG4PBIi.lean.js b/docs/document/assets/plugin_danmuku.md.BVV3kpeJ.lean.js
similarity index 100%
rename from docs/document/assets/plugin_danmuku.md.NzG4PBIi.lean.js
rename to docs/document/assets/plugin_danmuku.md.BVV3kpeJ.lean.js
diff --git a/docs/document/assets/start_i18n.md.uSeNmo_b.js b/docs/document/assets/start_i18n.md.CWsZb7Vr.js
similarity index 98%
rename from docs/document/assets/start_i18n.md.uSeNmo_b.js
rename to docs/document/assets/start_i18n.md.CWsZb7Vr.js
index e4f3e33df..df1cabece 100644
--- a/docs/document/assets/start_i18n.md.uSeNmo_b.js
+++ b/docs/document/assets/start_i18n.md.CWsZb7Vr.js
@@ -2,7 +2,7 @@ import{_ as a,c as i,o as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const c
     container: '.artplayer-app',
     url: '/assets/sample/video.mp4',
     lang: 'zh-cn', // or 'en'
-});
导入语言 ​
打包前的语言文件存放于: artplayer/src/i18n/*.js, 欢迎来添加你的语言
打包后的语言文件存放于: artplayer/dist/i18n/*.js
js
import id from 'artplayer/i18n/id';
+});
导入语言 ​
打包前的语言文件存放于: artplayer/src/i18n/*.js, 欢迎来添加你的语言
打包后的语言文件存放于: artplayer/dist/i18n/*.js
js
import id from 'artplayer/i18n/id';
 import zhTw from 'artplayer/i18n/zh-tw';
 
 var art = new Artplayer({
diff --git a/docs/document/assets/start_i18n.md.uSeNmo_b.lean.js b/docs/document/assets/start_i18n.md.CWsZb7Vr.lean.js
similarity index 100%
rename from docs/document/assets/start_i18n.md.uSeNmo_b.lean.js
rename to docs/document/assets/start_i18n.md.CWsZb7Vr.lean.js
diff --git a/docs/document/component/contextmenu.html b/docs/document/component/contextmenu.html
index 8d1f88558..0c8d3aec7 100644
--- a/docs/document/component/contextmenu.html
+++ b/docs/document/component/contextmenu.html
@@ -106,7 +106,7 @@
         })
     }, 3000);
 });

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/document/component/controls.html b/docs/document/component/controls.html
index ab40df85b..043f7018d 100644
--- a/docs/document/component/controls.html
+++ b/docs/document/component/controls.html
@@ -153,7 +153,7 @@
         });
     }, 3000);
 });
- + \ No newline at end of file diff --git a/docs/document/component/layers.html b/docs/document/component/layers.html index 53c0825f5..34dd8d1a7 100644 --- a/docs/document/component/layers.html +++ b/docs/document/component/layers.html @@ -125,7 +125,7 @@ }); }, 3000); }); - + \ No newline at end of file diff --git a/docs/document/component/setting.html b/docs/document/component/setting.html index 830f8efc8..4a0b9c7fb 100644 --- a/docs/document/component/setting.html +++ b/docs/document/component/setting.html @@ -245,7 +245,7 @@ }); }, 3000); }); - + \ No newline at end of file diff --git a/docs/document/en/advanced/built-in.html b/docs/document/en/advanced/built-in.html index 12f93f3e2..c36a7c1f1 100644 --- a/docs/document/en/advanced/built-in.html +++ b/docs/document/en/advanced/built-in.html @@ -217,7 +217,7 @@ art.on('ready', () => { art.plugins.add(myPlugin); }); - + \ No newline at end of file diff --git a/docs/document/en/advanced/class.html b/docs/document/en/advanced/class.html index 8d1b363e0..d54330dbb 100644 --- a/docs/document/en/advanced/class.html +++ b/docs/document/en/advanced/class.html @@ -31,7 +31,7 @@ }); console.info([...Artplayer.instances]);

version ​

Returns the version information of the player.

▶ Run Code
js
console.info(Artplayer.version);

env ​

Returns the environment variables of the player.

▶ Run Code
js
console.info(Artplayer.env);

build ​

Returns the build timestamp of the player.

▶ Run Code
js
console.info(Artplayer.build);

config ​

Returns the default configuration for videos.

▶ Run Code
js
console.info(Artplayer.config);

utils ​

Returns the collection of utility functions for the player.

▶ Run Code
js
console.info(Artplayer.utils);

For all utility functions, please refer to the following address:

artplayer/types/utils.d.ts

scheme ​

Returns the validation schema for player options.

▶ Run Code
js
console.info(Artplayer.scheme);

Emitter ​

Returns the constructor of the event emitter.

▶ Run Code
js
console.info(Artplayer.Emitter);

validator ​

Returns the validation function for options.

▶ Run Code
js
console.info(Artplayer.validator);

kindOf ​

Returns the type detection utility function.

▶ Run Code
js
console.info(Artplayer.kindOf);

html ​

Returns the html string required by the player.

▶ Run Code
js
console.info(Artplayer.html);

option ​

Returns the default options of the player.

▶ Run Code
js
console.info(Artplayer.option);
- + \ No newline at end of file diff --git a/docs/document/en/advanced/event.html b/docs/document/en/advanced/event.html index ddcb65626..52d7ea933 100644 --- a/docs/document/en/advanced/event.html +++ b/docs/document/en/advanced/event.html @@ -385,7 +385,7 @@ art.on('keydown', (event) => { console.log(event.code); });

video:canplay ​

The browser can start playing the media, but estimates there is not enough data to play through to the end without stopping for further buffering.

video:canplaythrough ​

The browser estimates it can play the media through to the end without stopping for buffering.

video:complete ​

The OfflineAudioContext rendering is complete.

video:durationchange ​

Triggered when the value of the duration property changes.

video:emptied ​

The media has become empty; for example, this event is sent when the media has already been loaded (or partially loaded), and the load() method is called to reload it.

video:ended ​

Playback has stopped because the media has reached its end.

video:error ​

An error occurred while fetching the media data, or the resource type is not a supported media format.

video:loadeddata ​

The first frame of the media has finished loading.

video:loadedmetadata ​

Metadata has been loaded.

video:pause ​

Playback has been paused.

video:play ​

Playback has begun.

video:playing ​

Playback is ready to start after having been paused or delayed due to lack of data.

video:progress ​

Fired periodically as the browser loads the resource.

video:ratechange ​

The playback rate has changed.

video:seeked ​

A seek operation has completed.

video:seeking ​

A seek operation has begun.

video:stalled ​

The user agent is trying to fetch media data, but data is unexpectedly not forthcoming.

video:suspend ​

Media data loading has been suspended.

video:timeupdate ​

The time indicated by the currentTime property has changed.

video:volumechange ​

The volume has changed.

video:waiting ​

Playback has stopped because of a temporary lack of data.

- + \ No newline at end of file diff --git a/docs/document/en/advanced/global.html b/docs/document/en/advanced/global.html index 8ddeb8df0..a7265b076 100644 --- a/docs/document/en/advanced/global.html +++ b/docs/document/en/advanced/global.html @@ -248,7 +248,7 @@ // Only destroy the UI, do not actively clear the src art.destroy(); - + \ No newline at end of file diff --git a/docs/document/en/advanced/plugin.html b/docs/document/en/advanced/plugin.html index 9d0729301..1b0f22989 100644 --- a/docs/document/en/advanced/plugin.html +++ b/docs/document/en/advanced/plugin.html @@ -122,7 +122,7 @@ }) ], }); - + \ No newline at end of file diff --git a/docs/document/en/advanced/property.html b/docs/document/en/advanced/property.html index b9c70243e..3ec5b3cf0 100644 --- a/docs/document/en/advanced/property.html +++ b/docs/document/en/advanced/property.html @@ -457,7 +457,7 @@ art.on('ready', () => { art.subtitleOffset = 1; }); - + \ No newline at end of file diff --git a/docs/document/en/component/contextmenu.html b/docs/document/en/component/contextmenu.html index 5787cb119..f080586fa 100644 --- a/docs/document/en/component/contextmenu.html +++ b/docs/document/en/component/contextmenu.html @@ -106,7 +106,7 @@ }) }, 3000); }); - + \ No newline at end of file diff --git a/docs/document/en/component/controls.html b/docs/document/en/component/controls.html index 1866e2bcf..7200c62ac 100644 --- a/docs/document/en/component/controls.html +++ b/docs/document/en/component/controls.html @@ -153,7 +153,7 @@ }); }, 3000); }); - + \ No newline at end of file diff --git a/docs/document/en/component/layers.html b/docs/document/en/component/layers.html index 71134afe2..cf57b2e07 100644 --- a/docs/document/en/component/layers.html +++ b/docs/document/en/component/layers.html @@ -125,7 +125,7 @@ }); }, 3000); }); - + \ No newline at end of file diff --git a/docs/document/en/component/setting.html b/docs/document/en/component/setting.html index e98e3ab5a..46264e150 100644 --- a/docs/document/en/component/setting.html +++ b/docs/document/en/component/setting.html @@ -245,7 +245,7 @@ }); }, 3000); }); - + \ No newline at end of file diff --git a/docs/document/en/index.html b/docs/document/en/index.html index 24b90b6ad..0f5a2a0a4 100644 --- a/docs/document/en/index.html +++ b/docs/document/en/index.html @@ -13,7 +13,7 @@ - + @@ -23,7 +23,7 @@ -
Artplayer.js

Appearance

Installation and Usage ​

Installation ​

bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>

CDN ​

bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js

Usage ​

html
<html>
+    
Artplayer.js
Appearance
Installation and Usage ​
Installation ​
bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js
Usage ​
html
<html>
     <head>
         <title>ArtPlayer Demo</title>
         <meta charset="UTF-8" />
@@ -44,7 +44,7 @@
           });
         </script>
     </body>
-</html>
Note
The player's dimensions depend on the dimensions of its container. Therefore, your container must have defined dimensions.
See more usage examples at the following link
/example
Vue.js ​
vue
<template>
+</html>
Note
The player's dimensions depend on the dimensions of its container. Therefore, your container must have defined dimensions.
See more usage examples at the following link
/example
Vue.js ​
vue
<template>
   <div ref="$container" />
 </template>
 
@@ -96,7 +96,7 @@
 function getInstance(art) {
   console.log(art)
 }
-</script>
Artplayer is not reactive:
Directly modifying the option in Vue.js will not update the player.
React.js ​
jsx
import Artplayer from 'artplayer'
+</script>
Artplayer is not reactive:
Directly modifying the option in Vue.js will not update the player.
React.js ​
jsx
import Artplayer from 'artplayer'
 import { useEffect, useRef } from 'react'
 
 export default function Player({ option, getInstance, ...rest }) {
@@ -179,7 +179,7 @@
 
 option.volume = 0.5;
 
-const art8 = new Artplayer(option);
Legacy Browsers ​
The production build artplayer.js only supports the latest major version of Chrome: last 1 Chrome version.
For legacy browsers, you can use the artplayer.legacy.js file, which is compatible down to: IE 11.
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
If you need to support even older browsers, modify the following configuration and build it yourself:
Build configuration: scripts/build.js
Reference documentation: browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
Starting from version 5.2.6, artplayer and all plugins also provide an ESM version in mjs format, such as:
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
+const art8 = new Artplayer(option);
Legacy Browsers ​
The production build artplayer.js only supports the latest major version of Chrome: last 1 Chrome version.
For legacy browsers, you can use the artplayer.legacy.js file, which is compatible down to: IE 11.
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
If you need to support even older browsers, modify the following configuration and build it yourself:
Build configuration: scripts/build.js
Reference documentation: browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
Starting from version 5.2.6, artplayer and all plugins also provide an ESM version in mjs format, such as:
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
 <html lang="en">
 
 <head>
@@ -237,7 +237,7 @@
         </script>
     </body>
 </html>
Note
You need to modify it before importing the Artplayer dependency for it to take effect.

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/document/en/start/i18n.html b/docs/document/en/start/i18n.html
index b3475e2a4..72ca7f33a 100644
--- a/docs/document/en/start/i18n.html
+++ b/docs/document/en/start/i18n.html
@@ -13,7 +13,7 @@
     
     
     
-    
+    
     
     
     
@@ -27,7 +27,7 @@
     container: '.artplayer-app',
     url: '/assets/sample/video.mp4',
     lang: 'zh-cn', // or 'en'
-});

Importing Languages ​

Language files before bundling are located at: artplayer/src/i18n/*.js. Contributions for new languages are welcome.

Bundled language files are located at: artplayer/dist/i18n/*.js

js
import id from 'artplayer/i18n/id';
+});

Importing Languages ​

Language files before bundling are located at: artplayer/src/i18n/*.js. Contributions for new languages are welcome.

Bundled language files are located at: artplayer/dist/i18n/*.js

js
import id from 'artplayer/i18n/id';
 import zhTw from 'artplayer/i18n/zh-tw';
 
 var art = new Artplayer({
@@ -75,7 +75,7 @@
         },
     },
 });
- + \ No newline at end of file diff --git a/docs/document/en/start/option.html b/docs/document/en/start/option.html index 7783a858d..3b1b17486 100644 --- a/docs/document/en/start/option.html +++ b/docs/document/en/start/option.html @@ -415,7 +415,7 @@ url: '/assets/sample/video.mp4', proxy: () => document.createElement('video') }); - + \ No newline at end of file diff --git a/docs/document/hashmap.json b/docs/document/hashmap.json index aeb95b1d0..3007f4e6c 100644 --- a/docs/document/hashmap.json +++ b/docs/document/hashmap.json @@ -1 +1 @@ -{"advanced_built-in.md":"DiyRIcIA","advanced_class.md":"Da3aE0pP","advanced_event.md":"mrsB0MsK","advanced_global.md":"Bdw3azKs","advanced_plugin.md":"B3Pobmcq","advanced_property.md":"CA7GaeI3","component_contextmenu.md":"ClKmcIKr","component_controls.md":"Cl62yW1F","component_layers.md":"Cys52VMi","component_setting.md":"BP5674ir","en_advanced_built-in.md":"CCHa0pnS","en_advanced_class.md":"SSD-Ahrs","en_advanced_event.md":"DEsqIUNQ","en_advanced_global.md":"3hwkL6RS","en_advanced_plugin.md":"C8AgK5Nt","en_advanced_property.md":"CaOAGGTk","en_component_contextmenu.md":"CsJAr6Ey","en_component_controls.md":"t1Ub-agE","en_component_layers.md":"Yo2RXBZy","en_component_setting.md":"Be0gsY-X","en_index.md":"L9xnqmbw","en_start_i18n.md":"Btgstn_9","en_start_option.md":"C2vGTVOZ","index.md":"CpfWSd2Y","plugin_danmuku.md":"NzG4PBIi","start_i18n.md":"uSeNmo_b","start_option.md":"D52S8Ynf"} +{"advanced_built-in.md":"DiyRIcIA","advanced_class.md":"Da3aE0pP","advanced_event.md":"mrsB0MsK","advanced_global.md":"Bdw3azKs","advanced_plugin.md":"B3Pobmcq","advanced_property.md":"CA7GaeI3","component_contextmenu.md":"ClKmcIKr","component_controls.md":"Cl62yW1F","component_layers.md":"Cys52VMi","component_setting.md":"BP5674ir","en_advanced_built-in.md":"CCHa0pnS","en_advanced_class.md":"SSD-Ahrs","en_advanced_event.md":"DEsqIUNQ","en_advanced_global.md":"3hwkL6RS","en_advanced_plugin.md":"C8AgK5Nt","en_advanced_property.md":"CaOAGGTk","en_component_contextmenu.md":"CsJAr6Ey","en_component_controls.md":"t1Ub-agE","en_component_layers.md":"Yo2RXBZy","en_component_setting.md":"Be0gsY-X","en_index.md":"DFeypQS9","en_start_i18n.md":"Cg_MHRXn","en_start_option.md":"C2vGTVOZ","index.md":"DhvU8bFi","plugin_danmuku.md":"BVV3kpeJ","start_i18n.md":"CWsZb7Vr","start_option.md":"D52S8Ynf"} diff --git a/docs/document/index.html b/docs/document/index.html index 8df026b28..21daed561 100644 --- a/docs/document/index.html +++ b/docs/document/index.html @@ -13,7 +13,7 @@ - + @@ -23,7 +23,7 @@ -
Artplayer.js

Appearance

安装使用 ​

安装 ​

bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>

CDN ​

bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js

使用 ​

html
<html>
+    
Artplayer.js
Appearance
安装使用 ​
安装 ​
bash
npm install artplayer
bash
yarn add artplayer
bash
pnpm add artplayer
html
<script src="path/to/artplayer.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js
bash
https://unpkg.com/artplayer/dist/artplayer.js
使用 ​
html
<html>
     <head>
         <title>ArtPlayer Demo</title>
         <meta charset="UTF-8" />
@@ -44,7 +44,7 @@
           });
         </script>
     </body>
-</html>
提示
播放器的尺寸依赖于容器 container 的尺寸，所以你的容器 container 必须是有尺寸的
以下链接可以看到更多的使用例子
/example
Vue.js ​
vue
<template>
+</html>
提示
播放器的尺寸依赖于容器 container 的尺寸，所以你的容器 container 必须是有尺寸的
以下链接可以看到更多的使用例子
/example
Vue.js ​
vue
<template>
   <div ref="$container" />
 </template>
 
@@ -96,7 +96,7 @@
 function getInstance(art) {
   console.log(art)
 }
-</script>
Artplayer 非响应式：
在 Vue.js 里直接修改 option 是不会改变播放器的
React.js ​
jsx
import Artplayer from 'artplayer'
+</script>
Artplayer 非响应式：
在 Vue.js 里直接修改 option 是不会改变播放器的
React.js ​
jsx
import Artplayer from 'artplayer'
 import { useEffect, useRef } from 'react'
 
 export default function Player({ option, getInstance, ...rest }) {
@@ -179,7 +179,7 @@
 
 option.volume = 0.5;
 
-const art8 = new Artplayer(option);
古老的浏览器 ​
生产构建的 artplayer.js 只兼容最新一个主版本的 Chrome：last 1 Chrome version
对于古老的浏览器，可以使用 artplayer.legacy.js 文件，可以兼容到：IE 11
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：
构建配置：scripts/build.js
参考文档：browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
从 5.2.6 开始，artplayer 和所有插件还会提供一个 ESM 版本的 mjs，如：
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
+const art8 = new Artplayer(option);
古老的浏览器 ​
生产构建的 artplayer.js 只兼容最新一个主版本的 Chrome：last 1 Chrome version
对于古老的浏览器，可以使用 artplayer.legacy.js 文件，可以兼容到：IE 11
js
import Artplayer from 'artplayer/legacy'
bash
https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js
bash
https://unpkg.com/artplayer/dist/artplayer.legacy.js
假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：
构建配置：scripts/build.js
参考文档：browserslist
ECMAScript Module ​
ESM Demo:
https://artplayer.org/esm.html
从 5.2.6 开始，artplayer 和所有插件还会提供一个 ESM 版本的 mjs，如：
  • artplayer/dist/artplayer.mjs
  • artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs
html
<!DOCTYPE html>
 <html lang="en">
 
 <head>
@@ -237,7 +237,7 @@
         </script>
     </body>
 </html>
提示
你需要在引入 Artplayer 依赖前来修改它才会生效

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/document/plugin/danmuku.html b/docs/document/plugin/danmuku.html
index 526ac5ade..3cfa95eb3 100644
--- a/docs/document/plugin/danmuku.html
+++ b/docs/document/plugin/danmuku.html
@@ -13,7 +13,7 @@
     
     
     
-    
+    
     
     
     
@@ -23,7 +23,7 @@
     
   
   
-    
Artplayer.js
Appearance
弹幕库 ​
演示 ​
👉 查看完整演示
安装 ​
bash
npm install artplayer-plugin-danmuku
bash
yarn add artplayer-plugin-danmuku
bash
pnpm add artplayer-plugin-danmuku
html
<script src="path/to/artplayer-plugin-danmuku.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
bash
https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
弹幕结构 ​
每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要text就可以发送一个弹幕，其余都是非必要参数
js
{
+    
Artplayer.js
Appearance
弹幕库 ​
演示 ​
👉 查看完整演示
安装 ​
bash
npm install artplayer-plugin-danmuku
bash
yarn add artplayer-plugin-danmuku
bash
pnpm add artplayer-plugin-danmuku
html
<script src="path/to/artplayer-plugin-danmuku.js"></script>
CDN ​
bash
https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
bash
https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js
弹幕结构 ​
每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要text就可以发送一个弹幕，其余都是非必要参数
js
{
     text: '', // 弹幕文本
     time: 10, // 弹幕时间, 默认为当前播放器时间
     mode: 0, // 弹幕模式: 0: 滚动(默认)，1: 顶部，2: 底部
@@ -367,7 +367,7 @@
 art.on('artplayerPluginDanmuku:destroy', () => {
     console.info('弹幕销毁');
 });

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/document/start/i18n.html b/docs/document/start/i18n.html
index be6fec8af..01f629381 100644
--- a/docs/document/start/i18n.html
+++ b/docs/document/start/i18n.html
@@ -13,7 +13,7 @@
     
     
     
-    
+    
     
     
     
@@ -27,7 +27,7 @@
     container: '.artplayer-app',
     url: '/assets/sample/video.mp4',
     lang: 'zh-cn', // or 'en'
-});
导入语言 ​
打包前的语言文件存放于: artplayer/src/i18n/*.js, 欢迎来添加你的语言
打包后的语言文件存放于: artplayer/dist/i18n/*.js
js
import id from 'artplayer/i18n/id';
+});
导入语言 ​
打包前的语言文件存放于: artplayer/src/i18n/*.js, 欢迎来添加你的语言
打包后的语言文件存放于: artplayer/dist/i18n/*.js
js
import id from 'artplayer/i18n/id';
 import zhTw from 'artplayer/i18n/zh-tw';
 
 var art = new Artplayer({
@@ -75,7 +75,7 @@
         },
     },
 });

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/document/start/option.html b/docs/document/start/option.html
index 43aa81851..3e2f4e211 100644
--- a/docs/document/start/option.html
+++ b/docs/document/start/option.html
@@ -415,7 +415,7 @@
     url: '/assets/sample/video.mp4',
     proxy: () => document.createElement('video')
 });
- + \ No newline at end of file diff --git a/docs/mobile.html b/docs/mobile.html index 137c40289..4a2af7560 100644 --- a/docs/mobile.html +++ b/docs/mobile.html @@ -5,11 +5,13 @@ Artplayer.js + content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover"> + +