From cfaaea6a5c700f576683463776797c18abaffcc5 Mon Sep 17 00:00:00 2001
From: Harvey Zhao <laozhaochaguan@gmail.com>
Date: Thu, 12 Feb 2026 16:55:43 +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 configurations.
---
 docs/assets/example/websr.js                  |   2 +
 docs/assets/ts/artplayer-plugin-ads.d.ts      |   4 +-
 .../assets/ts/artplayer-plugin-ambilight.d.ts |   4 +-
 docs/assets/ts/artplayer-plugin-asr.d.ts      |   4 +-
 .../ts/artplayer-plugin-audio-track.d.ts      |   4 +-
 .../ts/artplayer-plugin-auto-thumbnail.d.ts   |   4 +-
 docs/assets/ts/artplayer-plugin-chapter.d.ts  |   4 +-
 .../ts/artplayer-plugin-chromecast.d.ts       |   4 +-
 .../ts/artplayer-plugin-danmuku-mask.d.ts     |   4 +-
 docs/assets/ts/artplayer-plugin-danmuku.d.ts  |   4 +-
 .../ts/artplayer-plugin-dash-control.d.ts     |   4 +-
 .../ts/artplayer-plugin-document-pip.d.ts     |   4 +-
 .../ts/artplayer-plugin-hls-control.d.ts      |   4 +-
 docs/assets/ts/artplayer-plugin-iframe.d.ts   |   4 +-
 docs/assets/ts/artplayer-plugin-jassub.d.ts   |   4 +-
 .../artplayer-plugin-multiple-subtitles.d.ts  |   4 +-
 docs/assets/ts/artplayer-plugin-vast.d.ts     |   4 +-
 .../ts/artplayer-plugin-vtt-thumbnail.d.ts    |   4 +-
 docs/assets/ts/artplayer-plugin-websr.d.ts    |  97 ++---------
 docs/assets/ts/artplayer-proxy-canvas.d.ts    |   4 +-
 .../assets/ts/artplayer-proxy-mediabunny.d.ts |   4 +-
 docs/assets/ts/artplayer.d.ts                 |  36 +---
 docs/compiled/artplayer-plugin-websr.js       |   2 +-
 .../compiled/artplayer-plugin-websr.legacy.js |   2 +-
 docs/compiled/artplayer-plugin-websr.mjs      |   2 +-
 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.CYpcDsY6.js => en_index.md.DrOcPBwp.js} |  10 +-
 ...6.lean.js => en_index.md.DrOcPBwp.lean.js} |   0
 ...tw6CvN.js => en_start_i18n.md.DAxrpMQL.js} |   2 +-
 ...n.js => en_start_i18n.md.DAxrpMQL.lean.js} |   0
 ...ex.md.B8NxRV94.js => index.md.WcEL7IA5.js} |  10 +-
 ...RV94.lean.js => index.md.WcEL7IA5.lean.js} |   0
 ...HV45A.js => plugin_danmuku.md.D580Az0s.js} |   2 +-
 ....js => plugin_danmuku.md.D580Az0s.lean.js} |   0
 ....B0XPxv4h.js => start_i18n.md.C6dAnYSp.js} |   2 +-
 ...lean.js => start_i18n.md.C6dAnYSp.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                   |  14 +-
 docs/document/en/start/i18n.html              |   6 +-
 docs/document/en/start/option.html            |   2 +-
 docs/document/hashmap.json                    |   2 +-
 docs/document/index.html                      |  14 +-
 docs/document/plugin/danmuku.html             |   6 +-
 docs/document/start/i18n.html                 |   6 +-
 docs/document/start/option.html               |   2 +-
 .../artplayer-plugin-websr/index.js           | 163 ++++++++++++++----
 .../artplayer-plugin-websr/index.js.map       |   2 +-
 .../dist/artplayer-plugin-websr.js            |   2 +-
 .../dist/artplayer-plugin-websr.legacy.js     |   2 +-
 .../dist/artplayer-plugin-websr.mjs           |   2 +-
 .../artplayer-plugin-websr/src/Upscaler.js    |  85 ++++++---
 packages/artplayer-plugin-websr/src/index.js  | 148 +++++++++++++---
 .../types/artplayer-plugin-websr.d.ts         |  87 +---------
 72 files changed, 436 insertions(+), 392 deletions(-)
 rename docs/document/assets/{en_index.md.CYpcDsY6.js => en_index.md.DrOcPBwp.js} (96%)
 rename docs/document/assets/{en_index.md.CYpcDsY6.lean.js => en_index.md.DrOcPBwp.lean.js} (100%)
 rename docs/document/assets/{en_start_i18n.md.x4tw6CvN.js => en_start_i18n.md.DAxrpMQL.js} (98%)
 rename docs/document/assets/{en_start_i18n.md.x4tw6CvN.lean.js => en_start_i18n.md.DAxrpMQL.lean.js} (100%)
 rename docs/document/assets/{index.md.B8NxRV94.js => index.md.WcEL7IA5.js} (96%)
 rename docs/document/assets/{index.md.B8NxRV94.lean.js => index.md.WcEL7IA5.lean.js} (100%)
 rename docs/document/assets/{plugin_danmuku.md.C7LHV45A.js => plugin_danmuku.md.D580Az0s.js} (99%)
 rename docs/document/assets/{plugin_danmuku.md.C7LHV45A.lean.js => plugin_danmuku.md.D580Az0s.lean.js} (100%)
 rename docs/document/assets/{start_i18n.md.B0XPxv4h.js => start_i18n.md.C6dAnYSp.js} (98%)
 rename docs/document/assets/{start_i18n.md.B0XPxv4h.lean.js => start_i18n.md.C6dAnYSp.lean.js} (100%)

diff --git a/docs/assets/example/websr.js b/docs/assets/example/websr.js
index 0afe93119..e5574458e 100644
--- a/docs/assets/example/websr.js
+++ b/docs/assets/example/websr.js
@@ -1,3 +1,4 @@
+// https://github.com/sb2702/websr
 // npm i artplayer-plugin-websr
 // import artplayerPluginWebsr from 'artplayer-plugin-websr';
 
@@ -7,6 +8,7 @@ var art = new Artplayer({
     fullscreenWeb: true,
     plugins: [
         artplayerPluginWebsr({
+            videoScale: 2,
             networkSize: 'medium',
             weightsBaseUrl: '/assets/websr/weights',
             workerUrl: '/assets/websr/worker/main.js',
diff --git a/docs/assets/ts/artplayer-plugin-ads.d.ts b/docs/assets/ts/artplayer-plugin-ads.d.ts
index dd3cde90e..618fdd6c1 100644
--- a/docs/assets/ts/artplayer-plugin-ads.d.ts
+++ b/docs/assets/ts/artplayer-plugin-ads.d.ts
@@ -48,5 +48,5 @@ declare const artplayerPluginAds: (option: Option) => (art: Artplayer) => Ads
 
 export default artplayerPluginAds
 
-export = artplayerPluginAds;
-export as namespace artplayerPluginAds;
\ No newline at end of file
+export = artplayerPluginAds
+export as namespace artplayerPluginAds;
diff --git a/docs/assets/ts/artplayer-plugin-ambilight.d.ts b/docs/assets/ts/artplayer-plugin-ambilight.d.ts
index 786b884f4..50abda15a 100644
--- a/docs/assets/ts/artplayer-plugin-ambilight.d.ts
+++ b/docs/assets/ts/artplayer-plugin-ambilight.d.ts
@@ -16,5 +16,5 @@ declare const artplayerPluginAmbilight: (option: Option) => (art: Artplayer) =>
 
 export default artplayerPluginAmbilight
 
-export = artplayerPluginAmbilight;
-export as namespace artplayerPluginAmbilight;
\ No newline at end of file
+export = artplayerPluginAmbilight
+export as namespace artplayerPluginAmbilight;
diff --git a/docs/assets/ts/artplayer-plugin-asr.d.ts b/docs/assets/ts/artplayer-plugin-asr.d.ts
index a134e7348..769e0b30f 100644
--- a/docs/assets/ts/artplayer-plugin-asr.d.ts
+++ b/docs/assets/ts/artplayer-plugin-asr.d.ts
@@ -22,5 +22,5 @@ declare function artplayerPluginAsr(option?: AsrPluginOption): (art: Artplayer)
 
 export default artplayerPluginAsr
 
-export = artplayerPluginAsr;
-export as namespace artplayerPluginAsr;
\ No newline at end of file
+export = artplayerPluginAsr
+export as namespace artplayerPluginAsr;
diff --git a/docs/assets/ts/artplayer-plugin-audio-track.d.ts b/docs/assets/ts/artplayer-plugin-audio-track.d.ts
index aaddaa9cc..6d2dd469b 100644
--- a/docs/assets/ts/artplayer-plugin-audio-track.d.ts
+++ b/docs/assets/ts/artplayer-plugin-audio-track.d.ts
@@ -36,5 +36,5 @@ declare const artplayerPluginAudioTrack: (option: Option) => (art: Artplayer) =>
 
 export default artplayerPluginAudioTrack
 
-export = artplayerPluginAudioTrack;
-export as namespace artplayerPluginAudioTrack;
\ No newline at end of file
+export = artplayerPluginAudioTrack
+export as namespace artplayerPluginAudioTrack;
diff --git a/docs/assets/ts/artplayer-plugin-auto-thumbnail.d.ts b/docs/assets/ts/artplayer-plugin-auto-thumbnail.d.ts
index dff0302ce..e6f616aa0 100644
--- a/docs/assets/ts/artplayer-plugin-auto-thumbnail.d.ts
+++ b/docs/assets/ts/artplayer-plugin-auto-thumbnail.d.ts
@@ -13,5 +13,5 @@ declare const artplayerPluginAutoThumbnail: (option: Option) => (art: Artplayer)
 
 export default artplayerPluginAutoThumbnail
 
-export = artplayerPluginAutoThumbnail;
-export as namespace artplayerPluginAutoThumbnail;
\ No newline at end of file
+export = artplayerPluginAutoThumbnail
+export as namespace artplayerPluginAutoThumbnail;
diff --git a/docs/assets/ts/artplayer-plugin-chapter.d.ts b/docs/assets/ts/artplayer-plugin-chapter.d.ts
index 0c16baa40..5d6f7b378 100644
--- a/docs/assets/ts/artplayer-plugin-chapter.d.ts
+++ b/docs/assets/ts/artplayer-plugin-chapter.d.ts
@@ -17,5 +17,5 @@ declare const artplayerPluginChapter: (option: Option) => (art: Artplayer) => Re
 
 export default artplayerPluginChapter
 
-export = artplayerPluginChapter;
-export as namespace artplayerPluginChapter;
\ No newline at end of file
+export = artplayerPluginChapter
+export as namespace artplayerPluginChapter;
diff --git a/docs/assets/ts/artplayer-plugin-chromecast.d.ts b/docs/assets/ts/artplayer-plugin-chromecast.d.ts
index 4d3aadd12..5069b042d 100644
--- a/docs/assets/ts/artplayer-plugin-chromecast.d.ts
+++ b/docs/assets/ts/artplayer-plugin-chromecast.d.ts
@@ -13,5 +13,5 @@ declare const artplayerPluginChromecast: (option: Option) => (art: Artplayer) =>
 
 export default artplayerPluginChromecast
 
-export = artplayerPluginChromecast;
-export as namespace artplayerPluginChromecast;
\ No newline at end of file
+export = artplayerPluginChromecast
+export as namespace artplayerPluginChromecast;
diff --git a/docs/assets/ts/artplayer-plugin-danmuku-mask.d.ts b/docs/assets/ts/artplayer-plugin-danmuku-mask.d.ts
index b2c996b79..68515f8f8 100644
--- a/docs/assets/ts/artplayer-plugin-danmuku-mask.d.ts
+++ b/docs/assets/ts/artplayer-plugin-danmuku-mask.d.ts
@@ -21,5 +21,5 @@ declare const artplayerPluginDanmukuMask: (option?: Option) => (art: Artplayer)
 
 export default artplayerPluginDanmukuMask
 
-export = artplayerPluginDanmukuMask;
-export as namespace artplayerPluginDanmukuMask;
\ No newline at end of file
+export = artplayerPluginDanmukuMask
+export as namespace artplayerPluginDanmukuMask;
diff --git a/docs/assets/ts/artplayer-plugin-danmuku.d.ts b/docs/assets/ts/artplayer-plugin-danmuku.d.ts
index 6f6a5ec04..554ce0fe2 100644
--- a/docs/assets/ts/artplayer-plugin-danmuku.d.ts
+++ b/docs/assets/ts/artplayer-plugin-danmuku.d.ts
@@ -255,5 +255,5 @@ declare const artplayerPluginDanmuku: (option: Option) => (art: Artplayer) => Re
 
 export default artplayerPluginDanmuku
 
-export = artplayerPluginDanmuku;
-export as namespace artplayerPluginDanmuku;
\ No newline at end of file
+export = artplayerPluginDanmuku
+export as namespace artplayerPluginDanmuku;
diff --git a/docs/assets/ts/artplayer-plugin-dash-control.d.ts b/docs/assets/ts/artplayer-plugin-dash-control.d.ts
index 35057bb07..39a52d129 100644
--- a/docs/assets/ts/artplayer-plugin-dash-control.d.ts
+++ b/docs/assets/ts/artplayer-plugin-dash-control.d.ts
@@ -13,5 +13,5 @@ declare const artplayerPluginDashControl: (option: { quality?: Config, audio?: C
 
 export default artplayerPluginDashControl
 
-export = artplayerPluginDashControl;
-export as namespace artplayerPluginDashControl;
\ No newline at end of file
+export = artplayerPluginDashControl
+export as namespace artplayerPluginDashControl;
diff --git a/docs/assets/ts/artplayer-plugin-document-pip.d.ts b/docs/assets/ts/artplayer-plugin-document-pip.d.ts
index dee9d2c41..df061d9f4 100644
--- a/docs/assets/ts/artplayer-plugin-document-pip.d.ts
+++ b/docs/assets/ts/artplayer-plugin-document-pip.d.ts
@@ -18,5 +18,5 @@ declare const artplayerPluginDocumentPip: (option: Option) => (art: Artplayer) =
 
 export default artplayerPluginDocumentPip
 
-export = artplayerPluginDocumentPip;
-export as namespace artplayerPluginDocumentPip;
\ No newline at end of file
+export = artplayerPluginDocumentPip
+export as namespace artplayerPluginDocumentPip;
diff --git a/docs/assets/ts/artplayer-plugin-hls-control.d.ts b/docs/assets/ts/artplayer-plugin-hls-control.d.ts
index 01c881339..f047513e8 100644
--- a/docs/assets/ts/artplayer-plugin-hls-control.d.ts
+++ b/docs/assets/ts/artplayer-plugin-hls-control.d.ts
@@ -13,5 +13,5 @@ declare const artplayerPluginHlsControl: (option: { quality?: Config, audio?: Co
 
 export default artplayerPluginHlsControl
 
-export = artplayerPluginHlsControl;
-export as namespace artplayerPluginHlsControl;
\ No newline at end of file
+export = artplayerPluginHlsControl
+export as namespace artplayerPluginHlsControl;
diff --git a/docs/assets/ts/artplayer-plugin-iframe.d.ts b/docs/assets/ts/artplayer-plugin-iframe.d.ts
index f5ebf54f5..88cfd5bad 100644
--- a/docs/assets/ts/artplayer-plugin-iframe.d.ts
+++ b/docs/assets/ts/artplayer-plugin-iframe.d.ts
@@ -28,5 +28,5 @@ declare class ArtplayerPluginIframe {
 
 export default ArtplayerPluginIframe
 
-export = artplayerPluginIframe;
-export as namespace artplayerPluginIframe;
\ No newline at end of file
+export = artplayerPluginIframe
+export as namespace artplayerPluginIframe;
diff --git a/docs/assets/ts/artplayer-plugin-jassub.d.ts b/docs/assets/ts/artplayer-plugin-jassub.d.ts
index 0239d173d..27e10fe86 100644
--- a/docs/assets/ts/artplayer-plugin-jassub.d.ts
+++ b/docs/assets/ts/artplayer-plugin-jassub.d.ts
@@ -34,5 +34,5 @@ declare const artplayerPluginJassub: (option: JassubOption) => (art: Artplayer)
 
 export default artplayerPluginJassub
 
-export = artplayerPluginJassub;
-export as namespace artplayerPluginJassub;
\ No newline at end of file
+export = artplayerPluginJassub
+export as namespace artplayerPluginJassub;
diff --git a/docs/assets/ts/artplayer-plugin-multiple-subtitles.d.ts b/docs/assets/ts/artplayer-plugin-multiple-subtitles.d.ts
index 4d6161dff..a6f710bc1 100644
--- a/docs/assets/ts/artplayer-plugin-multiple-subtitles.d.ts
+++ b/docs/assets/ts/artplayer-plugin-multiple-subtitles.d.ts
@@ -12,5 +12,5 @@ declare const artplayerPluginMultipleSubtitles: (option: {
 
 export default artplayerPluginMultipleSubtitles
 
-export = artplayerPluginMultipleSubtitles;
-export as namespace artplayerPluginMultipleSubtitles;
\ No newline at end of file
+export = artplayerPluginMultipleSubtitles
+export as namespace artplayerPluginMultipleSubtitles;
diff --git a/docs/assets/ts/artplayer-plugin-vast.d.ts b/docs/assets/ts/artplayer-plugin-vast.d.ts
index 7d526fd4b..a2a5fc121 100644
--- a/docs/assets/ts/artplayer-plugin-vast.d.ts
+++ b/docs/assets/ts/artplayer-plugin-vast.d.ts
@@ -32,5 +32,5 @@ declare function artplayerPluginVast(
 
 export default artplayerPluginVast
 
-export = artplayerPluginVast;
-export as namespace artplayerPluginVast;
\ No newline at end of file
+export = artplayerPluginVast
+export as namespace artplayerPluginVast;
diff --git a/docs/assets/ts/artplayer-plugin-vtt-thumbnail.d.ts b/docs/assets/ts/artplayer-plugin-vtt-thumbnail.d.ts
index aaed1e528..4e8307e77 100644
--- a/docs/assets/ts/artplayer-plugin-vtt-thumbnail.d.ts
+++ b/docs/assets/ts/artplayer-plugin-vtt-thumbnail.d.ts
@@ -6,5 +6,5 @@ declare const artplayerPluginVttThumbnail: (option: { vtt?: string, style?: Part
 
 export default artplayerPluginVttThumbnail
 
-export = artplayerPluginVttThumbnail;
-export as namespace artplayerPluginVttThumbnail;
\ No newline at end of file
+export = artplayerPluginVttThumbnail
+export as namespace artplayerPluginVttThumbnail;
diff --git a/docs/assets/ts/artplayer-plugin-websr.d.ts b/docs/assets/ts/artplayer-plugin-websr.d.ts
index a2adaaf32..8ddec2731 100644
--- a/docs/assets/ts/artplayer-plugin-websr.d.ts
+++ b/docs/assets/ts/artplayer-plugin-websr.d.ts
@@ -1,95 +1,20 @@
 interface Option {
-    /**
-     * Upscale factor
-     * @default 2
-     */
-    scale?: number;
-    /**
-     * Network name for upscaling (required)
-     * e.g., 'anime4k/cnn-2x-m-an'
-     */
-    networkName: string;
-    /**
-     * Weights for the neural network (required)
-     * Can be a URL string or a pre-loaded weights object
-     * e.g., '/path/to/weights.json' or { layers: [...] }
-     */
-    weights: string | object;
-    /**
-     * Enable comparison mode
-     * @default false
-     */
-    compare?: boolean;
+  compare?: boolean
+  networkSize?: 'small' | 'medium' | 'large'
+  weightsBaseUrl?: string
+  workerUrl?: string
+  videoScale?: number
 }
 
 interface Result {
-    name: 'artplayerPluginWebsr';
-    /**
-     * Get WebSR instance
-     */
-    websr: () => any;
-    /**
-     * Get GPU context
-     */
-    gpu: () => any;
-    /**
-     * Get canvas element
-     */
-    canvas: () => HTMLCanvasElement;
-    /**
-     * Enable WebSR upscaling
-     */
-    enable: () => Promise<void>;
-    /**
-     * Disable WebSR upscaling
-     */
-    disable: () => void;
-    /**
-     * Toggle WebSR upscaling
-     */
-    toggle: () => Promise<void>;
-    /**
-     * Check if WebSR is enabled
-     */
-    isEnabled: () => boolean;
-    /**
-     * Check if WebSR is initialized
-     */
-    isInitialized: () => boolean;
-    /**
-     * Update options at runtime
-     * Supported options: enabled, weights, networkName, scale
-     */
-    update: (option: Partial<Option>) => Promise<void>;
-    /**
-     * Enable comparison mode
-     */
-    enableCompare: () => void;
-    /**
-     * Disable comparison mode
-     */
-    disableCompare: () => void;
-    /**
-     * Toggle comparison mode
-     */
-    toggleCompare: () => void;
-    /**
-     * Set comparison split position (0-1)
-     */
-    setComparePosition: (pos: number) => void;
-    /**
-     * Get current comparison split position (0-1)
-     */
-    getComparePosition: () => number;
-    /**
-     * Check if comparison mode is enabled
-     */
-    isComparing: () => boolean;
+  name: 'artplayerPluginWebsr'
+  upscaler: any
+  update: (option: Option) => void
 }
 
-declare const artplayerPluginWebsr: (option?: Option) => (art: Artplayer) => Result;
+declare const artplayerPluginWebsr: (option?: Option) => (art: Artplayer) => Result
 
 export default artplayerPluginWebsr
 
-export = artplayerPluginWebsr;
-export as namespace artplayerPluginWebsr;
\ No newline at end of file
+export = artplayerPluginWebsr
+export as namespace artplayerPluginWebsr;
diff --git a/docs/assets/ts/artplayer-proxy-canvas.d.ts b/docs/assets/ts/artplayer-proxy-canvas.d.ts
index caf16cc42..0db0ddf98 100644
--- a/docs/assets/ts/artplayer-proxy-canvas.d.ts
+++ b/docs/assets/ts/artplayer-proxy-canvas.d.ts
@@ -6,5 +6,5 @@ declare const artplayerProxyCanvas: (option?: Option) => (art: Artplayer) => Res
 
 export default artplayerProxyCanvas
 
-export = artplayerProxyCanvas;
-export as namespace artplayerProxyCanvas;
\ No newline at end of file
+export = artplayerProxyCanvas
+export as namespace artplayerProxyCanvas;
diff --git a/docs/assets/ts/artplayer-proxy-mediabunny.d.ts b/docs/assets/ts/artplayer-proxy-mediabunny.d.ts
index 152c886fb..823eb12ab 100644
--- a/docs/assets/ts/artplayer-proxy-mediabunny.d.ts
+++ b/docs/assets/ts/artplayer-proxy-mediabunny.d.ts
@@ -75,5 +75,5 @@ declare const artplayerProxyMediabunny: (option?: Option) => (art: Artplayer) =>
 
 export default artplayerProxyMediabunny
 
-export = artplayerProxyMediabunny;
-export as namespace artplayerProxyMediabunny;
\ No newline at end of file
+export = artplayerProxyMediabunny
+export as namespace artplayerProxyMediabunny;
diff --git a/docs/assets/ts/artplayer.d.ts b/docs/assets/ts/artplayer.d.ts
index 964913abc..401974c9a 100644
--- a/docs/assets/ts/artplayer.d.ts
+++ b/docs/assets/ts/artplayer.d.ts
@@ -126,8 +126,6 @@ export interface Subtitle {
   onVttLoad?: (vtt: string) => string
 }
 
-
-
 export interface SettingOption extends Omit<Setting, 'html' | 'icon' | 'tooltip'> {
   html: string
   icon: string | undefined
@@ -239,10 +237,6 @@ export interface Quality {
   url: string
 }
 
-
-
-
-
 export type AspectRatio = 'default' | '4:3' | '16:9' | (`${number}:${number}` & Record<never, never>)
 export type PlaybackRate = 0.5 | 0.75 | 1.0 | 1.25 | 1.5 | 1.75 | 2.0 | (number & Record<never, never>)
 export type Flip = 'normal' | 'horizontal' | 'vertical' | (string & Record<never, never>)
@@ -352,15 +346,6 @@ export declare class Player {
   reset(): void
 }
 
-
-
-
-
-
-
-
-
-
 export type CustomType
   = | 'flv'
     | 'm3u8'
@@ -769,9 +754,6 @@ declare module 'artplayer/i18n/*' {
   export default lang
 }
 
-
-
-
 export type Bar = 'loaded' | 'played' | 'hover'
 
 export interface Events {
@@ -995,8 +977,6 @@ export interface Config {
   ]
 }
 
-
-
 export interface Selector {
   /**
    * Whether the default is selected
@@ -1128,18 +1108,6 @@ export interface ComponentOption {
   onSelect?: (this: Artplayer, selector: Selector, element: HTMLElement, event: Event) => void
 }
 
-
-
-
-
-
-
-
-
-
-
-
-
 export type {
   Config,
   Events,
@@ -1329,5 +1297,5 @@ export default class Artplayer extends Player {
   } & Record<string, unknown>
 }
 
-export = Artplayer;
-export as namespace Artplayer;
\ No newline at end of file
+export = Artplayer
+export as namespace Artplayer;
diff --git a/docs/compiled/artplayer-plugin-websr.js b/docs/compiled/artplayer-plugin-websr.js
index 595a03982..2e8afed40 100644
--- a/docs/compiled/artplayer-plugin-websr.js
+++ b/docs/compiled/artplayer-plugin-websr.js
@@ -5,4 +5,4 @@
  * (c) 2017-2026 Harvey Zack
  * Released under the MIT License.
  */
-!function(e,n,t,r,s){var i="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof i[r]&&i[r],u=o.i||{},a=o.cache||{},c="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(n,t){if(!a[n]){if(!e[n]){if(s[n])return s[n];var u="function"==typeof i[r]&&i[r];if(!t&&u)return u(n,!0);if(o)return o(n,!0);if(c&&"string"==typeof n)return c(n);var f=Error("Cannot find module '"+n+"'");throw f.code="MODULE_NOT_FOUND",f}_.resolve=p,_.cache={};var d=a[n]=new l.Module(n);e[n][0].call(d.exports,_,d,d.exports,i)}return a[n].exports;function _(e){var n=_.resolve(e);if(!1===n)return{};if(Array.isArray(n)){var t={__esModule:!0};return n.forEach(function(e){var n=e[0],r=e[1],s=e[2]||e[0],i=l(r);"*"===n?Object.keys(i).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:function(){return i[e]}})}):"*"===s?Object.defineProperty(t,n,{enumerable:!0,value:i}):Object.defineProperty(t,n,{enumerable:!0,get:function(){return"default"===s?i.__esModule?i.default:i:i[s]}})}),t}return l(n)}function p(t){var r=e[n][1][t];return null!=r?r:t}}function f(e){this.id=e,this.bundle=l,this.require=c,this.exports={}}l.isParcelRequire=!0,l.Module=f,l.modules=e,l.cache=a,l.parent=o,l.distDir=void 0,l.publicUrl=void 0,l.devServer=void 0,l.i=u,l.register=function(n,t){e[n]=[function(e,n){n.exports=t},{}]},Object.defineProperty(l,"root",{get:function(){return i[r]}}),i[r]=l;for(var d=0;d<n.length;d++)l(n[d]);if(t){var _=l(t);"object"==typeof exports&&"u">typeof module?module.exports=_:"function"==typeof define&&define.amd&&define(function(){return _})}}({"80h6e":[function(e,n,t,r){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(t),s.export(t,"default",()=>u);var i=e("@websr/websr"),o=s.interopDefault(i);function u(e={}){return n=>{let{template:{$player:t},constructor:{validator:r,utils:{append:s,setStyles:i}}}=n;(e=r({scale:2,networkName:"",weights:null,compare:!1,...e},{scale:"number",networkName:"string",weights:"?string|object",compare:"boolean"})).networkName||console.error("WebSR: networkName is required"),e.weights||console.error("WebSR: weights is required");let u=null,a=null,c=!1,l=!0,f=null,d=.5,_=!1,p=document.createElement("canvas");p.id="artplayer-websr-canvas",i(p,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"block",pointerEvents:"none",zIndex:"11",imageRendering:"crisp-edges"}),s(t,p);let h=document.createElement("div");function x(n){if(i(h,{left:100*(d=Math.max(0,Math.min(1,n)))+"%"}),e.compare){let e=100*d;i(p,{clipPath:`inset(0 0 0 ${e}%)`})}}function v(){let e=n.video;if(!e)return{displayWidth:640,displayHeight:360};let r=t.offsetWidth||640,s=t.offsetHeight||360,i=(e.videoWidth||640)/(e.videoHeight||360),o=r,u=s;return r/s>i?o=s*i:u=r/i,{displayWidth:o,displayHeight:u}}async function b(){try{let t;if(c)return!0;if(!navigator.gpu)return console.warn("WebGPU is not supported"),!1;if(!(a=await o.default.initWebGPU()))return console.warn("Failed to initialize WebGPU"),!1;if("string"==typeof e.weights){let n=await fetch(e.weights);if(!n.ok)return console.warn(`Failed to load weights from ${e.weights}`),!1;t=await n.json()}else{if("object"!=typeof e.weights)return console.warn("Invalid weights format"),!1;t=e.weights}let r=n.video;if(!r)return console.warn("Video element not found"),!1;let{displayWidth:s,displayHeight:l}=v();return p.width=s*e.scale,p.height=l*e.scale,i(p,{width:s+"px",height:l+"px"}),u=new(0,o.default)({source:r,network_name:e.networkName,weights:t,gpu:a,canvas:p}),c=!0,!0}catch(e){return console.error("WebSR initialization error:",e),!1}}async function m(){if(u&&l&&n.video)try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}}async function y(){if(!u||!l||!n.video||n.video.paused){f=null;return}try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}l&&!n.video.paused&&(f=requestAnimationFrame(y))}async function w(){if(!l){if(!c&&!await b())return void console.error("Failed to initialize WebSR");l=!0,setStyle(p,"display","block"),n.video&&!n.video.paused&&(f=requestAnimationFrame(y)),n.emit("artplayerPluginWebsr:enable")}}function g(){l&&(l=!1,i(p,{display:"none"}),f&&(cancelAnimationFrame(f),f=null),n.emit("artplayerPluginWebsr:disable"))}async function k(){l?g():await w()}return h.id="artplayer-websr-divider",i(h,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"2px",height:"100%",backgroundColor:"#fff",display:e.compare?"block":"none",pointerEvents:"auto",cursor:"col-resize",zIndex:"12"}),s(t,h),document.addEventListener("mousemove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.clientX-n.left)/n.width)}),document.addEventListener("mouseup",()=>{_=!1}),h.addEventListener("mousedown",()=>{_=!0}),document.addEventListener("touchmove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.touches[0].clientX-n.left)/n.width)},{passive:!0}),document.addEventListener("touchend",()=>{_=!1}),h.addEventListener("touchstart",()=>{_=!0}),n.on("play",()=>{m(),l&&c&&!f&&(f=requestAnimationFrame(y))}),n.on("pause",()=>{f&&(cancelAnimationFrame(f),f=null)}),n.on("seek",()=>{l&&c&&!n.video.paused&&!f&&(f=requestAnimationFrame(y))}),n.on("resize",()=>{if(u&&p.offsetParent){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}),n.on("destroy",()=>{g(),f&&(cancelAnimationFrame(f),f=null),p.parentNode&&p.parentNode.removeChild(p)}),b().then(()=>{l&&c&&n.video&&m()}).catch(e=>console.error("Failed to init WebSR:",e)),{name:"artplayerPluginWebsr",websr:()=>u,gpu:()=>a,canvas:()=>p,enable:w,disable:g,toggle:k,isEnabled:()=>l,isInitialized:()=>c,enableCompare:()=>{e.compare=!0,i(h,{display:"block"}),x(d)},disableCompare:()=>{e.compare=!1,i(h,{display:"none"}),i(p,{clipPath:"none"})},toggleCompare:()=>{e.compare?(i(h,{display:"none"}),i(p,{clipPath:"none"}),e.compare=!1):(e.compare=!0,i(h,{display:"block"}),x(d))},setComparePosition:e=>{x(e)},getComparePosition:()=>d,isComparing:()=>e.compare,update:async n=>{if((void 0!==n.weights&&n.weights!==e.weights||void 0!==n.networkName&&n.networkName!==e.networkName)&&(void 0!==n.weights&&(e.weights=n.weights),void 0!==n.networkName&&(e.networkName=n.networkName),c=!1,l&&await b()),void 0!==n.scale&&n.scale!==e.scale&&(e.scale=n.scale,p)){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}}}}"u">typeof window&&(window.artplayerPluginWebsr=u)},{"@websr/websr":"sfGe3","@parcel/transformer-js/src/esmodule-helpers.js":"6ykb1"}],sfGe3:[function(require,module,exports,__globalThis){!function(e,n){module.exports=n()}(self,()=>(()=>{"use strict";var __webpack_modules__={"./src/context.ts":function(__unused_webpack_module,exports){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nclass WebGPUContext {\n constructor(device, resolution, canvas, scale, debug) {\n this.device = device;\n this.canvas = canvas;\n this.resolution = resolution;\n this.textures = {};\n this.buffers = {};\n this.destroyed = false;\n this.scale = scale;\n this.debug = debug;\n let context = this.canvas.getContext('webgpu');\n if (context instanceof GPUCanvasContext) {\n this.context = context;\n }\n else {\n throw new Error(\"Unable to load WebGPU context\");\n }\n this.context.configure({\n device: this.device,\n format: navigator.gpu.getPreferredCanvasFormat()\n });\n this.textureUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;\n this.bufferUsage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST;\n if (this.debug) {\n // Read output pixel value\n this.textureUsage = this.textureUsage | GPUTextureUsage.COPY_SRC;\n this.bufferUsage = this.bufferUsage | GPUBufferUsage.COPY_SRC;\n }\n this.textures['output'] = this.context.getCurrentTexture();\n }\n readBuffer(bufferName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.buffers[bufferName])\n throw new Error(`No buffer with name ${bufferName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${bufferName} buffer encoder`,\n });\n const buffer = this.buffers[bufferName];\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: buffer.size,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyBufferToBuffer(buffer, 0, resultBuffer, 0, resultBuffer.size);\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n let range = resultBuffer.getMappedRange();\n return new Float32Array(range);\n });\n }\n readTexture(textureName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.textures[textureName])\n throw new Error(`No texture with name ${textureName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${textureName} texture encoder`,\n });\n const texture = this.textures[textureName];\n let bitsPerPixel = 16;\n if (texture.format === 'rgba8unorm')\n bitsPerPixel = 4;\n if (texture.format === 'r32float')\n bitsPerPixel = 4;\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: texture.width * texture.height * bitsPerPixel,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyTextureToBuffer({\n texture: this.textures[textureName],\n }, {\n buffer: resultBuffer,\n bytesPerRow: texture.width * bitsPerPixel\n }, {\n width: texture.width,\n height: texture.height,\n depthOrArrayLayers: 1,\n });\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n if (texture.format === 'r32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba8unorm')\n return new Uint8ClampedArray(resultBuffer.getMappedRange());\n return new Float32Array(0);\n });\n }\n destroy() {\n this.device.destroy();\n this.destroyed = true;\n }\n buffer(key, options) {\n if (!this.buffers[key]) {\n options = options || {};\n const width = options.width || this.resolution.width;\n const height = options.height || this.resolution.height;\n const channels = options.channels || 4;\n const bitdepth = options.bitdepth || 4;\n this.buffers[key] = this.device.createBuffer({\n label: key,\n size: width * height * channels * bitdepth,\n usage: this.bufferUsage\n });\n }\n return this.buffers[key];\n }\n texture(key, options) {\n if (!this.textures[key]) {\n options = options || {};\n this.textures[key] = this.device.createTexture({\n label: key,\n size: [options.width || this.resolution.width, options.height || this.resolution.height],\n format: options.format || 'rgba32float',\n usage: this.textureUsage\n });\n }\n return this.textures[key];\n }\n}\nexports[\"default\"] = WebGPUContext;\n\n\n//# sourceURL=webpack://WebSR/./src/context.ts?\n}")},"./src/layers/anime4k/conv2d-112x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv112x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights, first) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv112x4";\n const kernels = weights.weights;\n this.createUniform("kernels", "array<mat4x4f, 28>");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n if (first) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 2}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n else {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i + 1}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 3}]*max(-1.0*pixel_val${i}, vec4f(0.0));`;\n }\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv112x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-112x4.ts?\n}')},"./src/layers/anime4k/conv2d-16x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv16x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv16x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 36>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val0 = inputBuffer0[buff_ind];\n let pix_val1 = inputBuffer1[buff_ind];\n \n result += kernels[i]*max(pix_val0, vec4f(0.0));\n result += kernels[i+9]*max(pix_val1, vec4f(0.0));\n result += kernels[i+18]*max(-1.0*pix_val0, vec4f(0.0));\n result += kernels[i+27]*max(-1.0*pix_val1, vec4f(0.0));\n } \n \n\n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv16x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-16x4.ts?\n}')},"./src/layers/anime4k/conv2d-3x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv3x4 extends base_compute_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.label = "Anime4KConv3x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 9>");\n this.createUniform("bias", "vec4f");\n // Set up pipeline in Lazy Load\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[0] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureLoad(inputTexture0, coord + offset)\' :\n \'textureLoad(inputTexture0, coord + offset, 0)\';\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let offset = vec2<i32>(kernel_offsets[i].xy);\n result += kernels[i]*${textureLoad};\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n}\nexports["default"] = Anime4KConv3x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-3x4.ts?\n}')},"./src/layers/anime4k/conv2d-56x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv56x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv56x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernels", "array<mat4x4f, 14>");\n this.createUniform("bias", "vec4f");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${2 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${2 * i + 1}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n result += bias;\n \n outputBuffer[buff_ind] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv56x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-56x4.ts?\n}')},"./src/layers/anime4k/conv2d-8x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv8x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv8x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 18>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val = inputBuffer0[buff_ind];\n \n result += kernels[i]*max(pix_val, vec4f(0.0));\n result += kernels[i+9]*max(-1.0*pix_val, vec4f(0.0));\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv8x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-8x4.ts?\n}')},"./src/layers/anime4k/conv2d-concat2.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConcat2 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConcat2";\n this.createUniform("bias", "vec4f");\n const bias = weights.bias;\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n \n outputBuffer[buff_ind] = inputBuffer0[buff_ind] + inputBuffer1[buff_ind] + bias;\n }\n `);\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConcat2;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-concat2.ts?\n}')},"./src/layers/anime4k/display.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display.ts?\n}')},"./src/layers/anime4k/display_1x.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let bicubic = ${textureLoad};\n \n return bicubic + inputBuffer0[i];\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_1x.ts?\n}')},"./src/layers/anime4k/display_3c.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer3C extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer3C";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[3] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var<storage, read_write>inputBuffer1: array<vec4f>;\n @group(0) @binding(2) var<storage, read_write>inputBuffer2: array<vec4f>;\n @group(0) @binding(3) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(4) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n let value1 = inputBuffer1[i][c_index];\n let value2 = inputBuffer2[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value, value1, value2, value2);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n vertex: {\n module: this.shader,\n entryPoint: \'vertexMain\',\n },\n fragment: {\n module: this.shader,\n entryPoint: \'fragmentMain\',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer3C;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_3c.ts?\n}')},"./src/layers/base_compute_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ "./src/layers/base_layer.ts");\nclass ComputeLayer extends base_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.num_work_groups = 8;\n }\n createStandardShader(computeShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.computeShaderInputs()}\n \n ${computeShader}\n `\n });\n }\n computeShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n if (this.inputs[i] instanceof GPUTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_2d<f32>;`);\n }\n else if (this.inputs[i] instanceof GPUExternalTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_external;`);\n }\n else if (this.inputs[i] instanceof GPUBuffer) {\n inputs.push(`@group(0) @binding(${i}) var<storage, read_write>inputBuffer${i}: array<vec4f>;`);\n }\n else {\n console.log(this.inputs[i]);\n throw new Error("Input is undefined or non of the correct input type");\n }\n }\n // console.log("This layer", this.label);\n // console.log(this.inputs.length);\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n inputs.push(`@group(0) @binding(${this.inputs.length + this.uniforms.length}) var<storage, read_write>outputBuffer: array<vec4f>;`);\n return inputs.join(\'\\n\');\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n lazyLoadSetup() {\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginComputePass({ label: this.label });\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n // Dividing into work groups speeds up inference. If width or height aren\'t cleandly divided by work groups, we round to the nearest multiple of work-groups\n // Physically, this means shaving a few pixels (up to num_work_groups-1) off the bottom and right edges of the canvas but users shouldn\'t notice?\n pass.dispatchWorkgroups(Math.floor(this.resolution.width / this.num_work_groups), Math.floor(this.resolution.height / this.num_work_groups));\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n}\nexports["default"] = ComputeLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_compute_layer.ts?\n}')},"./src/layers/base_layer.ts":(__unused_webpack_module,exports)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass Layer {\n constructor(inputs, output, weights) {\n this.context = globalThis.context;\n this.device = this.context.device;\n this.resolution = this.context.resolution;\n this.inputs = inputs;\n this.output = output;\n this.uniforms = [];\n this.buffers = {};\n this.weights = weights;\n }\n createUniform(name, type) {\n this.uniforms.push({ name, type });\n }\n setUniform(name, value) {\n const buffer = this.device.createBuffer({\n label: `layer-${this.label}-buffer-${name}`,\n size: value.byteLength,\n usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,\n });\n this.device.queue.writeBuffer(buffer, /*bufferOffset=*/ 0, value);\n this.buffers[name] = buffer;\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n hasExternalTexture() {\n for (const input of this.inputs) {\n if (input instanceof GPUExternalTexture)\n return true;\n }\n return false;\n }\n lazyLoadSetup() { }\n run() { }\n}\nexports["default"] = Layer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_layer.ts?\n}')},"./src/layers/base_render_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ \"./src/layers/base_layer.ts\");\nclass RenderLayer extends base_layer_1.default {\n constructor(inputs, output, weights) {\n super(inputs, output, weights);\n this.vertexScale = this.context.resolution;\n }\n defaultVertexShader() {\n return `\n \n struct VertexShaderOutput {\n @builtin(position) position: vec4f,\n @location(0) tex_coord: vec2f,\n };\n\n @vertex\n fn vertexMain( @builtin(vertex_index) vertexIndex : u32) -> VertexShaderOutput{\n let pos = array(\n // 1st triangle\n vec2f( -1.0, -1.0), // center\n vec2f( 1.0, -1.0), // right, center\n vec2f( -1.0, 1.0), // center, top\n \n // 2st triangle\n vec2f( -1.0, 1.0), // center, top\n vec2f( 1.0, -1.0), // right, center\n vec2f( 1.0, 1.0), // right, top\n );\n \n var vsOutput: VertexShaderOutput;\n let xy = pos[vertexIndex];\n vsOutput.position = vec4f(xy, 0.0, 1.0);\n vsOutput.tex_coord = xy*0.5 + 0.5;\n vsOutput.tex_coord.y = - 1.0* vsOutput.tex_coord.y + 1.0;\n vsOutput.tex_coord.x = vsOutput.tex_coord.x*${this.vertexScale.width};\n vsOutput.tex_coord.y = vsOutput.tex_coord.y*${this.vertexScale.height};\n return vsOutput;\n }\n `;\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: 'auto',\n vertex: {\n module: this.shader,\n entryPoint: 'vertexMain',\n },\n fragment: {\n module: this.shader,\n entryPoint: 'fragmentMain',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultRenderPassDescriptor() {\n return {\n label: `${this.label}-render-pass`,\n colorAttachments: [\n {\n view: this.output.createView(),\n clearValue: [0, 0, 0, 1],\n loadOp: 'clear',\n storeOp: 'store',\n },\n ],\n };\n }\n createStandardShader(fragmentShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n \n ${this.fragmentShaderInputs()}\n \n ${fragmentShader}\n `\n });\n }\n fragmentShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n let type = (this.inputs[i] instanceof GPUTexture) ? 'texture_2d<f32>' : 'texture_external';\n inputs.push(`@group(0) @binding(0) var inputTexture${i}: ${type};`);\n }\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n return inputs.join('\\n');\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginRenderPass(this.renderPassDescriptor);\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n pass.draw(6); // call our vertex shader 6 times\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n setOutput(outputTexture) {\n this.output = outputTexture;\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n}\nexports[\"default\"] = RenderLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_render_layer.ts?\n}")},"./src/layers/utils/gaussian.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass GuassianLayer extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.label = "Gaussian";\n this.createUniform("gaussian", "array<vec3f, 3>");\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n var val = 0.0;\n \n for(var i = 0u; i< 3; i++){\n \n let a = vec3f(\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x\n );\n \n val += dot(a, gaussian[i]);\n \n } \n \n \n return vec4f(val, val, val, 1.0);\n } \n `);\n this.setUniform("gaussian", new Float32Array([\n 0.0675, 0.125, 0.0675, 0.0,\n 0.125, 0.250, 0.1250, 0.0,\n 0.0675, 0.125, 0.0675, 0.0\n ]));\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n 0, -1, 0, 0,\n 1, -1, 0, 0,\n -1, 0, 0, 0,\n 0, 0, 0, 0,\n 1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, 1, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = GuassianLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/gaussian.ts?\n}')},"./src/layers/utils/rgb_2_yuv.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass RGB2YUV extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.createUniform("rgb2yuv", "mat3x3f");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let color = textureLoad(inputTexture0, vec2<i32>(input.tex_coord), 0); \n let yuv = rgb2yuv*color.xyz;\n \n return vec4f(yuv, 1.0);\n } \n `);\n this.setUniform("rgb2yuv", new Float32Array([\n 0.299, -0.1473, 0.615, 1.0,\n 0.587, -.2886, -.51499, 1.0,\n 0.114, 0.436, -.1001, 1.0\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = RGB2YUV;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/rgb_2_yuv.ts?\n}')},"./src/main.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst context_1 = __webpack_require__(/*! ./context */ "./src/context.ts");\nconst renderer_1 = __webpack_require__(/*! ./renderer */ "./src/renderer.ts");\nconst network_list_1 = __webpack_require__(/*! ./networks/network_list */ "./src/networks/network_list.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSR {\n constructor(params) {\n if (!network_list_1.NetworkList[params.network_name])\n throw Error(`Network ${params.network_name} is not defined or implemented`);\n this.source = params.source;\n const source = this.source;\n this.resolution = params.resolution ? params.resolution : {\n width: (0, utils_1.getSourceWidth)(source),\n height: (0, utils_1.getSourceHeight)(source)\n };\n const scale = network_list_1.NetworkScales[params.network_name];\n if (params.canvas)\n this.canvas = params.canvas;\n else {\n this.canvas = new HTMLCanvasElement();\n this.canvas.width = this.resolution.width * scale;\n this.canvas.height = this.resolution.height * scale;\n }\n this.scale = scale;\n this.context = new context_1.default(params.gpu, this.resolution, this.canvas, this.scale, this.debug);\n globalThis.context = this.context;\n this.network = new network_list_1.NetworkList[params.network_name](params.weights);\n this.renderer = new renderer_1.default(this.network, this.source);\n }\n switchNetwork(network, weights) {\n if (!network_list_1.NetworkList[network])\n throw Error(`Network ${network} is not defined or implemented`);\n this.network = new network_list_1.NetworkList[network](weights);\n this.renderer.switchNetwork(this.network);\n }\n static initWebGPU() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!navigator.gpu)\n return false;\n const adapter = yield navigator.gpu.requestAdapter();\n if (!adapter)\n return false;\n const device = yield adapter.requestDevice();\n if (!device)\n return false;\n return device;\n });\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.start();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.render(source);\n });\n }\n destroy() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n this.context.destroy();\n });\n }\n}\nexports["default"] = WebSR;\n\n\n//# sourceURL=webpack://WebSR/./src/main.ts?\n}')},"./src/networks/anime4k/cnn-2x-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ "./src/layers/anime4k/display_3c.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst conv2d_112x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-112x4 */ "./src/layers/anime4k/conv2d-112x4.ts");\nconst conv2d_concat2_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-concat2 */ "./src/layers/anime4k/conv2d-concat2.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNN2XL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i< 7; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n for (let c = 0; c < 3; c++) {\n const sources_0 = [];\n const sources_1 = [];\n for (let i = 0; i < 7; i++) {\n let source = (i == 0) ? `conv2d_tf` : `conv2d_${i}_tf`;\n sources_0.push(context.buffer(source));\n sources_1.push(context.buffer(source + "1"));\n }\n const dest = (c == 0) ? `conv2d_last_tf` : `conv2d_last_tf${c}`;\n layers.push(new conv2d_112x4_1.default(sources_0, context.buffer(`conv2d_last_${c}_pt1`), weights[dest], true));\n layers.push(new conv2d_112x4_1.default(sources_1, context.buffer(`conv2d_last_${c}_pt2`), weights[dest], false));\n layers.push(new conv2d_concat2_1.default([context.buffer(`conv2d_last_${c}_pt1`), context.buffer(`conv2d_last_${c}_pt2`)], context.buffer(dest), weights[dest]));\n }\n const paint = new display_3c_1.default([context.buffer(\'conv2d_last_tf\'), context.buffer(\'conv2d_last_tf1\'), context.buffer(\'conv2d_last_tf2\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNN2XL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-l.ts?\n}')},"./src/networks/anime4k/cnn-2x-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ \"./src/layers/anime4k/display_3c.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_7_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf'), weights['conv2d_7_tf']);\n const conv2d_7_tf1 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf1'), weights['conv2d_7_tf1']);\n const conv2d_7_tf2 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf2'), weights['conv2d_7_tf2']);\n const paint = new display_3c_1.default([context.buffer('conv2d_7_tf'), context.buffer('conv2d_7_tf1'), context.buffer('conv2d_7_tf2'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_7_tf, conv2d_7_tf1, conv2d_7_tf2, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-m.ts?\n}")},"./src/networks/anime4k/cnn-2x-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1 = __webpack_require__(/*! ../../layers/anime4k/display */ \"./src/layers/anime4k/display.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_last_tf'), weights['conv2d_last_tf']);\n const paint = new display_1.default([context.buffer('conv2d_last_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-s.ts?\n}")},"./src/networks/anime4k/cnn-restore-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ "./src/layers/anime4k/display_1x.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNNRL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i < 4; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n layers.push(new conv2d_16x4_1.default([context.buffer(\'conv2d_3_tf\'), context.buffer(\'conv2d_3_tf1\')], context.buffer(`conv2d_out_tf`), weights[`conv2d_out_tf`]));\n const paint = new display_1x_1.default([context.buffer(\'conv2d_out_tf\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNNRL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-l.ts?\n}')},"./src/networks/anime4k/cnn-restore-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_out_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_out_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-m.ts?\n}")},"./src/networks/anime4k/cnn-restore-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-s.ts?\n}")},"./src/networks/base_network.ts":function(__unused_webpack_module,exports){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass NeuralNetwork {\n constructor(weights) {\n this.weights = weights;\n this.context = globalThis.context;\n this.layers = this.model();\n }\n model() {\n return [];\n }\n lastLayer() {\n return this.layers[this.layers.length - 1];\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n this.layers.forEach(layer =>{\n layer.run();\n });\n });\n }\n}\nexports["default"] = NeuralNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/base_network.ts?\n}')},"./src/networks/network_list.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nexports.NetworkScales = exports.NetworkList = void 0;\nconst cnn_2x_s_1 = __webpack_require__(/*! ./anime4k/cnn-2x-s */ "./src/networks/anime4k/cnn-2x-s.ts");\nconst cnn_2x_m_1 = __webpack_require__(/*! ./anime4k/cnn-2x-m */ "./src/networks/anime4k/cnn-2x-m.ts");\nconst cnn_2x_l_1 = __webpack_require__(/*! ./anime4k/cnn-2x-l */ "./src/networks/anime4k/cnn-2x-l.ts");\nconst cnn_restore_l_1 = __webpack_require__(/*! ./anime4k/cnn-restore-l */ "./src/networks/anime4k/cnn-restore-l.ts");\nconst cnn_restore_m_1 = __webpack_require__(/*! ./anime4k/cnn-restore-m */ "./src/networks/anime4k/cnn-restore-m.ts");\nconst cnn_restore_s_1 = __webpack_require__(/*! ./anime4k/cnn-restore-s */ "./src/networks/anime4k/cnn-restore-s.ts");\nconst poc_network_1 = __webpack_require__(/*! ./poc_network */ "./src/networks/poc_network.ts");\nexports.NetworkList = {\n "anime4k/cnn-2x-s": cnn_2x_s_1.default,\n "anime4k/cnn-2x-m": cnn_2x_m_1.default,\n "anime4k/cnn-2x-l": cnn_2x_l_1.default,\n "anime4k/cnn-restore-s": cnn_restore_s_1.default,\n "anime4k/cnn-restore-m": cnn_restore_m_1.default,\n "anime4k/cnn-restore-l": cnn_restore_l_1.default,\n "sb2702/blur-poc": poc_network_1.default\n};\nexports.NetworkScales = {\n "anime4k/cnn-2x-s": 2,\n "anime4k/cnn-2x-m": 2,\n "anime4k/cnn-2x-l": 2,\n "anime4k/cnn-restore-s": 1,\n "anime4k/cnn-restore-m": 1,\n "anime4k/cnn-restore-l": 1,\n "sb2702/blur-poc": 1\n};\n\n\n//# sourceURL=webpack://WebSR/./src/networks/network_list.ts?\n}')},"./src/networks/poc_network.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ./base_network */ "./src/networks/base_network.ts");\nconst rgb_2_yuv_1 = __webpack_require__(/*! ../layers/utils/rgb_2_yuv */ "./src/layers/utils/rgb_2_yuv.ts");\nconst gaussian_1 = __webpack_require__(/*! ../layers/utils/gaussian */ "./src/layers/utils/gaussian.ts");\nclass PoCNetwork extends base_network_1.default {\n constructor() {\n super();\n }\n model() {\n const layers = [];\n const context = this.context;\n layers.push(new rgb_2_yuv_1.default([context.texture(\'input\')], context.texture(\'yuv\')));\n layers.push(new gaussian_1.default([context.texture(\'yuv\')], context.texture(\'output\')));\n return layers;\n }\n}\nexports["default"] = PoCNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/poc_network.ts?\n}')},"./src/renderer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst display_1 = __webpack_require__(/*! ./layers/anime4k/display */ "./src/layers/anime4k/display.ts");\nconst base_render_layer_1 = __webpack_require__(/*! ./layers/base_render_layer */ "./src/layers/base_render_layer.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSRRenderer {\n constructor(network, source) {\n this.context = globalThis.context;\n this.network = network;\n this.source = source;\n this.active = false;\n }\n switchNetwork(network) {\n this.network = network;\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.context.destroyed) {\n throw new Error("WebSR instance was destroyed");\n }\n this.active = true;\n yield this.renderStep();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n this.active = false;\n if (this.vfc && this.source && (0, utils_1.isHTMLVideoElement)(this.source))\n this.source.cancelVideoFrameCallback(this.vfc);\n });\n }\n renderStep() {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof display_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.render();\n if (this.active && this.source && (0, utils_1.isHTMLVideoElement)(this.source)) {\n this.vfc = this.source.requestVideoFrameCallback(this.renderStep.bind(this));\n }\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof base_render_layer_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.network.feedForward(source ? source : this.source);\n });\n }\n}\nexports["default"] = WebSRRenderer;\n\n\n//# sourceURL=webpack://WebSR/./src/renderer.ts?\n}')},"./src/utils.ts":(__unused_webpack_module,exports)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isMainThread = isMainThread;\nexports.isHTMLVideoElement = isHTMLVideoElement;\nexports.isHTMLImageElement = isHTMLImageElement;\nexports.isImageBitmap = isImageBitmap;\nexports.isVideoFrame = isVideoFrame;\nexports.isVideoSource = isVideoSource;\nexports.isImageSource = isImageSource;\nexports.getSourceWidth = getSourceWidth;\nexports.getSourceHeight = getSourceHeight;\n/**\n * Check if we're running on the main thread (not in a worker)\n */\nfunction isMainThread() {\n return typeof HTMLVideoElement !== 'undefined';\n}\n/**\n * Check if a source is a video element (main thread only)\n */\nfunction isHTMLVideoElement(source) {\n return typeof HTMLVideoElement !== 'undefined' && source instanceof HTMLVideoElement;\n}\n/**\n * Check if a source is an image element (main thread only)\n */\nfunction isHTMLImageElement(source) {\n return typeof HTMLImageElement !== 'undefined' && source instanceof HTMLImageElement;\n}\n/**\n * Check if a source is an ImageBitmap (works in both contexts)\n */\nfunction isImageBitmap(source) {\n return typeof ImageBitmap !== 'undefined' && source instanceof ImageBitmap;\n}\n/**\n * Check if a source is a VideoFrame (worker context)\n */\nfunction isVideoFrame(source) {\n return typeof VideoFrame !== 'undefined' && source instanceof VideoFrame;\n}\n/**\n * Check if a source is any type of video source\n */\nfunction isVideoSource(source) {\n return isHTMLVideoElement(source) || isVideoFrame(source);\n}\n/**\n * Check if a source is any type of image source\n */\nfunction isImageSource(source) {\n return isHTMLImageElement(source) || isImageBitmap(source);\n}\n/**\n * Get the width of a media source\n */\nfunction getSourceWidth(source) {\n if (isHTMLVideoElement(source))\n return source.videoWidth;\n if (isHTMLImageElement(source))\n return source.naturalWidth;\n if (isVideoFrame(source))\n return source.displayWidth;\n if (isImageBitmap(source))\n return source.width;\n return 0;\n}\n/**\n * Get the height of a media source\n */\nfunction getSourceHeight(source) {\n if (isHTMLVideoElement(source))\n return source.videoHeight;\n if (isHTMLImageElement(source))\n return source.naturalHeight;\n if (isVideoFrame(source))\n return source.displayHeight;\n if (isImageBitmap(source))\n return source.height;\n return 0;\n}\n\n\n//# sourceURL=webpack://WebSR/./src/utils.ts?\n}")}},__webpack_module_cache__={};function __webpack_require__(e){var n=__webpack_module_cache__[e];if(void 0!==n)return n.exports;var t=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),t.exports}var __webpack_exports__=__webpack_require__("./src/main.ts");return __webpack_exports__.default})())},{}],"6ykb1":[function(e,n,t,r){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,n){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})}),n},t.export=function(e,n,t){Object.defineProperty(e,n,{enumerable:!0,get:t})}},{}]},["80h6e"],"80h6e","parcelRequire4dc0",{});
\ No newline at end of file
+!function(e,t,r,i,s){var a="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof a[i]&&a[i],n=o.i||{},l=o.cache||{},d="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function u(t,r){if(!l[t]){if(!e[t]){if(s[t])return s[t];var n="function"==typeof a[i]&&a[i];if(!r&&n)return n(t,!0);if(o)return o(t,!0);if(d&&"string"==typeof t)return d(t);var c=Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}h.resolve=function(r){var i=e[t][1][r];return null!=i?i:r},h.cache={};var m=l[t]=new u.Module(t);e[t][0].call(m.exports,h,m,m.exports,a)}return l[t].exports;function h(e){var t=h.resolve(e);if(!1===t)return{};if(Array.isArray(t)){var r={__esModule:!0};return t.forEach(function(e){var t=e[0],i=e[1],s=e[2]||e[0],a=u(i);"*"===t?Object.keys(a).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(r,e)||Object.defineProperty(r,e,{enumerable:!0,get:function(){return a[e]}})}):"*"===s?Object.defineProperty(r,t,{enumerable:!0,value:a}):Object.defineProperty(r,t,{enumerable:!0,get:function(){return"default"===s?a.__esModule?a.default:a:a[s]}})}),r}return u(t)}}u.isParcelRequire=!0,u.Module=function(e){this.id=e,this.bundle=u,this.require=d,this.exports={}},u.modules=e,u.cache=l,u.parent=o,u.distDir=void 0,u.publicUrl=void 0,u.devServer=void 0,u.i=n,u.register=function(t,r){e[t]=[function(e,t){t.exports=r},{}]},Object.defineProperty(u,"root",{get:function(){return a[i]}}),a[i]=u;for(var c=0;c<t.length;c++)u(t[c]);if(r){var m=u(r);"object"==typeof exports&&"u">typeof module?module.exports=m:"function"==typeof define&&define.amd&&define(function(){return m})}}({"80h6e":[function(e,t,r,i){var s=e("@parcel/transformer-js/src/esmodule-helpers.js"),a=e("./Upscaler.js"),o=s.interopDefault(a);window.artplayerPluginWebsr=function(e={networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2}){return t=>{let{$video:r,$player:i}=t.template,s=document.createElement("canvas");function a(){let e=t.video,r=i.offsetWidth||640,s=i.offsetHeight||360,a=(e.videoWidth||640)/(e.videoHeight||360),o=r,n=s;return r/s>a?o=s*a:n=r/a,{displayWidth:o,displayHeight:n}}if(i.appendChild(s),s.style.position="absolute",s.style.zIndex="11",s.style.pointerEvents="none",s.style.top="50%",s.style.left="50%",s.style.transform="translate(-50%, -50%)",s.style.opacity="0",s.style.transition="opacity 0.2s ease",!o.default||!o.default.isSupported||!o.default.isSupported())return void console.warn("Upscaler is not supported in this environment");let n=new(0,o.default)({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2}),l=!1;async function d(){if(!l){l=!0;try{await new Promise((e,t)=>{if(r.readyState>=1)return void e();let i=()=>{a(),e()},s=()=>{a(),t(Error("Failed to load video metadata"))},a=()=>{r.removeEventListener("loadedmetadata",i),r.removeEventListener("error",s)};r.addEventListener("loadedmetadata",i),r.addEventListener("error",s)}),await n.startRealtimeUpscale(r,s,e.networkSize||n.networkSize),requestAnimationFrame(()=>{s.style.opacity="1"})}catch(e){console.error("artplayer-plugin-upscaler: failed to start realtime",e)}}}let{displayWidth:u,displayHeight:c}=a();s.style.width=u+"px",s.style.height=c+"px";let m=50,h=!1,p=!!e.compare,f=document.createElement("div");function g(){if(p){let{displayWidth:e,displayHeight:t}=a(),r=`linear-gradient(to right, transparent 0%, transparent ${m}%, black ${m}%, black 100%)`;s.style.maskImage=r;let o=i.offsetWidth||640,n=i.offsetHeight||360,l=(o-e)/2+e*m/100;f.style.top=(n-t)/2+"px",f.style.left=l+"px",f.style.height=t+"px",f.style.transform="translateX(-50%)"}else s.style.maskImage="none"}function w(e){p&&(h=!0)}function y(e){if(p&&h){let t=i.getBoundingClientRect(),{displayWidth:r}=a(),s=i.offsetWidth||640;m=Math.max(0,Math.min(100,m=(e.clientX-t.left-(s-r)/2)/r*100)),g()}}function v(e){h=!1}return f.style.position="absolute",f.style.width="3px",f.style.backgroundColor="rgba(255, 255, 255, 0.75)",f.style.cursor="ew-resize",f.style.zIndex="12",f.style.pointerEvents="auto",f.style.display=p?"block":"none",f.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",p&&(i.appendChild(f),f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()),t.on("destroy",()=>{n&&"function"==typeof n.dispose&&n.dispose(),f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v)}),t.on("resize",()=>{let{displayWidth:e,displayHeight:t}=a();s.style.width=e+"px",s.style.height=t+"px",g()}),t.on("play",()=>{d()}),{name:"artplayerPluginWebsr",upscaler:n,update:function(r={}){if(r&&"object"==typeof r){if(Object.prototype.hasOwnProperty.call(r,"compare")){let t=!!r.compare;e.compare=t,(p=t)?(f.parentNode||i.appendChild(f),f.style.display="block",f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()):(s.style.maskImage="none",f.style.display="none",f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v))}r.networkSize&&(e.networkSize=r.networkSize,n&&"function"==typeof n.stopRealtimeUpscale&&n.stopRealtimeUpscale(),l=!1,t.paused||d())}}}}}},{"./Upscaler.js":"fDXhG","@parcel/transformer-js/src/esmodule-helpers.js":"6ykb1"}],fDXhG:[function(e,t,r,i){e("@parcel/transformer-js/src/esmodule-helpers.js").defineInteropFlag(r);class s{static DEFAULT_TIMEOUTS={IMAGE:3e5,VIDEO:36e5,METADATA:1e4};static DEFAULT_DELAYS={INIT:500,NETWORK:300};static isSupported(){try{let e="u">typeof Worker,t="u">typeof OffscreenCanvas||"u">typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="u">typeof Blob;return e&&t&&r}catch{return!1}}static isVideoSupported(){try{return"u">typeof VideoEncoder&&"u">typeof VideoDecoder}catch{return!1}}constructor(e={}){const t=e.weightsBaseUrl||"/weights";this.networks=e.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:`${t}/cnn-8.json`},medium:{name:"anime4k/cnn-2x-16",weightsUrl:`${t}/cnn-16.json`},large:{name:"anime4k/cnn-2x-28",weightsUrl:`${t}/cnn-28.json`}},this.weightsBaseUrl=t,this.networkSize=e.networkSize||"medium",this.workerUrl=e.workerUrl||"/worker/main.js",this.timeouts={...s.DEFAULT_TIMEOUTS,...e.timeouts||{}},this.delays={...s.DEFAULT_DELAYS,...e.delays||{}},this.imageScale="number"==typeof e.imageScale&&e.imageScale>0?e.imageScale:2,this.videoScale="number"==typeof e.videoScale&&e.videoScale>0?e.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}init({prewarm:e=!0}={}){if(!s.isSupported())throw Error("Upscaler is not supported in this environment");return e&&this.getWorker().postMessage({cmd:"isSupported"}),this}getWorker(){return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=e=>this.handleWorkerMessage(e)),this.workerInstance}static extractProgressValue(e){let t=e.data??e.progress??e.value??e.percentage;return"number"==typeof t?Math.min(100,Math.max(0,Math.round(t))):null}handleBlobResponse(e){let t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r({[t]:e.data})}requestBlob(){let e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}handleWorkerMessage(e){let{data:t}=e;if(console.debug("Worker message:",t),!t.cmd)return;let{cmd:r}=t;if("progress"===r){let e=s.extractProgressValue(t);null!==e&&this.progressCallback&&this.progressCallback(e),this.messageHandlers.progress&&this.messageHandlers.progress(t)}else"finished"===r?t.data instanceof Blob?this.handleBlobResponse(t):this.requestBlob():this.messageHandlers[r]&&this.messageHandlers[r](t)}async loadWeights(e){if(this.validateNetworkSize(e),this.weightsCache.has(e))return this.weightsCache.get(e);let t=this.networks[e],r=await fetch(t.weightsUrl);if(!r.ok)throw Error(`Failed to fetch weights: ${r.statusText}`);let i=await r.json();return this.weightsCache.set(e,i),i}static loadImageMetadata(e,t){return new Promise((r,i)=>{let s=new Blob([e],{type:t}),a=URL.createObjectURL(s),o=new Image;o.onload=()=>{URL.revokeObjectURL(a),r({width:o.width,height:o.height})},o.onerror=()=>{URL.revokeObjectURL(a),i(Error("Failed to load image"))},o.src=a})}static loadVideoMetadata(e,t){return new Promise((r,i)=>{let s=URL.createObjectURL(e),a=document.createElement("video");a.src=s;let o=setTimeout(()=>i(Error("Timeout")),t);a.onloadedmetadata=()=>{clearTimeout(o),URL.revokeObjectURL(s),r({width:a.videoWidth,height:a.videoHeight,duration:a.duration})},a.onerror=()=>{clearTimeout(o),URL.revokeObjectURL(s),i(Error("Failed to load video"))}})}createOffscreenCanvas(e,t,r=2){let i="number"==typeof r&&r>0?r:1,s=document.createElement("canvas");if(s.width=e*i,s.height=t*i,"function"!=typeof s.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");return s.transferControlToOffscreen()}createBlobPromise(e,t){return new Promise((r,i)=>{let s=setTimeout(()=>{this.messageHandlers[e]&&(delete this.messageHandlers[e],i(Error(`${e} processing timeout`)))},t);this.messageHandlers[e]=t=>{delete this.messageHandlers[e],clearTimeout(s);let a=t[e]||t.data;a instanceof Blob?r(a):i(Error(`Invalid ${e} format`))}})}validateNetworkSize(e){if(!this.networks[e])throw Error("Invalid networkSize: use one of "+Object.keys(this.networks).join(", "))}async upscaleImage(e,t,r){if(!e)throw Error("Image file is required");let i=t||this.networkSize;this.validateNetworkSize(i),this.processingType="image";let a=await e.arrayBuffer(),o=e.type||"image/jpeg",{width:n,height:l}=await s.loadImageMetadata(a,o),d=await this.loadWeights(i),u=this.networks[i],c="number"==typeof r&&r>0?r:this.imageScale,[m,h]=[this.createOffscreenCanvas(n,l,c),this.createOffscreenCanvas(n,l,1)],p=this.createBlobPromise("imageBlob",this.timeouts.IMAGE);return this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:a,imageMimeType:o,upscaled:m,original:h,resolution:{width:n,height:l},network_name:u.name,weights:d}},[m,h]),setTimeout(()=>{this.getWorker().postMessage({cmd:"network",data:{name:u.name,imageArrayBuffer:a,imageMimeType:o,weights:d}}),setTimeout(()=>{this.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:a,imageMimeType:o}})},this.delays.NETWORK)},this.delays.INIT),p}async upscaleVideo(e,t,r){if(!e)throw Error("Video file is required");let i=t||this.networkSize;if(this.validateNetworkSize(i),!s.isVideoSupported())throw Error("WebCodecs API not supported. Requires Chrome 94+");this.processingType="video";let{width:a,height:o,duration:n}=await s.loadVideoMetadata(e,this.timeouts.METADATA),l=await this.loadWeights(i),d=this.networks[i],u="number"==typeof r&&r>0?r:this.videoScale,[c,m]=[this.createOffscreenCanvas(a,o,u),this.createOffscreenCanvas(a,o,1)],h=this.createBlobPromise("videoBlob",this.timeouts.VIDEO);return this.getWorker().postMessage({cmd:"process",file:e,fileSize:e.size,duration:n,adjustedResolution:{adjustedInputWidth:a,adjustedInputHeight:o,adjustedOutputWidth:a*u,adjustedOutputHeight:o*u},upscaled:c,original:m,weights:l,network_name:d.name,skipDemuxProgress:!0},[c,m]),h}async startRealtimeUpscale(e,t,r,i){if(!e||!t)throw Error("videoElement and canvasElement are required");let s=r||this.networkSize;this.validateNetworkSize(s);let a=this.networks[s],o=await this.loadWeights(s),n="number"==typeof i&&i>0?i:this.videoScale;await new Promise((t,r)=>{if(e.readyState>=1)return void t();let i=()=>{a(),t()},s=()=>{a(),r(Error("Failed to load video metadata"))},a=()=>{e.removeEventListener("loadedmetadata",i),e.removeEventListener("error",s)};e.addEventListener("loadedmetadata",i),e.addEventListener("error",s)});let l=e.videoWidth,d=e.videoHeight;if(!l||!d)throw Error("Invalid video dimensions");let u=!t._upscalerTransferred,c=null;if(u){if(t.width=l*n,t.height=d*n,"function"!=typeof t.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");c=t.transferControlToOffscreen(),t._upscalerTransferred=!0}let m=document.createElement("canvas");m.width=l,m.height=d;let h=m.getContext("2d");this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null);let p={cmd:"realtimeInit",data:{upscaled:u?c:null,resolution:{width:l,height:d,scale:n,outputWidth:l*n,outputHeight:d*n},network_name:a.name,weights:o}};u&&c?this.getWorker().postMessage(p,[c]):this.getWorker().postMessage(p),this.realtimeState={running:!0,video:e,canvas:t,scale:n,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:h};let f=async()=>{if(!this.realtimeState||!this.realtimeState.running)return;let e=this.realtimeState,t=e.video,r=t.HAVE_CURRENT_DATA||2;if(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0){e.busy=!0;try{let r=e.captureCanvas,i=e.captureCtx;if(!r||!i)throw Error("Missing capture canvas");i.drawImage(t,0,0,r.width,r.height);let s=await createImageBitmap(r);e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:s},[s])}catch(e){console.warn("realtimeFrame error",e)}finally{this.realtimeState&&(this.realtimeState.busy=!1)}}this.realtimeLoopId=requestAnimationFrame(f)};this.realtimeLoopId=requestAnimationFrame(f)}stopRealtimeUpscale(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}async downloadUpscaled(e,t,r=null){let i=e.type.startsWith("video"),s=t||this.networkSize,a=i?await this.upscaleVideo(e,s):await this.upscaleImage(e,s),o=URL.createObjectURL(a),n=document.createElement("a");return n.href=o,n.download=r||`upscaled_${Date.now()}.${i?"mp4":"png"}`,n.click(),URL.revokeObjectURL(o),a}getSupportedNetworks(){return Object.keys(this.networks)}static async getGPUCapability(){try{if(navigator.gpu){let e=await navigator.gpu.requestAdapter();if(e){let t=e.limits.maxStorageBufferBindingSize/512;return Math.min(t,0x4000000)}}let e=document.createElement("canvas").getContext("webgl2");if(e)return e.getParameter(e.MAX_TEXTURE_SIZE)**2;return 8388608}catch{return 8388608}}static getBackendType(){try{if(navigator.gpu)return"webgpu";if(document.createElement("canvas").getContext("webgl2"))return"webgl";return"unknown"}catch{return"unknown"}}getAppState(){return{backend:s.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}onProgress(e){"function"==typeof e&&(this.progressCallback=e)}dispose(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}}r.default=s},{"@parcel/transformer-js/src/esmodule-helpers.js":"6ykb1"}],"6ykb1":[function(e,t,r,i){r.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},r.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},r.exportAll=function(e,t){return Object.keys(e).forEach(function(r){"default"===r||"__esModule"===r||Object.prototype.hasOwnProperty.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[r]}})}),t},r.export=function(e,t,r){Object.defineProperty(e,t,{enumerable:!0,get:r})}},{}]},["80h6e"],"80h6e","parcelRequire4dc0",{});
\ No newline at end of file
diff --git a/docs/compiled/artplayer-plugin-websr.legacy.js b/docs/compiled/artplayer-plugin-websr.legacy.js
index 1f464ef98..179d7589c 100644
--- a/docs/compiled/artplayer-plugin-websr.legacy.js
+++ b/docs/compiled/artplayer-plugin-websr.legacy.js
@@ -5,4 +5,4 @@
  * (c) 2017-2026 Harvey Zack
  * Released under the MIT License.
  */
-!function(e,n,t,r,s){var i="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof i[r]&&i[r],u=o.i||{},a=o.cache||{},c="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(n,t){if(!a[n]){if(!e[n]){if(s[n])return s[n];var u="function"==typeof i[r]&&i[r];if(!t&&u)return u(n,!0);if(o)return o(n,!0);if(c&&"string"==typeof n)return c(n);var f=Error("Cannot find module '"+n+"'");throw f.code="MODULE_NOT_FOUND",f}_.resolve=p,_.cache={};var d=a[n]=new l.Module(n);e[n][0].call(d.exports,_,d,d.exports,i)}return a[n].exports;function _(e){var n=_.resolve(e);if(!1===n)return{};if(Array.isArray(n)){var t={__esModule:!0};return n.forEach(function(e){var n=e[0],r=e[1],s=e[2]||e[0],i=l(r);"*"===n?Object.keys(i).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:function(){return i[e]}})}):"*"===s?Object.defineProperty(t,n,{enumerable:!0,value:i}):Object.defineProperty(t,n,{enumerable:!0,get:function(){return"default"===s?i.__esModule?i.default:i:i[s]}})}),t}return l(n)}function p(t){var r=e[n][1][t];return null!=r?r:t}}function f(e){this.id=e,this.bundle=l,this.require=c,this.exports={}}l.isParcelRequire=!0,l.Module=f,l.modules=e,l.cache=a,l.parent=o,l.distDir=void 0,l.publicUrl=void 0,l.devServer=void 0,l.i=u,l.register=function(n,t){e[n]=[function(e,n){n.exports=t},{}]},Object.defineProperty(l,"root",{get:function(){return i[r]}}),i[r]=l;for(var d=0;d<n.length;d++)l(n[d]);if(t){var _=l(t);"object"==typeof exports&&"u">typeof module?module.exports=_:"function"==typeof define&&define.amd&&define(function(){return _})}}({hrC3O:[function(e,n,t,r){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(t),s.export(t,"default",function(){return f});var i=e("@swc/helpers/cjs/_async_to_generator.cjs"),o=e("@swc/helpers/cjs/_object_spread.cjs"),u=e("@swc/helpers/cjs/_type_of.cjs"),a=e("@swc/helpers/cjs/_ts_generator.cjs"),c=e("@websr/websr"),l=s.interopDefault(c);function f(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return function(n){var t=n.template.$player,r=n.constructor,s=r.validator,c=r.utils,f=c.append,d=c.setStyles;(e=s((0,o._)({scale:2,networkName:"",weights:null,compare:!1},e),{scale:"number",networkName:"string",weights:"?string|object",compare:"boolean"})).networkName||console.error("WebSR: networkName is required"),e.weights||console.error("WebSR: weights is required");var _=null,p=null,h=!1,v=!0,x=null,b=.5,m=!1,y=document.createElement("canvas");y.id="artplayer-websr-canvas",d(y,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"block",pointerEvents:"none",zIndex:"11",imageRendering:"crisp-edges"}),f(t,y);var w=document.createElement("div");function g(n){if(d(w,{left:100*(b=Math.max(0,Math.min(1,n)))+"%"}),e.compare){var t=100*b;d(y,{clipPath:"inset(0 0 0 ".concat(t,"%)")})}}function k(){var e=n.video;if(!e)return{displayWidth:640,displayHeight:360};var r=t.offsetWidth||640,s=t.offsetHeight||360,i=(e.videoWidth||640)/(e.videoHeight||360),o=r,u=s;return r/s>i?o=s*i:u=r/i,{displayWidth:o,displayHeight:u}}function P(){return(0,i._)(function(){var t,r,s,i,o,c;return(0,a._)(this,function(a){switch(a.label){case 0:if(a.trys.push([0,6,,7]),h)return[2,!0];if(!navigator.gpu)return console.warn("WebGPU is not supported"),[2,!1];return[4,l.default.initWebGPU()];case 1:if(!(p=a.sent()))return console.warn("Failed to initialize WebGPU"),[2,!1];if("string"!=typeof e.weights)return[3,4];return[4,fetch(e.weights)];case 2:if(!(r=a.sent()).ok)return console.warn("Failed to load weights from ".concat(e.weights)),[2,!1];return[4,r.json()];case 3:return t=a.sent(),[3,5];case 4:if("object"!==(0,u._)(e.weights))return console.warn("Invalid weights format"),[2,!1];t=e.weights,a.label=5;case 5:if(!(s=n.video))return console.warn("Video element not found"),[2,!1];return o=(i=k()).displayWidth,c=i.displayHeight,y.width=o*e.scale,y.height=c*e.scale,d(y,{width:o+"px",height:c+"px"}),_=new(0,l.default)({source:s,network_name:e.networkName,weights:t,gpu:p,canvas:y}),h=!0,[2,!0];case 6:return console.error("WebSR initialization error:",a.sent()),[2,!1];case 7:return[2]}})})()}function S(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(!_||!v||!n.video)return[2];e.label=1;case 1:return e.trys.push([1,3,,4]),[4,_.render(n.video)];case 2:return e.sent(),[3,4];case 3:return console.error("WebSR render error:",e.sent()),[3,4];case 4:return[2]}})})()}function U(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(!_||!v||!n.video||n.video.paused)return x=null,[2];e.label=1;case 1:return e.trys.push([1,3,,4]),[4,_.render(n.video)];case 2:return e.sent(),[3,4];case 3:return console.error("WebSR render error:",e.sent()),[3,4];case 4:return v&&!n.video.paused&&(x=requestAnimationFrame(U)),[2]}})})()}function T(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(v)return[2];if(h)return[3,2];return[4,P()];case 1:if(!e.sent())return console.error("Failed to initialize WebSR"),[2];e.label=2;case 2:return v=!0,setStyle(y,"display","block"),n.video&&!n.video.paused&&(x=requestAnimationFrame(U)),n.emit("artplayerPluginWebsr:enable"),[2]}})})()}function B(){v&&(v=!1,d(y,{display:"none"}),x&&(cancelAnimationFrame(x),x=null),n.emit("artplayerPluginWebsr:disable"))}function L(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(!v)return[3,1];return B(),[3,3];case 1:return[4,T()];case 2:e.sent(),e.label=3;case 3:return[2]}})})()}return w.id="artplayer-websr-divider",d(w,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"2px",height:"100%",backgroundColor:"#fff",display:e.compare?"block":"none",pointerEvents:"auto",cursor:"col-resize",zIndex:"12"}),f(t,w),document.addEventListener("mousemove",function(e){if(m){var n=t.getBoundingClientRect(),r=(e.clientX-n.left)/n.width;g(r)}}),document.addEventListener("mouseup",function(){m=!1}),w.addEventListener("mousedown",function(){m=!0}),document.addEventListener("touchmove",function(e){if(m){var n=t.getBoundingClientRect(),r=(e.touches[0].clientX-n.left)/n.width;g(r)}},{passive:!0}),document.addEventListener("touchend",function(){m=!1}),w.addEventListener("touchstart",function(){m=!0}),n.on("play",function(){S(),v&&h&&!x&&(x=requestAnimationFrame(U))}),n.on("pause",function(){x&&(cancelAnimationFrame(x),x=null)}),n.on("seek",function(){v&&h&&!n.video.paused&&!x&&(x=requestAnimationFrame(U))}),n.on("resize",function(){if(_&&y.offsetParent){var n=k(),t=n.displayWidth,r=n.displayHeight;y.width=t*e.scale,y.height=r*e.scale,d(y,{width:t+"px",height:r+"px"})}}),n.on("destroy",function(){B(),x&&(cancelAnimationFrame(x),x=null),y.parentNode&&y.parentNode.removeChild(y)}),P().then(function(){v&&h&&n.video&&S()}).catch(function(e){return console.error("Failed to init WebSR:",e)}),{name:"artplayerPluginWebsr",websr:function(){return _},gpu:function(){return p},canvas:function(){return y},enable:T,disable:B,toggle:L,isEnabled:function(){return v},isInitialized:function(){return h},enableCompare:function(){e.compare=!0,d(w,{display:"block"}),g(b)},disableCompare:function(){e.compare=!1,d(w,{display:"none"}),d(y,{clipPath:"none"})},toggleCompare:function(){e.compare?(d(w,{display:"none"}),d(y,{clipPath:"none"}),e.compare=!1):(e.compare=!0,d(w,{display:"block"}),g(b))},setComparePosition:function(e){g(e)},getComparePosition:function(){return b},isComparing:function(){return e.compare},update:function(n){return(0,i._)(function(){var t,r,s;return(0,a._)(this,function(i){switch(i.label){case 0:if((void 0===n.weights||n.weights===e.weights)&&(void 0===n.networkName||n.networkName===e.networkName)||(void 0!==n.weights&&(e.weights=n.weights),void 0!==n.networkName&&(e.networkName=n.networkName),h=!1,!v))return[3,2];return[4,P()];case 1:i.sent(),i.label=2;case 2:return void 0!==n.scale&&n.scale!==e.scale&&(e.scale=n.scale,y&&(r=(t=k()).displayWidth,s=t.displayHeight,y.width=r*e.scale,y.height=s*e.scale,d(y,{width:r+"px",height:s+"px"}))),[2]}})})()}}}}"u">typeof window&&(window.artplayerPluginWebsr=f)},{"@swc/helpers/cjs/_async_to_generator.cjs":"cZn0e","@swc/helpers/cjs/_object_spread.cjs":"kyoEj","@swc/helpers/cjs/_type_of.cjs":"iXhRw","@swc/helpers/cjs/_ts_generator.cjs":"eltGh","@websr/websr":"aOhGv","@parcel/transformer-js/src/esmodule-helpers.js":"qpMMf"}],cZn0e:[function(e,n,t,r){"use strict";function s(e,n,t,r,s,i,o){try{var u=e[i](o),a=u.value}catch(e){t(e);return}u.done?n(a):Promise.resolve(a).then(r,s)}t._=function(e){return function(){var n=this,t=arguments;return new Promise(function(r,i){var o=e.apply(n,t);function u(e){s(o,r,i,u,a,"next",e)}function a(e){s(o,r,i,u,a,"throw",e)}u(void 0)})}}},{}],kyoEj:[function(e,n,t,r){"use strict";var s=e("9f9b8a24218ee51e");t._=function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.forEach(function(n){s._(e,n,t[n])})}return e}},{"9f9b8a24218ee51e":"ltU3W"}],ltU3W:[function(e,n,t,r){"use strict";t._=function(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}},{}],iXhRw:[function(e,n,t,r){"use strict";t._=function(e){return e&&"u">typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}},{}],eltGh:[function(e,n,t,r){"use strict";t._=function(e,n){var t,r,s,i={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]},o=Object.create(("function"==typeof Iterator?Iterator:Object).prototype),u=Object.defineProperty;return u(o,"next",{value:a(0)}),u(o,"throw",{value:a(1)}),u(o,"return",{value:a(2)}),"function"==typeof Symbol&&u(o,Symbol.iterator,{value:function(){return this}}),o;function a(e){return function(n){return c([e,n])}}function c(u){if(t)throw TypeError("Generator is already executing.");for(;o&&(o=0,u[0]&&(i=0)),i;)try{if(t=1,r&&(s=2&u[0]?r.return:u[0]?r.throw||((s=r.return)&&s.call(r),0):r.next)&&!(s=s.call(r,u[1])).done)return s;switch(r=0,s&&(u=[2&u[0],s.value]),u[0]){case 0:case 1:s=u;break;case 4:return i.label++,{value:u[1],done:!1};case 5:i.label++,r=u[1],u=[0];continue;case 7:u=i.ops.pop(),i.trys.pop();continue;default:if(!(s=(s=i.trys).length>0&&s[s.length-1])&&(6===u[0]||2===u[0])){i=0;continue}if(3===u[0]&&(!s||u[1]>s[0]&&u[1]<s[3])){i.label=u[1];break}if(6===u[0]&&i.label<s[1]){i.label=s[1],s=u;break}if(s&&i.label<s[2]){i.label=s[2],i.ops.push(u);break}s[2]&&i.ops.pop(),i.trys.pop();continue}u=n.call(e,i)}catch(e){u=[6,e],r=0}finally{t=s=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}}},{}],aOhGv:[function(require,module,exports,__globalThis){!function(e,n){module.exports=n()}(self,function(){return function(){"use strict";var __webpack_modules__={"./src/context.ts":function(__unused_webpack_module,exports){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nclass WebGPUContext {\n constructor(device, resolution, canvas, scale, debug) {\n this.device = device;\n this.canvas = canvas;\n this.resolution = resolution;\n this.textures = {};\n this.buffers = {};\n this.destroyed = false;\n this.scale = scale;\n this.debug = debug;\n let context = this.canvas.getContext('webgpu');\n if (context instanceof GPUCanvasContext) {\n this.context = context;\n }\n else {\n throw new Error(\"Unable to load WebGPU context\");\n }\n this.context.configure({\n device: this.device,\n format: navigator.gpu.getPreferredCanvasFormat()\n });\n this.textureUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;\n this.bufferUsage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST;\n if (this.debug) {\n // Read output pixel value\n this.textureUsage = this.textureUsage | GPUTextureUsage.COPY_SRC;\n this.bufferUsage = this.bufferUsage | GPUBufferUsage.COPY_SRC;\n }\n this.textures['output'] = this.context.getCurrentTexture();\n }\n readBuffer(bufferName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.buffers[bufferName])\n throw new Error(`No buffer with name ${bufferName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${bufferName} buffer encoder`,\n });\n const buffer = this.buffers[bufferName];\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: buffer.size,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyBufferToBuffer(buffer, 0, resultBuffer, 0, resultBuffer.size);\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n let range = resultBuffer.getMappedRange();\n return new Float32Array(range);\n });\n }\n readTexture(textureName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.textures[textureName])\n throw new Error(`No texture with name ${textureName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${textureName} texture encoder`,\n });\n const texture = this.textures[textureName];\n let bitsPerPixel = 16;\n if (texture.format === 'rgba8unorm')\n bitsPerPixel = 4;\n if (texture.format === 'r32float')\n bitsPerPixel = 4;\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: texture.width * texture.height * bitsPerPixel,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyTextureToBuffer({\n texture: this.textures[textureName],\n }, {\n buffer: resultBuffer,\n bytesPerRow: texture.width * bitsPerPixel\n }, {\n width: texture.width,\n height: texture.height,\n depthOrArrayLayers: 1,\n });\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n if (texture.format === 'r32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba8unorm')\n return new Uint8ClampedArray(resultBuffer.getMappedRange());\n return new Float32Array(0);\n });\n }\n destroy() {\n this.device.destroy();\n this.destroyed = true;\n }\n buffer(key, options) {\n if (!this.buffers[key]) {\n options = options || {};\n const width = options.width || this.resolution.width;\n const height = options.height || this.resolution.height;\n const channels = options.channels || 4;\n const bitdepth = options.bitdepth || 4;\n this.buffers[key] = this.device.createBuffer({\n label: key,\n size: width * height * channels * bitdepth,\n usage: this.bufferUsage\n });\n }\n return this.buffers[key];\n }\n texture(key, options) {\n if (!this.textures[key]) {\n options = options || {};\n this.textures[key] = this.device.createTexture({\n label: key,\n size: [options.width || this.resolution.width, options.height || this.resolution.height],\n format: options.format || 'rgba32float',\n usage: this.textureUsage\n });\n }\n return this.textures[key];\n }\n}\nexports[\"default\"] = WebGPUContext;\n\n\n//# sourceURL=webpack://WebSR/./src/context.ts?\n}")},"./src/layers/anime4k/conv2d-112x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv112x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights, first) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv112x4";\n const kernels = weights.weights;\n this.createUniform("kernels", "array<mat4x4f, 28>");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n if (first) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 2}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n else {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i + 1}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 3}]*max(-1.0*pixel_val${i}, vec4f(0.0));`;\n }\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv112x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-112x4.ts?\n}')},"./src/layers/anime4k/conv2d-16x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv16x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv16x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 36>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val0 = inputBuffer0[buff_ind];\n let pix_val1 = inputBuffer1[buff_ind];\n \n result += kernels[i]*max(pix_val0, vec4f(0.0));\n result += kernels[i+9]*max(pix_val1, vec4f(0.0));\n result += kernels[i+18]*max(-1.0*pix_val0, vec4f(0.0));\n result += kernels[i+27]*max(-1.0*pix_val1, vec4f(0.0));\n } \n \n\n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv16x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-16x4.ts?\n}')},"./src/layers/anime4k/conv2d-3x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv3x4 extends base_compute_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.label = "Anime4KConv3x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 9>");\n this.createUniform("bias", "vec4f");\n // Set up pipeline in Lazy Load\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[0] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureLoad(inputTexture0, coord + offset)\' :\n \'textureLoad(inputTexture0, coord + offset, 0)\';\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let offset = vec2<i32>(kernel_offsets[i].xy);\n result += kernels[i]*${textureLoad};\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n}\nexports["default"] = Anime4KConv3x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-3x4.ts?\n}')},"./src/layers/anime4k/conv2d-56x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv56x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv56x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernels", "array<mat4x4f, 14>");\n this.createUniform("bias", "vec4f");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${2 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${2 * i + 1}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n result += bias;\n \n outputBuffer[buff_ind] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv56x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-56x4.ts?\n}')},"./src/layers/anime4k/conv2d-8x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv8x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv8x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 18>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val = inputBuffer0[buff_ind];\n \n result += kernels[i]*max(pix_val, vec4f(0.0));\n result += kernels[i+9]*max(-1.0*pix_val, vec4f(0.0));\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv8x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-8x4.ts?\n}')},"./src/layers/anime4k/conv2d-concat2.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConcat2 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConcat2";\n this.createUniform("bias", "vec4f");\n const bias = weights.bias;\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n \n outputBuffer[buff_ind] = inputBuffer0[buff_ind] + inputBuffer1[buff_ind] + bias;\n }\n `);\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConcat2;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-concat2.ts?\n}')},"./src/layers/anime4k/display.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display.ts?\n}')},"./src/layers/anime4k/display_1x.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let bicubic = ${textureLoad};\n \n return bicubic + inputBuffer0[i];\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_1x.ts?\n}')},"./src/layers/anime4k/display_3c.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer3C extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer3C";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[3] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var<storage, read_write>inputBuffer1: array<vec4f>;\n @group(0) @binding(2) var<storage, read_write>inputBuffer2: array<vec4f>;\n @group(0) @binding(3) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(4) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n let value1 = inputBuffer1[i][c_index];\n let value2 = inputBuffer2[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value, value1, value2, value2);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n vertex: {\n module: this.shader,\n entryPoint: \'vertexMain\',\n },\n fragment: {\n module: this.shader,\n entryPoint: \'fragmentMain\',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer3C;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_3c.ts?\n}')},"./src/layers/base_compute_layer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ "./src/layers/base_layer.ts");\nclass ComputeLayer extends base_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.num_work_groups = 8;\n }\n createStandardShader(computeShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.computeShaderInputs()}\n \n ${computeShader}\n `\n });\n }\n computeShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n if (this.inputs[i] instanceof GPUTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_2d<f32>;`);\n }\n else if (this.inputs[i] instanceof GPUExternalTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_external;`);\n }\n else if (this.inputs[i] instanceof GPUBuffer) {\n inputs.push(`@group(0) @binding(${i}) var<storage, read_write>inputBuffer${i}: array<vec4f>;`);\n }\n else {\n console.log(this.inputs[i]);\n throw new Error("Input is undefined or non of the correct input type");\n }\n }\n // console.log("This layer", this.label);\n // console.log(this.inputs.length);\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n inputs.push(`@group(0) @binding(${this.inputs.length + this.uniforms.length}) var<storage, read_write>outputBuffer: array<vec4f>;`);\n return inputs.join(\'\\n\');\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n lazyLoadSetup() {\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginComputePass({ label: this.label });\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n // Dividing into work groups speeds up inference. If width or height aren\'t cleandly divided by work groups, we round to the nearest multiple of work-groups\n // Physically, this means shaving a few pixels (up to num_work_groups-1) off the bottom and right edges of the canvas but users shouldn\'t notice?\n pass.dispatchWorkgroups(Math.floor(this.resolution.width / this.num_work_groups), Math.floor(this.resolution.height / this.num_work_groups));\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n}\nexports["default"] = ComputeLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_compute_layer.ts?\n}')},"./src/layers/base_layer.ts":function(__unused_webpack_module,exports){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass Layer {\n constructor(inputs, output, weights) {\n this.context = globalThis.context;\n this.device = this.context.device;\n this.resolution = this.context.resolution;\n this.inputs = inputs;\n this.output = output;\n this.uniforms = [];\n this.buffers = {};\n this.weights = weights;\n }\n createUniform(name, type) {\n this.uniforms.push({ name, type });\n }\n setUniform(name, value) {\n const buffer = this.device.createBuffer({\n label: `layer-${this.label}-buffer-${name}`,\n size: value.byteLength,\n usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,\n });\n this.device.queue.writeBuffer(buffer, /*bufferOffset=*/ 0, value);\n this.buffers[name] = buffer;\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n hasExternalTexture() {\n for (const input of this.inputs) {\n if (input instanceof GPUExternalTexture)\n return true;\n }\n return false;\n }\n lazyLoadSetup() { }\n run() { }\n}\nexports["default"] = Layer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_layer.ts?\n}')},"./src/layers/base_render_layer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ \"./src/layers/base_layer.ts\");\nclass RenderLayer extends base_layer_1.default {\n constructor(inputs, output, weights) {\n super(inputs, output, weights);\n this.vertexScale = this.context.resolution;\n }\n defaultVertexShader() {\n return `\n \n struct VertexShaderOutput {\n @builtin(position) position: vec4f,\n @location(0) tex_coord: vec2f,\n };\n\n @vertex\n fn vertexMain( @builtin(vertex_index) vertexIndex : u32) -> VertexShaderOutput{\n let pos = array(\n // 1st triangle\n vec2f( -1.0, -1.0), // center\n vec2f( 1.0, -1.0), // right, center\n vec2f( -1.0, 1.0), // center, top\n \n // 2st triangle\n vec2f( -1.0, 1.0), // center, top\n vec2f( 1.0, -1.0), // right, center\n vec2f( 1.0, 1.0), // right, top\n );\n \n var vsOutput: VertexShaderOutput;\n let xy = pos[vertexIndex];\n vsOutput.position = vec4f(xy, 0.0, 1.0);\n vsOutput.tex_coord = xy*0.5 + 0.5;\n vsOutput.tex_coord.y = - 1.0* vsOutput.tex_coord.y + 1.0;\n vsOutput.tex_coord.x = vsOutput.tex_coord.x*${this.vertexScale.width};\n vsOutput.tex_coord.y = vsOutput.tex_coord.y*${this.vertexScale.height};\n return vsOutput;\n }\n `;\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: 'auto',\n vertex: {\n module: this.shader,\n entryPoint: 'vertexMain',\n },\n fragment: {\n module: this.shader,\n entryPoint: 'fragmentMain',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultRenderPassDescriptor() {\n return {\n label: `${this.label}-render-pass`,\n colorAttachments: [\n {\n view: this.output.createView(),\n clearValue: [0, 0, 0, 1],\n loadOp: 'clear',\n storeOp: 'store',\n },\n ],\n };\n }\n createStandardShader(fragmentShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n \n ${this.fragmentShaderInputs()}\n \n ${fragmentShader}\n `\n });\n }\n fragmentShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n let type = (this.inputs[i] instanceof GPUTexture) ? 'texture_2d<f32>' : 'texture_external';\n inputs.push(`@group(0) @binding(0) var inputTexture${i}: ${type};`);\n }\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n return inputs.join('\\n');\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginRenderPass(this.renderPassDescriptor);\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n pass.draw(6); // call our vertex shader 6 times\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n setOutput(outputTexture) {\n this.output = outputTexture;\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n}\nexports[\"default\"] = RenderLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_render_layer.ts?\n}")},"./src/layers/utils/gaussian.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass GuassianLayer extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.label = "Gaussian";\n this.createUniform("gaussian", "array<vec3f, 3>");\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n var val = 0.0;\n \n for(var i = 0u; i< 3; i++){\n \n let a = vec3f(\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x\n );\n \n val += dot(a, gaussian[i]);\n \n } \n \n \n return vec4f(val, val, val, 1.0);\n } \n `);\n this.setUniform("gaussian", new Float32Array([\n 0.0675, 0.125, 0.0675, 0.0,\n 0.125, 0.250, 0.1250, 0.0,\n 0.0675, 0.125, 0.0675, 0.0\n ]));\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n 0, -1, 0, 0,\n 1, -1, 0, 0,\n -1, 0, 0, 0,\n 0, 0, 0, 0,\n 1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, 1, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = GuassianLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/gaussian.ts?\n}')},"./src/layers/utils/rgb_2_yuv.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass RGB2YUV extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.createUniform("rgb2yuv", "mat3x3f");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let color = textureLoad(inputTexture0, vec2<i32>(input.tex_coord), 0); \n let yuv = rgb2yuv*color.xyz;\n \n return vec4f(yuv, 1.0);\n } \n `);\n this.setUniform("rgb2yuv", new Float32Array([\n 0.299, -0.1473, 0.615, 1.0,\n 0.587, -.2886, -.51499, 1.0,\n 0.114, 0.436, -.1001, 1.0\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = RGB2YUV;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/rgb_2_yuv.ts?\n}')},"./src/main.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst context_1 = __webpack_require__(/*! ./context */ "./src/context.ts");\nconst renderer_1 = __webpack_require__(/*! ./renderer */ "./src/renderer.ts");\nconst network_list_1 = __webpack_require__(/*! ./networks/network_list */ "./src/networks/network_list.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSR {\n constructor(params) {\n if (!network_list_1.NetworkList[params.network_name])\n throw Error(`Network ${params.network_name} is not defined or implemented`);\n this.source = params.source;\n const source = this.source;\n this.resolution = params.resolution ? params.resolution : {\n width: (0, utils_1.getSourceWidth)(source),\n height: (0, utils_1.getSourceHeight)(source)\n };\n const scale = network_list_1.NetworkScales[params.network_name];\n if (params.canvas)\n this.canvas = params.canvas;\n else {\n this.canvas = new HTMLCanvasElement();\n this.canvas.width = this.resolution.width * scale;\n this.canvas.height = this.resolution.height * scale;\n }\n this.scale = scale;\n this.context = new context_1.default(params.gpu, this.resolution, this.canvas, this.scale, this.debug);\n globalThis.context = this.context;\n this.network = new network_list_1.NetworkList[params.network_name](params.weights);\n this.renderer = new renderer_1.default(this.network, this.source);\n }\n switchNetwork(network, weights) {\n if (!network_list_1.NetworkList[network])\n throw Error(`Network ${network} is not defined or implemented`);\n this.network = new network_list_1.NetworkList[network](weights);\n this.renderer.switchNetwork(this.network);\n }\n static initWebGPU() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!navigator.gpu)\n return false;\n const adapter = yield navigator.gpu.requestAdapter();\n if (!adapter)\n return false;\n const device = yield adapter.requestDevice();\n if (!device)\n return false;\n return device;\n });\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.start();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.render(source);\n });\n }\n destroy() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n this.context.destroy();\n });\n }\n}\nexports["default"] = WebSR;\n\n\n//# sourceURL=webpack://WebSR/./src/main.ts?\n}')},"./src/networks/anime4k/cnn-2x-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ "./src/layers/anime4k/display_3c.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst conv2d_112x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-112x4 */ "./src/layers/anime4k/conv2d-112x4.ts");\nconst conv2d_concat2_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-concat2 */ "./src/layers/anime4k/conv2d-concat2.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNN2XL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i< 7; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n for (let c = 0; c < 3; c++) {\n const sources_0 = [];\n const sources_1 = [];\n for (let i = 0; i < 7; i++) {\n let source = (i == 0) ? `conv2d_tf` : `conv2d_${i}_tf`;\n sources_0.push(context.buffer(source));\n sources_1.push(context.buffer(source + "1"));\n }\n const dest = (c == 0) ? `conv2d_last_tf` : `conv2d_last_tf${c}`;\n layers.push(new conv2d_112x4_1.default(sources_0, context.buffer(`conv2d_last_${c}_pt1`), weights[dest], true));\n layers.push(new conv2d_112x4_1.default(sources_1, context.buffer(`conv2d_last_${c}_pt2`), weights[dest], false));\n layers.push(new conv2d_concat2_1.default([context.buffer(`conv2d_last_${c}_pt1`), context.buffer(`conv2d_last_${c}_pt2`)], context.buffer(dest), weights[dest]));\n }\n const paint = new display_3c_1.default([context.buffer(\'conv2d_last_tf\'), context.buffer(\'conv2d_last_tf1\'), context.buffer(\'conv2d_last_tf2\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNN2XL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-l.ts?\n}')},"./src/networks/anime4k/cnn-2x-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ \"./src/layers/anime4k/display_3c.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_7_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf'), weights['conv2d_7_tf']);\n const conv2d_7_tf1 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf1'), weights['conv2d_7_tf1']);\n const conv2d_7_tf2 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf2'), weights['conv2d_7_tf2']);\n const paint = new display_3c_1.default([context.buffer('conv2d_7_tf'), context.buffer('conv2d_7_tf1'), context.buffer('conv2d_7_tf2'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_7_tf, conv2d_7_tf1, conv2d_7_tf2, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-m.ts?\n}")},"./src/networks/anime4k/cnn-2x-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1 = __webpack_require__(/*! ../../layers/anime4k/display */ \"./src/layers/anime4k/display.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_last_tf'), weights['conv2d_last_tf']);\n const paint = new display_1.default([context.buffer('conv2d_last_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-s.ts?\n}")},"./src/networks/anime4k/cnn-restore-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ "./src/layers/anime4k/display_1x.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNNRL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i < 4; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n layers.push(new conv2d_16x4_1.default([context.buffer(\'conv2d_3_tf\'), context.buffer(\'conv2d_3_tf1\')], context.buffer(`conv2d_out_tf`), weights[`conv2d_out_tf`]));\n const paint = new display_1x_1.default([context.buffer(\'conv2d_out_tf\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNNRL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-l.ts?\n}')},"./src/networks/anime4k/cnn-restore-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_out_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_out_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-m.ts?\n}")},"./src/networks/anime4k/cnn-restore-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-s.ts?\n}")},"./src/networks/base_network.ts":function(__unused_webpack_module,exports){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass NeuralNetwork {\n constructor(weights) {\n this.weights = weights;\n this.context = globalThis.context;\n this.layers = this.model();\n }\n model() {\n return [];\n }\n lastLayer() {\n return this.layers[this.layers.length - 1];\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n this.layers.forEach(layer =>{\n layer.run();\n });\n });\n }\n}\nexports["default"] = NeuralNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/base_network.ts?\n}')},"./src/networks/network_list.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nexports.NetworkScales = exports.NetworkList = void 0;\nconst cnn_2x_s_1 = __webpack_require__(/*! ./anime4k/cnn-2x-s */ "./src/networks/anime4k/cnn-2x-s.ts");\nconst cnn_2x_m_1 = __webpack_require__(/*! ./anime4k/cnn-2x-m */ "./src/networks/anime4k/cnn-2x-m.ts");\nconst cnn_2x_l_1 = __webpack_require__(/*! ./anime4k/cnn-2x-l */ "./src/networks/anime4k/cnn-2x-l.ts");\nconst cnn_restore_l_1 = __webpack_require__(/*! ./anime4k/cnn-restore-l */ "./src/networks/anime4k/cnn-restore-l.ts");\nconst cnn_restore_m_1 = __webpack_require__(/*! ./anime4k/cnn-restore-m */ "./src/networks/anime4k/cnn-restore-m.ts");\nconst cnn_restore_s_1 = __webpack_require__(/*! ./anime4k/cnn-restore-s */ "./src/networks/anime4k/cnn-restore-s.ts");\nconst poc_network_1 = __webpack_require__(/*! ./poc_network */ "./src/networks/poc_network.ts");\nexports.NetworkList = {\n "anime4k/cnn-2x-s": cnn_2x_s_1.default,\n "anime4k/cnn-2x-m": cnn_2x_m_1.default,\n "anime4k/cnn-2x-l": cnn_2x_l_1.default,\n "anime4k/cnn-restore-s": cnn_restore_s_1.default,\n "anime4k/cnn-restore-m": cnn_restore_m_1.default,\n "anime4k/cnn-restore-l": cnn_restore_l_1.default,\n "sb2702/blur-poc": poc_network_1.default\n};\nexports.NetworkScales = {\n "anime4k/cnn-2x-s": 2,\n "anime4k/cnn-2x-m": 2,\n "anime4k/cnn-2x-l": 2,\n "anime4k/cnn-restore-s": 1,\n "anime4k/cnn-restore-m": 1,\n "anime4k/cnn-restore-l": 1,\n "sb2702/blur-poc": 1\n};\n\n\n//# sourceURL=webpack://WebSR/./src/networks/network_list.ts?\n}')},"./src/networks/poc_network.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ./base_network */ "./src/networks/base_network.ts");\nconst rgb_2_yuv_1 = __webpack_require__(/*! ../layers/utils/rgb_2_yuv */ "./src/layers/utils/rgb_2_yuv.ts");\nconst gaussian_1 = __webpack_require__(/*! ../layers/utils/gaussian */ "./src/layers/utils/gaussian.ts");\nclass PoCNetwork extends base_network_1.default {\n constructor() {\n super();\n }\n model() {\n const layers = [];\n const context = this.context;\n layers.push(new rgb_2_yuv_1.default([context.texture(\'input\')], context.texture(\'yuv\')));\n layers.push(new gaussian_1.default([context.texture(\'yuv\')], context.texture(\'output\')));\n return layers;\n }\n}\nexports["default"] = PoCNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/poc_network.ts?\n}')},"./src/renderer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst display_1 = __webpack_require__(/*! ./layers/anime4k/display */ "./src/layers/anime4k/display.ts");\nconst base_render_layer_1 = __webpack_require__(/*! ./layers/base_render_layer */ "./src/layers/base_render_layer.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSRRenderer {\n constructor(network, source) {\n this.context = globalThis.context;\n this.network = network;\n this.source = source;\n this.active = false;\n }\n switchNetwork(network) {\n this.network = network;\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.context.destroyed) {\n throw new Error("WebSR instance was destroyed");\n }\n this.active = true;\n yield this.renderStep();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n this.active = false;\n if (this.vfc && this.source && (0, utils_1.isHTMLVideoElement)(this.source))\n this.source.cancelVideoFrameCallback(this.vfc);\n });\n }\n renderStep() {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof display_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.render();\n if (this.active && this.source && (0, utils_1.isHTMLVideoElement)(this.source)) {\n this.vfc = this.source.requestVideoFrameCallback(this.renderStep.bind(this));\n }\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof base_render_layer_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.network.feedForward(source ? source : this.source);\n });\n }\n}\nexports["default"] = WebSRRenderer;\n\n\n//# sourceURL=webpack://WebSR/./src/renderer.ts?\n}')},"./src/utils.ts":function(__unused_webpack_module,exports){eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isMainThread = isMainThread;\nexports.isHTMLVideoElement = isHTMLVideoElement;\nexports.isHTMLImageElement = isHTMLImageElement;\nexports.isImageBitmap = isImageBitmap;\nexports.isVideoFrame = isVideoFrame;\nexports.isVideoSource = isVideoSource;\nexports.isImageSource = isImageSource;\nexports.getSourceWidth = getSourceWidth;\nexports.getSourceHeight = getSourceHeight;\n/**\n * Check if we're running on the main thread (not in a worker)\n */\nfunction isMainThread() {\n return typeof HTMLVideoElement !== 'undefined';\n}\n/**\n * Check if a source is a video element (main thread only)\n */\nfunction isHTMLVideoElement(source) {\n return typeof HTMLVideoElement !== 'undefined' && source instanceof HTMLVideoElement;\n}\n/**\n * Check if a source is an image element (main thread only)\n */\nfunction isHTMLImageElement(source) {\n return typeof HTMLImageElement !== 'undefined' && source instanceof HTMLImageElement;\n}\n/**\n * Check if a source is an ImageBitmap (works in both contexts)\n */\nfunction isImageBitmap(source) {\n return typeof ImageBitmap !== 'undefined' && source instanceof ImageBitmap;\n}\n/**\n * Check if a source is a VideoFrame (worker context)\n */\nfunction isVideoFrame(source) {\n return typeof VideoFrame !== 'undefined' && source instanceof VideoFrame;\n}\n/**\n * Check if a source is any type of video source\n */\nfunction isVideoSource(source) {\n return isHTMLVideoElement(source) || isVideoFrame(source);\n}\n/**\n * Check if a source is any type of image source\n */\nfunction isImageSource(source) {\n return isHTMLImageElement(source) || isImageBitmap(source);\n}\n/**\n * Get the width of a media source\n */\nfunction getSourceWidth(source) {\n if (isHTMLVideoElement(source))\n return source.videoWidth;\n if (isHTMLImageElement(source))\n return source.naturalWidth;\n if (isVideoFrame(source))\n return source.displayWidth;\n if (isImageBitmap(source))\n return source.width;\n return 0;\n}\n/**\n * Get the height of a media source\n */\nfunction getSourceHeight(source) {\n if (isHTMLVideoElement(source))\n return source.videoHeight;\n if (isHTMLImageElement(source))\n return source.naturalHeight;\n if (isVideoFrame(source))\n return source.displayHeight;\n if (isImageBitmap(source))\n return source.height;\n return 0;\n}\n\n\n//# sourceURL=webpack://WebSR/./src/utils.ts?\n}")}},__webpack_module_cache__={};function __webpack_require__(e){var n=__webpack_module_cache__[e];if(void 0!==n)return n.exports;var t=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),t.exports}var __webpack_exports__=__webpack_require__("./src/main.ts");return __webpack_exports__.default}()})},{}],qpMMf:[function(e,n,t,r){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,n){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})}),n},t.export=function(e,n,t){Object.defineProperty(e,n,{enumerable:!0,get:t})}},{}]},["hrC3O"],"hrC3O","parcelRequire4dc0",{});
\ No newline at end of file
+!function(e,t,r,n,s){var o="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},i="function"==typeof o[n]&&o[n],a=i.i||{},c=i.cache||{},l="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function u(t,r){if(!c[t]){if(!e[t]){if(s[t])return s[t];var a="function"==typeof o[n]&&o[n];if(!r&&a)return a(t,!0);if(i)return i(t,!0);if(l&&"string"==typeof t)return l(t);var d=Error("Cannot find module '"+t+"'");throw d.code="MODULE_NOT_FOUND",d}h.resolve=function(r){var n=e[t][1][r];return null!=n?n:r},h.cache={};var f=c[t]=new u.Module(t);e[t][0].call(f.exports,h,f,f.exports,o)}return c[t].exports;function h(e){var t=h.resolve(e);if(!1===t)return{};if(Array.isArray(t)){var r={__esModule:!0};return t.forEach(function(e){var t=e[0],n=e[1],s=e[2]||e[0],o=u(n);"*"===t?Object.keys(o).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(r,e)||Object.defineProperty(r,e,{enumerable:!0,get:function(){return o[e]}})}):"*"===s?Object.defineProperty(r,t,{enumerable:!0,value:o}):Object.defineProperty(r,t,{enumerable:!0,get:function(){return"default"===s?o.__esModule?o.default:o:o[s]}})}),r}return u(t)}}u.isParcelRequire=!0,u.Module=function(e){this.id=e,this.bundle=u,this.require=l,this.exports={}},u.modules=e,u.cache=c,u.parent=i,u.distDir=void 0,u.publicUrl=void 0,u.devServer=void 0,u.i=a,u.register=function(t,r){e[t]=[function(e,t){t.exports=r},{}]},Object.defineProperty(u,"root",{get:function(){return o[n]}}),o[n]=u;for(var d=0;d<t.length;d++)u(t[d]);if(r){var f=u(r);"object"==typeof exports&&"u">typeof module?module.exports=f:"function"==typeof define&&define.amd&&define(function(){return f})}}({hrC3O:[function(e,t,r,n){var s=e("@parcel/transformer-js/src/esmodule-helpers.js"),o=e("@swc/helpers/cjs/_async_to_generator.cjs"),i=e("@swc/helpers/cjs/_type_of.cjs"),a=e("@swc/helpers/cjs/_ts_generator.cjs"),c=e("./Upscaler.js"),l=s.interopDefault(c);window.artplayerPluginWebsr=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2};return function(t){var r=t.template,n=r.$video,s=r.$player,c=document.createElement("canvas");function u(){var e=t.video,r=s.offsetWidth||640,n=s.offsetHeight||360,o=(e.videoWidth||640)/(e.videoHeight||360),i=r,a=n;return r/n>o?i=n*o:a=r/o,{displayWidth:i,displayHeight:a}}if(s.appendChild(c),c.style.position="absolute",c.style.zIndex="11",c.style.pointerEvents="none",c.style.top="50%",c.style.left="50%",c.style.transform="translate(-50%, -50%)",c.style.opacity="0",c.style.transition="opacity 0.2s ease",!l.default||!l.default.isSupported||!l.default.isSupported())return void console.warn("Upscaler is not supported in this environment");var d=new(0,l.default)({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2}),f=!1;function h(){return(0,o._)(function(){return(0,a._)(this,function(t){switch(t.label){case 0:if(f)return[2];f=!0,t.label=1;case 1:return t.trys.push([1,4,,5]),[4,new Promise(function(e,t){if(n.readyState>=1)return void e();var r=function(){o(),e()},s=function(){o(),t(Error("Failed to load video metadata"))},o=function(){n.removeEventListener("loadedmetadata",r),n.removeEventListener("error",s)};n.addEventListener("loadedmetadata",r),n.addEventListener("error",s)})];case 2:return t.sent(),[4,d.startRealtimeUpscale(n,c,e.networkSize||d.networkSize)];case 3:return t.sent(),requestAnimationFrame(function(){c.style.opacity="1"}),[3,5];case 4:return console.error("artplayer-plugin-upscaler: failed to start realtime",t.sent()),[3,5];case 5:return[2]}})})()}var p=u(),m=p.displayWidth,v=p.displayHeight;c.style.width=m+"px",c.style.height=v+"px";var g=50,y=!1,w=!!e.compare,b=document.createElement("div");function k(){if(w){var e=u(),t=e.displayWidth,r=e.displayHeight,n="linear-gradient(to right, transparent 0%, transparent ".concat(g,"%, black ").concat(g,"%, black 100%)");c.style.maskImage=n;var o=s.offsetWidth||640,i=s.offsetHeight||360,a=(o-t)/2+t*g/100;b.style.top=(i-r)/2+"px",b.style.left=a+"px",b.style.height=r+"px",b.style.transform="translateX(-50%)"}else c.style.maskImage="none"}function _(e){w&&(y=!0)}function j(e){if(w&&y){var t=s.getBoundingClientRect(),r=u().displayWidth,n=s.offsetWidth||640;g=Math.max(0,Math.min(100,g=(e.clientX-t.left-(n-r)/2)/r*100)),k()}}function E(e){y=!1}return b.style.position="absolute",b.style.width="3px",b.style.backgroundColor="rgba(255, 255, 255, 0.75)",b.style.cursor="ew-resize",b.style.zIndex="12",b.style.pointerEvents="auto",b.style.display=w?"block":"none",b.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",w&&(s.appendChild(b),b.addEventListener("mousedown",_),document.addEventListener("mousemove",j),document.addEventListener("mouseup",E),k()),t.on("destroy",function(){d&&"function"==typeof d.dispose&&d.dispose(),b.removeEventListener("mousedown",_),document.removeEventListener("mousemove",j),document.removeEventListener("mouseup",E)}),t.on("resize",function(){var e=u(),t=e.displayWidth,r=e.displayHeight;c.style.width=t+"px",c.style.height=r+"px",k()}),t.on("play",function(){h()}),{name:"artplayerPluginWebsr",upscaler:d,update:function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(r&&(void 0===r?"undefined":(0,i._)(r))==="object"){if(Object.prototype.hasOwnProperty.call(r,"compare")){var n=!!r.compare;e.compare=n,(w=n)?(b.parentNode||s.appendChild(b),b.style.display="block",b.addEventListener("mousedown",_),document.addEventListener("mousemove",j),document.addEventListener("mouseup",E),k()):(c.style.maskImage="none",b.style.display="none",b.removeEventListener("mousedown",_),document.removeEventListener("mousemove",j),document.removeEventListener("mouseup",E))}r.networkSize&&(e.networkSize=r.networkSize,d&&"function"==typeof d.stopRealtimeUpscale&&d.stopRealtimeUpscale(),f=!1,t.paused||h())}}}}}},{"@swc/helpers/cjs/_async_to_generator.cjs":"cZn0e","@swc/helpers/cjs/_type_of.cjs":"iXhRw","@swc/helpers/cjs/_ts_generator.cjs":"eltGh","./Upscaler.js":"7WXlf","@parcel/transformer-js/src/esmodule-helpers.js":"qpMMf"}],cZn0e:[function(e,t,r,n){"use strict";function s(e,t,r,n,s,o,i){try{var a=e[o](i),c=a.value}catch(e){r(e);return}a.done?t(c):Promise.resolve(c).then(n,s)}r._=function(e){return function(){var t=this,r=arguments;return new Promise(function(n,o){var i=e.apply(t,r);function a(e){s(i,n,o,a,c,"next",e)}function c(e){s(i,n,o,a,c,"throw",e)}a(void 0)})}}},{}],iXhRw:[function(e,t,r,n){"use strict";r._=function(e){return e&&"u">typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}},{}],eltGh:[function(e,t,r,n){"use strict";r._=function(e,t){var r,n,s,o={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]},i=Object.create(("function"==typeof Iterator?Iterator:Object).prototype),a=Object.defineProperty;return a(i,"next",{value:c(0)}),a(i,"throw",{value:c(1)}),a(i,"return",{value:c(2)}),"function"==typeof Symbol&&a(i,Symbol.iterator,{value:function(){return this}}),i;function c(a){return function(c){var l=[a,c];if(r)throw TypeError("Generator is already executing.");for(;i&&(i=0,l[0]&&(o=0)),o;)try{if(r=1,n&&(s=2&l[0]?n.return:l[0]?n.throw||((s=n.return)&&s.call(n),0):n.next)&&!(s=s.call(n,l[1])).done)return s;switch(n=0,s&&(l=[2&l[0],s.value]),l[0]){case 0:case 1:s=l;break;case 4:return o.label++,{value:l[1],done:!1};case 5:o.label++,n=l[1],l=[0];continue;case 7:l=o.ops.pop(),o.trys.pop();continue;default:if(!(s=(s=o.trys).length>0&&s[s.length-1])&&(6===l[0]||2===l[0])){o=0;continue}if(3===l[0]&&(!s||l[1]>s[0]&&l[1]<s[3])){o.label=l[1];break}if(6===l[0]&&o.label<s[1]){o.label=s[1],s=l;break}if(s&&o.label<s[2]){o.label=s[2],o.ops.push(l);break}s[2]&&o.ops.pop(),o.trys.pop();continue}l=t.call(e,o)}catch(e){l=[6,e],n=0}finally{r=s=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}}}},{}],"7WXlf":[function(e,t,r,n){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(r),s.export(r,"default",function(){return d});var o=e("@swc/helpers/cjs/_async_to_generator.cjs"),i=e("@swc/helpers/cjs/_class_call_check.cjs"),a=e("@swc/helpers/cjs/_create_class.cjs"),c=e("@swc/helpers/cjs/_define_property.cjs"),l=e("@swc/helpers/cjs/_object_spread.cjs"),u=e("@swc/helpers/cjs/_ts_generator.cjs"),d=function(){"use strict";function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};(0,i._)(this,e);var r=t.weightsBaseUrl||"/weights";this.networks=t.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:"".concat(r,"/cnn-8.json")},medium:{name:"anime4k/cnn-2x-16",weightsUrl:"".concat(r,"/cnn-16.json")},large:{name:"anime4k/cnn-2x-28",weightsUrl:"".concat(r,"/cnn-28.json")}},this.weightsBaseUrl=r,this.networkSize=t.networkSize||"medium",this.workerUrl=t.workerUrl||"/worker/main.js",this.timeouts=(0,l._)({},e.DEFAULT_TIMEOUTS,t.timeouts||{}),this.delays=(0,l._)({},e.DEFAULT_DELAYS,t.delays||{}),this.imageScale="number"==typeof t.imageScale&&t.imageScale>0?t.imageScale:2,this.videoScale="number"==typeof t.videoScale&&t.videoScale>0?t.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}return(0,a._)(e,[{key:"init",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=t.prewarm;if(!e.isSupported())throw Error("Upscaler is not supported in this environment");return(void 0===r||r)&&this.getWorker().postMessage({cmd:"isSupported"}),this}},{key:"getWorker",value:function(){var e=this;return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=function(t){return e.handleWorkerMessage(t)}),this.workerInstance}},{key:"handleBlobResponse",value:function(e){var t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r((0,c._)({},t,e.data))}},{key:"requestBlob",value:function(){var e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}},{key:"handleWorkerMessage",value:function(t){var r=t.data;if(console.debug("Worker message:",r),r.cmd){var n=r.cmd;if("progress"===n){var s=e.extractProgressValue(r);null!==s&&this.progressCallback&&this.progressCallback(s),this.messageHandlers.progress&&this.messageHandlers.progress(r)}else"finished"===n?r.data instanceof Blob?this.handleBlobResponse(r):this.requestBlob():this.messageHandlers[n]&&this.messageHandlers[n](r)}}},{key:"loadWeights",value:function(e){return(0,o._)(function(){var t,r;return(0,u._)(this,function(n){switch(n.label){case 0:if(this.validateNetworkSize(e),this.weightsCache.has(e))return[2,this.weightsCache.get(e)];return[4,fetch(this.networks[e].weightsUrl)];case 1:if(!(t=n.sent()).ok)throw Error("Failed to fetch weights: ".concat(t.statusText));return[4,t.json()];case 2:return r=n.sent(),this.weightsCache.set(e,r),[2,r]}})}).call(this)}},{key:"createOffscreenCanvas",value:function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:2,n="number"==typeof r&&r>0?r:1,s=document.createElement("canvas");if(s.width=e*n,s.height=t*n,"function"!=typeof s.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");return s.transferControlToOffscreen()}},{key:"createBlobPromise",value:function(e,t){var r=this;return new Promise(function(n,s){var o=setTimeout(function(){r.messageHandlers[e]&&(delete r.messageHandlers[e],s(Error("".concat(e," processing timeout"))))},t);r.messageHandlers[e]=function(t){delete r.messageHandlers[e],clearTimeout(o);var i=t[e]||t.data;i instanceof Blob?n(i):s(Error("Invalid ".concat(e," format")))}})}},{key:"validateNetworkSize",value:function(e){if(!this.networks[e])throw Error("Invalid networkSize: use one of "+Object.keys(this.networks).join(", "))}},{key:"upscaleImage",value:function(t,r,n){return(0,o._)(function(){var s,o,i,a,c,l,d,f,h,p,m,v,g,y;return(0,u._)(this,function(u){switch(u.label){case 0:if(s=this,!t)throw Error("Image file is required");return o=r||this.networkSize,this.validateNetworkSize(o),this.processingType="image",[4,t.arrayBuffer()];case 1:return i=u.sent(),a=t.type||"image/jpeg",[4,e.loadImageMetadata(i,a)];case 2:return l=(c=u.sent()).width,d=c.height,[4,this.loadWeights(o)];case 3:return f=u.sent(),h=this.networks[o],p="number"==typeof n&&n>0?n:this.imageScale,v=(m=[this.createOffscreenCanvas(l,d,p),this.createOffscreenCanvas(l,d,1)])[0],g=m[1],y=this.createBlobPromise("imageBlob",this.timeouts.IMAGE),this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:i,imageMimeType:a,upscaled:v,original:g,resolution:{width:l,height:d},network_name:h.name,weights:f}},[v,g]),setTimeout(function(){s.getWorker().postMessage({cmd:"network",data:{name:h.name,imageArrayBuffer:i,imageMimeType:a,weights:f}}),setTimeout(function(){s.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:i,imageMimeType:a}})},s.delays.NETWORK)},this.delays.INIT),[2,y]}})}).call(this)}},{key:"upscaleVideo",value:function(t,r,n){return(0,o._)(function(){var s,o,i,a,c,l,d,f,h,p,m,v;return(0,u._)(this,function(u){switch(u.label){case 0:if(!t)throw Error("Video file is required");if(s=r||this.networkSize,this.validateNetworkSize(s),!e.isVideoSupported())throw Error("WebCodecs API not supported. Requires Chrome 94+");return this.processingType="video",[4,e.loadVideoMetadata(t,this.timeouts.METADATA)];case 1:return i=(o=u.sent()).width,a=o.height,c=o.duration,[4,this.loadWeights(s)];case 2:return l=u.sent(),d=this.networks[s],f="number"==typeof n&&n>0?n:this.videoScale,p=(h=[this.createOffscreenCanvas(i,a,f),this.createOffscreenCanvas(i,a,1)])[0],m=h[1],v=this.createBlobPromise("videoBlob",this.timeouts.VIDEO),this.getWorker().postMessage({cmd:"process",file:t,fileSize:t.size,duration:c,adjustedResolution:{adjustedInputWidth:i,adjustedInputHeight:a,adjustedOutputWidth:i*f,adjustedOutputHeight:a*f},upscaled:p,original:m,weights:l,network_name:d.name,skipDemuxProgress:!0},[p,m]),[2,v]}})}).call(this)}},{key:"startRealtimeUpscale",value:function(e,t,r,n){return(0,o._)(function(){var s,i,a,c,l,d,f,h,p,m,v,g,y;return(0,u._)(this,function(w){switch(w.label){case 0:if(s=this,!e||!t)throw Error("videoElement and canvasElement are required");return i=r||this.networkSize,this.validateNetworkSize(i),a=this.networks[i],[4,this.loadWeights(i)];case 1:return c=w.sent(),l="number"==typeof n&&n>0?n:this.videoScale,[4,new Promise(function(t,r){if(e.readyState>=1)return void t();var n=function(){o(),t()},s=function(){o(),r(Error("Failed to load video metadata"))},o=function(){e.removeEventListener("loadedmetadata",n),e.removeEventListener("error",s)};e.addEventListener("loadedmetadata",n),e.addEventListener("error",s)})];case 2:if(w.sent(),d=e.videoWidth,f=e.videoHeight,!d||!f)throw Error("Invalid video dimensions");if(h=!t._upscalerTransferred,p=null,h){if(t.width=d*l,t.height=f*l,"function"!=typeof t.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");p=t.transferControlToOffscreen(),t._upscalerTransferred=!0}return(m=document.createElement("canvas")).width=d,m.height=f,v=m.getContext("2d"),this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),g={cmd:"realtimeInit",data:{upscaled:h?p:null,resolution:{width:d,height:f,scale:l,outputWidth:d*l,outputHeight:f*l},network_name:a.name,weights:c}},h&&p?this.getWorker().postMessage(g,[p]):this.getWorker().postMessage(g),this.realtimeState={running:!0,video:e,canvas:t,scale:l,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:v},y=function(){return(0,o._)(function(){var e,t,r,n,s,o;return(0,u._)(this,function(i){switch(i.label){case 0:if(!this.realtimeState||!this.realtimeState.running)return[2];if(r=(t=(e=this.realtimeState).video).HAVE_CURRENT_DATA||2,!(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0))return[3,5];e.busy=!0,i.label=1;case 1:if(i.trys.push([1,3,4,5]),n=e.captureCanvas,s=e.captureCtx,!n||!s)throw Error("Missing capture canvas");return s.drawImage(t,0,0,n.width,n.height),[4,createImageBitmap(n)];case 2:return o=i.sent(),e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:o},[o]),[3,5];case 3:return console.warn("realtimeFrame error",i.sent()),[3,5];case 4:return this.realtimeState&&(this.realtimeState.busy=!1),[7];case 5:return this.realtimeLoopId=requestAnimationFrame(y),[2]}})}).call(s)},this.realtimeLoopId=requestAnimationFrame(y),[2]}})}).call(this)}},{key:"stopRealtimeUpscale",value:function(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}},{key:"downloadUpscaled",value:function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return(0,o._)(function(){var n,s,o,i,a,c;return(0,u._)(this,function(l){switch(l.label){case 0:if(n=e.type.startsWith("video"),s=t||this.networkSize,!n)return[3,2];return[4,this.upscaleVideo(e,s)];case 1:return i=l.sent(),[3,4];case 2:return[4,this.upscaleImage(e,s)];case 3:i=l.sent(),l.label=4;case 4:return o=i,a=URL.createObjectURL(o),(c=document.createElement("a")).href=a,c.download=r||"upscaled_".concat(Date.now(),".").concat(n?"mp4":"png"),c.click(),URL.revokeObjectURL(a),[2,o]}})}).call(this)}},{key:"getSupportedNetworks",value:function(){return Object.keys(this.networks)}},{key:"getAppState",value:function(){return{backend:e.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}},{key:"onProgress",value:function(e){"function"==typeof e&&(this.progressCallback=e)}},{key:"dispose",value:function(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}}],[{key:"isSupported",value:function(){try{var e="u">typeof Worker,t="u">typeof OffscreenCanvas||"u">typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="u">typeof Blob;return e&&t&&r}catch(e){return!1}}},{key:"isVideoSupported",value:function(){try{return"u">typeof VideoEncoder&&"u">typeof VideoDecoder}catch(e){return!1}}},{key:"extractProgressValue",value:function(e){var t,r,n,s=null!=(n=null!=(r=null!=(t=e.data)?t:e.progress)?r:e.value)?n:e.percentage;return"number"==typeof s?Math.min(100,Math.max(0,Math.round(s))):null}},{key:"loadImageMetadata",value:function(e,t){return new Promise(function(r,n){var s=new Blob([e],{type:t}),o=URL.createObjectURL(s),i=new Image;i.onload=function(){URL.revokeObjectURL(o),r({width:i.width,height:i.height})},i.onerror=function(){URL.revokeObjectURL(o),n(Error("Failed to load image"))},i.src=o})}},{key:"loadVideoMetadata",value:function(e,t){return new Promise(function(r,n){var s=URL.createObjectURL(e),o=document.createElement("video");o.src=s;var i=setTimeout(function(){return n(Error("Timeout"))},t);o.onloadedmetadata=function(){clearTimeout(i),URL.revokeObjectURL(s),r({width:o.videoWidth,height:o.videoHeight,duration:o.duration})},o.onerror=function(){clearTimeout(i),URL.revokeObjectURL(s),n(Error("Failed to load video"))}})}},{key:"getGPUCapability",value:function(){return(0,o._)(function(){var e,t;return(0,u._)(this,function(r){switch(r.label){case 0:if(r.trys.push([0,3,,4]),!navigator.gpu)return[3,2];return[4,navigator.gpu.requestAdapter()];case 1:if(e=r.sent())return[2,Math.min(e.limits.maxStorageBufferBindingSize/512,0x4000000)];r.label=2;case 2:if(t=document.createElement("canvas").getContext("webgl2"))return[2,Math.pow(t.getParameter(t.MAX_TEXTURE_SIZE),2)];return[2,8388608];case 3:return r.sent(),[2,8388608];case 4:return[2]}})})()}},{key:"getBackendType",value:function(){try{if(navigator.gpu)return"webgpu";if(document.createElement("canvas").getContext("webgl2"))return"webgl";return"unknown"}catch(e){return"unknown"}}}]),e}();(0,c._)(d,"DEFAULT_TIMEOUTS",{IMAGE:3e5,VIDEO:36e5,METADATA:1e4}),(0,c._)(d,"DEFAULT_DELAYS",{INIT:500,NETWORK:300})},{"@swc/helpers/cjs/_async_to_generator.cjs":"cZn0e","@swc/helpers/cjs/_class_call_check.cjs":"4Uf9M","@swc/helpers/cjs/_create_class.cjs":"igUuK","@swc/helpers/cjs/_define_property.cjs":"ltU3W","@swc/helpers/cjs/_object_spread.cjs":"kyoEj","@swc/helpers/cjs/_ts_generator.cjs":"eltGh","@parcel/transformer-js/src/esmodule-helpers.js":"qpMMf"}],"4Uf9M":[function(e,t,r,n){"use strict";r._=function(e,t){if(!(e instanceof t))throw TypeError("Cannot call a class as a function")}},{}],igUuK:[function(e,t,r,n){"use strict";function s(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}r._=function(e,t,r){return t&&s(e.prototype,t),r&&s(e,r),e}},{}],ltU3W:[function(e,t,r,n){"use strict";r._=function(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}},{}],kyoEj:[function(e,t,r,n){"use strict";var s=e("9f9b8a24218ee51e");r._=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter(function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),n.forEach(function(t){s._(e,t,r[t])})}return e}},{"9f9b8a24218ee51e":"ltU3W"}],qpMMf:[function(e,t,r,n){r.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},r.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},r.exportAll=function(e,t){return Object.keys(e).forEach(function(r){"default"===r||"__esModule"===r||Object.prototype.hasOwnProperty.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[r]}})}),t},r.export=function(e,t,r){Object.defineProperty(e,t,{enumerable:!0,get:r})}},{}]},["hrC3O"],"hrC3O","parcelRequire4dc0",{});
\ No newline at end of file
diff --git a/docs/compiled/artplayer-plugin-websr.mjs b/docs/compiled/artplayer-plugin-websr.mjs
index e34928d74..b8f2d171a 100644
--- a/docs/compiled/artplayer-plugin-websr.mjs
+++ b/docs/compiled/artplayer-plugin-websr.mjs
@@ -5,4 +5,4 @@
  * (c) 2017-2026 Harvey Zack
  * Released under the MIT License.
  */
-!function(e,n,t,r,s){var i="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof i[r]&&i[r],u=o.i||{},a=o.cache||{},c="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(n,t){if(!a[n]){if(!e[n]){if(s[n])return s[n];var u="function"==typeof i[r]&&i[r];if(!t&&u)return u(n,!0);if(o)return o(n,!0);if(c&&"string"==typeof n)return c(n);var f=Error("Cannot find module '"+n+"'");throw f.code="MODULE_NOT_FOUND",f}_.resolve=p,_.cache={};var d=a[n]=new l.Module(n);e[n][0].call(d.exports,_,d,d.exports,i)}return a[n].exports;function _(e){var n=_.resolve(e);if(!1===n)return{};if(Array.isArray(n)){var t={__esModule:!0};return n.forEach(function(e){var n=e[0],r=e[1],s=e[2]||e[0],i=l(r);"*"===n?Object.keys(i).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:function(){return i[e]}})}):"*"===s?Object.defineProperty(t,n,{enumerable:!0,value:i}):Object.defineProperty(t,n,{enumerable:!0,get:function(){return"default"===s?i.__esModule?i.default:i:i[s]}})}),t}return l(n)}function p(t){var r=e[n][1][t];return null!=r?r:t}}function f(e){this.id=e,this.bundle=l,this.require=c,this.exports={}}l.isParcelRequire=!0,l.Module=f,l.modules=e,l.cache=a,l.parent=o,l.distDir=void 0,l.publicUrl=void 0,l.devServer=void 0,l.i=u,l.register=function(n,t){e[n]=[function(e,n){n.exports=t},{}]},Object.defineProperty(l,"root",{get:function(){return i[r]}}),i[r]=l;for(var d=0;d<n.length;d++)l(n[d]);if(t){var _=l(t);"object"==typeof exports&&"u">typeof module?module.exports=_:"function"==typeof define&&define.amd&&define(function(){return _})}}({hOg5u:[function(e,n,t,r){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(t),s.export(t,"default",()=>u);var i=e("@websr/websr"),o=s.interopDefault(i);function u(e={}){return n=>{let{template:{$player:t},constructor:{validator:r,utils:{append:s,setStyles:i}}}=n;(e=r({scale:2,networkName:"",weights:null,compare:!1,...e},{scale:"number",networkName:"string",weights:"?string|object",compare:"boolean"})).networkName||console.error("WebSR: networkName is required"),e.weights||console.error("WebSR: weights is required");let u=null,a=null,c=!1,l=!0,f=null,d=.5,_=!1,p=document.createElement("canvas");p.id="artplayer-websr-canvas",i(p,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"block",pointerEvents:"none",zIndex:"11",imageRendering:"crisp-edges"}),s(t,p);let h=document.createElement("div");function x(n){if(i(h,{left:100*(d=Math.max(0,Math.min(1,n)))+"%"}),e.compare){let e=100*d;i(p,{clipPath:`inset(0 0 0 ${e}%)`})}}function v(){let e=n.video;if(!e)return{displayWidth:640,displayHeight:360};let r=t.offsetWidth||640,s=t.offsetHeight||360,i=(e.videoWidth||640)/(e.videoHeight||360),o=r,u=s;return r/s>i?o=s*i:u=r/i,{displayWidth:o,displayHeight:u}}async function b(){try{let t;if(c)return!0;if(!navigator.gpu)return console.warn("WebGPU is not supported"),!1;if(!(a=await o.default.initWebGPU()))return console.warn("Failed to initialize WebGPU"),!1;if("string"==typeof e.weights){let n=await fetch(e.weights);if(!n.ok)return console.warn(`Failed to load weights from ${e.weights}`),!1;t=await n.json()}else{if("object"!=typeof e.weights)return console.warn("Invalid weights format"),!1;t=e.weights}let r=n.video;if(!r)return console.warn("Video element not found"),!1;let{displayWidth:s,displayHeight:l}=v();return p.width=s*e.scale,p.height=l*e.scale,i(p,{width:s+"px",height:l+"px"}),u=new(0,o.default)({source:r,network_name:e.networkName,weights:t,gpu:a,canvas:p}),c=!0,!0}catch(e){return console.error("WebSR initialization error:",e),!1}}async function m(){if(u&&l&&n.video)try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}}async function y(){if(!u||!l||!n.video||n.video.paused){f=null;return}try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}l&&!n.video.paused&&(f=requestAnimationFrame(y))}async function w(){if(!l){if(!c&&!await b())return void console.error("Failed to initialize WebSR");l=!0,setStyle(p,"display","block"),n.video&&!n.video.paused&&(f=requestAnimationFrame(y)),n.emit("artplayerPluginWebsr:enable")}}function g(){l&&(l=!1,i(p,{display:"none"}),f&&(cancelAnimationFrame(f),f=null),n.emit("artplayerPluginWebsr:disable"))}async function k(){l?g():await w()}return h.id="artplayer-websr-divider",i(h,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"2px",height:"100%",backgroundColor:"#fff",display:e.compare?"block":"none",pointerEvents:"auto",cursor:"col-resize",zIndex:"12"}),s(t,h),document.addEventListener("mousemove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.clientX-n.left)/n.width)}),document.addEventListener("mouseup",()=>{_=!1}),h.addEventListener("mousedown",()=>{_=!0}),document.addEventListener("touchmove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.touches[0].clientX-n.left)/n.width)},{passive:!0}),document.addEventListener("touchend",()=>{_=!1}),h.addEventListener("touchstart",()=>{_=!0}),n.on("play",()=>{m(),l&&c&&!f&&(f=requestAnimationFrame(y))}),n.on("pause",()=>{f&&(cancelAnimationFrame(f),f=null)}),n.on("seek",()=>{l&&c&&!n.video.paused&&!f&&(f=requestAnimationFrame(y))}),n.on("resize",()=>{if(u&&p.offsetParent){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}),n.on("destroy",()=>{g(),f&&(cancelAnimationFrame(f),f=null),p.parentNode&&p.parentNode.removeChild(p)}),b().then(()=>{l&&c&&n.video&&m()}).catch(e=>console.error("Failed to init WebSR:",e)),{name:"artplayerPluginWebsr",websr:()=>u,gpu:()=>a,canvas:()=>p,enable:w,disable:g,toggle:k,isEnabled:()=>l,isInitialized:()=>c,enableCompare:()=>{e.compare=!0,i(h,{display:"block"}),x(d)},disableCompare:()=>{e.compare=!1,i(h,{display:"none"}),i(p,{clipPath:"none"})},toggleCompare:()=>{e.compare?(i(h,{display:"none"}),i(p,{clipPath:"none"}),e.compare=!1):(e.compare=!0,i(h,{display:"block"}),x(d))},setComparePosition:e=>{x(e)},getComparePosition:()=>d,isComparing:()=>e.compare,update:async n=>{if((void 0!==n.weights&&n.weights!==e.weights||void 0!==n.networkName&&n.networkName!==e.networkName)&&(void 0!==n.weights&&(e.weights=n.weights),void 0!==n.networkName&&(e.networkName=n.networkName),c=!1,l&&await b()),void 0!==n.scale&&n.scale!==e.scale&&(e.scale=n.scale,p)){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}}}}"u">typeof window&&(window.artplayerPluginWebsr=u)},{"@websr/websr":"ePQAX","@parcel/transformer-js/src/esmodule-helpers.js":"loqXi"}],ePQAX:[function(require,module,exports,__globalThis){!function(e,n){module.exports=n()}(self,()=>(()=>{var __webpack_modules__={"./src/context.ts":function(__unused_webpack_module,exports){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nclass WebGPUContext {\n constructor(device, resolution, canvas, scale, debug) {\n this.device = device;\n this.canvas = canvas;\n this.resolution = resolution;\n this.textures = {};\n this.buffers = {};\n this.destroyed = false;\n this.scale = scale;\n this.debug = debug;\n let context = this.canvas.getContext('webgpu');\n if (context instanceof GPUCanvasContext) {\n this.context = context;\n }\n else {\n throw new Error(\"Unable to load WebGPU context\");\n }\n this.context.configure({\n device: this.device,\n format: navigator.gpu.getPreferredCanvasFormat()\n });\n this.textureUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;\n this.bufferUsage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST;\n if (this.debug) {\n // Read output pixel value\n this.textureUsage = this.textureUsage | GPUTextureUsage.COPY_SRC;\n this.bufferUsage = this.bufferUsage | GPUBufferUsage.COPY_SRC;\n }\n this.textures['output'] = this.context.getCurrentTexture();\n }\n readBuffer(bufferName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.buffers[bufferName])\n throw new Error(`No buffer with name ${bufferName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${bufferName} buffer encoder`,\n });\n const buffer = this.buffers[bufferName];\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: buffer.size,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyBufferToBuffer(buffer, 0, resultBuffer, 0, resultBuffer.size);\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n let range = resultBuffer.getMappedRange();\n return new Float32Array(range);\n });\n }\n readTexture(textureName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.textures[textureName])\n throw new Error(`No texture with name ${textureName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${textureName} texture encoder`,\n });\n const texture = this.textures[textureName];\n let bitsPerPixel = 16;\n if (texture.format === 'rgba8unorm')\n bitsPerPixel = 4;\n if (texture.format === 'r32float')\n bitsPerPixel = 4;\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: texture.width * texture.height * bitsPerPixel,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyTextureToBuffer({\n texture: this.textures[textureName],\n }, {\n buffer: resultBuffer,\n bytesPerRow: texture.width * bitsPerPixel\n }, {\n width: texture.width,\n height: texture.height,\n depthOrArrayLayers: 1,\n });\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n if (texture.format === 'r32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba8unorm')\n return new Uint8ClampedArray(resultBuffer.getMappedRange());\n return new Float32Array(0);\n });\n }\n destroy() {\n this.device.destroy();\n this.destroyed = true;\n }\n buffer(key, options) {\n if (!this.buffers[key]) {\n options = options || {};\n const width = options.width || this.resolution.width;\n const height = options.height || this.resolution.height;\n const channels = options.channels || 4;\n const bitdepth = options.bitdepth || 4;\n this.buffers[key] = this.device.createBuffer({\n label: key,\n size: width * height * channels * bitdepth,\n usage: this.bufferUsage\n });\n }\n return this.buffers[key];\n }\n texture(key, options) {\n if (!this.textures[key]) {\n options = options || {};\n this.textures[key] = this.device.createTexture({\n label: key,\n size: [options.width || this.resolution.width, options.height || this.resolution.height],\n format: options.format || 'rgba32float',\n usage: this.textureUsage\n });\n }\n return this.textures[key];\n }\n}\nexports[\"default\"] = WebGPUContext;\n\n\n//# sourceURL=webpack://WebSR/./src/context.ts?\n}")},"./src/layers/anime4k/conv2d-112x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv112x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights, first) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv112x4";\n const kernels = weights.weights;\n this.createUniform("kernels", "array<mat4x4f, 28>");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n if (first) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 2}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n else {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i + 1}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 3}]*max(-1.0*pixel_val${i}, vec4f(0.0));`;\n }\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv112x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-112x4.ts?\n}')},"./src/layers/anime4k/conv2d-16x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv16x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv16x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 36>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val0 = inputBuffer0[buff_ind];\n let pix_val1 = inputBuffer1[buff_ind];\n \n result += kernels[i]*max(pix_val0, vec4f(0.0));\n result += kernels[i+9]*max(pix_val1, vec4f(0.0));\n result += kernels[i+18]*max(-1.0*pix_val0, vec4f(0.0));\n result += kernels[i+27]*max(-1.0*pix_val1, vec4f(0.0));\n } \n \n\n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv16x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-16x4.ts?\n}')},"./src/layers/anime4k/conv2d-3x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv3x4 extends base_compute_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.label = "Anime4KConv3x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 9>");\n this.createUniform("bias", "vec4f");\n // Set up pipeline in Lazy Load\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[0] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureLoad(inputTexture0, coord + offset)\' :\n \'textureLoad(inputTexture0, coord + offset, 0)\';\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let offset = vec2<i32>(kernel_offsets[i].xy);\n result += kernels[i]*${textureLoad};\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n}\nexports["default"] = Anime4KConv3x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-3x4.ts?\n}')},"./src/layers/anime4k/conv2d-56x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv56x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv56x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernels", "array<mat4x4f, 14>");\n this.createUniform("bias", "vec4f");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${2 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${2 * i + 1}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n result += bias;\n \n outputBuffer[buff_ind] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv56x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-56x4.ts?\n}')},"./src/layers/anime4k/conv2d-8x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv8x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv8x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 18>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val = inputBuffer0[buff_ind];\n \n result += kernels[i]*max(pix_val, vec4f(0.0));\n result += kernels[i+9]*max(-1.0*pix_val, vec4f(0.0));\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv8x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-8x4.ts?\n}')},"./src/layers/anime4k/conv2d-concat2.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConcat2 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConcat2";\n this.createUniform("bias", "vec4f");\n const bias = weights.bias;\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n \n outputBuffer[buff_ind] = inputBuffer0[buff_ind] + inputBuffer1[buff_ind] + bias;\n }\n `);\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConcat2;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-concat2.ts?\n}')},"./src/layers/anime4k/display.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display.ts?\n}')},"./src/layers/anime4k/display_1x.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let bicubic = ${textureLoad};\n \n return bicubic + inputBuffer0[i];\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_1x.ts?\n}')},"./src/layers/anime4k/display_3c.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer3C extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer3C";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[3] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var<storage, read_write>inputBuffer1: array<vec4f>;\n @group(0) @binding(2) var<storage, read_write>inputBuffer2: array<vec4f>;\n @group(0) @binding(3) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(4) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n let value1 = inputBuffer1[i][c_index];\n let value2 = inputBuffer2[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value, value1, value2, value2);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n vertex: {\n module: this.shader,\n entryPoint: \'vertexMain\',\n },\n fragment: {\n module: this.shader,\n entryPoint: \'fragmentMain\',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer3C;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_3c.ts?\n}')},"./src/layers/base_compute_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ "./src/layers/base_layer.ts");\nclass ComputeLayer extends base_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.num_work_groups = 8;\n }\n createStandardShader(computeShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.computeShaderInputs()}\n \n ${computeShader}\n `\n });\n }\n computeShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n if (this.inputs[i] instanceof GPUTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_2d<f32>;`);\n }\n else if (this.inputs[i] instanceof GPUExternalTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_external;`);\n }\n else if (this.inputs[i] instanceof GPUBuffer) {\n inputs.push(`@group(0) @binding(${i}) var<storage, read_write>inputBuffer${i}: array<vec4f>;`);\n }\n else {\n console.log(this.inputs[i]);\n throw new Error("Input is undefined or non of the correct input type");\n }\n }\n // console.log("This layer", this.label);\n // console.log(this.inputs.length);\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n inputs.push(`@group(0) @binding(${this.inputs.length + this.uniforms.length}) var<storage, read_write>outputBuffer: array<vec4f>;`);\n return inputs.join(\'\\n\');\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n lazyLoadSetup() {\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginComputePass({ label: this.label });\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n // Dividing into work groups speeds up inference. If width or height aren\'t cleandly divided by work groups, we round to the nearest multiple of work-groups\n // Physically, this means shaving a few pixels (up to num_work_groups-1) off the bottom and right edges of the canvas but users shouldn\'t notice?\n pass.dispatchWorkgroups(Math.floor(this.resolution.width / this.num_work_groups), Math.floor(this.resolution.height / this.num_work_groups));\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n}\nexports["default"] = ComputeLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_compute_layer.ts?\n}')},"./src/layers/base_layer.ts":(__unused_webpack_module,exports)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass Layer {\n constructor(inputs, output, weights) {\n this.context = globalThis.context;\n this.device = this.context.device;\n this.resolution = this.context.resolution;\n this.inputs = inputs;\n this.output = output;\n this.uniforms = [];\n this.buffers = {};\n this.weights = weights;\n }\n createUniform(name, type) {\n this.uniforms.push({ name, type });\n }\n setUniform(name, value) {\n const buffer = this.device.createBuffer({\n label: `layer-${this.label}-buffer-${name}`,\n size: value.byteLength,\n usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,\n });\n this.device.queue.writeBuffer(buffer, /*bufferOffset=*/ 0, value);\n this.buffers[name] = buffer;\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n hasExternalTexture() {\n for (const input of this.inputs) {\n if (input instanceof GPUExternalTexture)\n return true;\n }\n return false;\n }\n lazyLoadSetup() { }\n run() { }\n}\nexports["default"] = Layer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_layer.ts?\n}')},"./src/layers/base_render_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ \"./src/layers/base_layer.ts\");\nclass RenderLayer extends base_layer_1.default {\n constructor(inputs, output, weights) {\n super(inputs, output, weights);\n this.vertexScale = this.context.resolution;\n }\n defaultVertexShader() {\n return `\n \n struct VertexShaderOutput {\n @builtin(position) position: vec4f,\n @location(0) tex_coord: vec2f,\n };\n\n @vertex\n fn vertexMain( @builtin(vertex_index) vertexIndex : u32) -> VertexShaderOutput{\n let pos = array(\n // 1st triangle\n vec2f( -1.0, -1.0), // center\n vec2f( 1.0, -1.0), // right, center\n vec2f( -1.0, 1.0), // center, top\n \n // 2st triangle\n vec2f( -1.0, 1.0), // center, top\n vec2f( 1.0, -1.0), // right, center\n vec2f( 1.0, 1.0), // right, top\n );\n \n var vsOutput: VertexShaderOutput;\n let xy = pos[vertexIndex];\n vsOutput.position = vec4f(xy, 0.0, 1.0);\n vsOutput.tex_coord = xy*0.5 + 0.5;\n vsOutput.tex_coord.y = - 1.0* vsOutput.tex_coord.y + 1.0;\n vsOutput.tex_coord.x = vsOutput.tex_coord.x*${this.vertexScale.width};\n vsOutput.tex_coord.y = vsOutput.tex_coord.y*${this.vertexScale.height};\n return vsOutput;\n }\n `;\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: 'auto',\n vertex: {\n module: this.shader,\n entryPoint: 'vertexMain',\n },\n fragment: {\n module: this.shader,\n entryPoint: 'fragmentMain',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultRenderPassDescriptor() {\n return {\n label: `${this.label}-render-pass`,\n colorAttachments: [\n {\n view: this.output.createView(),\n clearValue: [0, 0, 0, 1],\n loadOp: 'clear',\n storeOp: 'store',\n },\n ],\n };\n }\n createStandardShader(fragmentShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n \n ${this.fragmentShaderInputs()}\n \n ${fragmentShader}\n `\n });\n }\n fragmentShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n let type = (this.inputs[i] instanceof GPUTexture) ? 'texture_2d<f32>' : 'texture_external';\n inputs.push(`@group(0) @binding(0) var inputTexture${i}: ${type};`);\n }\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n return inputs.join('\\n');\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginRenderPass(this.renderPassDescriptor);\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n pass.draw(6); // call our vertex shader 6 times\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n setOutput(outputTexture) {\n this.output = outputTexture;\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n}\nexports[\"default\"] = RenderLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_render_layer.ts?\n}")},"./src/layers/utils/gaussian.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass GuassianLayer extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.label = "Gaussian";\n this.createUniform("gaussian", "array<vec3f, 3>");\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n var val = 0.0;\n \n for(var i = 0u; i< 3; i++){\n \n let a = vec3f(\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x\n );\n \n val += dot(a, gaussian[i]);\n \n } \n \n \n return vec4f(val, val, val, 1.0);\n } \n `);\n this.setUniform("gaussian", new Float32Array([\n 0.0675, 0.125, 0.0675, 0.0,\n 0.125, 0.250, 0.1250, 0.0,\n 0.0675, 0.125, 0.0675, 0.0\n ]));\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n 0, -1, 0, 0,\n 1, -1, 0, 0,\n -1, 0, 0, 0,\n 0, 0, 0, 0,\n 1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, 1, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = GuassianLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/gaussian.ts?\n}')},"./src/layers/utils/rgb_2_yuv.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass RGB2YUV extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.createUniform("rgb2yuv", "mat3x3f");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let color = textureLoad(inputTexture0, vec2<i32>(input.tex_coord), 0); \n let yuv = rgb2yuv*color.xyz;\n \n return vec4f(yuv, 1.0);\n } \n `);\n this.setUniform("rgb2yuv", new Float32Array([\n 0.299, -0.1473, 0.615, 1.0,\n 0.587, -.2886, -.51499, 1.0,\n 0.114, 0.436, -.1001, 1.0\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = RGB2YUV;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/rgb_2_yuv.ts?\n}')},"./src/main.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst context_1 = __webpack_require__(/*! ./context */ "./src/context.ts");\nconst renderer_1 = __webpack_require__(/*! ./renderer */ "./src/renderer.ts");\nconst network_list_1 = __webpack_require__(/*! ./networks/network_list */ "./src/networks/network_list.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSR {\n constructor(params) {\n if (!network_list_1.NetworkList[params.network_name])\n throw Error(`Network ${params.network_name} is not defined or implemented`);\n this.source = params.source;\n const source = this.source;\n this.resolution = params.resolution ? params.resolution : {\n width: (0, utils_1.getSourceWidth)(source),\n height: (0, utils_1.getSourceHeight)(source)\n };\n const scale = network_list_1.NetworkScales[params.network_name];\n if (params.canvas)\n this.canvas = params.canvas;\n else {\n this.canvas = new HTMLCanvasElement();\n this.canvas.width = this.resolution.width * scale;\n this.canvas.height = this.resolution.height * scale;\n }\n this.scale = scale;\n this.context = new context_1.default(params.gpu, this.resolution, this.canvas, this.scale, this.debug);\n globalThis.context = this.context;\n this.network = new network_list_1.NetworkList[params.network_name](params.weights);\n this.renderer = new renderer_1.default(this.network, this.source);\n }\n switchNetwork(network, weights) {\n if (!network_list_1.NetworkList[network])\n throw Error(`Network ${network} is not defined or implemented`);\n this.network = new network_list_1.NetworkList[network](weights);\n this.renderer.switchNetwork(this.network);\n }\n static initWebGPU() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!navigator.gpu)\n return false;\n const adapter = yield navigator.gpu.requestAdapter();\n if (!adapter)\n return false;\n const device = yield adapter.requestDevice();\n if (!device)\n return false;\n return device;\n });\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.start();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.render(source);\n });\n }\n destroy() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n this.context.destroy();\n });\n }\n}\nexports["default"] = WebSR;\n\n\n//# sourceURL=webpack://WebSR/./src/main.ts?\n}')},"./src/networks/anime4k/cnn-2x-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ "./src/layers/anime4k/display_3c.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst conv2d_112x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-112x4 */ "./src/layers/anime4k/conv2d-112x4.ts");\nconst conv2d_concat2_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-concat2 */ "./src/layers/anime4k/conv2d-concat2.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNN2XL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i< 7; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n for (let c = 0; c < 3; c++) {\n const sources_0 = [];\n const sources_1 = [];\n for (let i = 0; i < 7; i++) {\n let source = (i == 0) ? `conv2d_tf` : `conv2d_${i}_tf`;\n sources_0.push(context.buffer(source));\n sources_1.push(context.buffer(source + "1"));\n }\n const dest = (c == 0) ? `conv2d_last_tf` : `conv2d_last_tf${c}`;\n layers.push(new conv2d_112x4_1.default(sources_0, context.buffer(`conv2d_last_${c}_pt1`), weights[dest], true));\n layers.push(new conv2d_112x4_1.default(sources_1, context.buffer(`conv2d_last_${c}_pt2`), weights[dest], false));\n layers.push(new conv2d_concat2_1.default([context.buffer(`conv2d_last_${c}_pt1`), context.buffer(`conv2d_last_${c}_pt2`)], context.buffer(dest), weights[dest]));\n }\n const paint = new display_3c_1.default([context.buffer(\'conv2d_last_tf\'), context.buffer(\'conv2d_last_tf1\'), context.buffer(\'conv2d_last_tf2\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNN2XL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-l.ts?\n}')},"./src/networks/anime4k/cnn-2x-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ \"./src/layers/anime4k/display_3c.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_7_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf'), weights['conv2d_7_tf']);\n const conv2d_7_tf1 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf1'), weights['conv2d_7_tf1']);\n const conv2d_7_tf2 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf2'), weights['conv2d_7_tf2']);\n const paint = new display_3c_1.default([context.buffer('conv2d_7_tf'), context.buffer('conv2d_7_tf1'), context.buffer('conv2d_7_tf2'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_7_tf, conv2d_7_tf1, conv2d_7_tf2, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-m.ts?\n}")},"./src/networks/anime4k/cnn-2x-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1 = __webpack_require__(/*! ../../layers/anime4k/display */ \"./src/layers/anime4k/display.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_last_tf'), weights['conv2d_last_tf']);\n const paint = new display_1.default([context.buffer('conv2d_last_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-s.ts?\n}")},"./src/networks/anime4k/cnn-restore-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ "./src/layers/anime4k/display_1x.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNNRL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i < 4; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n layers.push(new conv2d_16x4_1.default([context.buffer(\'conv2d_3_tf\'), context.buffer(\'conv2d_3_tf1\')], context.buffer(`conv2d_out_tf`), weights[`conv2d_out_tf`]));\n const paint = new display_1x_1.default([context.buffer(\'conv2d_out_tf\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNNRL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-l.ts?\n}')},"./src/networks/anime4k/cnn-restore-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_out_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_out_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-m.ts?\n}")},"./src/networks/anime4k/cnn-restore-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-s.ts?\n}")},"./src/networks/base_network.ts":function(__unused_webpack_module,exports){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass NeuralNetwork {\n constructor(weights) {\n this.weights = weights;\n this.context = globalThis.context;\n this.layers = this.model();\n }\n model() {\n return [];\n }\n lastLayer() {\n return this.layers[this.layers.length - 1];\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n this.layers.forEach(layer =>{\n layer.run();\n });\n });\n }\n}\nexports["default"] = NeuralNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/base_network.ts?\n}')},"./src/networks/network_list.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nexports.NetworkScales = exports.NetworkList = void 0;\nconst cnn_2x_s_1 = __webpack_require__(/*! ./anime4k/cnn-2x-s */ "./src/networks/anime4k/cnn-2x-s.ts");\nconst cnn_2x_m_1 = __webpack_require__(/*! ./anime4k/cnn-2x-m */ "./src/networks/anime4k/cnn-2x-m.ts");\nconst cnn_2x_l_1 = __webpack_require__(/*! ./anime4k/cnn-2x-l */ "./src/networks/anime4k/cnn-2x-l.ts");\nconst cnn_restore_l_1 = __webpack_require__(/*! ./anime4k/cnn-restore-l */ "./src/networks/anime4k/cnn-restore-l.ts");\nconst cnn_restore_m_1 = __webpack_require__(/*! ./anime4k/cnn-restore-m */ "./src/networks/anime4k/cnn-restore-m.ts");\nconst cnn_restore_s_1 = __webpack_require__(/*! ./anime4k/cnn-restore-s */ "./src/networks/anime4k/cnn-restore-s.ts");\nconst poc_network_1 = __webpack_require__(/*! ./poc_network */ "./src/networks/poc_network.ts");\nexports.NetworkList = {\n "anime4k/cnn-2x-s": cnn_2x_s_1.default,\n "anime4k/cnn-2x-m": cnn_2x_m_1.default,\n "anime4k/cnn-2x-l": cnn_2x_l_1.default,\n "anime4k/cnn-restore-s": cnn_restore_s_1.default,\n "anime4k/cnn-restore-m": cnn_restore_m_1.default,\n "anime4k/cnn-restore-l": cnn_restore_l_1.default,\n "sb2702/blur-poc": poc_network_1.default\n};\nexports.NetworkScales = {\n "anime4k/cnn-2x-s": 2,\n "anime4k/cnn-2x-m": 2,\n "anime4k/cnn-2x-l": 2,\n "anime4k/cnn-restore-s": 1,\n "anime4k/cnn-restore-m": 1,\n "anime4k/cnn-restore-l": 1,\n "sb2702/blur-poc": 1\n};\n\n\n//# sourceURL=webpack://WebSR/./src/networks/network_list.ts?\n}')},"./src/networks/poc_network.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ./base_network */ "./src/networks/base_network.ts");\nconst rgb_2_yuv_1 = __webpack_require__(/*! ../layers/utils/rgb_2_yuv */ "./src/layers/utils/rgb_2_yuv.ts");\nconst gaussian_1 = __webpack_require__(/*! ../layers/utils/gaussian */ "./src/layers/utils/gaussian.ts");\nclass PoCNetwork extends base_network_1.default {\n constructor() {\n super();\n }\n model() {\n const layers = [];\n const context = this.context;\n layers.push(new rgb_2_yuv_1.default([context.texture(\'input\')], context.texture(\'yuv\')));\n layers.push(new gaussian_1.default([context.texture(\'yuv\')], context.texture(\'output\')));\n return layers;\n }\n}\nexports["default"] = PoCNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/poc_network.ts?\n}')},"./src/renderer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst display_1 = __webpack_require__(/*! ./layers/anime4k/display */ "./src/layers/anime4k/display.ts");\nconst base_render_layer_1 = __webpack_require__(/*! ./layers/base_render_layer */ "./src/layers/base_render_layer.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSRRenderer {\n constructor(network, source) {\n this.context = globalThis.context;\n this.network = network;\n this.source = source;\n this.active = false;\n }\n switchNetwork(network) {\n this.network = network;\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.context.destroyed) {\n throw new Error("WebSR instance was destroyed");\n }\n this.active = true;\n yield this.renderStep();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n this.active = false;\n if (this.vfc && this.source && (0, utils_1.isHTMLVideoElement)(this.source))\n this.source.cancelVideoFrameCallback(this.vfc);\n });\n }\n renderStep() {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof display_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.render();\n if (this.active && this.source && (0, utils_1.isHTMLVideoElement)(this.source)) {\n this.vfc = this.source.requestVideoFrameCallback(this.renderStep.bind(this));\n }\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof base_render_layer_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.network.feedForward(source ? source : this.source);\n });\n }\n}\nexports["default"] = WebSRRenderer;\n\n\n//# sourceURL=webpack://WebSR/./src/renderer.ts?\n}')},"./src/utils.ts":(__unused_webpack_module,exports)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isMainThread = isMainThread;\nexports.isHTMLVideoElement = isHTMLVideoElement;\nexports.isHTMLImageElement = isHTMLImageElement;\nexports.isImageBitmap = isImageBitmap;\nexports.isVideoFrame = isVideoFrame;\nexports.isVideoSource = isVideoSource;\nexports.isImageSource = isImageSource;\nexports.getSourceWidth = getSourceWidth;\nexports.getSourceHeight = getSourceHeight;\n/**\n * Check if we're running on the main thread (not in a worker)\n */\nfunction isMainThread() {\n return typeof HTMLVideoElement !== 'undefined';\n}\n/**\n * Check if a source is a video element (main thread only)\n */\nfunction isHTMLVideoElement(source) {\n return typeof HTMLVideoElement !== 'undefined' && source instanceof HTMLVideoElement;\n}\n/**\n * Check if a source is an image element (main thread only)\n */\nfunction isHTMLImageElement(source) {\n return typeof HTMLImageElement !== 'undefined' && source instanceof HTMLImageElement;\n}\n/**\n * Check if a source is an ImageBitmap (works in both contexts)\n */\nfunction isImageBitmap(source) {\n return typeof ImageBitmap !== 'undefined' && source instanceof ImageBitmap;\n}\n/**\n * Check if a source is a VideoFrame (worker context)\n */\nfunction isVideoFrame(source) {\n return typeof VideoFrame !== 'undefined' && source instanceof VideoFrame;\n}\n/**\n * Check if a source is any type of video source\n */\nfunction isVideoSource(source) {\n return isHTMLVideoElement(source) || isVideoFrame(source);\n}\n/**\n * Check if a source is any type of image source\n */\nfunction isImageSource(source) {\n return isHTMLImageElement(source) || isImageBitmap(source);\n}\n/**\n * Get the width of a media source\n */\nfunction getSourceWidth(source) {\n if (isHTMLVideoElement(source))\n return source.videoWidth;\n if (isHTMLImageElement(source))\n return source.naturalWidth;\n if (isVideoFrame(source))\n return source.displayWidth;\n if (isImageBitmap(source))\n return source.width;\n return 0;\n}\n/**\n * Get the height of a media source\n */\nfunction getSourceHeight(source) {\n if (isHTMLVideoElement(source))\n return source.videoHeight;\n if (isHTMLImageElement(source))\n return source.naturalHeight;\n if (isVideoFrame(source))\n return source.displayHeight;\n if (isImageBitmap(source))\n return source.height;\n return 0;\n}\n\n\n//# sourceURL=webpack://WebSR/./src/utils.ts?\n}")}},__webpack_module_cache__={};function __webpack_require__(e){var n=__webpack_module_cache__[e];if(void 0!==n)return n.exports;var t=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),t.exports}var __webpack_exports__=__webpack_require__("./src/main.ts");return __webpack_exports__.default})())},{}],loqXi:[function(e,n,t,r){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,n){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})}),n},t.export=function(e,n,t){Object.defineProperty(e,n,{enumerable:!0,get:t})}},{}]},["hOg5u"],"hOg5u","parcelRequire4dc0",{});let{default:_default}=parcelRequire4dc0("hOg5u");export{_default as default};
\ No newline at end of file
+!function(e,t,r,i,a){var o="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},s="function"==typeof o[i]&&o[i],n=s.i||{},l=s.cache||{},d="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function u(t,r){if(!l[t]){if(!e[t]){if(a[t])return a[t];var n="function"==typeof o[i]&&o[i];if(!r&&n)return n(t,!0);if(s)return s(t,!0);if(d&&"string"==typeof t)return d(t);var c=Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}h.resolve=function(r){var i=e[t][1][r];return null!=i?i:r},h.cache={};var m=l[t]=new u.Module(t);e[t][0].call(m.exports,h,m,m.exports,o)}return l[t].exports;function h(e){var t=h.resolve(e);if(!1===t)return{};if(Array.isArray(t)){var r={__esModule:!0};return t.forEach(function(e){var t=e[0],i=e[1],a=e[2]||e[0],o=u(i);"*"===t?Object.keys(o).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(r,e)||Object.defineProperty(r,e,{enumerable:!0,get:function(){return o[e]}})}):"*"===a?Object.defineProperty(r,t,{enumerable:!0,value:o}):Object.defineProperty(r,t,{enumerable:!0,get:function(){return"default"===a?o.__esModule?o.default:o:o[a]}})}),r}return u(t)}}u.isParcelRequire=!0,u.Module=function(e){this.id=e,this.bundle=u,this.require=d,this.exports={}},u.modules=e,u.cache=l,u.parent=s,u.distDir=void 0,u.publicUrl=void 0,u.devServer=void 0,u.i=n,u.register=function(t,r){e[t]=[function(e,t){t.exports=r},{}]},Object.defineProperty(u,"root",{get:function(){return o[i]}}),o[i]=u;for(var c=0;c<t.length;c++)u(t[c]);if(r){var m=u(r);"object"==typeof exports&&"u">typeof module?module.exports=m:"function"==typeof define&&define.amd&&define(function(){return m})}}({hOg5u:[function(e,t,r,i){var a=e("@parcel/transformer-js/src/esmodule-helpers.js"),o=e("./Upscaler.js"),s=a.interopDefault(o);window.artplayerPluginWebsr=function(e={networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2}){return t=>{let{$video:r,$player:i}=t.template,a=document.createElement("canvas");function o(){let e=t.video,r=i.offsetWidth||640,a=i.offsetHeight||360,o=(e.videoWidth||640)/(e.videoHeight||360),s=r,n=a;return r/a>o?s=a*o:n=r/o,{displayWidth:s,displayHeight:n}}if(i.appendChild(a),a.style.position="absolute",a.style.zIndex="11",a.style.pointerEvents="none",a.style.top="50%",a.style.left="50%",a.style.transform="translate(-50%, -50%)",a.style.opacity="0",a.style.transition="opacity 0.2s ease",!s.default||!s.default.isSupported||!s.default.isSupported())return void console.warn("Upscaler is not supported in this environment");let n=new(0,s.default)({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2}),l=!1;async function d(){if(!l){l=!0;try{await new Promise((e,t)=>{if(r.readyState>=1)return void e();let i=()=>{o(),e()},a=()=>{o(),t(Error("Failed to load video metadata"))},o=()=>{r.removeEventListener("loadedmetadata",i),r.removeEventListener("error",a)};r.addEventListener("loadedmetadata",i),r.addEventListener("error",a)}),await n.startRealtimeUpscale(r,a,e.networkSize||n.networkSize),requestAnimationFrame(()=>{a.style.opacity="1"})}catch(e){console.error("artplayer-plugin-upscaler: failed to start realtime",e)}}}let{displayWidth:u,displayHeight:c}=o();a.style.width=u+"px",a.style.height=c+"px";let m=50,h=!1,p=!!e.compare,f=document.createElement("div");function g(){if(p){let{displayWidth:e,displayHeight:t}=o(),r=`linear-gradient(to right, transparent 0%, transparent ${m}%, black ${m}%, black 100%)`;a.style.maskImage=r;let s=i.offsetWidth||640,n=i.offsetHeight||360,l=(s-e)/2+e*m/100;f.style.top=(n-t)/2+"px",f.style.left=l+"px",f.style.height=t+"px",f.style.transform="translateX(-50%)"}else a.style.maskImage="none"}function w(e){p&&(h=!0)}function y(e){if(p&&h){let t=i.getBoundingClientRect(),{displayWidth:r}=o(),a=i.offsetWidth||640;m=Math.max(0,Math.min(100,m=(e.clientX-t.left-(a-r)/2)/r*100)),g()}}function v(e){h=!1}return f.style.position="absolute",f.style.width="3px",f.style.backgroundColor="rgba(255, 255, 255, 0.75)",f.style.cursor="ew-resize",f.style.zIndex="12",f.style.pointerEvents="auto",f.style.display=p?"block":"none",f.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",p&&(i.appendChild(f),f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()),t.on("destroy",()=>{n&&"function"==typeof n.dispose&&n.dispose(),f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v)}),t.on("resize",()=>{let{displayWidth:e,displayHeight:t}=o();a.style.width=e+"px",a.style.height=t+"px",g()}),t.on("play",()=>{d()}),{name:"artplayerPluginWebsr",upscaler:n,update:function(r={}){if(r&&"object"==typeof r){if(Object.prototype.hasOwnProperty.call(r,"compare")){let t=!!r.compare;e.compare=t,(p=t)?(f.parentNode||i.appendChild(f),f.style.display="block",f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()):(a.style.maskImage="none",f.style.display="none",f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v))}r.networkSize&&(e.networkSize=r.networkSize,n&&"function"==typeof n.stopRealtimeUpscale&&n.stopRealtimeUpscale(),l=!1,t.paused||d())}}}}}},{"./Upscaler.js":"6fh0X","@parcel/transformer-js/src/esmodule-helpers.js":"loqXi"}],"6fh0X":[function(e,t,r,i){e("@parcel/transformer-js/src/esmodule-helpers.js").defineInteropFlag(r);class a{static DEFAULT_TIMEOUTS={IMAGE:3e5,VIDEO:36e5,METADATA:1e4};static DEFAULT_DELAYS={INIT:500,NETWORK:300};static isSupported(){try{let e="u">typeof Worker,t="u">typeof OffscreenCanvas||"u">typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="u">typeof Blob;return e&&t&&r}catch{return!1}}static isVideoSupported(){try{return"u">typeof VideoEncoder&&"u">typeof VideoDecoder}catch{return!1}}constructor(e={}){let t=e.weightsBaseUrl||"/weights";this.networks=e.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:`${t}/cnn-8.json`},medium:{name:"anime4k/cnn-2x-16",weightsUrl:`${t}/cnn-16.json`},large:{name:"anime4k/cnn-2x-28",weightsUrl:`${t}/cnn-28.json`}},this.weightsBaseUrl=t,this.networkSize=e.networkSize||"medium",this.workerUrl=e.workerUrl||"/worker/main.js",this.timeouts={...a.DEFAULT_TIMEOUTS,...e.timeouts||{}},this.delays={...a.DEFAULT_DELAYS,...e.delays||{}},this.imageScale="number"==typeof e.imageScale&&e.imageScale>0?e.imageScale:2,this.videoScale="number"==typeof e.videoScale&&e.videoScale>0?e.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}init({prewarm:e=!0}={}){if(!a.isSupported())throw Error("Upscaler is not supported in this environment");return e&&this.getWorker().postMessage({cmd:"isSupported"}),this}getWorker(){return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=e=>this.handleWorkerMessage(e)),this.workerInstance}static extractProgressValue(e){let t=e.data??e.progress??e.value??e.percentage;return"number"==typeof t?Math.min(100,Math.max(0,Math.round(t))):null}handleBlobResponse(e){let t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r({[t]:e.data})}requestBlob(){let e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}handleWorkerMessage(e){let{data:t}=e;if(console.debug("Worker message:",t),!t.cmd)return;let{cmd:r}=t;if("progress"===r){let e=a.extractProgressValue(t);null!==e&&this.progressCallback&&this.progressCallback(e),this.messageHandlers.progress&&this.messageHandlers.progress(t)}else"finished"===r?t.data instanceof Blob?this.handleBlobResponse(t):this.requestBlob():this.messageHandlers[r]&&this.messageHandlers[r](t)}async loadWeights(e){if(this.validateNetworkSize(e),this.weightsCache.has(e))return this.weightsCache.get(e);let t=this.networks[e],r=await fetch(t.weightsUrl);if(!r.ok)throw Error(`Failed to fetch weights: ${r.statusText}`);let i=await r.json();return this.weightsCache.set(e,i),i}static loadImageMetadata(e,t){return new Promise((r,i)=>{let a=new Blob([e],{type:t}),o=URL.createObjectURL(a),s=new Image;s.onload=()=>{URL.revokeObjectURL(o),r({width:s.width,height:s.height})},s.onerror=()=>{URL.revokeObjectURL(o),i(Error("Failed to load image"))},s.src=o})}static loadVideoMetadata(e,t){return new Promise((r,i)=>{let a=URL.createObjectURL(e),o=document.createElement("video");o.src=a;let s=setTimeout(()=>i(Error("Timeout")),t);o.onloadedmetadata=()=>{clearTimeout(s),URL.revokeObjectURL(a),r({width:o.videoWidth,height:o.videoHeight,duration:o.duration})},o.onerror=()=>{clearTimeout(s),URL.revokeObjectURL(a),i(Error("Failed to load video"))}})}createOffscreenCanvas(e,t,r=2){let i="number"==typeof r&&r>0?r:1,a=document.createElement("canvas");if(a.width=e*i,a.height=t*i,"function"!=typeof a.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");return a.transferControlToOffscreen()}createBlobPromise(e,t){return new Promise((r,i)=>{let a=setTimeout(()=>{this.messageHandlers[e]&&(delete this.messageHandlers[e],i(Error(`${e} processing timeout`)))},t);this.messageHandlers[e]=t=>{delete this.messageHandlers[e],clearTimeout(a);let o=t[e]||t.data;o instanceof Blob?r(o):i(Error(`Invalid ${e} format`))}})}validateNetworkSize(e){if(!this.networks[e])throw Error("Invalid networkSize: use one of "+Object.keys(this.networks).join(", "))}async upscaleImage(e,t,r){if(!e)throw Error("Image file is required");let i=t||this.networkSize;this.validateNetworkSize(i),this.processingType="image";let o=await e.arrayBuffer(),s=e.type||"image/jpeg",{width:n,height:l}=await a.loadImageMetadata(o,s),d=await this.loadWeights(i),u=this.networks[i],c="number"==typeof r&&r>0?r:this.imageScale,[m,h]=[this.createOffscreenCanvas(n,l,c),this.createOffscreenCanvas(n,l,1)],p=this.createBlobPromise("imageBlob",this.timeouts.IMAGE);return this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:o,imageMimeType:s,upscaled:m,original:h,resolution:{width:n,height:l},network_name:u.name,weights:d}},[m,h]),setTimeout(()=>{this.getWorker().postMessage({cmd:"network",data:{name:u.name,imageArrayBuffer:o,imageMimeType:s,weights:d}}),setTimeout(()=>{this.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:o,imageMimeType:s}})},this.delays.NETWORK)},this.delays.INIT),p}async upscaleVideo(e,t,r){if(!e)throw Error("Video file is required");let i=t||this.networkSize;if(this.validateNetworkSize(i),!a.isVideoSupported())throw Error("WebCodecs API not supported. Requires Chrome 94+");this.processingType="video";let{width:o,height:s,duration:n}=await a.loadVideoMetadata(e,this.timeouts.METADATA),l=await this.loadWeights(i),d=this.networks[i],u="number"==typeof r&&r>0?r:this.videoScale,[c,m]=[this.createOffscreenCanvas(o,s,u),this.createOffscreenCanvas(o,s,1)],h=this.createBlobPromise("videoBlob",this.timeouts.VIDEO);return this.getWorker().postMessage({cmd:"process",file:e,fileSize:e.size,duration:n,adjustedResolution:{adjustedInputWidth:o,adjustedInputHeight:s,adjustedOutputWidth:o*u,adjustedOutputHeight:s*u},upscaled:c,original:m,weights:l,network_name:d.name,skipDemuxProgress:!0},[c,m]),h}async startRealtimeUpscale(e,t,r,i){if(!e||!t)throw Error("videoElement and canvasElement are required");let a=r||this.networkSize;this.validateNetworkSize(a);let o=this.networks[a],s=await this.loadWeights(a),n="number"==typeof i&&i>0?i:this.videoScale;await new Promise((t,r)=>{if(e.readyState>=1)return void t();let i=()=>{o(),t()},a=()=>{o(),r(Error("Failed to load video metadata"))},o=()=>{e.removeEventListener("loadedmetadata",i),e.removeEventListener("error",a)};e.addEventListener("loadedmetadata",i),e.addEventListener("error",a)});let l=e.videoWidth,d=e.videoHeight;if(!l||!d)throw Error("Invalid video dimensions");let u=!t._upscalerTransferred,c=null;if(u){if(t.width=l*n,t.height=d*n,"function"!=typeof t.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");c=t.transferControlToOffscreen(),t._upscalerTransferred=!0}let m=document.createElement("canvas");m.width=l,m.height=d;let h=m.getContext("2d");this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null);let p={cmd:"realtimeInit",data:{upscaled:u?c:null,resolution:{width:l,height:d,scale:n,outputWidth:l*n,outputHeight:d*n},network_name:o.name,weights:s}};u&&c?this.getWorker().postMessage(p,[c]):this.getWorker().postMessage(p),this.realtimeState={running:!0,video:e,canvas:t,scale:n,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:h};let f=async()=>{if(!this.realtimeState||!this.realtimeState.running)return;let e=this.realtimeState,t=e.video,r=t.HAVE_CURRENT_DATA||2;if(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0){e.busy=!0;try{let r=e.captureCanvas,i=e.captureCtx;if(!r||!i)throw Error("Missing capture canvas");i.drawImage(t,0,0,r.width,r.height);let a=await createImageBitmap(r);e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:a},[a])}catch(e){console.warn("realtimeFrame error",e)}finally{this.realtimeState&&(this.realtimeState.busy=!1)}}this.realtimeLoopId=requestAnimationFrame(f)};this.realtimeLoopId=requestAnimationFrame(f)}stopRealtimeUpscale(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}async downloadUpscaled(e,t,r=null){let i=e.type.startsWith("video"),a=t||this.networkSize,o=i?await this.upscaleVideo(e,a):await this.upscaleImage(e,a),s=URL.createObjectURL(o),n=document.createElement("a");return n.href=s,n.download=r||`upscaled_${Date.now()}.${i?"mp4":"png"}`,n.click(),URL.revokeObjectURL(s),o}getSupportedNetworks(){return Object.keys(this.networks)}static async getGPUCapability(){try{if(navigator.gpu){let e=await navigator.gpu.requestAdapter();if(e){let t=e.limits.maxStorageBufferBindingSize/512;return Math.min(t,0x4000000)}}let e=document.createElement("canvas").getContext("webgl2");if(e)return e.getParameter(e.MAX_TEXTURE_SIZE)**2;return 8388608}catch{return 8388608}}static getBackendType(){try{if(navigator.gpu)return"webgpu";if(document.createElement("canvas").getContext("webgl2"))return"webgl";return"unknown"}catch{return"unknown"}}getAppState(){return{backend:a.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}onProgress(e){"function"==typeof e&&(this.progressCallback=e)}dispose(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}}r.default=a},{"@parcel/transformer-js/src/esmodule-helpers.js":"loqXi"}],loqXi:[function(e,t,r,i){r.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},r.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},r.exportAll=function(e,t){return Object.keys(e).forEach(function(r){"default"===r||"__esModule"===r||Object.prototype.hasOwnProperty.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[r]}})}),t},r.export=function(e,t,r){Object.defineProperty(e,t,{enumerable:!0,get:r})}},{}]},["hOg5u"],"hOg5u","parcelRequire4dc0",{});let{}=parcelRequire4dc0("hOg5u");export{};
\ No newline at end of file
diff --git a/docs/document/404.html b/docs/document/404.html
index 363a1f340..4ffd88645 100644
--- a/docs/document/404.html
+++ b/docs/document/404.html
@@ -21,7 +21,7 @@
   </head>
   <body>
     <div id="app"></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/advanced/built-in.html b/docs/document/advanced/built-in.html
index f2c9f120c..11168a4a2 100644
--- a/docs/document/advanced/built-in.html
+++ b/docs/document/advanced/built-in.html
@@ -217,7 +217,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;ready&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    art.plugins.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">add</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(myPlugin);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/advanced/built-in.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:12:38.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/advanced/property.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>实例属性</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/advanced/class.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>静态属性</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/advanced/class.html b/docs/document/advanced/class.html
index a234111d1..92ed51b41 100644
--- a/docs/document/advanced/class.html
+++ b/docs/document/advanced/class.html
@@ -31,7 +31,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">([</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Artplayer.instances]);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><h2 id="version" tabindex="-1"><code>version</code> <a class="header-anchor" href="#version" aria-label="Permalink to &quot;`version`&quot;">​</a></h2><p>返回播放器的版本信息</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.version);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="env" tabindex="-1"><code>env</code> <a class="header-anchor" href="#env" aria-label="Permalink to &quot;`env`&quot;">​</a></h2><p>返回播放器的环境变量</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.env);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="build" tabindex="-1"><code>build</code> <a class="header-anchor" href="#build" aria-label="Permalink to &quot;`build`&quot;">​</a></h2><p>返回播放器的打包时间</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.build);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="config" tabindex="-1"><code>config</code> <a class="header-anchor" href="#config" aria-label="Permalink to &quot;`config`&quot;">​</a></h2><p>返回视频的默认配置</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.config);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="utils" tabindex="-1"><code>utils</code> <a class="header-anchor" href="#utils" aria-label="Permalink to &quot;`utils`&quot;">​</a></h2><p>返回播放器的工具函数集合</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.utils);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="warning custom-block"><p class="custom-block-title">全部工具函数请参考以下地址：</p><p><a href="https://github.com/zhw2590582/ArtPlayer/blob/master/packages/artplayer/types/utils.d.ts" target="_blank" rel="noreferrer">artplayer/types/utils.d.ts</a></p></div><h2 id="scheme" tabindex="-1"><code>scheme</code> <a class="header-anchor" href="#scheme" aria-label="Permalink to &quot;`scheme`&quot;">​</a></h2><p>返回播放器选项的校验方案</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.scheme);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="emitter" tabindex="-1"><code>Emitter</code> <a class="header-anchor" href="#emitter" aria-label="Permalink to &quot;`Emitter`&quot;">​</a></h2><p>返回事件分发器的构造函数</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.Emitter);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="validator" tabindex="-1"><code>validator</code> <a class="header-anchor" href="#validator" aria-label="Permalink to &quot;`validator`&quot;">​</a></h2><p>返回选项的校验函数</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.validator);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="kindof" tabindex="-1"><code>kindOf</code> <a class="header-anchor" href="#kindof" aria-label="Permalink to &quot;`kindOf`&quot;">​</a></h2><p>返回类型检测的函数工具</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.kindOf);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="html" tabindex="-1"><code>html</code> <a class="header-anchor" href="#html" aria-label="Permalink to &quot;`html`&quot;">​</a></h2><p>返回播放器所需的 <code>html</code> 字符串</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.html);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="option" tabindex="-1"><code>option</code> <a class="header-anchor" href="#option" aria-label="Permalink to &quot;`option`&quot;">​</a></h2><p>返回播放器的默认选项</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/advanced/class.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2023-04-23T07:11:08.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/advanced/built-in.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>高级属性</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/advanced/global.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>全局属性</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/advanced/event.html b/docs/document/advanced/event.html
index c7cf6f4b6..7cd0efb91 100644
--- a/docs/document/advanced/event.html
+++ b/docs/document/advanced/event.html
@@ -385,7 +385,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;keydown&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">event</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(event.code);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><h2 id="video-canplay" tabindex="-1"><code>video:canplay</code> <a class="header-anchor" href="#video-canplay" aria-label="Permalink to &quot;`video:canplay`&quot;">​</a></h2><p>浏览器可以播放媒体文件了，但估计没有足够的数据来支撑播放到结束，不必停下来进一步缓冲内容</p><h2 id="video-canplaythrough" tabindex="-1"><code>video:canplaythrough</code> <a class="header-anchor" href="#video-canplaythrough" aria-label="Permalink to &quot;`video:canplaythrough`&quot;">​</a></h2><p>浏览器估计它可以在不停止内容缓冲的情况下播放媒体直到结束</p><h2 id="video-complete" tabindex="-1"><code>video:complete</code> <a class="header-anchor" href="#video-complete" aria-label="Permalink to &quot;`video:complete`&quot;">​</a></h2><p>OfflineAudioContext 渲染完成</p><h2 id="video-durationchange" tabindex="-1"><code>video:durationchange</code> <a class="header-anchor" href="#video-durationchange" aria-label="Permalink to &quot;`video:durationchange`&quot;">​</a></h2><p>duration 属性的值改变时触发</p><h2 id="video-emptied" tabindex="-1"><code>video:emptied</code> <a class="header-anchor" href="#video-emptied" aria-label="Permalink to &quot;`video:emptied`&quot;">​</a></h2><p>媒体内容变为空；例如，当这个 media 已经加载完成（或者部分加载完成），则发送此事件，并调用 load() 方法重新加载它</p><h2 id="video-ended" tabindex="-1"><code>video:ended</code> <a class="header-anchor" href="#video-ended" aria-label="Permalink to &quot;`video:ended`&quot;">​</a></h2><p>视频停止播放，因为 media 已经到达结束点</p><h2 id="video-error" tabindex="-1"><code>video:error</code> <a class="header-anchor" href="#video-error" aria-label="Permalink to &quot;`video:error`&quot;">​</a></h2><p>获取媒体数据时出错，或者资源类型不是受支持的媒体格式</p><h2 id="video-loadeddata" tabindex="-1"><code>video:loadeddata</code> <a class="header-anchor" href="#video-loadeddata" aria-label="Permalink to &quot;`video:loadeddata`&quot;">​</a></h2><p>media 中的首帧已经完成加载</p><h2 id="video-loadedmetadata" tabindex="-1"><code>video:loadedmetadata</code> <a class="header-anchor" href="#video-loadedmetadata" aria-label="Permalink to &quot;`video:loadedmetadata`&quot;">​</a></h2><p>已加载元数据</p><h2 id="video-pause" tabindex="-1"><code>video:pause</code> <a class="header-anchor" href="#video-pause" aria-label="Permalink to &quot;`video:pause`&quot;">​</a></h2><p>播放已暂停</p><h2 id="video-play" tabindex="-1"><code>video:play</code> <a class="header-anchor" href="#video-play" aria-label="Permalink to &quot;`video:play`&quot;">​</a></h2><p>播放已开始</p><h2 id="video-playing" tabindex="-1"><code>video:playing</code> <a class="header-anchor" href="#video-playing" aria-label="Permalink to &quot;`video:playing`&quot;">​</a></h2><p>由于缺乏数据而暂停或延迟后，播放准备开始</p><h2 id="video-progress" tabindex="-1"><code>video:progress</code> <a class="header-anchor" href="#video-progress" aria-label="Permalink to &quot;`video:progress`&quot;">​</a></h2><p>在浏览器加载资源时周期性触发</p><h2 id="video-ratechange" tabindex="-1"><code>video:ratechange</code> <a class="header-anchor" href="#video-ratechange" aria-label="Permalink to &quot;`video:ratechange`&quot;">​</a></h2><p>播放速率发生变化</p><h2 id="video-seeked" tabindex="-1"><code>video:seeked</code> <a class="header-anchor" href="#video-seeked" aria-label="Permalink to &quot;`video:seeked`&quot;">​</a></h2><p>跳帧（seek）操作完成</p><h2 id="video-seeking" tabindex="-1"><code>video:seeking</code> <a class="header-anchor" href="#video-seeking" aria-label="Permalink to &quot;`video:seeking`&quot;">​</a></h2><p>跳帧（seek）操作开始</p><h2 id="video-stalled" tabindex="-1"><code>video:stalled</code> <a class="header-anchor" href="#video-stalled" aria-label="Permalink to &quot;`video:stalled`&quot;">​</a></h2><p>用户代理（user agent）正在尝试获取媒体数据，但数据意外未出现</p><h2 id="video-suspend" tabindex="-1"><code>video:suspend</code> <a class="header-anchor" href="#video-suspend" aria-label="Permalink to &quot;`video:suspend`&quot;">​</a></h2><p>媒体数据加载已暂停</p><h2 id="video-timeupdate" tabindex="-1"><code>video:timeupdate</code> <a class="header-anchor" href="#video-timeupdate" aria-label="Permalink to &quot;`video:timeupdate`&quot;">​</a></h2><p>currentTime 属性指定的时间发生变化</p><h2 id="video-volumechange" tabindex="-1"><code>video:volumechange</code> <a class="header-anchor" href="#video-volumechange" aria-label="Permalink to &quot;`video:volumechange`&quot;">​</a></h2><p>音量发生变化</p><h2 id="video-waiting" tabindex="-1"><code>video:waiting</code> <a class="header-anchor" href="#video-waiting" aria-label="Permalink to &quot;`video:waiting`&quot;">​</a></h2><p>由于暂时缺少数据，播放已停止</p></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/advanced/event.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2024-10-20T08:21:34.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/advanced/global.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>全局属性</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/advanced/plugin.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>编写插件</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/advanced/global.html b/docs/document/advanced/global.html
index 2f6c08ca5..8c2cede95 100644
--- a/docs/document/advanced/global.html
+++ b/docs/document/advanced/global.html
@@ -248,7 +248,7 @@
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 只销毁界面，不主动清空 src</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/advanced/global.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:12:38.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/advanced/class.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>静态属性</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/advanced/event.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>实例事件</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/advanced/plugin.html b/docs/document/advanced/plugin.html
index a357069ca..8380baac2 100644
--- a/docs/document/advanced/plugin.html
+++ b/docs/document/advanced/plugin.html
@@ -122,7 +122,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        })</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    ],</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/advanced/plugin.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2023-01-11T12:45:01.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/advanced/event.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>实例事件</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/plugin/danmuku.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>🎉 弹幕库</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/advanced/property.html b/docs/document/advanced/property.html
index ba48daaae..d4d44b10f 100644
--- a/docs/document/advanced/property.html
+++ b/docs/document/advanced/property.html
@@ -457,7 +457,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;ready&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    art.subtitleOffset </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/advanced/property.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:12:38.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/component/setting.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>设置面板</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/advanced/built-in.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>高级属性</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/assets/en_index.md.CYpcDsY6.js b/docs/document/assets/en_index.md.DrOcPBwp.js
similarity index 96%
rename from docs/document/assets/en_index.md.CYpcDsY6.js
rename to docs/document/assets/en_index.md.DrOcPBwp.js
index af7a1c754..c74670be3 100644
--- a/docs/document/assets/en_index.md.CYpcDsY6.js
+++ b/docs/document/assets/en_index.md.DrOcPBwp.js
@@ -1,4 +1,4 @@
-import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g=JSON.parse('{"title":"Installation & Usage","description":"","frontmatter":{},"headers":[],"relativePath":"en/index.md","filePath":"en/index.md","lastUpdated":1767420511000}'),p={name:"en/index.md"};function t(e,s,h,k,r,E){return a(),n("div",null,s[0]||(s[0]=[l(`<h1 id="installation-usage" tabindex="-1">Installation &amp; Usage <a class="header-anchor" href="#installation-usage" aria-label="Permalink to &quot;Installation &amp; Usage&quot;">​</a></h1><h2 id="installation" tabindex="-1">Installation <a class="header-anchor" href="#installation" aria-label="Permalink to &quot;Installation&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-cTffq" id="tab-BBr5lZE" checked><label data-title="npm" for="tab-BBr5lZE">npm</label><input type="radio" name="group-cTffq" id="tab-unwyWxO"><label data-title="yarn" for="tab-unwyWxO">yarn</label><input type="radio" name="group-cTffq" id="tab-ZGulfPc"><label data-title="pnpm" for="tab-ZGulfPc">pnpm</label><input type="radio" name="group-cTffq" id="tab-x-6tmvd"><label data-title="script" for="tab-x-6tmvd">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;\`CDN\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-E4Jpq" id="tab--sXtDMW" checked><label data-title="jsdelivr.net" for="tab--sXtDMW">jsdelivr.net</label><input type="radio" name="group-E4Jpq" id="tab-kqk-8z4"><label data-title="unpkg.com" for="tab-kqk-8z4">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="usage" tabindex="-1">Usage <a class="header-anchor" href="#usage" aria-label="Permalink to &quot;Usage&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-cLR2h" id="tab-iD-L7TM" checked><label data-title="index.html" for="tab-iD-L7TM">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g=JSON.parse('{"title":"Installation & Usage","description":"","frontmatter":{},"headers":[],"relativePath":"en/index.md","filePath":"en/index.md","lastUpdated":1767420511000}'),p={name:"en/index.md"};function t(e,s,h,k,r,E){return a(),n("div",null,s[0]||(s[0]=[l(`<h1 id="installation-usage" tabindex="-1">Installation &amp; Usage <a class="header-anchor" href="#installation-usage" aria-label="Permalink to &quot;Installation &amp; Usage&quot;">​</a></h1><h2 id="installation" tabindex="-1">Installation <a class="header-anchor" href="#installation" aria-label="Permalink to &quot;Installation&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-xhdeV" id="tab-jQ-ikso" checked><label data-title="npm" for="tab-jQ-ikso">npm</label><input type="radio" name="group-xhdeV" id="tab-PYp5aeE"><label data-title="yarn" for="tab-PYp5aeE">yarn</label><input type="radio" name="group-xhdeV" id="tab-A_QzmiS"><label data-title="pnpm" for="tab-A_QzmiS">pnpm</label><input type="radio" name="group-xhdeV" id="tab-XmoQe0N"><label data-title="script" for="tab-XmoQe0N">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;\`CDN\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-lMTXQ" id="tab-JwrqZbx" checked><label data-title="jsdelivr.net" for="tab-JwrqZbx">jsdelivr.net</label><input type="radio" name="group-lMTXQ" id="tab-xPmmiS7"><label data-title="unpkg.com" for="tab-xPmmiS7">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="usage" tabindex="-1">Usage <a class="header-anchor" href="#usage" aria-label="Permalink to &quot;Usage&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-MUWrD" id="tab-_1zQhbe" checked><label data-title="index.html" for="tab-_1zQhbe">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;ArtPlayer Demo&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">meta</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> charset</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;UTF-8&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
@@ -19,7 +19,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">          });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">body</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Note</p><p>The player&#39;s dimensions depend on the size of its container <code>container</code>, so your container must have defined dimensions.</p></div><div class="tip custom-block"><p class="custom-block-title">See more usage examples at the following link:</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;\`Vue.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-mgYpS" id="tab-JbACN3P" checked><label data-title="Artplayer.vue" for="tab-JbACN3P">Artplayer.vue</label><input type="radio" name="group-mgYpS" id="tab-DOfQIoV"><label data-title="app.vue" for="tab-DOfQIoV">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Note</p><p>The player&#39;s dimensions depend on the size of its container <code>container</code>, so your container must have defined dimensions.</p></div><div class="tip custom-block"><p class="custom-block-title">See more usage examples at the following link:</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;\`Vue.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-l0H5H" id="tab-PJ8oBGT" checked><label data-title="Artplayer.vue" for="tab-PJ8oBGT">Artplayer.vue</label><input type="radio" name="group-l0H5H" id="tab-G2gRnpF"><label data-title="app.vue" for="tab-G2gRnpF">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;$container&quot;</span><span style="--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
@@ -51,7 +51,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  art.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">})</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><div class="language-vue vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">style</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">getInstance</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;option&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;style&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> @get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;getInstance&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
@@ -71,7 +71,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">art</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(art)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer is not reactive:</p><p>Directly modifying <code>option</code> in <code>Vue.js</code> will not update the player.</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;\`React.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-YAdSX" id="tab-GMl6BwU" checked><label data-title="Artplayer.jsx" for="tab-GMl6BwU">Artplayer.jsx</label><input type="radio" name="group-YAdSX" id="tab-8OWkGj5"><label data-title="app.jsx" for="tab-8OWkGj5">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer is not reactive:</p><p>Directly modifying <code>option</code> in <code>Vue.js</code> will not update the player.</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;\`React.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-GN-ip" id="tab-34CCKx7" checked><label data-title="Artplayer.jsx" for="tab-34CCKx7">Artplayer.jsx</label><input type="radio" name="group-GN-ip" id="tab-thj5yc7"><label data-title="app.jsx" for="tab-thj5yc7">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { useEffect, useRef } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;react&#39;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Player</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">rest</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) {</span></span>
@@ -154,7 +154,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option.volume </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 0.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
-<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="legacy-browsers" tabindex="-1">Legacy Browsers <a class="header-anchor" href="#legacy-browsers" aria-label="Permalink to &quot;Legacy Browsers&quot;">​</a></h2><p>The production build <code>artplayer.js</code> only supports the latest major version of <code>Chrome</code>: <code>last 1 Chrome version</code></p><p>For legacy browsers, you can use the <code>artplayer.legacy.js</code> file, which supports compatibility down to: <code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-WlXHS" id="tab-WzjO9KW" checked><label data-title="jsdelivr.net" for="tab-WzjO9KW">jsdelivr.net</label><input type="radio" name="group-WlXHS" id="tab-q15Nl2K"><label data-title="unpkg.com" for="tab-q15Nl2K">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">If you need to support even older browsers, modify the following configuration and build it yourself:</p><p>Build configuration: <a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>Reference documentation: <a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>Starting from <code>5.2.6</code>, <code>artplayer</code> and all plugins also provide an <code>ESM</code> version <code>mjs</code>, such as:</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="legacy-browsers" tabindex="-1">Legacy Browsers <a class="header-anchor" href="#legacy-browsers" aria-label="Permalink to &quot;Legacy Browsers&quot;">​</a></h2><p>The production build <code>artplayer.js</code> only supports the latest major version of <code>Chrome</code>: <code>last 1 Chrome version</code></p><p>For legacy browsers, you can use the <code>artplayer.legacy.js</code> file, which supports compatibility down to: <code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-xGZkx" id="tab-428x8xK" checked><label data-title="jsdelivr.net" for="tab-428x8xK">jsdelivr.net</label><input type="radio" name="group-xGZkx" id="tab-JXnG8wn"><label data-title="unpkg.com" for="tab-JXnG8wn">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">If you need to support even older browsers, modify the following configuration and build it yourself:</p><p>Build configuration: <a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>Reference documentation: <a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>Starting from <code>5.2.6</code>, <code>artplayer</code> and all plugins also provide an <code>ESM</code> version <code>mjs</code>, such as:</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;en&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
diff --git a/docs/document/assets/en_index.md.CYpcDsY6.lean.js b/docs/document/assets/en_index.md.DrOcPBwp.lean.js
similarity index 100%
rename from docs/document/assets/en_index.md.CYpcDsY6.lean.js
rename to docs/document/assets/en_index.md.DrOcPBwp.lean.js
diff --git a/docs/document/assets/en_start_i18n.md.x4tw6CvN.js b/docs/document/assets/en_start_i18n.md.DAxrpMQL.js
similarity index 98%
rename from docs/document/assets/en_start_i18n.md.x4tw6CvN.js
rename to docs/document/assets/en_start_i18n.md.DAxrpMQL.js
index 2ecead6bd..f0e00fa2d 100644
--- a/docs/document/assets/en_start_i18n.md.x4tw6CvN.js
+++ b/docs/document/assets/en_start_i18n.md.DAxrpMQL.js
@@ -2,7 +2,7 @@ import{_ as a,o as i,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    container: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;.artplayer-app&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/assets/sample/video.mp4&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    lang: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;zh-cn&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// or &#39;en&#39;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="importing-languages" tabindex="-1">Importing Languages <a class="header-anchor" href="#importing-languages" aria-label="Permalink to &quot;Importing Languages&quot;">​</a></h2><p>Language files before bundling are located at: <code>artplayer/src/i18n/*.js</code>. Contributions to add your language are welcome.</p><p>Language files after bundling are located at: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-fV4Qu" id="tab-_bBuYRp" checked><label data-title="import" for="tab-_bBuYRp">import</label><input type="radio" name="group-fV4Qu" id="tab-eHRWePn"><label data-title="script" for="tab-eHRWePn">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="importing-languages" tabindex="-1">Importing Languages <a class="header-anchor" href="#importing-languages" aria-label="Permalink to &quot;Importing Languages&quot;">​</a></h2><p>Language files before bundling are located at: <code>artplayer/src/i18n/*.js</code>. Contributions to add your language are welcome.</p><p>Language files after bundling are located at: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-ix1Uk" id="tab-tMINLhf" checked><label data-title="import" for="tab-tMINLhf">import</label><input type="radio" name="group-ix1Uk" id="tab-6bnGS7D"><label data-title="script" for="tab-6bnGS7D">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> zhTw </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/zh-tw&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> art </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
diff --git a/docs/document/assets/en_start_i18n.md.x4tw6CvN.lean.js b/docs/document/assets/en_start_i18n.md.DAxrpMQL.lean.js
similarity index 100%
rename from docs/document/assets/en_start_i18n.md.x4tw6CvN.lean.js
rename to docs/document/assets/en_start_i18n.md.DAxrpMQL.lean.js
diff --git a/docs/document/assets/index.md.B8NxRV94.js b/docs/document/assets/index.md.WcEL7IA5.js
similarity index 96%
rename from docs/document/assets/index.md.B8NxRV94.js
rename to docs/document/assets/index.md.WcEL7IA5.js
index 394747784..b1ba8c460 100644
--- a/docs/document/assets/index.md.B8NxRV94.js
+++ b/docs/document/assets/index.md.WcEL7IA5.js
@@ -1,4 +1,4 @@
-import{_ as i,o as a,c 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 a(),n("div",null,s[0]||(s[0]=[l(`<h1 id="安装使用" tabindex="-1">安装使用 <a class="header-anchor" href="#安装使用" aria-label="Permalink to &quot;安装使用&quot;">​</a></h1><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-oTRZF" id="tab-dl4CGvG" checked><label data-title="npm" for="tab-dl4CGvG">npm</label><input type="radio" name="group-oTRZF" id="tab-bPwiync"><label data-title="yarn" for="tab-bPwiync">yarn</label><input type="radio" name="group-oTRZF" id="tab-fbc-Uta"><label data-title="pnpm" for="tab-fbc-Uta">pnpm</label><input type="radio" name="group-oTRZF" id="tab-rLfX3Ru"><label data-title="script" for="tab-rLfX3Ru">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;\`CDN\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-Jd546" id="tab-_XTKVh5" checked><label data-title="jsdelivr.net" for="tab-_XTKVh5">jsdelivr.net</label><input type="radio" name="group-Jd546" id="tab-iVR2h1k"><label data-title="unpkg.com" for="tab-iVR2h1k">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="使用" tabindex="-1">使用 <a class="header-anchor" href="#使用" aria-label="Permalink to &quot;使用&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-VUy86" id="tab-JJOXotf" checked><label data-title="index.html" for="tab-JJOXotf">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+import{_ as i,o as a,c 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 a(),n("div",null,s[0]||(s[0]=[l(`<h1 id="安装使用" tabindex="-1">安装使用 <a class="header-anchor" href="#安装使用" aria-label="Permalink to &quot;安装使用&quot;">​</a></h1><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-6VmWd" id="tab--5RTTp0" checked><label data-title="npm" for="tab--5RTTp0">npm</label><input type="radio" name="group-6VmWd" id="tab-Ty4Avp2"><label data-title="yarn" for="tab-Ty4Avp2">yarn</label><input type="radio" name="group-6VmWd" id="tab-PWODMSm"><label data-title="pnpm" for="tab-PWODMSm">pnpm</label><input type="radio" name="group-6VmWd" id="tab-rJ7w3iS"><label data-title="script" for="tab-rJ7w3iS">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;\`CDN\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-BelSB" id="tab-Sgj9bjl" checked><label data-title="jsdelivr.net" for="tab-Sgj9bjl">jsdelivr.net</label><input type="radio" name="group-BelSB" id="tab-9xwUR5a"><label data-title="unpkg.com" for="tab-9xwUR5a">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="使用" tabindex="-1">使用 <a class="header-anchor" href="#使用" aria-label="Permalink to &quot;使用&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-p4NO-" id="tab-H81VyLe" checked><label data-title="index.html" for="tab-H81VyLe">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;ArtPlayer Demo&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">meta</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> charset</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;UTF-8&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
@@ -19,7 +19,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">          });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">body</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">提示</p><p>播放器的尺寸依赖于容器 <code>container</code> 的尺寸，所以你的容器 <code>container</code> 必须是有尺寸的</p></div><div class="tip custom-block"><p class="custom-block-title">以下链接可以看到更多的使用例子</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;\`Vue.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-b2RBZ" id="tab-88AfHBH" checked><label data-title="Artplayer.vue" for="tab-88AfHBH">Artplayer.vue</label><input type="radio" name="group-b2RBZ" id="tab-8zvGTOY"><label data-title="app.vue" for="tab-8zvGTOY">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">提示</p><p>播放器的尺寸依赖于容器 <code>container</code> 的尺寸，所以你的容器 <code>container</code> 必须是有尺寸的</p></div><div class="tip custom-block"><p class="custom-block-title">以下链接可以看到更多的使用例子</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;\`Vue.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-FoW68" id="tab-QWckAns" checked><label data-title="Artplayer.vue" for="tab-QWckAns">Artplayer.vue</label><input type="radio" name="group-FoW68" id="tab-WNKyaFC"><label data-title="app.vue" for="tab-WNKyaFC">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;$container&quot;</span><span style="--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
@@ -51,7 +51,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  art.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">})</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><div class="language-vue vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;option&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;style&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> @get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;getInstance&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">style</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">getInstance</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
@@ -71,7 +71,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">art</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(art)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer 非响应式：</p><p>在 <code>Vue.js</code> 里直接修改 <code>option</code> 是不会改变播放器的</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;\`React.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-rE7lk" id="tab-ZGkw364" checked><label data-title="Artplayer.jsx" for="tab-ZGkw364">Artplayer.jsx</label><input type="radio" name="group-rE7lk" id="tab-18BybYQ"><label data-title="app.jsx" for="tab-18BybYQ">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer 非响应式：</p><p>在 <code>Vue.js</code> 里直接修改 <code>option</code> 是不会改变播放器的</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;\`React.js\`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-G4Ewk" id="tab-W7K46wQ" checked><label data-title="Artplayer.jsx" for="tab-W7K46wQ">Artplayer.jsx</label><input type="radio" name="group-G4Ewk" id="tab-C6ipVk4"><label data-title="app.jsx" for="tab-C6ipVk4">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { useEffect, useRef } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;react&#39;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Player</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">rest</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) {</span></span>
@@ -154,7 +154,7 @@ import{_ as i,o as a,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const g
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option.volume </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 0.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
-<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="古老的浏览器" tabindex="-1">古老的浏览器 <a class="header-anchor" href="#古老的浏览器" aria-label="Permalink to &quot;古老的浏览器&quot;">​</a></h2><p>生产构建的 <code>artplayer.js</code> 只兼容最新一个主版本的 <code>Chrome</code>：<code>last 1 Chrome version</code></p><p>对于古老的浏览器，可以使用 <code>artplayer.legacy.js</code> 文件，可以兼容到：<code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-5bLtB" id="tab-4qUEudq" checked><label data-title="jsdelivr.net" for="tab-4qUEudq">jsdelivr.net</label><input type="radio" name="group-5bLtB" id="tab-NsPuE3f"><label data-title="unpkg.com" for="tab-NsPuE3f">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：</p><p>构建配置：<a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>参考文档：<a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>从 <code>5.2.6</code> 开始，<code>artplayer</code> 和所有插件还会提供一个 <code>ESM</code> 版本的 <code>mjs</code>，如：</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="古老的浏览器" tabindex="-1">古老的浏览器 <a class="header-anchor" href="#古老的浏览器" aria-label="Permalink to &quot;古老的浏览器&quot;">​</a></h2><p>生产构建的 <code>artplayer.js</code> 只兼容最新一个主版本的 <code>Chrome</code>：<code>last 1 Chrome version</code></p><p>对于古老的浏览器，可以使用 <code>artplayer.legacy.js</code> 文件，可以兼容到：<code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-7LBEI" id="tab-AtRTXwG" checked><label data-title="jsdelivr.net" for="tab-AtRTXwG">jsdelivr.net</label><input type="radio" name="group-7LBEI" id="tab-YqWtgkR"><label data-title="unpkg.com" for="tab-YqWtgkR">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：</p><p>构建配置：<a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>参考文档：<a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>从 <code>5.2.6</code> 开始，<code>artplayer</code> 和所有插件还会提供一个 <code>ESM</code> 版本的 <code>mjs</code>，如：</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;en&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
diff --git a/docs/document/assets/index.md.B8NxRV94.lean.js b/docs/document/assets/index.md.WcEL7IA5.lean.js
similarity index 100%
rename from docs/document/assets/index.md.B8NxRV94.lean.js
rename to docs/document/assets/index.md.WcEL7IA5.lean.js
diff --git a/docs/document/assets/plugin_danmuku.md.C7LHV45A.js b/docs/document/assets/plugin_danmuku.md.D580Az0s.js
similarity index 99%
rename from docs/document/assets/plugin_danmuku.md.C7LHV45A.js
rename to docs/document/assets/plugin_danmuku.md.D580Az0s.js
index 66b06bc40..f34bd4c3f 100644
--- a/docs/document/assets/plugin_danmuku.md.C7LHV45A.js
+++ b/docs/document/assets/plugin_danmuku.md.D580Az0s.js
@@ -1,4 +1,4 @@
-import{_ as n,o as l,c 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 l(),p("div",null,a[0]||(a[0]=[s(`<h1 id="弹幕库" tabindex="-1">弹幕库 <a class="header-anchor" href="#弹幕库" aria-label="Permalink to &quot;弹幕库&quot;">​</a></h1><h2 id="演示" tabindex="-1">演示 <a class="header-anchor" href="#演示" aria-label="Permalink to &quot;演示&quot;">​</a></h2><p>👉 <a href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&amp;example=danmuku" target="_blank" rel="noreferrer">查看完整演示</a></p><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-D9jx4" id="tab-KS42MSM" checked><label data-title="npm" for="tab-KS42MSM">npm</label><input type="radio" name="group-D9jx4" id="tab-BtruepB"><label data-title="yarn" for="tab-BtruepB">yarn</label><input type="radio" name="group-D9jx4" id="tab-XQtvzKT"><label data-title="pnpm" for="tab-XQtvzKT">pnpm</label><input type="radio" name="group-D9jx4" id="tab-FIRZ9QK"><label data-title="script" for="tab-FIRZ9QK">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer-plugin-danmuku.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1">CDN <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;CDN&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-7kCl2" id="tab-b07Jg39" checked><label data-title="jsdelivr.net" for="tab-b07Jg39">jsdelivr.net</label><input type="radio" name="group-7kCl2" id="tab-G03d6W3"><label data-title="unpkg.com" for="tab-G03d6W3">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="弹幕结构" tabindex="-1">弹幕结构 <a class="header-anchor" href="#弹幕结构" aria-label="Permalink to &quot;弹幕结构&quot;">​</a></h2><p>每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要<code>text</code>就可以发送一个弹幕，其余都是非必要参数</p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
+import{_ as n,o as l,c 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 l(),p("div",null,a[0]||(a[0]=[s(`<h1 id="弹幕库" tabindex="-1">弹幕库 <a class="header-anchor" href="#弹幕库" aria-label="Permalink to &quot;弹幕库&quot;">​</a></h1><h2 id="演示" tabindex="-1">演示 <a class="header-anchor" href="#演示" aria-label="Permalink to &quot;演示&quot;">​</a></h2><p>👉 <a href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&amp;example=danmuku" target="_blank" rel="noreferrer">查看完整演示</a></p><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-9b-Cj" id="tab-LkD8Rrg" checked><label data-title="npm" for="tab-LkD8Rrg">npm</label><input type="radio" name="group-9b-Cj" id="tab-59CrnTZ"><label data-title="yarn" for="tab-59CrnTZ">yarn</label><input type="radio" name="group-9b-Cj" id="tab-pxugZU_"><label data-title="pnpm" for="tab-pxugZU_">pnpm</label><input type="radio" name="group-9b-Cj" id="tab-s_jUgft"><label data-title="script" for="tab-s_jUgft">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer-plugin-danmuku.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1">CDN <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;CDN&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-3ZK7f" id="tab-kIMJdgE" checked><label data-title="jsdelivr.net" for="tab-kIMJdgE">jsdelivr.net</label><input type="radio" name="group-3ZK7f" id="tab-TCCj7Bb"><label data-title="unpkg.com" for="tab-TCCj7Bb">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="弹幕结构" tabindex="-1">弹幕结构 <a class="header-anchor" href="#弹幕结构" aria-label="Permalink to &quot;弹幕结构&quot;">​</a></h2><p>每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要<code>text</code>就可以发送一个弹幕，其余都是非必要参数</p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
 <span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    text</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 弹幕文本</span></span>
 <span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    time</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">10</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 弹幕时间, 默认为当前播放器时间</span></span>
 <span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    mode</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 弹幕模式: 0: 滚动(默认)，1: 顶部，2: 底部</span></span>
diff --git a/docs/document/assets/plugin_danmuku.md.C7LHV45A.lean.js b/docs/document/assets/plugin_danmuku.md.D580Az0s.lean.js
similarity index 100%
rename from docs/document/assets/plugin_danmuku.md.C7LHV45A.lean.js
rename to docs/document/assets/plugin_danmuku.md.D580Az0s.lean.js
diff --git a/docs/document/assets/start_i18n.md.B0XPxv4h.js b/docs/document/assets/start_i18n.md.C6dAnYSp.js
similarity index 98%
rename from docs/document/assets/start_i18n.md.B0XPxv4h.js
rename to docs/document/assets/start_i18n.md.C6dAnYSp.js
index ea7ffed9d..bbb136bff 100644
--- a/docs/document/assets/start_i18n.md.B0XPxv4h.js
+++ b/docs/document/assets/start_i18n.md.C6dAnYSp.js
@@ -2,7 +2,7 @@ import{_ as a,o as i,c as n,ak as l}from"./chunks/framework.xxfEszSJ.js";const c
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    container: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;.artplayer-app&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/assets/sample/video.mp4&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    lang: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;zh-cn&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// or &#39;en&#39;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="导入语言" tabindex="-1">导入语言 <a class="header-anchor" href="#导入语言" aria-label="Permalink to &quot;导入语言&quot;">​</a></h2><p>打包前的语言文件存放于: <code>artplayer/src/i18n/*.js</code>, 欢迎来添加你的语言</p><p>打包后的语言文件存放于: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-NA9u6" id="tab-lo0uwTZ" checked><label data-title="import" for="tab-lo0uwTZ">import</label><input type="radio" name="group-NA9u6" id="tab-MoqQ4Uu"><label data-title="script" for="tab-MoqQ4Uu">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="导入语言" tabindex="-1">导入语言 <a class="header-anchor" href="#导入语言" aria-label="Permalink to &quot;导入语言&quot;">​</a></h2><p>打包前的语言文件存放于: <code>artplayer/src/i18n/*.js</code>, 欢迎来添加你的语言</p><p>打包后的语言文件存放于: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-FMc8Y" id="tab-KBTz-n3" checked><label data-title="import" for="tab-KBTz-n3">import</label><input type="radio" name="group-FMc8Y" id="tab-mo4iUSt"><label data-title="script" for="tab-mo4iUSt">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> zhTw </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/zh-tw&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> art </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
diff --git a/docs/document/assets/start_i18n.md.B0XPxv4h.lean.js b/docs/document/assets/start_i18n.md.C6dAnYSp.lean.js
similarity index 100%
rename from docs/document/assets/start_i18n.md.B0XPxv4h.lean.js
rename to docs/document/assets/start_i18n.md.C6dAnYSp.lean.js
diff --git a/docs/document/component/contextmenu.html b/docs/document/component/contextmenu.html
index 88213cc3b..775c491c3 100644
--- a/docs/document/component/contextmenu.html
+++ b/docs/document/component/contextmenu.html
@@ -106,7 +106,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        })</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/component/contextmenu.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2023-04-23T05:50:30.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/component/controls.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>控制器</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/component/setting.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>设置面板</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/component/controls.html b/docs/document/component/controls.html
index 5c641ace0..fdf515524 100644
--- a/docs/document/component/controls.html
+++ b/docs/document/component/controls.html
@@ -153,7 +153,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/component/controls.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2023-04-23T07:11:08.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/component/layers.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>业务层</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/component/contextmenu.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>右键菜单</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/component/layers.html b/docs/document/component/layers.html
index 1240887c1..398ce5f32 100644
--- a/docs/document/component/layers.html
+++ b/docs/document/component/layers.html
@@ -125,7 +125,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/component/layers.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2023-04-23T05:50:30.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/start/i18n.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>语言设置</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/component/controls.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>控制器</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/component/setting.html b/docs/document/component/setting.html
index 75147e039..7d50b81bd 100644
--- a/docs/document/component/setting.html
+++ b/docs/document/component/setting.html
@@ -245,7 +245,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/component/setting.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-06-20T01:56:18.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/component/contextmenu.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>右键菜单</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/advanced/property.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>实例属性</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ 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 ae8539be0..7714ce53a 100644
--- a/docs/document/en/advanced/built-in.html
+++ b/docs/document/en/advanced/built-in.html
@@ -217,7 +217,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;ready&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    art.plugins.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">add</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(myPlugin);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/advanced/built-in.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/advanced/property.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Instance Property</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/advanced/class.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Static Property</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/advanced/class.html b/docs/document/en/advanced/class.html
index a56fa3988..dfb752559 100644
--- a/docs/document/en/advanced/class.html
+++ b/docs/document/en/advanced/class.html
@@ -31,7 +31,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">([</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Artplayer.instances]);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><h2 id="version" tabindex="-1"><code>version</code> <a class="header-anchor" href="#version" aria-label="Permalink to &quot;`version`&quot;">​</a></h2><p>Returns the version information of the player.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.version);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="env" tabindex="-1"><code>env</code> <a class="header-anchor" href="#env" aria-label="Permalink to &quot;`env`&quot;">​</a></h2><p>Returns the environment variables of the player.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.env);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="build" tabindex="-1"><code>build</code> <a class="header-anchor" href="#build" aria-label="Permalink to &quot;`build`&quot;">​</a></h2><p>Returns the build time of the player.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.build);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="config" tabindex="-1"><code>config</code> <a class="header-anchor" href="#config" aria-label="Permalink to &quot;`config`&quot;">​</a></h2><p>Returns the default configuration for videos.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.config);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="utils" tabindex="-1"><code>utils</code> <a class="header-anchor" href="#utils" aria-label="Permalink to &quot;`utils`&quot;">​</a></h2><p>Returns the collection of utility functions for the player.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.utils);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="warning custom-block"><p class="custom-block-title">For all utility functions, please refer to the following address:</p><p><a href="https://github.com/zhw2590582/ArtPlayer/blob/master/packages/artplayer/types/utils.d.ts" target="_blank" rel="noreferrer">artplayer/types/utils.d.ts</a></p></div><h2 id="scheme" tabindex="-1"><code>scheme</code> <a class="header-anchor" href="#scheme" aria-label="Permalink to &quot;`scheme`&quot;">​</a></h2><p>Returns the validation schema for player options.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.scheme);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="emitter" tabindex="-1"><code>Emitter</code> <a class="header-anchor" href="#emitter" aria-label="Permalink to &quot;`Emitter`&quot;">​</a></h2><p>Returns the constructor function for the event emitter.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.Emitter);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="validator" tabindex="-1"><code>validator</code> <a class="header-anchor" href="#validator" aria-label="Permalink to &quot;`validator`&quot;">​</a></h2><p>Returns the validation function for options.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.validator);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="kindof" tabindex="-1"><code>kindOf</code> <a class="header-anchor" href="#kindof" aria-label="Permalink to &quot;`kindOf`&quot;">​</a></h2><p>Returns the utility function for type detection.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.kindOf);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="html" tabindex="-1"><code>html</code> <a class="header-anchor" href="#html" aria-label="Permalink to &quot;`html`&quot;">​</a></h2><p>Returns the <code>html</code> string required by the player.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.html);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="option" tabindex="-1"><code>option</code> <a class="header-anchor" href="#option" aria-label="Permalink to &quot;`option`&quot;">​</a></h2><p>Returns the default options for the player.</p><div className="run-code">▶ Run Code</div><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(Artplayer.option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/advanced/class.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/advanced/built-in.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Advanced Property</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/advanced/global.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Global Property</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/advanced/event.html b/docs/document/en/advanced/event.html
index 9d9873a02..f2183441c 100644
--- a/docs/document/en/advanced/event.html
+++ b/docs/document/en/advanced/event.html
@@ -412,7 +412,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;keydown&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">event</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(event.code);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><h2 id="video-canplay" tabindex="-1"><code>video:canplay</code> <a class="header-anchor" href="#video-canplay" aria-label="Permalink to &quot;`video:canplay`&quot;">​</a></h2><p>The browser can start playing the media, but estimates there isn&#39;t enough data to play through to the end without having to stop for further buffering</p><h2 id="video-canplaythrough" tabindex="-1"><code>video:canplaythrough</code> <a class="header-anchor" href="#video-canplaythrough" aria-label="Permalink to &quot;`video:canplaythrough`&quot;">​</a></h2><p>The browser estimates it can play the media through to the end without stopping to buffer content</p><h2 id="video-complete" tabindex="-1"><code>video:complete</code> <a class="header-anchor" href="#video-complete" aria-label="Permalink to &quot;`video:complete`&quot;">​</a></h2><p>OfflineAudioContext rendering is complete</p><h2 id="video-durationchange" tabindex="-1"><code>video:durationchange</code> <a class="header-anchor" href="#video-durationchange" aria-label="Permalink to &quot;`video:durationchange`&quot;">​</a></h2><p>Triggered when the value of the duration property changes</p><h2 id="video-emptied" tabindex="-1"><code>video:emptied</code> <a class="header-anchor" href="#video-emptied" aria-label="Permalink to &quot;`video:emptied`&quot;">​</a></h2><p>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</p><h2 id="video-ended" tabindex="-1"><code>video:ended</code> <a class="header-anchor" href="#video-ended" aria-label="Permalink to &quot;`video:ended`&quot;">​</a></h2><p>Playback has stopped because the media has reached its end point</p><h2 id="video-error" tabindex="-1"><code>video:error</code> <a class="header-anchor" href="#video-error" aria-label="Permalink to &quot;`video:error`&quot;">​</a></h2><p>An error occurred while fetching media data, or the resource type is not a supported media format</p><h2 id="video-loadeddata" tabindex="-1"><code>video:loadeddata</code> <a class="header-anchor" href="#video-loadeddata" aria-label="Permalink to &quot;`video:loadeddata`&quot;">​</a></h2><p>The first frame of the media has finished loading</p><h2 id="video-loadedmetadata" tabindex="-1"><code>video:loadedmetadata</code> <a class="header-anchor" href="#video-loadedmetadata" aria-label="Permalink to &quot;`video:loadedmetadata`&quot;">​</a></h2><p>Metadata has been loaded</p><h2 id="video-pause" tabindex="-1"><code>video:pause</code> <a class="header-anchor" href="#video-pause" aria-label="Permalink to &quot;`video:pause`&quot;">​</a></h2><p>Playback has been paused</p><h2 id="video-play" tabindex="-1"><code>video:play</code> <a class="header-anchor" href="#video-play" aria-label="Permalink to &quot;`video:play`&quot;">​</a></h2><p>Playback has begun</p><h2 id="video-playing" tabindex="-1"><code>video:playing</code> <a class="header-anchor" href="#video-playing" aria-label="Permalink to &quot;`video:playing`&quot;">​</a></h2><p>Playback is ready to start after having been paused or delayed due to lack of data</p><h2 id="video-progress" tabindex="-1"><code>video:progress</code> <a class="header-anchor" href="#video-progress" aria-label="Permalink to &quot;`video:progress`&quot;">​</a></h2><p>Periodically triggered while the browser is loading the resource</p><h2 id="video-ratechange" tabindex="-1"><code>video:ratechange</code> <a class="header-anchor" href="#video-ratechange" aria-label="Permalink to &quot;`video:ratechange`&quot;">​</a></h2><p>The playback rate has changed</p><h2 id="video-seeked" tabindex="-1"><code>video:seeked</code> <a class="header-anchor" href="#video-seeked" aria-label="Permalink to &quot;`video:seeked`&quot;">​</a></h2><p>A seek operation has completed</p><h2 id="video-seeking" tabindex="-1"><code>video:seeking</code> <a class="header-anchor" href="#video-seeking" aria-label="Permalink to &quot;`video:seeking`&quot;">​</a></h2><p>A seek operation has begun</p><h2 id="video-stalled" tabindex="-1"><code>video:stalled</code> <a class="header-anchor" href="#video-stalled" aria-label="Permalink to &quot;`video:stalled`&quot;">​</a></h2><p>The user agent is trying to fetch media data, but data is unexpectedly not forthcoming</p><h2 id="video-suspend" tabindex="-1"><code>video:suspend</code> <a class="header-anchor" href="#video-suspend" aria-label="Permalink to &quot;`video:suspend`&quot;">​</a></h2><p>Media data loading has been suspended</p><h2 id="video-timeupdate" tabindex="-1"><code>video:timeupdate</code> <a class="header-anchor" href="#video-timeupdate" aria-label="Permalink to &quot;`video:timeupdate`&quot;">​</a></h2><p>The time indicated by the currentTime attribute has been updated</p><h2 id="video-volumechange" tabindex="-1"><code>video:volumechange</code> <a class="header-anchor" href="#video-volumechange" aria-label="Permalink to &quot;`video:volumechange`&quot;">​</a></h2><p>The volume has changed</p><h2 id="video-waiting" tabindex="-1"><code>video:waiting</code> <a class="header-anchor" href="#video-waiting" aria-label="Permalink to &quot;`video:waiting`&quot;">​</a></h2><p>Playback has stopped due to temporary lack of data</p></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/advanced/event.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/advanced/global.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Global Property</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/advanced/plugin.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Writing Plugin</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/advanced/global.html b/docs/document/en/advanced/global.html
index 7d6f923eb..8f23987a7 100644
--- a/docs/document/en/advanced/global.html
+++ b/docs/document/en/advanced/global.html
@@ -266,7 +266,7 @@
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// Only destroys the UI, does not actively clear src</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/advanced/global.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/advanced/class.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Static Property</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/advanced/event.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Instance Event</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/advanced/plugin.html b/docs/document/en/advanced/plugin.html
index 3d5a06308..99ef62814 100644
--- a/docs/document/en/advanced/plugin.html
+++ b/docs/document/en/advanced/plugin.html
@@ -122,7 +122,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        })</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    ],</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/advanced/plugin.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/advanced/event.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Instance Event</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link vp-external-link-icon pager-link next" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Advertise</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/advanced/property.html b/docs/document/en/advanced/property.html
index f4e74a968..02fc635fb 100644
--- a/docs/document/en/advanced/property.html
+++ b/docs/document/en/advanced/property.html
@@ -487,7 +487,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;ready&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    art.subtitleOffset </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/advanced/property.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/component/setting.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Setting</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/advanced/built-in.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Advanced Property</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/component/contextmenu.html b/docs/document/en/component/contextmenu.html
index 9a0c9fbc7..d863dff0d 100644
--- a/docs/document/en/component/contextmenu.html
+++ b/docs/document/en/component/contextmenu.html
@@ -106,7 +106,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        })</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/component/contextmenu.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-10-08T01:55:44.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/component/controls.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Controls</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/component/setting.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Setting</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/component/controls.html b/docs/document/en/component/controls.html
index 7ffe5c3ba..f1de4b85d 100644
--- a/docs/document/en/component/controls.html
+++ b/docs/document/en/component/controls.html
@@ -153,7 +153,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/component/controls.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/component/layers.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Layers</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/component/contextmenu.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Contextmenu</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/component/layers.html b/docs/document/en/component/layers.html
index ee3a6aeef..2a6c44d33 100644
--- a/docs/document/en/component/layers.html
+++ b/docs/document/en/component/layers.html
@@ -125,7 +125,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/component/layers.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/start/i18n.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Language</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/component/controls.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Controls</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/component/setting.html b/docs/document/en/component/setting.html
index 64965a78d..f159597f7 100644
--- a/docs/document/en/component/setting.html
+++ b/docs/document/en/component/setting.html
@@ -260,7 +260,7 @@
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/component/setting.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/component/contextmenu.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Contextmenu</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/advanced/property.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Instance Property</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/index.html b/docs/document/en/index.html
index 6d390ba9b..68901fc93 100644
--- a/docs/document/en/index.html
+++ b/docs/document/en/index.html
@@ -13,7 +13,7 @@
     <link rel="preload" href="/document/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
     <link rel="modulepreload" href="/document/assets/chunks/theme.DwvAHEyX.js">
     <link rel="modulepreload" href="/document/assets/chunks/framework.xxfEszSJ.js">
-    <link rel="modulepreload" href="/document/assets/en_index.md.CYpcDsY6.lean.js">
+    <link rel="modulepreload" href="/document/assets/en_index.md.DrOcPBwp.lean.js">
     <script src="/document/main.js"></script>
     <link rel="stylesheet" href="/document/style.css">
     <link rel="shortcut icon" href="/document/favicon.ico">
@@ -23,7 +23,7 @@
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-c4daae71><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17ad389b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-17ad389b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c4daae71 data-v-a46e73f0><div class="VPNavBar" data-v-a46e73f0 data-v-bb7529ee><div class="wrapper" data-v-bb7529ee><div class="container" data-v-bb7529ee><div class="title" data-v-bb7529ee><div class="VPNavBarTitle has-sidebar" data-v-bb7529ee data-v-5622a072><a class="title" href="/document/" data-v-5622a072><!--[--><!--]--><!--[--><img class="VPImage logo" src="/document/logo.png" alt data-v-4d414b82><!--]--><span data-v-5622a072>Artplayer.js</span><!--[--><!--]--></a></div></div><div class="content" data-v-bb7529ee><div class="content-body" data-v-bb7529ee><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bb7529ee><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><span class="DocSearch-Button-Key">Meta</span><span class="DocSearch-Button-Key">K</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-bb7529ee data-v-5bacfe89><span id="main-nav-aria-label" class="visually-hidden" data-v-5bacfe89> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>中文版</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/document/en/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>English Docs</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>Online Editor</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org/llms.txt" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>🤖LLMs</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-5bacfe89 data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-40e55da0><span class="text" data-v-40e55da0><!----><span data-v-40e55da0>5.3.x</span><span class="vpi-chevron-down text-icon" data-v-40e55da0></span></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><div class="items" data-v-39eca401><!--[--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Changelog</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer#donations" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Donation</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bb7529ee data-v-123fcb2f><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-123fcb2f data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bb7529ee data-v-08b35e6f data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bb7529ee data-v-0c845e5d data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-40e55da0><span class="vpi-more-horizontal icon" data-v-40e55da0></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><!----><!--[--><!--[--><!----><div class="group" data-v-0c845e5d><div class="item appearance" data-v-0c845e5d><p class="label" data-v-0c845e5d>Appearance</p><div class="appearance-action" data-v-0c845e5d><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-0c845e5d data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div></div></div><div class="group" data-v-0c845e5d><div class="item social-links" data-v-0c845e5d><div class="VPSocialLinks social-links-list" data-v-0c845e5d data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-bb7529ee data-v-670493dd><span class="container" data-v-670493dd><span class="top" data-v-670493dd></span><span class="middle" data-v-670493dd></span><span class="bottom" data-v-670493dd></span></span></button></div></div></div></div><div class="divider" data-v-bb7529ee><div class="divider-line" data-v-bb7529ee></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-c4daae71 data-v-9d8129cc><div class="container" data-v-9d8129cc><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-9d8129cc><span class="vpi-align-left menu-icon" data-v-9d8129cc></span><span class="menu-text" data-v-9d8129cc>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-9d8129cc data-v-d61422fe><button data-v-d61422fe>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-c4daae71 data-v-12a40e3d><div class="curtain" data-v-12a40e3d></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-12a40e3d><span class="visually-hidden" id="sidebar-aria-label" data-v-12a40e3d> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0 has-active" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Quick start</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Install</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/start/option.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Option</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/start/i18n.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Language</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Component</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/layers.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Layers</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/controls.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Controls</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/contextmenu.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Contextmenu</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/setting.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Setting</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Advanced</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/property.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Instance Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/built-in.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Advanced Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/class.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Static Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/global.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Global Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/event.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Instance Event</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/plugin.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Writing Plugin</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Plugins</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Advertise</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&amp;example=iframe" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Iframe Control</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&amp;example=hls.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>HLS Control</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&amp;example=dash.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>DASH Control</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&amp;example=vtt.thumbnail" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VTT Thumbnail</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&amp;example=multiple.subtitles" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Multiple Subtitles</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&amp;example=jassub" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>ASS Subtitle - JASSUB</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&amp;example=chromecast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Chromecast</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&amp;example=vast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VAST</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&amp;example=chapter" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Video Chapters</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&amp;example=ambilight" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Video Ambilight</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&amp;example=document.pip" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Document PIP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&amp;example=audio.track" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Audio Track</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Libraries</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&amp;example=hls" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>hls.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&amp;example=flv" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>flv.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&amp;example=dash" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>dash.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&amp;example=mpegts" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>mpegts.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&amp;example=webtorrent" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>webtorrent.js</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Proxys</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&amp;example=canvas" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Canvas</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&amp;example=mediabunny" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Mediabunny</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-c4daae71 data-v-d2aef184><div class="VPDoc has-sidebar has-aside" data-v-d2aef184 data-v-ef3a4dda><!--[--><!--]--><div class="container" data-v-ef3a4dda><div class="aside" data-v-ef3a4dda><div class="aside-curtain" data-v-ef3a4dda></div><div class="aside-container" data-v-ef3a4dda><div class="aside-content" data-v-ef3a4dda><div class="VPDocAside" data-v-ef3a4dda data-v-79cae1a0><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-79cae1a0 data-v-dfbd9fb8><div class="content" data-v-dfbd9fb8><div class="outline-marker" data-v-dfbd9fb8></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-dfbd9fb8>On this page</div><ul class="VPDocOutlineItem root" data-v-dfbd9fb8 data-v-da421f78><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-79cae1a0></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ef3a4dda><div class="content-container" data-v-ef3a4dda><!--[--><!--]--><main class="main" data-v-ef3a4dda><div style="position:relative;" class="vp-doc _document_en_" data-v-ef3a4dda><div><h1 id="installation-usage" tabindex="-1">Installation &amp; Usage <a class="header-anchor" href="#installation-usage" aria-label="Permalink to &quot;Installation &amp; Usage&quot;">​</a></h1><h2 id="installation" tabindex="-1">Installation <a class="header-anchor" href="#installation" aria-label="Permalink to &quot;Installation&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-cTffq" id="tab-BBr5lZE" checked><label data-title="npm" for="tab-BBr5lZE">npm</label><input type="radio" name="group-cTffq" id="tab-unwyWxO"><label data-title="yarn" for="tab-unwyWxO">yarn</label><input type="radio" name="group-cTffq" id="tab-ZGulfPc"><label data-title="pnpm" for="tab-ZGulfPc">pnpm</label><input type="radio" name="group-cTffq" id="tab-x-6tmvd"><label data-title="script" for="tab-x-6tmvd">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;`CDN`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-E4Jpq" id="tab--sXtDMW" checked><label data-title="jsdelivr.net" for="tab--sXtDMW">jsdelivr.net</label><input type="radio" name="group-E4Jpq" id="tab-kqk-8z4"><label data-title="unpkg.com" for="tab-kqk-8z4">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="usage" tabindex="-1">Usage <a class="header-anchor" href="#usage" aria-label="Permalink to &quot;Usage&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-cLR2h" id="tab-iD-L7TM" checked><label data-title="index.html" for="tab-iD-L7TM">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-c4daae71><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17ad389b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-17ad389b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c4daae71 data-v-a46e73f0><div class="VPNavBar" data-v-a46e73f0 data-v-bb7529ee><div class="wrapper" data-v-bb7529ee><div class="container" data-v-bb7529ee><div class="title" data-v-bb7529ee><div class="VPNavBarTitle has-sidebar" data-v-bb7529ee data-v-5622a072><a class="title" href="/document/" data-v-5622a072><!--[--><!--]--><!--[--><img class="VPImage logo" src="/document/logo.png" alt data-v-4d414b82><!--]--><span data-v-5622a072>Artplayer.js</span><!--[--><!--]--></a></div></div><div class="content" data-v-bb7529ee><div class="content-body" data-v-bb7529ee><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bb7529ee><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><span class="DocSearch-Button-Key">Meta</span><span class="DocSearch-Button-Key">K</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-bb7529ee data-v-5bacfe89><span id="main-nav-aria-label" class="visually-hidden" data-v-5bacfe89> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>中文版</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/document/en/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>English Docs</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>Online Editor</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org/llms.txt" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>🤖LLMs</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-5bacfe89 data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-40e55da0><span class="text" data-v-40e55da0><!----><span data-v-40e55da0>5.3.x</span><span class="vpi-chevron-down text-icon" data-v-40e55da0></span></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><div class="items" data-v-39eca401><!--[--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Changelog</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer#donations" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Donation</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bb7529ee data-v-123fcb2f><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-123fcb2f data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bb7529ee data-v-08b35e6f data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bb7529ee data-v-0c845e5d data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-40e55da0><span class="vpi-more-horizontal icon" data-v-40e55da0></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><!----><!--[--><!--[--><!----><div class="group" data-v-0c845e5d><div class="item appearance" data-v-0c845e5d><p class="label" data-v-0c845e5d>Appearance</p><div class="appearance-action" data-v-0c845e5d><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-0c845e5d data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div></div></div><div class="group" data-v-0c845e5d><div class="item social-links" data-v-0c845e5d><div class="VPSocialLinks social-links-list" data-v-0c845e5d data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-bb7529ee data-v-670493dd><span class="container" data-v-670493dd><span class="top" data-v-670493dd></span><span class="middle" data-v-670493dd></span><span class="bottom" data-v-670493dd></span></span></button></div></div></div></div><div class="divider" data-v-bb7529ee><div class="divider-line" data-v-bb7529ee></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-c4daae71 data-v-9d8129cc><div class="container" data-v-9d8129cc><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-9d8129cc><span class="vpi-align-left menu-icon" data-v-9d8129cc></span><span class="menu-text" data-v-9d8129cc>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-9d8129cc data-v-d61422fe><button data-v-d61422fe>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-c4daae71 data-v-12a40e3d><div class="curtain" data-v-12a40e3d></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-12a40e3d><span class="visually-hidden" id="sidebar-aria-label" data-v-12a40e3d> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0 has-active" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Quick start</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Install</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/start/option.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Option</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/start/i18n.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Language</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Component</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/layers.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Layers</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/controls.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Controls</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/contextmenu.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Contextmenu</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/component/setting.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Setting</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Advanced</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/property.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Instance Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/built-in.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Advanced Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/class.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Static Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/global.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Global Property</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/event.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Instance Event</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/en/advanced/plugin.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Writing Plugin</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Plugins</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Advertise</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&amp;example=iframe" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Iframe Control</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&amp;example=hls.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>HLS Control</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&amp;example=dash.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>DASH Control</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&amp;example=vtt.thumbnail" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VTT Thumbnail</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&amp;example=multiple.subtitles" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Multiple Subtitles</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&amp;example=jassub" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>ASS Subtitle - JASSUB</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&amp;example=chromecast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Chromecast</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&amp;example=vast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VAST</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&amp;example=chapter" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Video Chapters</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&amp;example=ambilight" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Video Ambilight</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&amp;example=document.pip" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Document PIP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&amp;example=audio.track" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Audio Track</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Libraries</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&amp;example=hls" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>hls.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&amp;example=flv" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>flv.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&amp;example=dash" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>dash.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&amp;example=mpegts" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>mpegts.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&amp;example=webtorrent" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>webtorrent.js</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>Proxys</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&amp;example=canvas" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Canvas</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&amp;example=mediabunny" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Mediabunny</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-c4daae71 data-v-d2aef184><div class="VPDoc has-sidebar has-aside" data-v-d2aef184 data-v-ef3a4dda><!--[--><!--]--><div class="container" data-v-ef3a4dda><div class="aside" data-v-ef3a4dda><div class="aside-curtain" data-v-ef3a4dda></div><div class="aside-container" data-v-ef3a4dda><div class="aside-content" data-v-ef3a4dda><div class="VPDocAside" data-v-ef3a4dda data-v-79cae1a0><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-79cae1a0 data-v-dfbd9fb8><div class="content" data-v-dfbd9fb8><div class="outline-marker" data-v-dfbd9fb8></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-dfbd9fb8>On this page</div><ul class="VPDocOutlineItem root" data-v-dfbd9fb8 data-v-da421f78><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-79cae1a0></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ef3a4dda><div class="content-container" data-v-ef3a4dda><!--[--><!--]--><main class="main" data-v-ef3a4dda><div style="position:relative;" class="vp-doc _document_en_" data-v-ef3a4dda><div><h1 id="installation-usage" tabindex="-1">Installation &amp; Usage <a class="header-anchor" href="#installation-usage" aria-label="Permalink to &quot;Installation &amp; Usage&quot;">​</a></h1><h2 id="installation" tabindex="-1">Installation <a class="header-anchor" href="#installation" aria-label="Permalink to &quot;Installation&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-xhdeV" id="tab-jQ-ikso" checked><label data-title="npm" for="tab-jQ-ikso">npm</label><input type="radio" name="group-xhdeV" id="tab-PYp5aeE"><label data-title="yarn" for="tab-PYp5aeE">yarn</label><input type="radio" name="group-xhdeV" id="tab-A_QzmiS"><label data-title="pnpm" for="tab-A_QzmiS">pnpm</label><input type="radio" name="group-xhdeV" id="tab-XmoQe0N"><label data-title="script" for="tab-XmoQe0N">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;`CDN`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-lMTXQ" id="tab-JwrqZbx" checked><label data-title="jsdelivr.net" for="tab-JwrqZbx">jsdelivr.net</label><input type="radio" name="group-lMTXQ" id="tab-xPmmiS7"><label data-title="unpkg.com" for="tab-xPmmiS7">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="usage" tabindex="-1">Usage <a class="header-anchor" href="#usage" aria-label="Permalink to &quot;Usage&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-MUWrD" id="tab-_1zQhbe" checked><label data-title="index.html" for="tab-_1zQhbe">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;ArtPlayer Demo&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">meta</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> charset</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;UTF-8&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
@@ -44,7 +44,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">          });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">body</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Note</p><p>The player&#39;s dimensions depend on the size of its container <code>container</code>, so your container must have defined dimensions.</p></div><div class="tip custom-block"><p class="custom-block-title">See more usage examples at the following link:</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;`Vue.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-mgYpS" id="tab-JbACN3P" checked><label data-title="Artplayer.vue" for="tab-JbACN3P">Artplayer.vue</label><input type="radio" name="group-mgYpS" id="tab-DOfQIoV"><label data-title="app.vue" for="tab-DOfQIoV">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Note</p><p>The player&#39;s dimensions depend on the size of its container <code>container</code>, so your container must have defined dimensions.</p></div><div class="tip custom-block"><p class="custom-block-title">See more usage examples at the following link:</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;`Vue.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-l0H5H" id="tab-PJ8oBGT" checked><label data-title="Artplayer.vue" for="tab-PJ8oBGT">Artplayer.vue</label><input type="radio" name="group-l0H5H" id="tab-G2gRnpF"><label data-title="app.vue" for="tab-G2gRnpF">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;$container&quot;</span><span style="--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
@@ -76,7 +76,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  art.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">})</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><div class="language-vue vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">style</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">getInstance</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;option&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;style&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> @get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;getInstance&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
@@ -96,7 +96,7 @@
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">art</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(art)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer is not reactive:</p><p>Directly modifying <code>option</code> in <code>Vue.js</code> will not update the player.</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;`React.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-YAdSX" id="tab-GMl6BwU" checked><label data-title="Artplayer.jsx" for="tab-GMl6BwU">Artplayer.jsx</label><input type="radio" name="group-YAdSX" id="tab-8OWkGj5"><label data-title="app.jsx" for="tab-8OWkGj5">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer is not reactive:</p><p>Directly modifying <code>option</code> in <code>Vue.js</code> will not update the player.</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;`React.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-GN-ip" id="tab-34CCKx7" checked><label data-title="Artplayer.jsx" for="tab-34CCKx7">Artplayer.jsx</label><input type="radio" name="group-GN-ip" id="tab-thj5yc7"><label data-title="app.jsx" for="tab-thj5yc7">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { useEffect, useRef } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;react&#39;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Player</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">rest</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) {</span></span>
@@ -179,7 +179,7 @@
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option.volume </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 0.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
-<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="legacy-browsers" tabindex="-1">Legacy Browsers <a class="header-anchor" href="#legacy-browsers" aria-label="Permalink to &quot;Legacy Browsers&quot;">​</a></h2><p>The production build <code>artplayer.js</code> only supports the latest major version of <code>Chrome</code>: <code>last 1 Chrome version</code></p><p>For legacy browsers, you can use the <code>artplayer.legacy.js</code> file, which supports compatibility down to: <code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-WlXHS" id="tab-WzjO9KW" checked><label data-title="jsdelivr.net" for="tab-WzjO9KW">jsdelivr.net</label><input type="radio" name="group-WlXHS" id="tab-q15Nl2K"><label data-title="unpkg.com" for="tab-q15Nl2K">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">If you need to support even older browsers, modify the following configuration and build it yourself:</p><p>Build configuration: <a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>Reference documentation: <a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>Starting from <code>5.2.6</code>, <code>artplayer</code> and all plugins also provide an <code>ESM</code> version <code>mjs</code>, such as:</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="legacy-browsers" tabindex="-1">Legacy Browsers <a class="header-anchor" href="#legacy-browsers" aria-label="Permalink to &quot;Legacy Browsers&quot;">​</a></h2><p>The production build <code>artplayer.js</code> only supports the latest major version of <code>Chrome</code>: <code>last 1 Chrome version</code></p><p>For legacy browsers, you can use the <code>artplayer.legacy.js</code> file, which supports compatibility down to: <code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-xGZkx" id="tab-428x8xK" checked><label data-title="jsdelivr.net" for="tab-428x8xK">jsdelivr.net</label><input type="radio" name="group-xGZkx" id="tab-JXnG8wn"><label data-title="unpkg.com" for="tab-JXnG8wn">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">If you need to support even older browsers, modify the following configuration and build it yourself:</p><p>Build configuration: <a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>Reference documentation: <a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>Starting from <code>5.2.6</code>, <code>artplayer</code> and all plugins also provide an <code>ESM</code> version <code>mjs</code>, such as:</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;en&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
@@ -237,7 +237,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">body</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div><div class="warning custom-block"><p class="custom-block-title">Note</p><p>You need to modify it before importing the <code>Artplayer</code> dependency for it to take effect.</p></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/index.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2026-01-03T06:08:31.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><!----></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/start/option.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Option</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/start/i18n.html b/docs/document/en/start/i18n.html
index 4f1ce742c..ce6c51b59 100644
--- a/docs/document/en/start/i18n.html
+++ b/docs/document/en/start/i18n.html
@@ -13,7 +13,7 @@
     <link rel="preload" href="/document/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
     <link rel="modulepreload" href="/document/assets/chunks/theme.DwvAHEyX.js">
     <link rel="modulepreload" href="/document/assets/chunks/framework.xxfEszSJ.js">
-    <link rel="modulepreload" href="/document/assets/en_start_i18n.md.x4tw6CvN.lean.js">
+    <link rel="modulepreload" href="/document/assets/en_start_i18n.md.DAxrpMQL.lean.js">
     <script src="/document/main.js"></script>
     <link rel="stylesheet" href="/document/style.css">
     <link rel="shortcut icon" href="/document/favicon.ico">
@@ -27,7 +27,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    container: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;.artplayer-app&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/assets/sample/video.mp4&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    lang: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;zh-cn&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// or &#39;en&#39;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="importing-languages" tabindex="-1">Importing Languages <a class="header-anchor" href="#importing-languages" aria-label="Permalink to &quot;Importing Languages&quot;">​</a></h2><p>Language files before bundling are located at: <code>artplayer/src/i18n/*.js</code>. Contributions to add your language are welcome.</p><p>Language files after bundling are located at: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-fV4Qu" id="tab-_bBuYRp" checked><label data-title="import" for="tab-_bBuYRp">import</label><input type="radio" name="group-fV4Qu" id="tab-eHRWePn"><label data-title="script" for="tab-eHRWePn">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="importing-languages" tabindex="-1">Importing Languages <a class="header-anchor" href="#importing-languages" aria-label="Permalink to &quot;Importing Languages&quot;">​</a></h2><p>Language files before bundling are located at: <code>artplayer/src/i18n/*.js</code>. Contributions to add your language are welcome.</p><p>Language files after bundling are located at: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-ix1Uk" id="tab-tMINLhf" checked><label data-title="import" for="tab-tMINLhf">import</label><input type="radio" name="group-ix1Uk" id="tab-6bnGS7D"><label data-title="script" for="tab-6bnGS7D">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> zhTw </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/zh-tw&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> art </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
@@ -75,7 +75,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        },</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    },</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/start/i18n.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/start/option.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Option</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/component/layers.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Layers</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/en/start/option.html b/docs/document/en/start/option.html
index 9e03379ed..c331ead61 100644
--- a/docs/document/en/start/option.html
+++ b/docs/document/en/start/option.html
@@ -475,7 +475,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/assets/sample/video.mp4&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line highlighted"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    proxy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> document.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">createElement</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;video&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/en/start/option.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:26:42.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/en/" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>Install</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/en/start/i18n.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>Language</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/hashmap.json b/docs/document/hashmap.json
index d91c982e9..a4c07c254 100644
--- a/docs/document/hashmap.json
+++ b/docs/document/hashmap.json
@@ -1 +1 @@
-{"advanced_built-in.md":"DbXkhR8l","advanced_class.md":"BE9Wp7q6","advanced_event.md":"DoIgqIU9","advanced_global.md":"Db4VcykV","advanced_plugin.md":"CVp3Oe2x","advanced_property.md":"C_nOKniE","component_contextmenu.md":"lsIURdc3","component_controls.md":"CKAl0l5Z","component_layers.md":"D34Y4OkH","component_setting.md":"BwCpY3NU","en_advanced_built-in.md":"DWw_qKdn","en_advanced_class.md":"bWhe2FDl","en_advanced_event.md":"igITY2FO","en_advanced_global.md":"Bj0Agjzd","en_advanced_plugin.md":"IXiFhAGS","en_advanced_property.md":"DQzShb4B","en_component_contextmenu.md":"3nvb8CSX","en_component_controls.md":"s1SJ4fZd","en_component_layers.md":"wLZPKN9j","en_component_setting.md":"eqeWyMDt","en_index.md":"CYpcDsY6","en_start_i18n.md":"x4tw6CvN","en_start_option.md":"CuY4IYWk","index.md":"B8NxRV94","plugin_danmuku.md":"C7LHV45A","start_i18n.md":"B0XPxv4h","start_option.md":"DRwrMHeQ"}
+{"advanced_built-in.md":"DbXkhR8l","advanced_class.md":"BE9Wp7q6","advanced_event.md":"DoIgqIU9","advanced_global.md":"Db4VcykV","advanced_plugin.md":"CVp3Oe2x","advanced_property.md":"C_nOKniE","component_contextmenu.md":"lsIURdc3","component_controls.md":"CKAl0l5Z","component_layers.md":"D34Y4OkH","component_setting.md":"BwCpY3NU","en_advanced_built-in.md":"DWw_qKdn","en_advanced_class.md":"bWhe2FDl","en_advanced_event.md":"igITY2FO","en_advanced_global.md":"Bj0Agjzd","en_advanced_plugin.md":"IXiFhAGS","en_advanced_property.md":"DQzShb4B","en_component_contextmenu.md":"3nvb8CSX","en_component_controls.md":"s1SJ4fZd","en_component_layers.md":"wLZPKN9j","en_component_setting.md":"eqeWyMDt","en_index.md":"DrOcPBwp","en_start_i18n.md":"DAxrpMQL","en_start_option.md":"CuY4IYWk","index.md":"WcEL7IA5","plugin_danmuku.md":"D580Az0s","start_i18n.md":"C6dAnYSp","start_option.md":"DRwrMHeQ"}
diff --git a/docs/document/index.html b/docs/document/index.html
index e9ed9cfa9..f9d6cf8e7 100644
--- a/docs/document/index.html
+++ b/docs/document/index.html
@@ -13,7 +13,7 @@
     <link rel="preload" href="/document/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
     <link rel="modulepreload" href="/document/assets/chunks/theme.DwvAHEyX.js">
     <link rel="modulepreload" href="/document/assets/chunks/framework.xxfEszSJ.js">
-    <link rel="modulepreload" href="/document/assets/index.md.B8NxRV94.lean.js">
+    <link rel="modulepreload" href="/document/assets/index.md.WcEL7IA5.lean.js">
     <script src="/document/main.js"></script>
     <link rel="stylesheet" href="/document/style.css">
     <link rel="shortcut icon" href="/document/favicon.ico">
@@ -23,7 +23,7 @@
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-c4daae71><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17ad389b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-17ad389b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c4daae71 data-v-a46e73f0><div class="VPNavBar" data-v-a46e73f0 data-v-bb7529ee><div class="wrapper" data-v-bb7529ee><div class="container" data-v-bb7529ee><div class="title" data-v-bb7529ee><div class="VPNavBarTitle has-sidebar" data-v-bb7529ee data-v-5622a072><a class="title" href="/document/" data-v-5622a072><!--[--><!--]--><!--[--><img class="VPImage logo" src="/document/logo.png" alt data-v-4d414b82><!--]--><span data-v-5622a072>Artplayer.js</span><!--[--><!--]--></a></div></div><div class="content" data-v-bb7529ee><div class="content-body" data-v-bb7529ee><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bb7529ee><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><span class="DocSearch-Button-Key">Meta</span><span class="DocSearch-Button-Key">K</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-bb7529ee data-v-5bacfe89><span id="main-nav-aria-label" class="visually-hidden" data-v-5bacfe89> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/document/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>中文版</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/en/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>English Docs</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>Online Editor</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org/llms.txt" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>🤖LLMs</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-5bacfe89 data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-40e55da0><span class="text" data-v-40e55da0><!----><span data-v-40e55da0>5.3.x</span><span class="vpi-chevron-down text-icon" data-v-40e55da0></span></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><div class="items" data-v-39eca401><!--[--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Changelog</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer#donations" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Donation</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bb7529ee data-v-123fcb2f><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-123fcb2f data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bb7529ee data-v-08b35e6f data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bb7529ee data-v-0c845e5d data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-40e55da0><span class="vpi-more-horizontal icon" data-v-40e55da0></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><!----><!--[--><!--[--><!----><div class="group" data-v-0c845e5d><div class="item appearance" data-v-0c845e5d><p class="label" data-v-0c845e5d>Appearance</p><div class="appearance-action" data-v-0c845e5d><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-0c845e5d data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div></div></div><div class="group" data-v-0c845e5d><div class="item social-links" data-v-0c845e5d><div class="VPSocialLinks social-links-list" data-v-0c845e5d data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-bb7529ee data-v-670493dd><span class="container" data-v-670493dd><span class="top" data-v-670493dd></span><span class="middle" data-v-670493dd></span><span class="bottom" data-v-670493dd></span></span></button></div></div></div></div><div class="divider" data-v-bb7529ee><div class="divider-line" data-v-bb7529ee></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-c4daae71 data-v-9d8129cc><div class="container" data-v-9d8129cc><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-9d8129cc><span class="vpi-align-left menu-icon" data-v-9d8129cc></span><span class="menu-text" data-v-9d8129cc>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-9d8129cc data-v-d61422fe><button data-v-d61422fe>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-c4daae71 data-v-12a40e3d><div class="curtain" data-v-12a40e3d></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-12a40e3d><span class="visually-hidden" id="sidebar-aria-label" data-v-12a40e3d> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0 has-active" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>开始</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>安装使用</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/option.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>基础选项</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/i18n.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>语言设置</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>组件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/layers.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>业务层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/controls.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>控制器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/contextmenu.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>右键菜单</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/setting.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>设置面板</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>高级</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/property.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/built-in.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>高级属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/class.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>静态属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/global.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>全局属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/event.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例事件</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/plugin.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>编写插件</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>插件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/plugin/danmuku.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>🎉 弹幕库</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&amp;example=danmuku.mask" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>弹幕遮罩</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&amp;example=iframe" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Iframe 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&amp;example=hls.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>HLS 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&amp;example=dash.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>DASH 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&amp;example=vtt.thumbnail" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VTT 缩略图</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&amp;example=multiple.subtitles" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>多重字幕</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&amp;example=jassub" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>ASS 字幕 - JASSUB</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&amp;example=chromecast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Chromecast</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&amp;example=vast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VAST 广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&amp;example=chapter" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频章节</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&amp;example=ambilight" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频背光</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&amp;example=document.pip" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>文档画中画</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&amp;example=audio.track" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>独立音轨</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>第三方库</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&amp;example=hls" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>hls.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&amp;example=flv" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>flv.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&amp;example=dash" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>dash.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&amp;example=mpegts" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>mpegts.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&amp;example=webtorrent" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>webtorrent.js</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>代理</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&amp;example=canvas" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Canvas</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&amp;example=mediabunny" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Mediabunny</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-c4daae71 data-v-d2aef184><div class="VPDoc has-sidebar has-aside" data-v-d2aef184 data-v-ef3a4dda><!--[--><!--]--><div class="container" data-v-ef3a4dda><div class="aside" data-v-ef3a4dda><div class="aside-curtain" data-v-ef3a4dda></div><div class="aside-container" data-v-ef3a4dda><div class="aside-content" data-v-ef3a4dda><div class="VPDocAside" data-v-ef3a4dda data-v-79cae1a0><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-79cae1a0 data-v-dfbd9fb8><div class="content" data-v-dfbd9fb8><div class="outline-marker" data-v-dfbd9fb8></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-dfbd9fb8>On this page</div><ul class="VPDocOutlineItem root" data-v-dfbd9fb8 data-v-da421f78><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-79cae1a0></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ef3a4dda><div class="content-container" data-v-ef3a4dda><!--[--><!--]--><main class="main" data-v-ef3a4dda><div style="position:relative;" class="vp-doc _document_" data-v-ef3a4dda><div><h1 id="安装使用" tabindex="-1">安装使用 <a class="header-anchor" href="#安装使用" aria-label="Permalink to &quot;安装使用&quot;">​</a></h1><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-oTRZF" id="tab-dl4CGvG" checked><label data-title="npm" for="tab-dl4CGvG">npm</label><input type="radio" name="group-oTRZF" id="tab-bPwiync"><label data-title="yarn" for="tab-bPwiync">yarn</label><input type="radio" name="group-oTRZF" id="tab-fbc-Uta"><label data-title="pnpm" for="tab-fbc-Uta">pnpm</label><input type="radio" name="group-oTRZF" id="tab-rLfX3Ru"><label data-title="script" for="tab-rLfX3Ru">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;`CDN`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-Jd546" id="tab-_XTKVh5" checked><label data-title="jsdelivr.net" for="tab-_XTKVh5">jsdelivr.net</label><input type="radio" name="group-Jd546" id="tab-iVR2h1k"><label data-title="unpkg.com" for="tab-iVR2h1k">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="使用" tabindex="-1">使用 <a class="header-anchor" href="#使用" aria-label="Permalink to &quot;使用&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-VUy86" id="tab-JJOXotf" checked><label data-title="index.html" for="tab-JJOXotf">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-c4daae71><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17ad389b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-17ad389b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c4daae71 data-v-a46e73f0><div class="VPNavBar" data-v-a46e73f0 data-v-bb7529ee><div class="wrapper" data-v-bb7529ee><div class="container" data-v-bb7529ee><div class="title" data-v-bb7529ee><div class="VPNavBarTitle has-sidebar" data-v-bb7529ee data-v-5622a072><a class="title" href="/document/" data-v-5622a072><!--[--><!--]--><!--[--><img class="VPImage logo" src="/document/logo.png" alt data-v-4d414b82><!--]--><span data-v-5622a072>Artplayer.js</span><!--[--><!--]--></a></div></div><div class="content" data-v-bb7529ee><div class="content-body" data-v-bb7529ee><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bb7529ee><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><span class="DocSearch-Button-Key">Meta</span><span class="DocSearch-Button-Key">K</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-bb7529ee data-v-5bacfe89><span id="main-nav-aria-label" class="visually-hidden" data-v-5bacfe89> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/document/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>中文版</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/en/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>English Docs</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>Online Editor</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org/llms.txt" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>🤖LLMs</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-5bacfe89 data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-40e55da0><span class="text" data-v-40e55da0><!----><span data-v-40e55da0>5.3.x</span><span class="vpi-chevron-down text-icon" data-v-40e55da0></span></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><div class="items" data-v-39eca401><!--[--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Changelog</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer#donations" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Donation</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bb7529ee data-v-123fcb2f><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-123fcb2f data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bb7529ee data-v-08b35e6f data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bb7529ee data-v-0c845e5d data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-40e55da0><span class="vpi-more-horizontal icon" data-v-40e55da0></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><!----><!--[--><!--[--><!----><div class="group" data-v-0c845e5d><div class="item appearance" data-v-0c845e5d><p class="label" data-v-0c845e5d>Appearance</p><div class="appearance-action" data-v-0c845e5d><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-0c845e5d data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div></div></div><div class="group" data-v-0c845e5d><div class="item social-links" data-v-0c845e5d><div class="VPSocialLinks social-links-list" data-v-0c845e5d data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-bb7529ee data-v-670493dd><span class="container" data-v-670493dd><span class="top" data-v-670493dd></span><span class="middle" data-v-670493dd></span><span class="bottom" data-v-670493dd></span></span></button></div></div></div></div><div class="divider" data-v-bb7529ee><div class="divider-line" data-v-bb7529ee></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-c4daae71 data-v-9d8129cc><div class="container" data-v-9d8129cc><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-9d8129cc><span class="vpi-align-left menu-icon" data-v-9d8129cc></span><span class="menu-text" data-v-9d8129cc>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-9d8129cc data-v-d61422fe><button data-v-d61422fe>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-c4daae71 data-v-12a40e3d><div class="curtain" data-v-12a40e3d></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-12a40e3d><span class="visually-hidden" id="sidebar-aria-label" data-v-12a40e3d> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0 has-active" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>开始</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>安装使用</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/option.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>基础选项</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/i18n.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>语言设置</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>组件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/layers.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>业务层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/controls.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>控制器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/contextmenu.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>右键菜单</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/setting.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>设置面板</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>高级</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/property.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/built-in.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>高级属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/class.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>静态属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/global.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>全局属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/event.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例事件</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/plugin.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>编写插件</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>插件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/plugin/danmuku.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>🎉 弹幕库</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&amp;example=danmuku.mask" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>弹幕遮罩</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&amp;example=iframe" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Iframe 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&amp;example=hls.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>HLS 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&amp;example=dash.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>DASH 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&amp;example=vtt.thumbnail" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VTT 缩略图</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&amp;example=multiple.subtitles" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>多重字幕</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&amp;example=jassub" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>ASS 字幕 - JASSUB</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&amp;example=chromecast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Chromecast</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&amp;example=vast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VAST 广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&amp;example=chapter" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频章节</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&amp;example=ambilight" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频背光</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&amp;example=document.pip" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>文档画中画</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&amp;example=audio.track" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>独立音轨</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>第三方库</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&amp;example=hls" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>hls.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&amp;example=flv" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>flv.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&amp;example=dash" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>dash.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&amp;example=mpegts" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>mpegts.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&amp;example=webtorrent" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>webtorrent.js</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>代理</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&amp;example=canvas" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Canvas</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&amp;example=mediabunny" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Mediabunny</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-c4daae71 data-v-d2aef184><div class="VPDoc has-sidebar has-aside" data-v-d2aef184 data-v-ef3a4dda><!--[--><!--]--><div class="container" data-v-ef3a4dda><div class="aside" data-v-ef3a4dda><div class="aside-curtain" data-v-ef3a4dda></div><div class="aside-container" data-v-ef3a4dda><div class="aside-content" data-v-ef3a4dda><div class="VPDocAside" data-v-ef3a4dda data-v-79cae1a0><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-79cae1a0 data-v-dfbd9fb8><div class="content" data-v-dfbd9fb8><div class="outline-marker" data-v-dfbd9fb8></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-dfbd9fb8>On this page</div><ul class="VPDocOutlineItem root" data-v-dfbd9fb8 data-v-da421f78><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-79cae1a0></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ef3a4dda><div class="content-container" data-v-ef3a4dda><!--[--><!--]--><main class="main" data-v-ef3a4dda><div style="position:relative;" class="vp-doc _document_" data-v-ef3a4dda><div><h1 id="安装使用" tabindex="-1">安装使用 <a class="header-anchor" href="#安装使用" aria-label="Permalink to &quot;安装使用&quot;">​</a></h1><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-6VmWd" id="tab--5RTTp0" checked><label data-title="npm" for="tab--5RTTp0">npm</label><input type="radio" name="group-6VmWd" id="tab-Ty4Avp2"><label data-title="yarn" for="tab-Ty4Avp2">yarn</label><input type="radio" name="group-6VmWd" id="tab-PWODMSm"><label data-title="pnpm" for="tab-PWODMSm">pnpm</label><input type="radio" name="group-6VmWd" id="tab-rJ7w3iS"><label data-title="script" for="tab-rJ7w3iS">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1"><code>CDN</code> <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;`CDN`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-BelSB" id="tab-Sgj9bjl" checked><label data-title="jsdelivr.net" for="tab-Sgj9bjl">jsdelivr.net</label><input type="radio" name="group-BelSB" id="tab-9xwUR5a"><label data-title="unpkg.com" for="tab-9xwUR5a">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="使用" tabindex="-1">使用 <a class="header-anchor" href="#使用" aria-label="Permalink to &quot;使用&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-p4NO-" id="tab-H81VyLe" checked><label data-title="index.html" for="tab-H81VyLe">index.html</label></div><div class="blocks"><div class="language-html vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;ArtPlayer Demo&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">meta</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> charset</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;UTF-8&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
@@ -44,7 +44,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">          });</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">body</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">提示</p><p>播放器的尺寸依赖于容器 <code>container</code> 的尺寸，所以你的容器 <code>container</code> 必须是有尺寸的</p></div><div class="tip custom-block"><p class="custom-block-title">以下链接可以看到更多的使用例子</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;`Vue.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-b2RBZ" id="tab-88AfHBH" checked><label data-title="Artplayer.vue" for="tab-88AfHBH">Artplayer.vue</label><input type="radio" name="group-b2RBZ" id="tab-8zvGTOY"><label data-title="app.vue" for="tab-8zvGTOY">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">提示</p><p>播放器的尺寸依赖于容器 <code>container</code> 的尺寸，所以你的容器 <code>container</code> 必须是有尺寸的</p></div><div class="tip custom-block"><p class="custom-block-title">以下链接可以看到更多的使用例子</p><p><a href="https://github.com/zhw2590582/ArtPlayer/tree/master/example" target="_blank" rel="noreferrer">/example</a></p></div><h2 id="vue-js" tabindex="-1"><code>Vue.js</code> <a class="header-anchor" href="#vue-js" aria-label="Permalink to &quot;`Vue.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-FoW68" id="tab-QWckAns" checked><label data-title="Artplayer.vue" for="tab-QWckAns">Artplayer.vue</label><input type="radio" name="group-FoW68" id="tab-WNKyaFC"><label data-title="app.vue" for="tab-WNKyaFC">app.vue</label></div><div class="blocks"><div class="language-vue vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;$container&quot;</span><span style="--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
@@ -76,7 +76,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  art.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">})</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><div class="language-vue vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;option&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> :style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;style&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> @get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;getInstance&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">style</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">get-instance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">getInstance</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> /&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
@@ -96,7 +96,7 @@
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">art</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(art)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer 非响应式：</p><p>在 <code>Vue.js</code> 里直接修改 <code>option</code> 是不会改变播放器的</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;`React.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-rE7lk" id="tab-ZGkw364" checked><label data-title="Artplayer.jsx" for="tab-ZGkw364">Artplayer.jsx</label><input type="radio" name="group-rE7lk" id="tab-18BybYQ"><label data-title="app.jsx" for="tab-18BybYQ">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">Artplayer 非响应式：</p><p>在 <code>Vue.js</code> 里直接修改 <code>option</code> 是不会改变播放器的</p></div><h2 id="react-js" tabindex="-1"><code>React.js</code> <a class="header-anchor" href="#react-js" aria-label="Permalink to &quot;`React.js`&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-G4Ewk" id="tab-W7K46wQ" checked><label data-title="Artplayer.jsx" for="tab-W7K46wQ">Artplayer.jsx</label><input type="radio" name="group-G4Ewk" id="tab-C6ipVk4"><label data-title="app.jsx" for="tab-C6ipVk4">app.jsx</label></div><div class="blocks"><div class="language-jsx vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer&#39;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { useEffect, useRef } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;react&#39;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Player</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">option</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">getInstance</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">rest</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) {</span></span>
@@ -179,7 +179,7 @@
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">option.volume </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 0.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
-<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="古老的浏览器" tabindex="-1">古老的浏览器 <a class="header-anchor" href="#古老的浏览器" aria-label="Permalink to &quot;古老的浏览器&quot;">​</a></h2><p>生产构建的 <code>artplayer.js</code> 只兼容最新一个主版本的 <code>Chrome</code>：<code>last 1 Chrome version</code></p><p>对于古老的浏览器，可以使用 <code>artplayer.legacy.js</code> 文件，可以兼容到：<code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-5bLtB" id="tab-4qUEudq" checked><label data-title="jsdelivr.net" for="tab-4qUEudq">jsdelivr.net</label><input type="radio" name="group-5bLtB" id="tab-NsPuE3f"><label data-title="unpkg.com" for="tab-NsPuE3f">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：</p><p>构建配置：<a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>参考文档：<a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>从 <code>5.2.6</code> 开始，<code>artplayer</code> 和所有插件还会提供一个 <code>ESM</code> 版本的 <code>mjs</code>，如：</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> art8</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(option);</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="古老的浏览器" tabindex="-1">古老的浏览器 <a class="header-anchor" href="#古老的浏览器" aria-label="Permalink to &quot;古老的浏览器&quot;">​</a></h2><p>生产构建的 <code>artplayer.js</code> 只兼容最新一个主版本的 <code>Chrome</code>：<code>last 1 Chrome version</code></p><p>对于古老的浏览器，可以使用 <code>artplayer.legacy.js</code> 文件，可以兼容到：<code>IE 11</code></p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Artplayer </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/legacy&#39;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-7LBEI" id="tab-AtRTXwG" checked><label data-title="jsdelivr.net" for="tab-AtRTXwG">jsdelivr.net</label><input type="radio" name="group-7LBEI" id="tab-YqWtgkR"><label data-title="unpkg.com" for="tab-YqWtgkR">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer/dist/artplayer.legacy.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="tip custom-block"><p class="custom-block-title">假如你要兼容更古老的浏览器时，请修改以下配置然后自行构建：</p><p>构建配置：<a href="https://github.com/zhw2590582/ArtPlayer/blob/master/scripts/build.js#L29" target="_blank" rel="noreferrer">scripts/build.js</a></p><p>参考文档：<a href="https://github.com/browserslist/browserslist#full-list" target="_blank" rel="noreferrer">browserslist</a></p></div><h2 id="ecmascript-module" tabindex="-1">ECMAScript Module <a class="header-anchor" href="#ecmascript-module" aria-label="Permalink to &quot;ECMAScript Module&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">ESM Demo:</p><p><a href="https://artplayer.org/esm.html" target="_blank" rel="noreferrer">https://artplayer.org/esm.html</a></p></div><p>从 <code>5.2.6</code> 开始，<code>artplayer</code> 和所有插件还会提供一个 <code>ESM</code> 版本的 <code>mjs</code>，如：</p><ul><li><code>artplayer/dist/artplayer.mjs</code></li><li><code>artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.mjs</code></li></ul><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;!</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">DOCTYPE</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;en&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">head</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
@@ -237,7 +237,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">body</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">html</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div><div class="warning custom-block"><p class="custom-block-title">提示</p><p>你需要在引入 <code>Artplayer</code> 依赖前来修改它才会生效</p></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/index.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2026-01-03T06:08:31.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><!----></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/start/option.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>基础选项</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/plugin/danmuku.html b/docs/document/plugin/danmuku.html
index 7a0a1d66e..06cecf679 100644
--- a/docs/document/plugin/danmuku.html
+++ b/docs/document/plugin/danmuku.html
@@ -13,7 +13,7 @@
     <link rel="preload" href="/document/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
     <link rel="modulepreload" href="/document/assets/chunks/theme.DwvAHEyX.js">
     <link rel="modulepreload" href="/document/assets/chunks/framework.xxfEszSJ.js">
-    <link rel="modulepreload" href="/document/assets/plugin_danmuku.md.C7LHV45A.lean.js">
+    <link rel="modulepreload" href="/document/assets/plugin_danmuku.md.D580Az0s.lean.js">
     <script src="/document/main.js"></script>
     <link rel="stylesheet" href="/document/style.css">
     <link rel="shortcut icon" href="/document/favicon.ico">
@@ -23,7 +23,7 @@
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-c4daae71><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17ad389b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-17ad389b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c4daae71 data-v-a46e73f0><div class="VPNavBar" data-v-a46e73f0 data-v-bb7529ee><div class="wrapper" data-v-bb7529ee><div class="container" data-v-bb7529ee><div class="title" data-v-bb7529ee><div class="VPNavBarTitle has-sidebar" data-v-bb7529ee data-v-5622a072><a class="title" href="/document/" data-v-5622a072><!--[--><!--]--><!--[--><img class="VPImage logo" src="/document/logo.png" alt data-v-4d414b82><!--]--><span data-v-5622a072>Artplayer.js</span><!--[--><!--]--></a></div></div><div class="content" data-v-bb7529ee><div class="content-body" data-v-bb7529ee><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bb7529ee><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><span class="DocSearch-Button-Key">Meta</span><span class="DocSearch-Button-Key">K</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-bb7529ee data-v-5bacfe89><span id="main-nav-aria-label" class="visually-hidden" data-v-5bacfe89> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>中文版</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/en/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>English Docs</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>Online Editor</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org/llms.txt" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>🤖LLMs</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-5bacfe89 data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-40e55da0><span class="text" data-v-40e55da0><!----><span data-v-40e55da0>5.3.x</span><span class="vpi-chevron-down text-icon" data-v-40e55da0></span></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><div class="items" data-v-39eca401><!--[--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Changelog</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer#donations" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Donation</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bb7529ee data-v-123fcb2f><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-123fcb2f data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bb7529ee data-v-08b35e6f data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bb7529ee data-v-0c845e5d data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-40e55da0><span class="vpi-more-horizontal icon" data-v-40e55da0></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><!----><!--[--><!--[--><!----><div class="group" data-v-0c845e5d><div class="item appearance" data-v-0c845e5d><p class="label" data-v-0c845e5d>Appearance</p><div class="appearance-action" data-v-0c845e5d><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-0c845e5d data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div></div></div><div class="group" data-v-0c845e5d><div class="item social-links" data-v-0c845e5d><div class="VPSocialLinks social-links-list" data-v-0c845e5d data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-bb7529ee data-v-670493dd><span class="container" data-v-670493dd><span class="top" data-v-670493dd></span><span class="middle" data-v-670493dd></span><span class="bottom" data-v-670493dd></span></span></button></div></div></div></div><div class="divider" data-v-bb7529ee><div class="divider-line" data-v-bb7529ee></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-c4daae71 data-v-9d8129cc><div class="container" data-v-9d8129cc><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-9d8129cc><span class="vpi-align-left menu-icon" data-v-9d8129cc></span><span class="menu-text" data-v-9d8129cc>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-9d8129cc data-v-d61422fe><button data-v-d61422fe>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-c4daae71 data-v-12a40e3d><div class="curtain" data-v-12a40e3d></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-12a40e3d><span class="visually-hidden" id="sidebar-aria-label" data-v-12a40e3d> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>开始</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>安装使用</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/option.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>基础选项</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/i18n.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>语言设置</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>组件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/layers.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>业务层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/controls.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>控制器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/contextmenu.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>右键菜单</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/setting.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>设置面板</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>高级</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/property.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/built-in.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>高级属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/class.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>静态属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/global.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>全局属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/event.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例事件</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/plugin.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>编写插件</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0 has-active" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>插件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/plugin/danmuku.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>🎉 弹幕库</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&amp;example=danmuku.mask" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>弹幕遮罩</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&amp;example=iframe" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Iframe 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&amp;example=hls.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>HLS 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&amp;example=dash.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>DASH 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&amp;example=vtt.thumbnail" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VTT 缩略图</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&amp;example=multiple.subtitles" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>多重字幕</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&amp;example=jassub" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>ASS 字幕 - JASSUB</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&amp;example=chromecast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Chromecast</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&amp;example=vast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VAST 广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&amp;example=chapter" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频章节</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&amp;example=ambilight" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频背光</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&amp;example=document.pip" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>文档画中画</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&amp;example=audio.track" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>独立音轨</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>第三方库</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&amp;example=hls" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>hls.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&amp;example=flv" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>flv.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&amp;example=dash" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>dash.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&amp;example=mpegts" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>mpegts.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&amp;example=webtorrent" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>webtorrent.js</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>代理</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&amp;example=canvas" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Canvas</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&amp;example=mediabunny" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Mediabunny</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-c4daae71 data-v-d2aef184><div class="VPDoc has-sidebar has-aside" data-v-d2aef184 data-v-ef3a4dda><!--[--><!--]--><div class="container" data-v-ef3a4dda><div class="aside" data-v-ef3a4dda><div class="aside-curtain" data-v-ef3a4dda></div><div class="aside-container" data-v-ef3a4dda><div class="aside-content" data-v-ef3a4dda><div class="VPDocAside" data-v-ef3a4dda data-v-79cae1a0><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-79cae1a0 data-v-dfbd9fb8><div class="content" data-v-dfbd9fb8><div class="outline-marker" data-v-dfbd9fb8></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-dfbd9fb8>On this page</div><ul class="VPDocOutlineItem root" data-v-dfbd9fb8 data-v-da421f78><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-79cae1a0></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ef3a4dda><div class="content-container" data-v-ef3a4dda><!--[--><!--]--><main class="main" data-v-ef3a4dda><div style="position:relative;" class="vp-doc _document_plugin_danmuku" data-v-ef3a4dda><div><h1 id="弹幕库" tabindex="-1">弹幕库 <a class="header-anchor" href="#弹幕库" aria-label="Permalink to &quot;弹幕库&quot;">​</a></h1><h2 id="演示" tabindex="-1">演示 <a class="header-anchor" href="#演示" aria-label="Permalink to &quot;演示&quot;">​</a></h2><p>👉 <a href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&amp;example=danmuku" target="_blank" rel="noreferrer">查看完整演示</a></p><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-D9jx4" id="tab-KS42MSM" checked><label data-title="npm" for="tab-KS42MSM">npm</label><input type="radio" name="group-D9jx4" id="tab-BtruepB"><label data-title="yarn" for="tab-BtruepB">yarn</label><input type="radio" name="group-D9jx4" id="tab-XQtvzKT"><label data-title="pnpm" for="tab-XQtvzKT">pnpm</label><input type="radio" name="group-D9jx4" id="tab-FIRZ9QK"><label data-title="script" for="tab-FIRZ9QK">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer-plugin-danmuku.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1">CDN <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;CDN&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-7kCl2" id="tab-b07Jg39" checked><label data-title="jsdelivr.net" for="tab-b07Jg39">jsdelivr.net</label><input type="radio" name="group-7kCl2" id="tab-G03d6W3"><label data-title="unpkg.com" for="tab-G03d6W3">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="弹幕结构" tabindex="-1">弹幕结构 <a class="header-anchor" href="#弹幕结构" aria-label="Permalink to &quot;弹幕结构&quot;">​</a></h2><p>每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要<code>text</code>就可以发送一个弹幕，其余都是非必要参数</p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
+    <div id="app"><div class="Layout" data-v-c4daae71><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17ad389b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-17ad389b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c4daae71 data-v-a46e73f0><div class="VPNavBar" data-v-a46e73f0 data-v-bb7529ee><div class="wrapper" data-v-bb7529ee><div class="container" data-v-bb7529ee><div class="title" data-v-bb7529ee><div class="VPNavBarTitle has-sidebar" data-v-bb7529ee data-v-5622a072><a class="title" href="/document/" data-v-5622a072><!--[--><!--]--><!--[--><img class="VPImage logo" src="/document/logo.png" alt data-v-4d414b82><!--]--><span data-v-5622a072>Artplayer.js</span><!--[--><!--]--></a></div></div><div class="content" data-v-bb7529ee><div class="content-body" data-v-bb7529ee><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bb7529ee><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><span class="DocSearch-Button-Key">Meta</span><span class="DocSearch-Button-Key">K</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-bb7529ee data-v-5bacfe89><span id="main-nav-aria-label" class="visually-hidden" data-v-5bacfe89> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>中文版</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/document/en/" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>English Docs</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>Online Editor</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://artplayer.org/llms.txt" target="_blank" rel="noreferrer" tabindex="0" data-v-5bacfe89 data-v-8dbce4d0><!--[--><span data-v-8dbce4d0>🤖LLMs</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-5bacfe89 data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-40e55da0><span class="text" data-v-40e55da0><!----><span data-v-40e55da0>5.3.x</span><span class="vpi-chevron-down text-icon" data-v-40e55da0></span></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><div class="items" data-v-39eca401><!--[--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Changelog</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-39eca401 data-v-65e4a6b1><a class="VPLink link vp-external-link-icon" href="https://github.com/zhw2590582/ArtPlayer#donations" target="_blank" rel="noreferrer" data-v-65e4a6b1><!--[--><span data-v-65e4a6b1>Donation</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bb7529ee data-v-123fcb2f><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-123fcb2f data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bb7529ee data-v-08b35e6f data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bb7529ee data-v-0c845e5d data-v-40e55da0><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-40e55da0><span class="vpi-more-horizontal icon" data-v-40e55da0></span></button><div class="menu" data-v-40e55da0><div class="VPMenu" data-v-40e55da0 data-v-39eca401><!----><!--[--><!--[--><!----><div class="group" data-v-0c845e5d><div class="item appearance" data-v-0c845e5d><p class="label" data-v-0c845e5d>Appearance</p><div class="appearance-action" data-v-0c845e5d><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="true" data-v-0c845e5d data-v-fa1daf57 data-v-7012e5dd><span class="check" data-v-7012e5dd><span class="icon" data-v-7012e5dd><!--[--><span class="vpi-sun sun" data-v-fa1daf57></span><span class="vpi-moon moon" data-v-fa1daf57></span><!--]--></span></span></button></div></div></div><div class="group" data-v-0c845e5d><div class="item social-links" data-v-0c845e5d><div class="VPSocialLinks social-links-list" data-v-0c845e5d data-v-f2234a39><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zhw2590582/ArtPlayer" aria-label="github" target="_blank" rel="noopener" data-v-f2234a39 data-v-fbf39218><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-bb7529ee data-v-670493dd><span class="container" data-v-670493dd><span class="top" data-v-670493dd></span><span class="middle" data-v-670493dd></span><span class="bottom" data-v-670493dd></span></span></button></div></div></div></div><div class="divider" data-v-bb7529ee><div class="divider-line" data-v-bb7529ee></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-c4daae71 data-v-9d8129cc><div class="container" data-v-9d8129cc><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-9d8129cc><span class="vpi-align-left menu-icon" data-v-9d8129cc></span><span class="menu-text" data-v-9d8129cc>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-9d8129cc data-v-d61422fe><button data-v-d61422fe>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-c4daae71 data-v-12a40e3d><div class="curtain" data-v-12a40e3d></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-12a40e3d><span class="visually-hidden" id="sidebar-aria-label" data-v-12a40e3d> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>开始</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>安装使用</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/option.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>基础选项</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/start/i18n.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>语言设置</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>组件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/layers.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>业务层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/controls.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>控制器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/contextmenu.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>右键菜单</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/component/setting.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>设置面板</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>高级</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/property.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/built-in.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>高级属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/class.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>静态属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/global.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>全局属性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/event.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>实例事件</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/advanced/plugin.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>编写插件</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0 has-active" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>插件</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link link" href="/document/plugin/danmuku.html" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>🎉 弹幕库</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&amp;example=danmuku.mask" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>弹幕遮罩</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&amp;example=ads" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&amp;example=iframe" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Iframe 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&amp;example=hls.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>HLS 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&amp;example=dash.control" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>DASH 控制</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&amp;example=vtt.thumbnail" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VTT 缩略图</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&amp;example=multiple.subtitles" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>多重字幕</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&amp;example=jassub" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>ASS 字幕 - JASSUB</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&amp;example=chromecast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Chromecast</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&amp;example=vast" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>VAST 广告</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&amp;example=chapter" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频章节</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&amp;example=ambilight" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>视频背光</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&amp;example=document.pip" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>文档画中画</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&amp;example=audio.track" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>独立音轨</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>第三方库</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&amp;example=hls" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>hls.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&amp;example=flv" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>flv.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&amp;example=dash" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>dash.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&amp;example=mpegts" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>mpegts.js</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&amp;example=webtorrent" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>webtorrent.js</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-ec086cd5><section class="VPSidebarItem level-0" data-v-ec086cd5 data-v-2e0476bc><div class="item" role="button" tabindex="0" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><h2 class="text" data-v-2e0476bc>代理</h2><!----></div><div class="items" data-v-2e0476bc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&amp;example=canvas" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Canvas</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-2e0476bc data-v-2e0476bc><div class="item" data-v-2e0476bc><div class="indicator" data-v-2e0476bc></div><a class="VPLink link vp-external-link-icon link" href="https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&amp;example=mediabunny" target="_blank" rel="noreferrer" data-v-2e0476bc><!--[--><p class="text" data-v-2e0476bc>Mediabunny</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-c4daae71 data-v-d2aef184><div class="VPDoc has-sidebar has-aside" data-v-d2aef184 data-v-ef3a4dda><!--[--><!--]--><div class="container" data-v-ef3a4dda><div class="aside" data-v-ef3a4dda><div class="aside-curtain" data-v-ef3a4dda></div><div class="aside-container" data-v-ef3a4dda><div class="aside-content" data-v-ef3a4dda><div class="VPDocAside" data-v-ef3a4dda data-v-79cae1a0><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-79cae1a0 data-v-dfbd9fb8><div class="content" data-v-dfbd9fb8><div class="outline-marker" data-v-dfbd9fb8></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-dfbd9fb8>On this page</div><ul class="VPDocOutlineItem root" data-v-dfbd9fb8 data-v-da421f78><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-79cae1a0></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ef3a4dda><div class="content-container" data-v-ef3a4dda><!--[--><!--]--><main class="main" data-v-ef3a4dda><div style="position:relative;" class="vp-doc _document_plugin_danmuku" data-v-ef3a4dda><div><h1 id="弹幕库" tabindex="-1">弹幕库 <a class="header-anchor" href="#弹幕库" aria-label="Permalink to &quot;弹幕库&quot;">​</a></h1><h2 id="演示" tabindex="-1">演示 <a class="header-anchor" href="#演示" aria-label="Permalink to &quot;演示&quot;">​</a></h2><p>👉 <a href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&amp;example=danmuku" target="_blank" rel="noreferrer">查看完整演示</a></p><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-9b-Cj" id="tab-LkD8Rrg" checked><label data-title="npm" for="tab-LkD8Rrg">npm</label><input type="radio" name="group-9b-Cj" id="tab-59CrnTZ"><label data-title="yarn" for="tab-59CrnTZ">yarn</label><input type="radio" name="group-9b-Cj" id="tab-pxugZU_"><label data-title="pnpm" for="tab-pxugZU_">pnpm</label><input type="radio" name="group-9b-Cj" id="tab-s_jUgft"><label data-title="script" for="tab-s_jUgft">script</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> artplayer-plugin-danmuku</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-html vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> src</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;path/to/artplayer-plugin-danmuku.js&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="cdn" tabindex="-1">CDN <a class="header-anchor" href="#cdn" aria-label="Permalink to &quot;CDN&quot;">​</a></h2><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-3ZK7f" id="tab-kIMJdgE" checked><label data-title="jsdelivr.net" for="tab-kIMJdgE">jsdelivr.net</label><input type="radio" name="group-3ZK7f" id="tab-TCCj7Bb"><label data-title="unpkg.com" for="tab-TCCj7Bb">unpkg.com</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://cdn.jsdelivr.net/npm/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">https://unpkg.com/artplayer-plugin-danmuku/dist/artplayer-plugin-danmuku.js</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><h2 id="弹幕结构" tabindex="-1">弹幕结构 <a class="header-anchor" href="#弹幕结构" aria-label="Permalink to &quot;弹幕结构&quot;">​</a></h2><p>每一个弹幕是一个对象，多个弹幕组成的数组就是弹幕库，通常只需要<code>text</code>就可以发送一个弹幕，其余都是非必要参数</p><div class="language-js vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
 <span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    text</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 弹幕文本</span></span>
 <span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    time</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">10</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 弹幕时间, 默认为当前播放器时间</span></span>
 <span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    mode</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 弹幕模式: 0: 滚动(默认)，1: 顶部，2: 底部</span></span>
@@ -367,7 +367,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">art.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;artplayerPluginDanmuku:destroy&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;弹幕销毁&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/plugin/danmuku.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2024-12-15T13:56:31.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/advanced/plugin.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>编写插件</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link vp-external-link-icon pager-link next" href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&amp;example=danmuku.mask" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>弹幕遮罩</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/start/i18n.html b/docs/document/start/i18n.html
index eb8908384..7dc47c456 100644
--- a/docs/document/start/i18n.html
+++ b/docs/document/start/i18n.html
@@ -13,7 +13,7 @@
     <link rel="preload" href="/document/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
     <link rel="modulepreload" href="/document/assets/chunks/theme.DwvAHEyX.js">
     <link rel="modulepreload" href="/document/assets/chunks/framework.xxfEszSJ.js">
-    <link rel="modulepreload" href="/document/assets/start_i18n.md.B0XPxv4h.lean.js">
+    <link rel="modulepreload" href="/document/assets/start_i18n.md.C6dAnYSp.lean.js">
     <script src="/document/main.js"></script>
     <link rel="stylesheet" href="/document/style.css">
     <link rel="shortcut icon" href="/document/favicon.ico">
@@ -27,7 +27,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    container: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;.artplayer-app&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/assets/sample/video.mp4&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line highlighted"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    lang: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;zh-cn&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// or &#39;en&#39;</span></span>
-<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="导入语言" tabindex="-1">导入语言 <a class="header-anchor" href="#导入语言" aria-label="Permalink to &quot;导入语言&quot;">​</a></h2><p>打包前的语言文件存放于: <code>artplayer/src/i18n/*.js</code>, 欢迎来添加你的语言</p><p>打包后的语言文件存放于: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-NA9u6" id="tab-lo0uwTZ" checked><label data-title="import" for="tab-lo0uwTZ">import</label><input type="radio" name="group-NA9u6" id="tab-MoqQ4Uu"><label data-title="script" for="tab-MoqQ4Uu">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h2 id="导入语言" tabindex="-1">导入语言 <a class="header-anchor" href="#导入语言" aria-label="Permalink to &quot;导入语言&quot;">​</a></h2><p>打包前的语言文件存放于: <code>artplayer/src/i18n/*.js</code>, 欢迎来添加你的语言</p><p>打包后的语言文件存放于: <code>artplayer/dist/i18n/*.js</code></p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-FMc8Y" id="tab-KBTz-n3" checked><label data-title="import" for="tab-KBTz-n3">import</label><input type="radio" name="group-FMc8Y" id="tab-mo4iUSt"><label data-title="script" for="tab-mo4iUSt">script</label></div><div class="blocks"><div class="language-js vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/id&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> zhTw </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;artplayer/i18n/zh-tw&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> art </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Artplayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
@@ -75,7 +75,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        },</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    },</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/start/i18n.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-09-06T05:48:25.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/start/option.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>基础选项</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/component/layers.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>业务层</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/document/start/option.html b/docs/document/start/option.html
index 9063a57ea..66bde2451 100644
--- a/docs/document/start/option.html
+++ b/docs/document/start/option.html
@@ -415,7 +415,7 @@
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/assets/sample/video.mp4&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
 <span class="line highlighted"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">    proxy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> document.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">createElement</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;video&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
 <span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-ef3a4dda data-v-07d71ff1><!--[--><!--]--><div class="edit-info" data-v-07d71ff1><div class="edit-link" data-v-07d71ff1><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/start/option.md" target="_blank" rel="noreferrer" data-v-07d71ff1><!--[--><span class="vpi-square-pen edit-link-icon" data-v-07d71ff1></span> Edit this page on GitHub<!--]--></a></div><div class="last-updated" data-v-07d71ff1><p class="VPLastUpdated" data-v-07d71ff1 data-v-e95db471>Last updated: <time datetime="2025-11-29T14:12:38.000Z" data-v-e95db471></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-07d71ff1><span class="visually-hidden" id="doc-footer-aria-label" data-v-07d71ff1>Pager</span><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link prev" href="/document/" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Previous page</span><span class="title" data-v-07d71ff1>安装使用</span><!--]--></a></div><div class="pager" data-v-07d71ff1><a class="VPLink link pager-link next" href="/document/start/i18n.html" data-v-07d71ff1><!--[--><span class="desc" data-v-07d71ff1>Next page</span><span class="title" data-v-07d71ff1>语言设置</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"CYpcDsY6\",\"en_start_i18n.md\":\"x4tw6CvN\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"B8NxRV94\",\"plugin_danmuku.md\":\"C7LHV45A\",\"start_i18n.md\":\"B0XPxv4h\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"advanced_built-in.md\":\"DbXkhR8l\",\"advanced_class.md\":\"BE9Wp7q6\",\"advanced_event.md\":\"DoIgqIU9\",\"advanced_global.md\":\"Db4VcykV\",\"advanced_plugin.md\":\"CVp3Oe2x\",\"advanced_property.md\":\"C_nOKniE\",\"component_contextmenu.md\":\"lsIURdc3\",\"component_controls.md\":\"CKAl0l5Z\",\"component_layers.md\":\"D34Y4OkH\",\"component_setting.md\":\"BwCpY3NU\",\"en_advanced_built-in.md\":\"DWw_qKdn\",\"en_advanced_class.md\":\"bWhe2FDl\",\"en_advanced_event.md\":\"igITY2FO\",\"en_advanced_global.md\":\"Bj0Agjzd\",\"en_advanced_plugin.md\":\"IXiFhAGS\",\"en_advanced_property.md\":\"DQzShb4B\",\"en_component_contextmenu.md\":\"3nvb8CSX\",\"en_component_controls.md\":\"s1SJ4fZd\",\"en_component_layers.md\":\"wLZPKN9j\",\"en_component_setting.md\":\"eqeWyMDt\",\"en_index.md\":\"DrOcPBwp\",\"en_start_i18n.md\":\"DAxrpMQL\",\"en_start_option.md\":\"CuY4IYWk\",\"index.md\":\"WcEL7IA5\",\"plugin_danmuku.md\":\"D580Az0s\",\"start_i18n.md\":\"C6dAnYSp\",\"start_option.md\":\"DRwrMHeQ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Artplayer.js\",\"description\":\"ArtPlayer.js is a modern and full featured HTML5 video player\",\"base\":\"/document/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"siteTitle\":\"Artplayer.js\",\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"中文版\",\"link\":\"/\"},{\"text\":\"English Docs\",\"link\":\"/en/\",\"activeMatch\":\"/en/\"},{\"text\":\"Online Editor\",\"link\":\"https://artplayer.org\"},{\"text\":\"🤖LLMs\",\"link\":\"https://artplayer.org/llms.txt\"},{\"text\":\"5.3.x\",\"items\":[{\"text\":\"Changelog\",\"link\":\"https://github.com/zhw2590582/ArtPlayer/blob/master/CHANGELOG.md\"},{\"text\":\"Donation\",\"link\":\"https://github.com/zhw2590582/ArtPlayer#donations\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zhw2590582/ArtPlayer\"}],\"sidebar\":{\"/\":[{\"text\":\"开始\",\"collapsible\":true,\"items\":[{\"text\":\"安装使用\",\"link\":\"/\"},{\"text\":\"基础选项\",\"link\":\"/start/option\"},{\"text\":\"语言设置\",\"link\":\"/start/i18n\"}]},{\"text\":\"组件\",\"collapsible\":true,\"items\":[{\"text\":\"业务层\",\"link\":\"/component/layers\"},{\"text\":\"控制器\",\"link\":\"/component/controls\"},{\"text\":\"右键菜单\",\"link\":\"/component/contextmenu\"},{\"text\":\"设置面板\",\"link\":\"/component/setting\"}]},{\"text\":\"高级\",\"collapsible\":true,\"items\":[{\"text\":\"实例属性\",\"link\":\"/advanced/property\"},{\"text\":\"高级属性\",\"link\":\"/advanced/built-in\"},{\"text\":\"静态属性\",\"link\":\"/advanced/class\"},{\"text\":\"全局属性\",\"link\":\"/advanced/global\"},{\"text\":\"实例事件\",\"link\":\"/advanced/event\"},{\"text\":\"编写插件\",\"link\":\"/advanced/plugin\"}]},{\"text\":\"插件\",\"collapsible\":true,\"items\":[{\"text\":\"🎉 弹幕库\",\"link\":\"/plugin/danmuku\"},{\"text\":\"弹幕遮罩\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask\"},{\"text\":\"视频广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe 控制\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH 控制\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT 缩略图\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"多重字幕\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS 字幕 - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST 广告\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"视频章节\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"视频背光\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"文档画中画\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"独立音轨\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"第三方库\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"代理\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}],\"/en/\":[{\"text\":\"Quick start\",\"collapsible\":true,\"items\":[{\"text\":\"Install\",\"link\":\"/en/\"},{\"text\":\"Option\",\"link\":\"/en/start/option\"},{\"text\":\"Language\",\"link\":\"/en/start/i18n\"}]},{\"text\":\"Component\",\"collapsible\":true,\"items\":[{\"text\":\"Layers\",\"link\":\"/en/component/layers\"},{\"text\":\"Controls\",\"link\":\"/en/component/controls\"},{\"text\":\"Contextmenu\",\"link\":\"/en/component/contextmenu\"},{\"text\":\"Setting\",\"link\":\"/en/component/setting\"}]},{\"text\":\"Advanced\",\"collapsible\":true,\"items\":[{\"text\":\"Instance Property\",\"link\":\"/en/advanced/property\"},{\"text\":\"Advanced Property\",\"link\":\"/en/advanced/built-in\"},{\"text\":\"Static Property\",\"link\":\"/en/advanced/class\"},{\"text\":\"Global Property\",\"link\":\"/en/advanced/global\"},{\"text\":\"Instance Event\",\"link\":\"/en/advanced/event\"},{\"text\":\"Writing Plugin\",\"link\":\"/en/advanced/plugin\"}]},{\"text\":\"Plugins\",\"collapsible\":true,\"items\":[{\"text\":\"Advertise\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads\"},{\"text\":\"Iframe Control\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe\"},{\"text\":\"HLS Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js%0A./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control\"},{\"text\":\"DASH Control\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control\"},{\"text\":\"VTT Thumbnail\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail\"},{\"text\":\"Multiple Subtitles\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles\"},{\"text\":\"ASS Subtitle - JASSUB\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub\"},{\"text\":\"Chromecast\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast\"},{\"text\":\"VAST\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast\"},{\"text\":\"Video Chapters\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter\"},{\"text\":\"Video Ambilight\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight\"},{\"text\":\"Document PIP\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip\"},{\"text\":\"Audio Track\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track\"}]},{\"text\":\"Libraries\",\"collapsible\":true,\"items\":[{\"text\":\"hls.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls\"},{\"text\":\"flv.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv\"},{\"text\":\"dash.js\",\"link\":\"https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash\"},{\"text\":\"mpegts.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts\"},{\"text\":\"webtorrent.js\",\"link\":\"https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent\"}]},{\"text\":\"Proxys\",\"collapsible\":true,\"items\":[{\"text\":\"Canvas\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas\"},{\"text\":\"Mediabunny\",\"link\":\"https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny\"}]}]},\"editLink\":{\"pattern\":\"https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-vitepress/docs/:path\",\"text\":\"Edit this page on GitHub\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/uncompiled/artplayer-plugin-websr/index.js b/docs/uncompiled/artplayer-plugin-websr/index.js
index 495e47124..82322e33d 100644
--- a/docs/uncompiled/artplayer-plugin-websr/index.js
+++ b/docs/uncompiled/artplayer-plugin-websr/index.js
@@ -209,15 +209,16 @@
   }
 })({"fIfgU":[function(require,module,exports,__globalThis) {
 var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
-parcelHelpers.defineInteropFlag(exports);
-parcelHelpers.export(exports, "default", ()=>artplayerPluginWebsr);
-var _upscaler = require("./Upscaler");
-var _upscalerDefault = parcelHelpers.interopDefault(_upscaler);
+var _upscalerJs = require("./Upscaler.js");
+var _upscalerJsDefault = parcelHelpers.interopDefault(_upscalerJs);
 function artplayerPluginWebsr(option = {
     networkSize: "medium",
-    compare: false
+    compare: false,
+    weightsBaseUrl: "/weights",
+    workerUrl: "/worker/main.js",
+    videoScale: 2
 }) {
-    return async (art)=>{
+    return (art)=>{
         const { $video, $player } = art.template;
         const $canvas = document.createElement("canvas");
         $player.appendChild($canvas);
@@ -227,6 +228,8 @@ function artplayerPluginWebsr(option = {
         $canvas.style.top = "50%";
         $canvas.style.left = "50%";
         $canvas.style.transform = "translate(-50%, -50%)";
+        $canvas.style.opacity = "0";
+        $canvas.style.transition = "opacity 0.2s ease";
         function calcCanvasSize() {
             const videoElement = art.video;
             const containerWidth = $player.offsetWidth || 640;
@@ -243,27 +246,65 @@ function artplayerPluginWebsr(option = {
                 displayHeight
             };
         }
-        const upscaler = new (0, _upscalerDefault.default)(option);
-        upscaler.init();
-        await upscaler.startRealtimeUpscale($video, $canvas, option.networkSize);
-        // 初始化 canvas 显示尺寸
+        if (!(0, _upscalerJsDefault.default) || !(0, _upscalerJsDefault.default).isSupported || !(0, _upscalerJsDefault.default).isSupported()) {
+            console.warn("Upscaler is not supported in this environment");
+            return;
+        }
+        const upscaler = new (0, _upscalerJsDefault.default)({
+            networkSize: option.networkSize || "medium",
+            weightsBaseUrl: option.weightsBaseUrl || "/weights",
+            workerUrl: option.workerUrl || "/worker/main.js",
+            videoScale: option.videoScale || 2
+        });
+        let realtimeStarted = false;
+        async function startRealtime() {
+            if (realtimeStarted) return;
+            realtimeStarted = true;
+            try {
+                await new Promise((resolve, reject)=>{
+                    if ($video.readyState >= 1) {
+                        resolve();
+                        return;
+                    }
+                    const onLoaded = ()=>{
+                        cleanup();
+                        resolve();
+                    };
+                    const onError = ()=>{
+                        cleanup();
+                        reject(new Error("Failed to load video metadata"));
+                    };
+                    const cleanup = ()=>{
+                        $video.removeEventListener("loadedmetadata", onLoaded);
+                        $video.removeEventListener("error", onError);
+                    };
+                    $video.addEventListener("loadedmetadata", onLoaded);
+                    $video.addEventListener("error", onError);
+                });
+                await upscaler.startRealtimeUpscale($video, $canvas, option.networkSize || upscaler.networkSize);
+                requestAnimationFrame(()=>{
+                    $canvas.style.opacity = "1";
+                });
+            } catch (e) {
+                console.error("artplayer-plugin-upscaler: failed to start realtime", e);
+            }
+        }
         const { displayWidth, displayHeight } = calcCanvasSize();
         $canvas.style.width = displayWidth + "px";
         $canvas.style.height = displayHeight + "px";
-        // 对比模式
         let comparePosition = 50;
         let isDragging = false;
-        // 创建对比手柄
+        let compareEnabled = !!option.compare;
         const $handler = document.createElement("div");
         $handler.style.position = "absolute";
         $handler.style.width = "3px";
-        $handler.style.backgroundColor = "rgba(255, 255, 255, 0.5)";
+        $handler.style.backgroundColor = "rgba(255, 255, 255, 0.75)";
         $handler.style.cursor = "ew-resize";
         $handler.style.zIndex = "12";
         $handler.style.pointerEvents = "auto";
-        $handler.style.display = option.compare ? "block" : "none";
-        $handler.style.boxShadow = "0 0 4px rgba(0, 0, 0, 0.1)";
-        if (option.compare) {
+        $handler.style.display = compareEnabled ? "block" : "none";
+        $handler.style.boxShadow = "0 0 2px rgba(0, 0, 0, 0.1)";
+        if (compareEnabled) {
             $player.appendChild($handler);
             $handler.addEventListener("mousedown", handleMouseDown);
             document.addEventListener("mousemove", handleMouseMove);
@@ -271,7 +312,7 @@ function artplayerPluginWebsr(option = {
             updateCompareMask();
         }
         function updateCompareMask() {
-            if (option.compare) {
+            if (compareEnabled) {
                 const { displayWidth, displayHeight } = calcCanvasSize();
                 const gradient = `linear-gradient(to right, transparent 0%, transparent ${comparePosition}%, black ${comparePosition}%, black 100%)`;
                 $canvas.style.maskImage = gradient;
@@ -287,10 +328,10 @@ function artplayerPluginWebsr(option = {
             } else $canvas.style.maskImage = "none";
         }
         function handleMouseDown(e) {
-            if (option.compare) isDragging = true;
+            if (compareEnabled) isDragging = true;
         }
         function handleMouseMove(e) {
-            if (option.compare && isDragging) {
+            if (compareEnabled && isDragging) {
                 const rect = $player.getBoundingClientRect();
                 const { displayWidth } = calcCanvasSize();
                 const containerWidth = $player.offsetWidth || 640;
@@ -306,7 +347,7 @@ function artplayerPluginWebsr(option = {
             isDragging = false;
         }
         art.on("destroy", ()=>{
-            upscaler.dispose();
+            if (upscaler && typeof upscaler.dispose === "function") upscaler.dispose();
             $handler.removeEventListener("mousedown", handleMouseDown);
             document.removeEventListener("mousemove", handleMouseMove);
             document.removeEventListener("mouseup", handleMouseUp);
@@ -317,14 +358,48 @@ function artplayerPluginWebsr(option = {
             $canvas.style.height = displayHeight + "px";
             updateCompareMask();
         });
+        art.on("play", ()=>{
+            startRealtime();
+        });
+        function update(newOption = {}) {
+            if (!newOption || typeof newOption !== "object") return;
+            if (Object.prototype.hasOwnProperty.call(newOption, "compare")) {
+                const nextCompare = !!newOption.compare;
+                option.compare = nextCompare;
+                compareEnabled = nextCompare;
+                if (compareEnabled) {
+                    if (!$handler.parentNode) $player.appendChild($handler);
+                    $handler.style.display = "block";
+                    $handler.addEventListener("mousedown", handleMouseDown);
+                    document.addEventListener("mousemove", handleMouseMove);
+                    document.addEventListener("mouseup", handleMouseUp);
+                    updateCompareMask();
+                } else {
+                    $canvas.style.maskImage = "none";
+                    $handler.style.display = "none";
+                    $handler.removeEventListener("mousedown", handleMouseDown);
+                    document.removeEventListener("mousemove", handleMouseMove);
+                    document.removeEventListener("mouseup", handleMouseUp);
+                }
+            }
+            if (newOption.networkSize) {
+                const nextSize = newOption.networkSize;
+                option.networkSize = nextSize;
+                if (upscaler && typeof upscaler.stopRealtimeUpscale === "function") upscaler.stopRealtimeUpscale();
+                realtimeStarted = false;
+                if (!art.paused) startRealtime();
+            }
+        }
         return {
-            name: "artplayerPluginWebsr"
+            name: "artplayerPluginWebsr",
+            upscaler,
+            update
         };
     };
 }
-if (typeof window !== "undefined") window.artplayerPluginWebsr = artplayerPluginWebsr;
+window.artplayerPluginWebsr = artplayerPluginWebsr;
 
-},{"./Upscaler":"d22Rz","@parcel/transformer-js/src/esmodule-helpers.js":"8oCsH"}],"d22Rz":[function(require,module,exports,__globalThis) {
+},{"./Upscaler.js":"d22Rz","@parcel/transformer-js/src/esmodule-helpers.js":"8oCsH"}],"d22Rz":[function(require,module,exports,__globalThis) {
 var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
 parcelHelpers.defineInteropFlag(exports);
 class Upscaler {
@@ -370,8 +445,8 @@ class Upscaler {
                 weightsUrl: `${weightsBaseUrl}/cnn-28.json`
             }
         };
-        this.networkSize = options.networkSize || "medium";
         this.weightsBaseUrl = weightsBaseUrl;
+        this.networkSize = options.networkSize || "medium";
         this.workerUrl = options.workerUrl || "/worker/main.js";
         this.timeouts = {
             ...Upscaler.DEFAULT_TIMEOUTS,
@@ -390,6 +465,7 @@ class Upscaler {
         this.processingType = null;
         this.realtimeLoopId = null;
         this.realtimeState = null;
+        this.init();
     }
     init({ prewarm = true } = {}) {
         if (!Upscaler.isSupported()) throw new Error("Upscaler is not supported in this environment");
@@ -424,6 +500,7 @@ class Upscaler {
     }
     handleWorkerMessage(event) {
         const { data } = event;
+        console.debug("Worker message:", data);
         if (!data.cmd) return;
         const { cmd } = data;
         if (cmd === "progress") {
@@ -644,18 +721,27 @@ class Upscaler {
         const width = videoElement.videoWidth;
         const height = videoElement.videoHeight;
         if (!width || !height) throw new Error("Invalid video dimensions");
-        canvasElement.width = width * scale;
-        canvasElement.height = height * scale;
-        if (typeof canvasElement.transferControlToOffscreen !== "function") throw new Error("OffscreenCanvas is not supported in this environment");
-        const offscreen = canvasElement.transferControlToOffscreen();
+        const firstInit = !canvasElement._upscalerTransferred;
+        let offscreen = null;
+        if (firstInit) {
+            canvasElement.width = width * scale;
+            canvasElement.height = height * scale;
+            if (typeof canvasElement.transferControlToOffscreen !== "function") throw new Error("OffscreenCanvas is not supported in this environment");
+            offscreen = canvasElement.transferControlToOffscreen();
+            canvasElement._upscalerTransferred = true;
+        }
+        const captureCanvas = document.createElement("canvas");
+        captureCanvas.width = width;
+        captureCanvas.height = height;
+        const captureCtx = captureCanvas.getContext("2d");
         if (this.realtimeLoopId) {
             cancelAnimationFrame(this.realtimeLoopId);
             this.realtimeLoopId = null;
         }
-        this.getWorker().postMessage({
+        const initPayload = {
             cmd: "realtimeInit",
             data: {
-                upscaled: offscreen,
+                upscaled: firstInit ? offscreen : null,
                 resolution: {
                     width,
                     height,
@@ -666,25 +752,34 @@ class Upscaler {
                 network_name: network.name,
                 weights
             }
-        }, [
+        };
+        if (firstInit && offscreen) this.getWorker().postMessage(initPayload, [
             offscreen
         ]);
+        else this.getWorker().postMessage(initPayload);
         this.realtimeState = {
             running: true,
             video: videoElement,
             canvas: canvasElement,
             scale,
             busy: false,
-            frameIndex: 0
+            frameIndex: 0,
+            captureCanvas,
+            captureCtx
         };
         const loop = async ()=>{
             if (!this.realtimeState || !this.realtimeState.running) return;
             const state = this.realtimeState;
             const v = state.video;
-            if (!v.paused && !v.ended && !state.busy) {
+            const haveCurrentData = v.HAVE_CURRENT_DATA || 2;
+            if (!v.paused && !v.ended && !state.busy && v.readyState >= haveCurrentData && v.videoWidth > 0 && v.videoHeight > 0) {
                 state.busy = true;
                 try {
-                    const frame = await createImageBitmap(v);
+                    const captureCanvas = state.captureCanvas;
+                    const captureCtx = state.captureCtx;
+                    if (!captureCanvas || !captureCtx) throw new Error("Missing capture canvas");
+                    captureCtx.drawImage(v, 0, 0, captureCanvas.width, captureCanvas.height);
+                    const frame = await createImageBitmap(captureCanvas);
                     state.frameIndex += 1;
                     this.getWorker().postMessage({
                         cmd: "realtimeFrame",
diff --git a/docs/uncompiled/artplayer-plugin-websr/index.js.map b/docs/uncompiled/artplayer-plugin-websr/index.js.map
index 125b271b3..62db5cca8 100644
--- a/docs/uncompiled/artplayer-plugin-websr/index.js.map
+++ b/docs/uncompiled/artplayer-plugin-websr/index.js.map
@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CAEwB;AAFxB;;AAEe,SAAS,qBACpB,SAAS;IACL,aAAa;IACb,SAAS;AACb,CAAC;IAED,OAAO,OAAO;QACV,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,QAAQ;QAExC,MAAM,UAAU,SAAS,aAAa,CAAC;QACvC,QAAQ,WAAW,CAAC;QAEpB,QAAQ,KAAK,CAAC,QAAQ,GAAG;QACzB,QAAQ,KAAK,CAAC,MAAM,GAAG;QACvB,QAAQ,KAAK,CAAC,aAAa,GAAG;QAC9B,QAAQ,KAAK,CAAC,GAAG,GAAG;QACpB,QAAQ,KAAK,CAAC,IAAI,GAAG;QACrB,QAAQ,KAAK,CAAC,SAAS,GAAG;QAE1B,SAAS;YACL,MAAM,eAAe,IAAI,KAAK;YAC9B,MAAM,iBAAiB,QAAQ,WAAW,IAAI;YAC9C,MAAM,kBAAkB,QAAQ,YAAY,IAAI;YAChD,MAAM,aAAa,aAAa,UAAU,IAAI;YAC9C,MAAM,cAAc,aAAa,WAAW,IAAI;YAChD,MAAM,cAAc,aAAa;YACjC,IAAI,eAAe;YACnB,IAAI,gBAAgB;YACpB,IAAI,iBAAiB,kBAAkB,aACnC,eAAe,kBAAkB;iBAEjC,gBAAgB,iBAAiB;YAErC,OAAO;gBAAE;gBAAc;YAAc;QACzC;QAEA,MAAM,WAAW,IAAI,CAAA,GAAA,wBAAQ,AAAD,EAAE;QAC9B,SAAS,IAAI;QACb,MAAM,SAAS,oBAAoB,CAC/B,QACA,SACA,OAAO,WAAW;QAGtB,kBAAkB;QAClB,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG;QACxC,QAAQ,KAAK,CAAC,KAAK,GAAG,eAAe;QACrC,QAAQ,KAAK,CAAC,MAAM,GAAG,gBAAgB;QAEvC,OAAO;QACP,IAAI,kBAAkB;QACtB,IAAI,aAAa;QAEjB,SAAS;QACT,MAAM,WAAW,SAAS,aAAa,CAAC;QACxC,SAAS,KAAK,CAAC,QAAQ,GAAG;QAC1B,SAAS,KAAK,CAAC,KAAK,GAAG;QACvB,SAAS,KAAK,CAAC,eAAe,GAAG;QACjC,SAAS,KAAK,CAAC,MAAM,GAAG;QACxB,SAAS,KAAK,CAAC,MAAM,GAAG;QACxB,SAAS,KAAK,CAAC,aAAa,GAAG;QAC/B,SAAS,KAAK,CAAC,OAAO,GAAG,OAAO,OAAO,GAAG,UAAU;QACpD,SAAS,KAAK,CAAC,SAAS,GAAG;QAE3B,IAAI,OAAO,OAAO,EAAE;YAChB,QAAQ,WAAW,CAAC;YACpB,SAAS,gBAAgB,CAAC,aAAa;YACvC,SAAS,gBAAgB,CAAC,aAAa;YACvC,SAAS,gBAAgB,CAAC,WAAW;YACrC;QACJ;QAEA,SAAS;YACL,IAAI,OAAO,OAAO,EAAE;gBAChB,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG;gBACxC,MAAM,WAAW,CAAC,sDAAsD,EAAE,gBAAgB,SAAS,EAAE,gBAAgB,cAAc,CAAC;gBACpI,QAAQ,KAAK,CAAC,SAAS,GAAG;gBAE1B,MAAM,iBAAiB,QAAQ,WAAW,IAAI;gBAC9C,MAAM,kBAAkB,QAAQ,YAAY,IAAI;gBAChD,MAAM,aAAa,AAAC,CAAA,iBAAiB,YAAW,IAAK;gBACrD,MAAM,YAAY,AAAC,CAAA,kBAAkB,aAAY,IAAK;gBACtD,MAAM,WACF,aAAa,AAAC,eAAe,kBAAmB;gBAEpD,SAAS,KAAK,CAAC,GAAG,GAAG,YAAY;gBACjC,SAAS,KAAK,CAAC,IAAI,GAAG,WAAW;gBACjC,SAAS,KAAK,CAAC,MAAM,GAAG,gBAAgB;gBACxC,SAAS,KAAK,CAAC,SAAS,GAAG;YAC/B,OACI,QAAQ,KAAK,CAAC,SAAS,GAAG;QAElC;QAEA,SAAS,gBAAgB,CAAC;YACtB,IAAI,OAAO,OAAO,EACd,aAAa;QAErB;QAEA,SAAS,gBAAgB,CAAC;YACtB,IAAI,OAAO,OAAO,IAAI,YAAY;gBAC9B,MAAM,OAAO,QAAQ,qBAAqB;gBAC1C,MAAM,EAAE,YAAY,EAAE,GAAG;gBACzB,MAAM,iBAAiB,QAAQ,WAAW,IAAI;gBAC9C,MAAM,aAAa,AAAC,CAAA,iBAAiB,YAAW,IAAK;gBACrD,MAAM,IAAI,EAAE,OAAO,GAAG,KAAK,IAAI;gBAC/B,MAAM,YAAY,IAAI;gBACtB,kBAAkB,AAAC,YAAY,eAAgB;gBAC/C,kBAAkB,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK;gBAC5C;YACJ;QACJ;QAEA,SAAS,cAAc,CAAC;YACpB,aAAa;QACjB;QAEA,IAAI,EAAE,CAAC,WAAW;YACd,SAAS,OAAO;YAChB,SAAS,mBAAmB,CAAC,aAAa;YAC1C,SAAS,mBAAmB,CAAC,aAAa;YAC1C,SAAS,mBAAmB,CAAC,WAAW;QAC5C;QAEA,IAAI,EAAE,CAAC,UAAU;YACb,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG;YACxC,QAAQ,KAAK,CAAC,KAAK,GAAG,eAAe;YACrC,QAAQ,KAAK,CAAC,MAAM,GAAG,gBAAgB;YACvC;QACJ;QAEA,OAAO;YACH,MAAM;QACV;IACJ;AACJ;AAEA,IAAI,OAAO,WAAW,aAClB,OAAO,oBAAoB,GAAG;;;;;AC7InB,MAAM;IACnB,OAAO,mBAAmB;QAAE,OAAO;QAAQ,OAAO;QAAS,UAAU;IAAM,EAAE;IAC7E,OAAO,iBAAiB;QAAE,MAAM;QAAK,SAAS;IAAI,EAAE;IAEpD,OAAO,cAAc;QACnB,IAAI;YACF,MAAM,YAAY,OAAO,WAAW;YACpC,MAAM,eACJ,OAAO,oBAAoB,eAC1B,OAAO,aAAa,eACnB,CAAC,CAAC,SAAS,aAAa,CAAC,UAAU,0BAA0B;YACjE,MAAM,UAAU,OAAO,SAAS;YAChC,OAAO,aAAa,gBAAgB;QACtC,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,OAAO,mBAAmB;QACxB,IAAI;YACF,OACE,OAAO,iBAAiB,eACxB,OAAO,iBAAiB;QAE5B,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,YAAY,UAAU,CAAC,CAAC,CAAE;QACxB,MAAM,iBAAiB,QAAQ,cAAc,IAAI;QAEjD,IAAI,CAAC,QAAQ,GAAG,QAAQ,QAAQ,IAAI;YAClC,OAAO;gBACL,MAAM;gBACN,YAAY,GAAG,eAAe,WAAW,CAAC;YAC5C;YACA,QAAQ;gBACN,MAAM;gBACN,YAAY,GAAG,eAAe,YAAY,CAAC;YAC7C;YACA,OAAO;gBACL,MAAM;gBACN,YAAY,GAAG,eAAe,YAAY,CAAC;YAC7C;QACF;QAEA,IAAI,CAAC,WAAW,GAAG,QAAQ,WAAW,IAAI;QAC1C,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,SAAS,GAAG,QAAQ,SAAS,IAAI;QAEtC,IAAI,CAAC,QAAQ,GAAG;YACd,GAAG,SAAS,gBAAgB;YAC5B,GAAI,QAAQ,QAAQ,IAAI,CAAC,CAAC;QAC5B;QACA,IAAI,CAAC,MAAM,GAAG;YAAE,GAAG,SAAS,cAAc;YAAE,GAAI,QAAQ,MAAM,IAAI,CAAC,CAAC;QAAE;QAEtE,IAAI,CAAC,UAAU,GACb,OAAO,QAAQ,UAAU,KAAK,YAAY,QAAQ,UAAU,GAAG,IAC3D,QAAQ,UAAU,GAClB;QACN,IAAI,CAAC,UAAU,GACb,OAAO,QAAQ,UAAU,KAAK,YAAY,QAAQ,UAAU,GAAG,IAC3D,QAAQ,UAAU,GAClB;QAEN,IAAI,CAAC,YAAY,GAAG,IAAI;QACxB,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,eAAe,GAAG,CAAC;QACxB,IAAI,CAAC,gBAAgB,GAAG;QACxB,IAAI,CAAC,cAAc,GAAG;QAEtB,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,aAAa,GAAG;IACvB;IAEA,KAAK,EAAE,UAAU,IAAI,EAAE,GAAG,CAAC,CAAC,EAAE;QAC5B,IAAI,CAAC,SAAS,WAAW,IACvB,MAAM,IAAI,MAAM;QAElB,IAAI,SACF,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;YAAE,KAAK;QAAc;QAEpD,OAAO,IAAI;IACb;IAEA,YAAY;QACV,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACxB,IAAI,CAAC,cAAc,GAAG,IAAI,OAAO,IAAI,CAAC,SAAS;YAC/C,IAAI,CAAC,cAAc,CAAC,SAAS,GAAG,CAAC,QAC/B,IAAI,CAAC,mBAAmB,CAAC;QAC7B;QACA,OAAO,IAAI,CAAC,cAAc;IAC5B;IAEA,OAAO,qBAAqB,IAAI,EAAE;QAChC,MAAM,QAAQ,KAAK,IAAI,IAAI,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI,KAAK,UAAU;QACzE,OAAO,OAAO,UAAU,WACpB,KAAK,GAAG,CAAC,KAAK,KAAK,GAAG,CAAC,GAAG,KAAK,KAAK,CAAC,WACrC;IACN;IAEA,mBAAmB,IAAI,EAAE;QACvB,MAAM,WACJ,IAAI,CAAC,cAAc,KAAK,UAAU,cAAc;QAClD,MAAM,UAAU,IAAI,CAAC,eAAe,CAAC,SAAS;QAC9C,IAAI,KAAK,IAAI,YAAY,QAAQ,SAC/B,QAAQ;YAAE,CAAC,SAAS,EAAE,KAAK,IAAI;QAAC;IAEpC;IAEA,cAAc;QACZ,MAAM,MACJ,IAAI,CAAC,cAAc,KAAK,UAAU,iBAAiB;QACrD,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;YAAE;QAAI;IACrC;IAEA,oBAAoB,KAAK,EAAE;QACzB,MAAM,EAAE,IAAI,EAAE,GAAG;QACjB,IAAI,CAAC,KAAK,GAAG,EAAE;QAEf,MAAM,EAAE,GAAG,EAAE,GAAG;QAEhB,IAAI,QAAQ,YAAY;YACtB,MAAM,WAAW,SAAS,oBAAoB,CAAC;YAC/C,IAAI,aAAa,QAAQ,IAAI,CAAC,gBAAgB,EAC5C,IAAI,CAAC,gBAAgB,CAAC;YAExB,IAAI,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC;QACnE,OAAO,IAAI,QAAQ;YACjB,IAAI,KAAK,IAAI,YAAY,MACvB,IAAI,CAAC,kBAAkB,CAAC;iBAExB,IAAI,CAAC,WAAW;eAEb,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,EAClC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;IAE9B;IAEA,MAAM,YAAY,WAAW,EAAE;QAC7B,IAAI,CAAC,mBAAmB,CAAC;QACzB,IAAI,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,cACxB,OAAO,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;QAE/B,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,YAAY;QAC1C,MAAM,WAAW,MAAM,MAAM,QAAQ,UAAU;QAC/C,IAAI,CAAC,SAAS,EAAE,EACd,MAAM,IAAI,MAAM,CAAC,yBAAyB,EAAE,SAAS,UAAU,EAAE;QACnE,MAAM,UAAU,MAAM,SAAS,IAAI;QACnC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,aAAa;QACnC,OAAO;IACT;IAEA,OAAO,kBAAkB,WAAW,EAAE,QAAQ,EAAE;QAC9C,OAAO,IAAI,QAAQ,CAAC,SAAS;YAC3B,MAAM,OAAO,IAAI,KAAK;gBAAC;aAAY,EAAE;gBAAE,MAAM;YAAS;YACtD,MAAM,MAAM,IAAI,eAAe,CAAC;YAChC,MAAM,MAAM,IAAI;YAEhB,IAAI,MAAM,GAAG;gBACX,IAAI,eAAe,CAAC;gBACpB,QAAQ;oBAAE,OAAO,IAAI,KAAK;oBAAE,QAAQ,IAAI,MAAM;gBAAC;YACjD;YAEA,IAAI,OAAO,GAAG;gBACZ,IAAI,eAAe,CAAC;gBACpB,OAAO,IAAI,MAAM;YACnB;YAEA,IAAI,GAAG,GAAG;QACZ;IACF;IAEA,OAAO,kBAAkB,IAAI,EAAE,SAAS,EAAE;QACxC,OAAO,IAAI,QAAQ,CAAC,SAAS;YAC3B,MAAM,MAAM,IAAI,eAAe,CAAC;YAChC,MAAM,QAAQ,SAAS,aAAa,CAAC;YACrC,MAAM,GAAG,GAAG;YAEZ,MAAM,UAAU,WAAW,IAAM,OAAO,IAAI,MAAM,aAAa;YAE/D,MAAM,gBAAgB,GAAG;gBACvB,aAAa;gBACb,IAAI,eAAe,CAAC;gBACpB,QAAQ;oBACN,OAAO,MAAM,UAAU;oBACvB,QAAQ,MAAM,WAAW;oBACzB,UAAU,MAAM,QAAQ;gBAC1B;YACF;YAEA,MAAM,OAAO,GAAG;gBACd,aAAa;gBACb,IAAI,eAAe,CAAC;gBACpB,OAAO,IAAI,MAAM;YACnB;QACF;IACF;IAEA,sBAAsB,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE;QAC9C,MAAM,SAAS,OAAO,UAAU,YAAY,QAAQ,IAAI,QAAQ;QAChE,MAAM,SAAS,SAAS,aAAa,CAAC;QACtC,OAAO,KAAK,GAAG,QAAQ;QACvB,OAAO,MAAM,GAAG,SAAS;QACzB,IAAI,OAAO,OAAO,0BAA0B,KAAK,YAC/C,MAAM,IAAI,MAAM;QAElB,OAAO,OAAO,0BAA0B;IAC1C;IAEA,kBAAkB,QAAQ,EAAE,OAAO,EAAE;QACnC,OAAO,IAAI,QAAQ,CAAC,SAAS;YAC3B,MAAM,YAAY,WAAW;gBAC3B,IAAI,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE;oBAClC,OAAO,IAAI,CAAC,eAAe,CAAC,SAAS;oBACrC,OAAO,IAAI,MAAM,GAAG,SAAS,mBAAmB,CAAC;gBACnD;YACF,GAAG;YAEH,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,CAAC;gBAChC,OAAO,IAAI,CAAC,eAAe,CAAC,SAAS;gBACrC,aAAa;gBACb,MAAM,OAAO,GAAG,CAAC,SAAS,IAAI,IAAI,IAAI;gBACtC,IAAI,gBAAgB,MAClB,QAAQ;qBAER,OAAO,IAAI,MAAM,CAAC,QAAQ,EAAE,SAAS,OAAO,CAAC;YAEjD;QACF;IACF;IAEA,oBAAoB,IAAI,EAAE;QACxB,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,EACtB,MAAM,IAAI,MACR,qCACE,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IAGxC;IAEA,MAAM,aAAa,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE;QACxD,IAAI,CAAC,WAAW,MAAM,IAAI,MAAM;QAChC,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,IAAI,CAAC,mBAAmB,CAAC;QAEzB,IAAI,CAAC,cAAc,GAAG;QACtB,MAAM,cAAc,MAAM,UAAU,WAAW;QAC/C,MAAM,WAAW,UAAU,IAAI,IAAI;QACnC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,SAAS,iBAAiB,CACxD,aACA;QAIF,MAAM,UAAU,MAAM,IAAI,CAAC,WAAW,CAAC;QACvC,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK;QACnC,MAAM,QACJ,OAAO,kBAAkB,YAAY,gBAAgB,IACjD,gBACA,IAAI,CAAC,UAAU;QACrB,MAAM,CAAC,UAAU,WAAW,GAAG;YAC7B,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;YAC1C,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;SAC3C;QAED,MAAM,cAAc,IAAI,CAAC,iBAAiB,CACxC,aACA,IAAI,CAAC,QAAQ,CAAC,KAAK;QAGrB,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;YACE,KAAK;YACL,MAAM;gBACJ,kBAAkB;gBAClB,eAAe;gBACf,UAAU;gBACV,UAAU;gBACV,YAAY;oBAAE;oBAAO;gBAAO;gBAC5B,cAAc,QAAQ,IAAI;gBAC1B;YACF;QACF,GACA;YAAC;YAAU;SAAW;QAGxB,WAAW;YACT,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;gBAC3B,KAAK;gBACL,MAAM;oBACJ,MAAM,QAAQ,IAAI;oBAClB,kBAAkB;oBAClB,eAAe;oBACf;gBACF;YACF;YAEA,WAAW;gBACT,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;oBAC3B,KAAK;oBACL,MAAM;wBAAE,kBAAkB;wBAAa,eAAe;oBAAS;gBACjE;YACF,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO;QACxB,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI;QAEnB,OAAO;IACT;IAEA,MAAM,aAAa,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE;QACxD,IAAI,CAAC,WAAW,MAAM,IAAI,MAAM;QAChC,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,IAAI,CAAC,mBAAmB,CAAC;QAEzB,IAAI,CAAC,SAAS,gBAAgB,IAC5B,MAAM,IAAI,MAAM;QAGlB,IAAI,CAAC,cAAc,GAAG;QACtB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,SAAS,iBAAiB,CAClE,WACA,IAAI,CAAC,QAAQ,CAAC,QAAQ;QAIxB,MAAM,UAAU,MAAM,IAAI,CAAC,WAAW,CAAC;QACvC,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK;QACnC,MAAM,QACJ,OAAO,kBAAkB,YAAY,gBAAgB,IACjD,gBACA,IAAI,CAAC,UAAU;QACrB,MAAM,CAAC,WAAW,SAAS,GAAG;YAC5B,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;YAC1C,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;SAC3C;QAED,MAAM,cAAc,IAAI,CAAC,iBAAiB,CACxC,aACA,IAAI,CAAC,QAAQ,CAAC,KAAK;QAGrB,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;YACE,KAAK;YACL,MAAM;YACN,UAAU,UAAU,IAAI;YACxB;YACA,oBAAoB;gBAClB,oBAAoB;gBACpB,qBAAqB;gBACrB,qBAAqB,QAAQ;gBAC7B,sBAAsB,SAAS;YACjC;YACA,UAAU;YACV,UAAU;YACV;YACA,cAAc,QAAQ,IAAI;YAC1B,mBAAmB;QACrB,GACA;YAAC;YAAW;SAAS;QAGvB,OAAO;IACT;IAEA,MAAM,qBACJ,YAAY,EACZ,aAAa,EACb,WAAW,EACX,aAAa,EACb;QACA,IAAI,CAAC,gBAAgB,CAAC,eACpB,MAAM,IAAI,MAAM;QAGlB,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,IAAI,CAAC,mBAAmB,CAAC;QAEzB,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK;QACnC,MAAM,UAAU,MAAM,IAAI,CAAC,WAAW,CAAC;QAEvC,MAAM,QACJ,OAAO,kBAAkB,YAAY,gBAAgB,IACjD,gBACA,IAAI,CAAC,UAAU;QAErB,MAAM,iBAAiB;YACrB,OAAO,IAAI,QAAQ,CAAC,SAAS;gBAC3B,IAAI,aAAa,UAAU,IAAI,GAAG;oBAChC;oBACA;gBACF;gBACA,MAAM,WAAW;oBACf;oBACA;gBACF;gBACA,MAAM,UAAU;oBACd;oBACA,OAAO,IAAI,MAAM;gBACnB;gBACA,MAAM,UAAU;oBACd,aAAa,mBAAmB,CAAC,kBAAkB;oBACnD,aAAa,mBAAmB,CAAC,SAAS;gBAC5C;gBACA,aAAa,gBAAgB,CAAC,kBAAkB;gBAChD,aAAa,gBAAgB,CAAC,SAAS;YACzC;QACF;QAEA,MAAM;QAEN,MAAM,QAAQ,aAAa,UAAU;QACrC,MAAM,SAAS,aAAa,WAAW;QACvC,IAAI,CAAC,SAAS,CAAC,QACb,MAAM,IAAI,MAAM;QAIlB,cAAc,KAAK,GAAG,QAAQ;QAC9B,cAAc,MAAM,GAAG,SAAS;QAEhC,IAAI,OAAO,cAAc,0BAA0B,KAAK,YACtD,MAAM,IAAI,MAAM;QAGlB,MAAM,YAAY,cAAc,0BAA0B;QAG1D,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,qBAAqB,IAAI,CAAC,cAAc;YACxC,IAAI,CAAC,cAAc,GAAG;QACxB;QAEA,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;YACE,KAAK;YACL,MAAM;gBACJ,UAAU;gBACV,YAAY;oBACV;oBACA;oBACA;oBACA,aAAa,QAAQ;oBACrB,cAAc,SAAS;gBACzB;gBACA,cAAc,QAAQ,IAAI;gBAC1B;YACF;QACF,GACA;YAAC;SAAU;QAIb,IAAI,CAAC,aAAa,GAAG;YACnB,SAAS;YACT,OAAO;YACP,QAAQ;YACR;YACA,MAAM;YACN,YAAY;QACd;QAEA,MAAM,OAAO;YACX,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YACxD,MAAM,QAAQ,IAAI,CAAC,aAAa;YAChC,MAAM,IAAI,MAAM,KAAK;YAErB,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,MAAM,IAAI,EAAE;gBACxC,MAAM,IAAI,GAAG;gBACb,IAAI;oBACF,MAAM,QAAQ,MAAM,kBAAkB;oBACtC,MAAM,UAAU,IAAI;oBAEpB,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;wBACE,KAAK;wBACL;oBACF,GACA;wBAAC;qBAAM;gBAEX,EAAE,OAAO,GAAG;oBACV,QAAQ,IAAI,CAAC,uBAAuB;gBACtC,SAAU;oBACR,IAAI,IAAI,CAAC,aAAa,EACpB,IAAI,CAAC,aAAa,CAAC,IAAI,GAAG;gBAE9B;YACF;YAEA,IAAI,CAAC,cAAc,GAAG,sBAAsB;QAC9C;QAEA,IAAI,CAAC,cAAc,GAAG,sBAAsB;IAC9C;IAEA,sBAAsB;QACpB,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,qBAAqB,IAAI,CAAC,cAAc;YACxC,IAAI,CAAC,cAAc,GAAG;QACxB;QACA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,IAAI,CAAC,aAAa,CAAC,OAAO,GAAG;YAC7B,IAAI,CAAC,aAAa,GAAG;QACvB;IACF;IAEA,MAAM,iBAAiB,IAAI,EAAE,WAAW,EAAE,WAAW,IAAI,EAAE;QACzD,MAAM,UAAU,KAAK,IAAI,CAAC,UAAU,CAAC;QACrC,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,MAAM,OAAO,UACT,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM,QAC9B,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM;QAClC,MAAM,MAAM,IAAI,eAAe,CAAC;QAChC,MAAM,OAAO,SAAS,aAAa,CAAC;QACpC,KAAK,IAAI,GAAG;QACZ,KAAK,QAAQ,GACX,YAAY,CAAC,SAAS,EAAE,KAAK,GAAG,GAAG,CAAC,EAAE,UAAU,QAAQ,OAAO;QACjE,KAAK,KAAK;QACV,IAAI,eAAe,CAAC;QACpB,OAAO;IACT;IAEA,uBAAuB;QACrB,OAAO,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ;IAClC;IAEA,aAAa,mBAAmB;QAC9B,IAAI;YACF,IAAI,UAAU,GAAG,EAAE;gBACjB,MAAM,UAAU,MAAM,UAAU,GAAG,CAAC,cAAc;gBAClD,IAAI,SAAS;oBACX,MAAM,SAAS,QAAQ,MAAM,CAAC,2BAA2B,GAAG;oBAC5D,MAAM,UAAU;oBAChB,OAAO,KAAK,GAAG,CAAC,QAAQ;gBAC1B;YACF;YACA,MAAM,SAAS,SAAS,aAAa,CAAC;YACtC,MAAM,KAAK,OAAO,UAAU,CAAC;YAC7B,IAAI,IAAI,OAAO,GAAG,YAAY,CAAC,GAAG,gBAAgB,KAAK;YACvD,OAAO;QACT,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,OAAO,iBAAiB;QACtB,IAAI;YACF,IAAI,UAAU,GAAG,EAAE,OAAO;YAC1B,IAAI,SAAS,aAAa,CAAC,UAAU,UAAU,CAAC,WAAW,OAAO;YAClE,OAAO;QACT,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,cAAc;QACZ,OAAO;YACL,SAAS,SAAS,cAAc;YAChC,cAAc;YACd,UAAU;YACV,OAAO;YACP,QAAQ;QACV;IACF;IAEA,WAAW,QAAQ,EAAE;QACnB,IAAI,OAAO,aAAa,YACtB,IAAI,CAAC,gBAAgB,GAAG;IAE5B;IAEA,UAAU;QACR,IAAI,CAAC,mBAAmB;QACxB,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,cAAc,CAAC,SAAS;YAC7B,IAAI,CAAC,cAAc,GAAG;QACxB;QACA,IAAI,CAAC,eAAe,GAAG,CAAC;QACxB,IAAI,CAAC,gBAAgB,GAAG;QACxB,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,YAAY,CAAC,KAAK;IACzB;AACF;kBAvkBqB;;;ACArB,QAAQ,cAAc,GAAG,SAAU,CAAC;IAClC,OAAO,KAAK,EAAE,UAAU,GAAG,IAAI;QAAC,SAAS;IAAC;AAC5C;AAEA,QAAQ,iBAAiB,GAAG,SAAU,CAAC;IACrC,OAAO,cAAc,CAAC,GAAG,cAAc;QAAC,OAAO;IAAI;AACrD;AAEA,QAAQ,SAAS,GAAG,SAAU,MAAM,EAAE,IAAI;IACxC,OAAO,IAAI,CAAC,QAAQ,OAAO,CAAC,SAAU,GAAG;QACvC,IACE,QAAQ,aACR,QAAQ,gBACR,OAAO,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,MAE3C;QAGF,OAAO,cAAc,CAAC,MAAM,KAAK;YAC/B,YAAY;YACZ,KAAK;gBACH,OAAO,MAAM,CAAC,IAAI;YACpB;QACF;IACF;IAEA,OAAO;AACT;AAEA,QAAQ,MAAM,GAAG,SAAU,IAAI,EAAE,QAAQ,EAAE,GAAG;IAC5C,OAAO,cAAc,CAAC,MAAM,UAAU;QACpC,YAAY;QACZ,KAAK;IACP;AACF","sources":["packages/artplayer-plugin-websr/src/index.js","packages/artplayer-plugin-websr/src/Upscaler.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import Upscaler from \"./Upscaler\";\n\nexport default function artplayerPluginWebsr(\n    option = {\n        networkSize: \"medium\",\n        compare: false,\n    },\n) {\n    return async (art) => {\n        const { $video, $player } = art.template;\n\n        const $canvas = document.createElement(\"canvas\");\n        $player.appendChild($canvas);\n\n        $canvas.style.position = \"absolute\";\n        $canvas.style.zIndex = \"11\";\n        $canvas.style.pointerEvents = \"none\";\n        $canvas.style.top = \"50%\";\n        $canvas.style.left = \"50%\";\n        $canvas.style.transform = \"translate(-50%, -50%)\";\n\n        function calcCanvasSize() {\n            const videoElement = art.video;\n            const containerWidth = $player.offsetWidth || 640;\n            const containerHeight = $player.offsetHeight || 360;\n            const videoWidth = videoElement.videoWidth || 640;\n            const videoHeight = videoElement.videoHeight || 360;\n            const aspectRatio = videoWidth / videoHeight;\n            let displayWidth = containerWidth;\n            let displayHeight = containerHeight;\n            if (containerWidth / containerHeight > aspectRatio) {\n                displayWidth = containerHeight * aspectRatio;\n            } else {\n                displayHeight = containerWidth / aspectRatio;\n            }\n            return { displayWidth, displayHeight };\n        }\n\n        const upscaler = new Upscaler(option);\n        upscaler.init();\n        await upscaler.startRealtimeUpscale(\n            $video,\n            $canvas,\n            option.networkSize,\n        );\n\n        // 初始化 canvas 显示尺寸\n        const { displayWidth, displayHeight } = calcCanvasSize();\n        $canvas.style.width = displayWidth + \"px\";\n        $canvas.style.height = displayHeight + \"px\";\n\n        // 对比模式\n        let comparePosition = 50;\n        let isDragging = false;\n\n        // 创建对比手柄\n        const $handler = document.createElement(\"div\");\n        $handler.style.position = \"absolute\";\n        $handler.style.width = \"3px\";\n        $handler.style.backgroundColor = \"rgba(255, 255, 255, 0.5)\";\n        $handler.style.cursor = \"ew-resize\";\n        $handler.style.zIndex = \"12\";\n        $handler.style.pointerEvents = \"auto\";\n        $handler.style.display = option.compare ? \"block\" : \"none\";\n        $handler.style.boxShadow = \"0 0 4px rgba(0, 0, 0, 0.1)\";\n\n        if (option.compare) {\n            $player.appendChild($handler);\n            $handler.addEventListener(\"mousedown\", handleMouseDown);\n            document.addEventListener(\"mousemove\", handleMouseMove);\n            document.addEventListener(\"mouseup\", handleMouseUp);\n            updateCompareMask();\n        }\n\n        function updateCompareMask() {\n            if (option.compare) {\n                const { displayWidth, displayHeight } = calcCanvasSize();\n                const gradient = `linear-gradient(to right, transparent 0%, transparent ${comparePosition}%, black ${comparePosition}%, black 100%)`;\n                $canvas.style.maskImage = gradient;\n\n                const containerWidth = $player.offsetWidth || 640;\n                const containerHeight = $player.offsetHeight || 360;\n                const canvasLeft = (containerWidth - displayWidth) / 2;\n                const canvasTop = (containerHeight - displayHeight) / 2;\n                const handlerX =\n                    canvasLeft + (displayWidth * comparePosition) / 100;\n\n                $handler.style.top = canvasTop + \"px\";\n                $handler.style.left = handlerX + \"px\";\n                $handler.style.height = displayHeight + \"px\";\n                $handler.style.transform = \"translateX(-50%)\";\n            } else {\n                $canvas.style.maskImage = \"none\";\n            }\n        }\n\n        function handleMouseDown(e) {\n            if (option.compare) {\n                isDragging = true;\n            }\n        }\n\n        function handleMouseMove(e) {\n            if (option.compare && isDragging) {\n                const rect = $player.getBoundingClientRect();\n                const { displayWidth } = calcCanvasSize();\n                const containerWidth = $player.offsetWidth || 640;\n                const canvasLeft = (containerWidth - displayWidth) / 2;\n                const x = e.clientX - rect.left;\n                const relativeX = x - canvasLeft;\n                comparePosition = (relativeX / displayWidth) * 100;\n                comparePosition = Math.max(0, Math.min(100, comparePosition));\n                updateCompareMask();\n            }\n        }\n\n        function handleMouseUp(e) {\n            isDragging = false;\n        }\n\n        art.on(\"destroy\", () => {\n            upscaler.dispose();\n            $handler.removeEventListener(\"mousedown\", handleMouseDown);\n            document.removeEventListener(\"mousemove\", handleMouseMove);\n            document.removeEventListener(\"mouseup\", handleMouseUp);\n        });\n\n        art.on(\"resize\", () => {\n            const { displayWidth, displayHeight } = calcCanvasSize();\n            $canvas.style.width = displayWidth + \"px\";\n            $canvas.style.height = displayHeight + \"px\";\n            updateCompareMask();\n        });\n\n        return {\n            name: \"artplayerPluginWebsr\",\n        };\n    };\n}\n\nif (typeof window !== \"undefined\") {\n    window.artplayerPluginWebsr = artplayerPluginWebsr;\n}\n","export default class Upscaler {\r\n  static DEFAULT_TIMEOUTS = { IMAGE: 300000, VIDEO: 3600000, METADATA: 10000 };\r\n  static DEFAULT_DELAYS = { INIT: 500, NETWORK: 300 };\r\n\r\n  static isSupported() {\r\n    try {\r\n      const hasWorker = typeof Worker !== \"undefined\";\r\n      const hasOffscreen =\r\n        typeof OffscreenCanvas !== \"undefined\" ||\r\n        (typeof document !== \"undefined\" &&\r\n          !!document.createElement(\"canvas\").transferControlToOffscreen);\r\n      const hasBlob = typeof Blob !== \"undefined\";\r\n      return hasWorker && hasOffscreen && hasBlob;\r\n    } catch {\r\n      return false;\r\n    }\r\n  }\r\n\r\n  static isVideoSupported() {\r\n    try {\r\n      return (\r\n        typeof VideoEncoder !== \"undefined\" &&\r\n        typeof VideoDecoder !== \"undefined\"\r\n      );\r\n    } catch {\r\n      return false;\r\n    }\r\n  }\r\n\r\n  constructor(options = {}) {\r\n    const weightsBaseUrl = options.weightsBaseUrl || \"/weights\";\r\n\r\n    this.networks = options.networks || {\r\n      small: {\r\n        name: \"anime4k/cnn-2x-l\",\r\n        weightsUrl: `${weightsBaseUrl}/cnn-8.json`,\r\n      },\r\n      medium: {\r\n        name: \"anime4k/cnn-2x-16\",\r\n        weightsUrl: `${weightsBaseUrl}/cnn-16.json`,\r\n      },\r\n      large: {\r\n        name: \"anime4k/cnn-2x-28\",\r\n        weightsUrl: `${weightsBaseUrl}/cnn-28.json`,\r\n      },\r\n    };\r\n\r\n    this.networkSize = options.networkSize || \"medium\";\r\n    this.weightsBaseUrl = weightsBaseUrl;\r\n    this.workerUrl = options.workerUrl || \"/worker/main.js\";\r\n\r\n    this.timeouts = {\r\n      ...Upscaler.DEFAULT_TIMEOUTS,\r\n      ...(options.timeouts || {}),\r\n    };\r\n    this.delays = { ...Upscaler.DEFAULT_DELAYS, ...(options.delays || {}) };\r\n\r\n    this.imageScale =\r\n      typeof options.imageScale === \"number\" && options.imageScale > 0\r\n        ? options.imageScale\r\n        : 2;\r\n    this.videoScale =\r\n      typeof options.videoScale === \"number\" && options.videoScale > 0\r\n        ? options.videoScale\r\n        : 2;\r\n\r\n    this.weightsCache = new Map();\r\n    this.workerInstance = null;\r\n    this.messageHandlers = {};\r\n    this.progressCallback = null;\r\n    this.processingType = null;\r\n\r\n    this.realtimeLoopId = null;\r\n    this.realtimeState = null;\r\n  }\r\n\r\n  init({ prewarm = true } = {}) {\r\n    if (!Upscaler.isSupported()) {\r\n      throw new Error(\"Upscaler is not supported in this environment\");\r\n    }\r\n    if (prewarm) {\r\n      this.getWorker().postMessage({ cmd: \"isSupported\" });\r\n    }\r\n    return this;\r\n  }\r\n\r\n  getWorker() {\r\n    if (!this.workerInstance) {\r\n      this.workerInstance = new Worker(this.workerUrl);\r\n      this.workerInstance.onmessage = (event) =>\r\n        this.handleWorkerMessage(event);\r\n    }\r\n    return this.workerInstance;\r\n  }\r\n\r\n  static extractProgressValue(data) {\r\n    const value = data.data ?? data.progress ?? data.value ?? data.percentage;\r\n    return typeof value === \"number\"\r\n      ? Math.min(100, Math.max(0, Math.round(value)))\r\n      : null;\r\n  }\r\n\r\n  handleBlobResponse(data) {\r\n    const blobType =\r\n      this.processingType === \"video\" ? \"videoBlob\" : \"imageBlob\";\r\n    const handler = this.messageHandlers[blobType];\r\n    if (data.data instanceof Blob && handler) {\r\n      handler({ [blobType]: data.data });\r\n    }\r\n  }\r\n\r\n  requestBlob() {\r\n    const cmd =\r\n      this.processingType === \"video\" ? \"getVideoBlob\" : \"getImageBlob\";\r\n    this.getWorker().postMessage({ cmd });\r\n  }\r\n\r\n  handleWorkerMessage(event) {\r\n    const { data } = event;\r\n    if (!data.cmd) return;\r\n\r\n    const { cmd } = data;\r\n\r\n    if (cmd === \"progress\") {\r\n      const progress = Upscaler.extractProgressValue(data);\r\n      if (progress !== null && this.progressCallback) {\r\n        this.progressCallback(progress);\r\n      }\r\n      if (this.messageHandlers.progress) this.messageHandlers.progress(data);\r\n    } else if (cmd === \"finished\") {\r\n      if (data.data instanceof Blob) {\r\n        this.handleBlobResponse(data);\r\n      } else {\r\n        this.requestBlob();\r\n      }\r\n    } else if (this.messageHandlers[cmd]) {\r\n      this.messageHandlers[cmd](data);\r\n    }\r\n  }\r\n\r\n  async loadWeights(networkSize) {\r\n    this.validateNetworkSize(networkSize);\r\n    if (this.weightsCache.has(networkSize)) {\r\n      return this.weightsCache.get(networkSize);\r\n    }\r\n    const network = this.networks[networkSize];\r\n    const response = await fetch(network.weightsUrl);\r\n    if (!response.ok)\r\n      throw new Error(`Failed to fetch weights: ${response.statusText}`);\r\n    const weights = await response.json();\r\n    this.weightsCache.set(networkSize, weights);\r\n    return weights;\r\n  }\r\n\r\n  static loadImageMetadata(arrayBuffer, mimeType) {\r\n    return new Promise((resolve, reject) => {\r\n      const blob = new Blob([arrayBuffer], { type: mimeType });\r\n      const url = URL.createObjectURL(blob);\r\n      const img = new Image();\r\n\r\n      img.onload = () => {\r\n        URL.revokeObjectURL(url);\r\n        resolve({ width: img.width, height: img.height });\r\n      };\r\n\r\n      img.onerror = () => {\r\n        URL.revokeObjectURL(url);\r\n        reject(new Error(\"Failed to load image\"));\r\n      };\r\n\r\n      img.src = url;\r\n    });\r\n  }\r\n\r\n  static loadVideoMetadata(file, timeoutMs) {\r\n    return new Promise((resolve, reject) => {\r\n      const url = URL.createObjectURL(file);\r\n      const video = document.createElement(\"video\");\r\n      video.src = url;\r\n\r\n      const timeout = setTimeout(() => reject(new Error(\"Timeout\")), timeoutMs);\r\n\r\n      video.onloadedmetadata = () => {\r\n        clearTimeout(timeout);\r\n        URL.revokeObjectURL(url);\r\n        resolve({\r\n          width: video.videoWidth,\r\n          height: video.videoHeight,\r\n          duration: video.duration,\r\n        });\r\n      };\r\n\r\n      video.onerror = () => {\r\n        clearTimeout(timeout);\r\n        URL.revokeObjectURL(url);\r\n        reject(new Error(\"Failed to load video\"));\r\n      };\r\n    });\r\n  }\r\n\r\n  createOffscreenCanvas(width, height, scale = 2) {\r\n    const factor = typeof scale === \"number\" && scale > 0 ? scale : 1;\r\n    const canvas = document.createElement(\"canvas\");\r\n    canvas.width = width * factor;\r\n    canvas.height = height * factor;\r\n    if (typeof canvas.transferControlToOffscreen !== \"function\") {\r\n      throw new Error(\"OffscreenCanvas is not supported in this environment\");\r\n    }\r\n    return canvas.transferControlToOffscreen();\r\n  }\r\n\r\n  createBlobPromise(blobType, timeout) {\r\n    return new Promise((resolve, reject) => {\r\n      const timeoutId = setTimeout(() => {\r\n        if (this.messageHandlers[blobType]) {\r\n          delete this.messageHandlers[blobType];\r\n          reject(new Error(`${blobType} processing timeout`));\r\n        }\r\n      }, timeout);\r\n\r\n      this.messageHandlers[blobType] = (msg) => {\r\n        delete this.messageHandlers[blobType];\r\n        clearTimeout(timeoutId);\r\n        const blob = msg[blobType] || msg.data;\r\n        if (blob instanceof Blob) {\r\n          resolve(blob);\r\n        } else {\r\n          reject(new Error(`Invalid ${blobType} format`));\r\n        }\r\n      };\r\n    });\r\n  }\r\n\r\n  validateNetworkSize(size) {\r\n    if (!this.networks[size]) {\r\n      throw new Error(\r\n        \"Invalid networkSize: use one of \" +\r\n          Object.keys(this.networks).join(\", \"),\r\n      );\r\n    }\r\n  }\r\n\r\n  async upscaleImage(imageFile, networkSize, scaleOverride) {\r\n    if (!imageFile) throw new Error(\"Image file is required\");\r\n    const size = networkSize || this.networkSize;\r\n    this.validateNetworkSize(size);\r\n\r\n    this.processingType = \"image\";\r\n    const arrayBuffer = await imageFile.arrayBuffer();\r\n    const mimeType = imageFile.type || \"image/jpeg\";\r\n    const { width, height } = await Upscaler.loadImageMetadata(\r\n      arrayBuffer,\r\n      mimeType,\r\n    );\r\n\r\n\r\n    const weights = await this.loadWeights(size);\r\n    const network = this.networks[size];\r\n    const scale =\r\n      typeof scaleOverride === \"number\" && scaleOverride > 0\r\n        ? scaleOverride\r\n        : this.imageScale;\r\n    const [canvasUp, canvasOrig] = [\r\n      this.createOffscreenCanvas(width, height, scale),\r\n      this.createOffscreenCanvas(width, height, 1),\r\n    ];\r\n\r\n    const blobPromise = this.createBlobPromise(\r\n      \"imageBlob\",\r\n      this.timeouts.IMAGE,\r\n    );\r\n\r\n    this.getWorker().postMessage(\r\n      {\r\n        cmd: \"init\",\r\n        data: {\r\n          imageArrayBuffer: arrayBuffer,\r\n          imageMimeType: mimeType,\r\n          upscaled: canvasUp,\r\n          original: canvasOrig,\r\n          resolution: { width, height },\r\n          network_name: network.name,\r\n          weights,\r\n        },\r\n      },\r\n      [canvasUp, canvasOrig],\r\n    );\r\n\r\n    setTimeout(() => {\r\n      this.getWorker().postMessage({\r\n        cmd: \"network\",\r\n        data: {\r\n          name: network.name,\r\n          imageArrayBuffer: arrayBuffer,\r\n          imageMimeType: mimeType,\r\n          weights,\r\n        },\r\n      });\r\n\r\n      setTimeout(() => {\r\n        this.getWorker().postMessage({\r\n          cmd: \"getImageBlob\",\r\n          data: { imageArrayBuffer: arrayBuffer, imageMimeType: mimeType },\r\n        });\r\n      }, this.delays.NETWORK);\r\n    }, this.delays.INIT);\r\n\r\n    return blobPromise;\r\n  }\r\n\r\n  async upscaleVideo(videoFile, networkSize, scaleOverride) {\r\n    if (!videoFile) throw new Error(\"Video file is required\");\r\n    const size = networkSize || this.networkSize;\r\n    this.validateNetworkSize(size);\r\n\r\n    if (!Upscaler.isVideoSupported()) {\r\n      throw new Error(\"WebCodecs API not supported. Requires Chrome 94+\");\r\n    }\r\n\r\n    this.processingType = \"video\";\r\n    const { width, height, duration } = await Upscaler.loadVideoMetadata(\r\n      videoFile,\r\n      this.timeouts.METADATA,\r\n    );\r\n\r\n\r\n    const weights = await this.loadWeights(size);\r\n    const network = this.networks[size];\r\n    const scale =\r\n      typeof scaleOverride === \"number\" && scaleOverride > 0\r\n        ? scaleOverride\r\n        : this.videoScale;\r\n    const [canvasOut, canvasIn] = [\r\n      this.createOffscreenCanvas(width, height, scale),\r\n      this.createOffscreenCanvas(width, height, 1),\r\n    ];\r\n\r\n    const blobPromise = this.createBlobPromise(\r\n      \"videoBlob\",\r\n      this.timeouts.VIDEO,\r\n    );\r\n\r\n    this.getWorker().postMessage(\r\n      {\r\n        cmd: \"process\",\r\n        file: videoFile,\r\n        fileSize: videoFile.size,\r\n        duration,\r\n        adjustedResolution: {\r\n          adjustedInputWidth: width,\r\n          adjustedInputHeight: height,\r\n          adjustedOutputWidth: width * scale,\r\n          adjustedOutputHeight: height * scale,\r\n        },\r\n        upscaled: canvasOut,\r\n        original: canvasIn,\r\n        weights,\r\n        network_name: network.name,\r\n        skipDemuxProgress: true,\r\n      },\r\n      [canvasOut, canvasIn],\r\n    );\r\n\r\n    return blobPromise;\r\n  }\r\n\r\n  async startRealtimeUpscale(\r\n    videoElement,\r\n    canvasElement,\r\n    networkSize,\r\n    scaleOverride,\r\n  ) {\r\n    if (!videoElement || !canvasElement) {\r\n      throw new Error(\"videoElement and canvasElement are required\");\r\n    }\r\n\r\n    const size = networkSize || this.networkSize;\r\n    this.validateNetworkSize(size);\r\n\r\n    const network = this.networks[size];\r\n    const weights = await this.loadWeights(size);\r\n\r\n    const scale =\r\n      typeof scaleOverride === \"number\" && scaleOverride > 0\r\n        ? scaleOverride\r\n        : this.videoScale;\r\n\r\n    const ensureMetadata = () => {\r\n      return new Promise((resolve, reject) => {\r\n        if (videoElement.readyState >= 1) {\r\n          resolve();\r\n          return;\r\n        }\r\n        const onLoaded = () => {\r\n          cleanup();\r\n          resolve();\r\n        };\r\n        const onError = () => {\r\n          cleanup();\r\n          reject(new Error(\"Failed to load video metadata\"));\r\n        };\r\n        const cleanup = () => {\r\n          videoElement.removeEventListener(\"loadedmetadata\", onLoaded);\r\n          videoElement.removeEventListener(\"error\", onError);\r\n        };\r\n        videoElement.addEventListener(\"loadedmetadata\", onLoaded);\r\n        videoElement.addEventListener(\"error\", onError);\r\n      });\r\n    };\r\n\r\n    await ensureMetadata();\r\n\r\n    const width = videoElement.videoWidth;\r\n    const height = videoElement.videoHeight;\r\n    if (!width || !height) {\r\n      throw new Error(\"Invalid video dimensions\");\r\n    }\r\n\r\n\r\n    canvasElement.width = width * scale;\r\n    canvasElement.height = height * scale;\r\n\r\n    if (typeof canvasElement.transferControlToOffscreen !== \"function\") {\r\n      throw new Error(\"OffscreenCanvas is not supported in this environment\");\r\n    }\r\n\r\n    const offscreen = canvasElement.transferControlToOffscreen();\r\n\r\n\r\n    if (this.realtimeLoopId) {\r\n      cancelAnimationFrame(this.realtimeLoopId);\r\n      this.realtimeLoopId = null;\r\n    }\r\n\r\n    this.getWorker().postMessage(\r\n      {\r\n        cmd: \"realtimeInit\",\r\n        data: {\r\n          upscaled: offscreen,\r\n          resolution: {\r\n            width,\r\n            height,\r\n            scale,\r\n            outputWidth: width * scale,\r\n            outputHeight: height * scale,\r\n          },\r\n          network_name: network.name,\r\n          weights,\r\n        },\r\n      },\r\n      [offscreen],\r\n    );\r\n\r\n\r\n    this.realtimeState = {\r\n      running: true,\r\n      video: videoElement,\r\n      canvas: canvasElement,\r\n      scale,\r\n      busy: false,\r\n      frameIndex: 0,\r\n    };\r\n\r\n    const loop = async () => {\r\n      if (!this.realtimeState || !this.realtimeState.running) return;\r\n      const state = this.realtimeState;\r\n      const v = state.video;\r\n\r\n      if (!v.paused && !v.ended && !state.busy) {\r\n        state.busy = true;\r\n        try {\r\n          const frame = await createImageBitmap(v);\r\n          state.frameIndex += 1;\r\n          \r\n          this.getWorker().postMessage(\r\n            {\r\n              cmd: \"realtimeFrame\",\r\n              frame,\r\n            },\r\n            [frame],\r\n          );\r\n        } catch (e) {\r\n          console.warn(\"realtimeFrame error\", e);\r\n        } finally {\r\n          if (this.realtimeState) {\r\n            this.realtimeState.busy = false;\r\n          }\r\n        }\r\n      }\r\n\r\n      this.realtimeLoopId = requestAnimationFrame(loop);\r\n    };\r\n\r\n    this.realtimeLoopId = requestAnimationFrame(loop);\r\n  }\r\n\r\n  stopRealtimeUpscale() {\r\n    if (this.realtimeLoopId) {\r\n      cancelAnimationFrame(this.realtimeLoopId);\r\n      this.realtimeLoopId = null;\r\n    }\r\n    if (this.realtimeState) {\r\n      this.realtimeState.running = false;\r\n      this.realtimeState = null;\r\n    }\r\n  }\r\n\r\n  async downloadUpscaled(file, networkSize, filename = null) {\r\n    const isVideo = file.type.startsWith(\"video\");\r\n    const size = networkSize || this.networkSize;\r\n    const blob = isVideo\r\n      ? await this.upscaleVideo(file, size)\r\n      : await this.upscaleImage(file, size);\r\n    const url = URL.createObjectURL(blob);\r\n    const link = document.createElement(\"a\");\r\n    link.href = url;\r\n    link.download =\r\n      filename || `upscaled_${Date.now()}.${isVideo ? \"mp4\" : \"png\"}`;\r\n    link.click();\r\n    URL.revokeObjectURL(url);\r\n    return blob;\r\n  }\r\n\r\n  getSupportedNetworks() {\r\n    return Object.keys(this.networks);\r\n  }\r\n\r\n  static async getGPUCapability() {\r\n    try {\r\n      if (navigator.gpu) {\r\n        const adapter = await navigator.gpu.requestAdapter();\r\n        if (adapter) {\r\n          const buffer = adapter.limits.maxStorageBufferBindingSize / 512;\r\n          const texture = 8192 * 8192;\r\n          return Math.min(buffer, texture);\r\n        }\r\n      }\r\n      const canvas = document.createElement(\"canvas\");\r\n      const gl = canvas.getContext(\"webgl2\");\r\n      if (gl) return gl.getParameter(gl.MAX_TEXTURE_SIZE) ** 2;\r\n      return 8388608;\r\n    } catch {\r\n      return 8388608;\r\n    }\r\n  }\r\n\r\n  static getBackendType() {\r\n    try {\r\n      if (navigator.gpu) return \"webgpu\";\r\n      if (document.createElement(\"canvas\").getContext(\"webgl2\")) return \"webgl\";\r\n      return \"unknown\";\r\n    } catch {\r\n      return \"unknown\";\r\n    }\r\n  }\r\n\r\n  getAppState() {\r\n    return {\r\n      backend: Upscaler.getBackendType(),\r\n      isProcessing: false,\r\n      progress: 0,\r\n      width: 0,\r\n      height: 0,\r\n    };\r\n  }\r\n\r\n  onProgress(callback) {\r\n    if (typeof callback === \"function\") {\r\n      this.progressCallback = callback;\r\n    }\r\n  }\r\n\r\n  dispose() {\r\n    this.stopRealtimeUpscale();\r\n    if (this.workerInstance) {\r\n      this.workerInstance.terminate();\r\n      this.workerInstance = null;\r\n    }\r\n    this.messageHandlers = {};\r\n    this.progressCallback = null;\r\n    this.processingType = null;\r\n    this.weightsCache.clear();\r\n  }\r\n}","exports.interopDefault = function (a) {\n  return a && a.__esModule ? a : {default: a};\n};\n\nexports.defineInteropFlag = function (a) {\n  Object.defineProperty(a, '__esModule', {value: true});\n};\n\nexports.exportAll = function (source, dest) {\n  Object.keys(source).forEach(function (key) {\n    if (\n      key === 'default' ||\n      key === '__esModule' ||\n      Object.prototype.hasOwnProperty.call(dest, key)\n    ) {\n      return;\n    }\n\n    Object.defineProperty(dest, key, {\n      enumerable: true,\n      get: function () {\n        return source[key];\n      },\n    });\n  });\n\n  return dest;\n};\n\nexports.export = function (dest, destName, get) {\n  Object.defineProperty(dest, destName, {\n    enumerable: true,\n    get: get,\n  });\n};\n"],"names":[],"version":3,"file":"index.js.map","sourceRoot":"../../../"}
\ No newline at end of file
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA,SAAS,qBACL,SAAS;IACL,aAAa;IACb,SAAS;IACT,gBAAgB;IAChB,WAAW;IACX,YAAY;AAChB,CAAC;IAED,OAAO,CAAC;QACJ,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,QAAQ;QAExC,MAAM,UAAU,SAAS,aAAa,CAAC;QACvC,QAAQ,WAAW,CAAC;QAEpB,QAAQ,KAAK,CAAC,QAAQ,GAAG;QACzB,QAAQ,KAAK,CAAC,MAAM,GAAG;QACvB,QAAQ,KAAK,CAAC,aAAa,GAAG;QAC9B,QAAQ,KAAK,CAAC,GAAG,GAAG;QACpB,QAAQ,KAAK,CAAC,IAAI,GAAG;QACrB,QAAQ,KAAK,CAAC,SAAS,GAAG;QAC1B,QAAQ,KAAK,CAAC,OAAO,GAAG;QACxB,QAAQ,KAAK,CAAC,UAAU,GAAG;QAE3B,SAAS;YACL,MAAM,eAAe,IAAI,KAAK;YAC9B,MAAM,iBAAiB,QAAQ,WAAW,IAAI;YAC9C,MAAM,kBAAkB,QAAQ,YAAY,IAAI;YAChD,MAAM,aAAa,aAAa,UAAU,IAAI;YAC9C,MAAM,cAAc,aAAa,WAAW,IAAI;YAChD,MAAM,cAAc,aAAa;YACjC,IAAI,eAAe;YACnB,IAAI,gBAAgB;YACpB,IAAI,iBAAiB,kBAAkB,aACnC,eAAe,kBAAkB;iBAEjC,gBAAgB,iBAAiB;YAErC,OAAO;gBAAE;gBAAc;YAAc;QACzC;QAEA,IAAI,CAAC,CAAA,GAAA,0BAAQ,AAAD,KAAK,CAAC,CAAA,GAAA,0BAAQ,AAAD,EAAE,WAAW,IAAI,CAAC,CAAA,GAAA,0BAAQ,AAAD,EAAE,WAAW,IAAI;YAC/D,QAAQ,IAAI,CAAC;YACb;QACJ;QAEA,MAAM,WAAW,IAAI,CAAA,GAAA,0BAAQ,AAAD,EAAE;YAC1B,aAAa,OAAO,WAAW,IAAI;YACnC,gBAAgB,OAAO,cAAc,IAAI;YACzC,WAAW,OAAO,SAAS,IAAI;YAC/B,YAAY,OAAO,UAAU,IAAI;QACrC;QAEA,IAAI,kBAAkB;QAEtB,eAAe;YACX,IAAI,iBAAiB;YACrB,kBAAkB;YAElB,IAAI;gBACA,MAAM,IAAI,QAAQ,CAAC,SAAS;oBACxB,IAAI,OAAO,UAAU,IAAI,GAAG;wBACxB;wBACA;oBACJ;oBACA,MAAM,WAAW;wBACb;wBACA;oBACJ;oBACA,MAAM,UAAU;wBACZ;wBACA,OAAO,IAAI,MAAM;oBACrB;oBACA,MAAM,UAAU;wBACZ,OAAO,mBAAmB,CAAC,kBAAkB;wBAC7C,OAAO,mBAAmB,CAAC,SAAS;oBACxC;oBACA,OAAO,gBAAgB,CAAC,kBAAkB;oBAC1C,OAAO,gBAAgB,CAAC,SAAS;gBACrC;gBAEA,MAAM,SAAS,oBAAoB,CAC/B,QACA,SACA,OAAO,WAAW,IAAI,SAAS,WAAW;gBAG9C,sBAAsB;oBAClB,QAAQ,KAAK,CAAC,OAAO,GAAG;gBAC5B;YACJ,EAAE,OAAO,GAAG;gBACR,QAAQ,KAAK,CACT,uDACA;YAER;QACJ;QAEA,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG;QACxC,QAAQ,KAAK,CAAC,KAAK,GAAG,eAAe;QACrC,QAAQ,KAAK,CAAC,MAAM,GAAG,gBAAgB;QAEvC,IAAI,kBAAkB;QACtB,IAAI,aAAa;QACjB,IAAI,iBAAiB,CAAC,CAAC,OAAO,OAAO;QAErC,MAAM,WAAW,SAAS,aAAa,CAAC;QACxC,SAAS,KAAK,CAAC,QAAQ,GAAG;QAC1B,SAAS,KAAK,CAAC,KAAK,GAAG;QACvB,SAAS,KAAK,CAAC,eAAe,GAAG;QACjC,SAAS,KAAK,CAAC,MAAM,GAAG;QACxB,SAAS,KAAK,CAAC,MAAM,GAAG;QACxB,SAAS,KAAK,CAAC,aAAa,GAAG;QAC/B,SAAS,KAAK,CAAC,OAAO,GAAG,iBAAiB,UAAU;QACpD,SAAS,KAAK,CAAC,SAAS,GAAG;QAE3B,IAAI,gBAAgB;YAChB,QAAQ,WAAW,CAAC;YACpB,SAAS,gBAAgB,CAAC,aAAa;YACvC,SAAS,gBAAgB,CAAC,aAAa;YACvC,SAAS,gBAAgB,CAAC,WAAW;YACrC;QACJ;QAEA,SAAS;YACL,IAAI,gBAAgB;gBAChB,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG;gBACxC,MAAM,WAAW,CAAC,sDAAsD,EAAE,gBAAgB,SAAS,EAAE,gBAAgB,cAAc,CAAC;gBACpI,QAAQ,KAAK,CAAC,SAAS,GAAG;gBAE1B,MAAM,iBAAiB,QAAQ,WAAW,IAAI;gBAC9C,MAAM,kBAAkB,QAAQ,YAAY,IAAI;gBAChD,MAAM,aAAa,AAAC,CAAA,iBAAiB,YAAW,IAAK;gBACrD,MAAM,YAAY,AAAC,CAAA,kBAAkB,aAAY,IAAK;gBACtD,MAAM,WACF,aAAa,AAAC,eAAe,kBAAmB;gBAEpD,SAAS,KAAK,CAAC,GAAG,GAAG,YAAY;gBACjC,SAAS,KAAK,CAAC,IAAI,GAAG,WAAW;gBACjC,SAAS,KAAK,CAAC,MAAM,GAAG,gBAAgB;gBACxC,SAAS,KAAK,CAAC,SAAS,GAAG;YAC/B,OACI,QAAQ,KAAK,CAAC,SAAS,GAAG;QAElC;QAEA,SAAS,gBAAgB,CAAC;YACtB,IAAI,gBACA,aAAa;QAErB;QAEA,SAAS,gBAAgB,CAAC;YACtB,IAAI,kBAAkB,YAAY;gBAC9B,MAAM,OAAO,QAAQ,qBAAqB;gBAC1C,MAAM,EAAE,YAAY,EAAE,GAAG;gBACzB,MAAM,iBAAiB,QAAQ,WAAW,IAAI;gBAC9C,MAAM,aAAa,AAAC,CAAA,iBAAiB,YAAW,IAAK;gBACrD,MAAM,IAAI,EAAE,OAAO,GAAG,KAAK,IAAI;gBAC/B,MAAM,YAAY,IAAI;gBACtB,kBAAkB,AAAC,YAAY,eAAgB;gBAC/C,kBAAkB,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK;gBAC5C;YACJ;QACJ;QAEA,SAAS,cAAc,CAAC;YACpB,aAAa;QACjB;QAEA,IAAI,EAAE,CAAC,WAAW;YACd,IAAI,YAAY,OAAO,SAAS,OAAO,KAAK,YACxC,SAAS,OAAO;YAEpB,SAAS,mBAAmB,CAAC,aAAa;YAC1C,SAAS,mBAAmB,CAAC,aAAa;YAC1C,SAAS,mBAAmB,CAAC,WAAW;QAC5C;QAEA,IAAI,EAAE,CAAC,UAAU;YACb,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG;YACxC,QAAQ,KAAK,CAAC,KAAK,GAAG,eAAe;YACrC,QAAQ,KAAK,CAAC,MAAM,GAAG,gBAAgB;YACvC;QACJ;QAEA,IAAI,EAAE,CAAC,QAAQ;YACX;QACJ;QAEA,SAAS,OAAO,YAAY,CAAC,CAAC;YAC1B,IAAI,CAAC,aAAa,OAAO,cAAc,UAAU;YAEjD,IAAI,OAAO,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,WAAW,YAAY;gBAC5D,MAAM,cAAc,CAAC,CAAC,UAAU,OAAO;gBACvC,OAAO,OAAO,GAAG;gBACjB,iBAAiB;gBAEjB,IAAI,gBAAgB;oBAChB,IAAI,CAAC,SAAS,UAAU,EACpB,QAAQ,WAAW,CAAC;oBAExB,SAAS,KAAK,CAAC,OAAO,GAAG;oBACzB,SAAS,gBAAgB,CAAC,aAAa;oBACvC,SAAS,gBAAgB,CAAC,aAAa;oBACvC,SAAS,gBAAgB,CAAC,WAAW;oBACrC;gBACJ,OAAO;oBACH,QAAQ,KAAK,CAAC,SAAS,GAAG;oBAC1B,SAAS,KAAK,CAAC,OAAO,GAAG;oBACzB,SAAS,mBAAmB,CAAC,aAAa;oBAC1C,SAAS,mBAAmB,CAAC,aAAa;oBAC1C,SAAS,mBAAmB,CAAC,WAAW;gBAC5C;YACJ;YAEA,IAAI,UAAU,WAAW,EAAE;gBACvB,MAAM,WAAW,UAAU,WAAW;gBACtC,OAAO,WAAW,GAAG;gBACrB,IACI,YACA,OAAO,SAAS,mBAAmB,KAAK,YAExC,SAAS,mBAAmB;gBAEhC,kBAAkB;gBAClB,IAAI,CAAC,IAAI,MAAM,EACX;YAER;QACJ;QAEA,OAAO;YACH,MAAM;YACN;YACA;QACJ;IACJ;AACJ;AAEA,OAAO,oBAAoB,GAAG;;;;;AClPf,MAAM;IACnB,OAAO,mBAAmB;QAAE,OAAO;QAAQ,OAAO;QAAS,UAAU;IAAM,EAAE;IAC7E,OAAO,iBAAiB;QAAE,MAAM;QAAK,SAAS;IAAI,EAAE;IAEpD,OAAO,cAAc;QACnB,IAAI;YACF,MAAM,YAAY,OAAO,WAAW;YACpC,MAAM,eACJ,OAAO,oBAAoB,eAC1B,OAAO,aAAa,eACnB,CAAC,CAAC,SAAS,aAAa,CAAC,UAAU,0BAA0B;YACjE,MAAM,UAAU,OAAO,SAAS;YAChC,OAAO,aAAa,gBAAgB;QACtC,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,OAAO,mBAAmB;QACxB,IAAI;YACF,OACE,OAAO,iBAAiB,eACxB,OAAO,iBAAiB;QAE5B,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,YAAY,UAAU,CAAC,CAAC,CAAE;QACxB,MAAM,iBAAiB,QAAQ,cAAc,IAAI;QAEjD,IAAI,CAAC,QAAQ,GAAG,QAAQ,QAAQ,IAAI;YAClC,OAAO;gBACL,MAAM;gBACN,YAAY,GAAG,eAAe,WAAW,CAAC;YAC5C;YACA,QAAQ;gBACN,MAAM;gBACN,YAAY,GAAG,eAAe,YAAY,CAAC;YAC7C;YACA,OAAO;gBACL,MAAM;gBACN,YAAY,GAAG,eAAe,YAAY,CAAC;YAC7C;QACF;QAEA,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,WAAW,GAAG,QAAQ,WAAW,IAAI;QAC1C,IAAI,CAAC,SAAS,GAAG,QAAQ,SAAS,IAAI;QAEtC,IAAI,CAAC,QAAQ,GAAG;YACd,GAAG,SAAS,gBAAgB;YAC5B,GAAI,QAAQ,QAAQ,IAAI,CAAC,CAAC;QAC5B;QACA,IAAI,CAAC,MAAM,GAAG;YAAE,GAAG,SAAS,cAAc;YAAE,GAAI,QAAQ,MAAM,IAAI,CAAC,CAAC;QAAE;QAEtE,IAAI,CAAC,UAAU,GACb,OAAO,QAAQ,UAAU,KAAK,YAAY,QAAQ,UAAU,GAAG,IAC3D,QAAQ,UAAU,GAClB;QACN,IAAI,CAAC,UAAU,GACb,OAAO,QAAQ,UAAU,KAAK,YAAY,QAAQ,UAAU,GAAG,IAC3D,QAAQ,UAAU,GAClB;QAEN,IAAI,CAAC,YAAY,GAAG,IAAI;QACxB,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,eAAe,GAAG,CAAC;QACxB,IAAI,CAAC,gBAAgB,GAAG;QACxB,IAAI,CAAC,cAAc,GAAG;QAEtB,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,aAAa,GAAG;QAErB,IAAI,CAAC,IAAI;IACX;IAEA,KAAK,EAAE,UAAU,IAAI,EAAE,GAAG,CAAC,CAAC,EAAE;QAC5B,IAAI,CAAC,SAAS,WAAW,IACvB,MAAM,IAAI,MAAM;QAElB,IAAI,SACF,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;YAAE,KAAK;QAAc;QAEpD,OAAO,IAAI;IACb;IAEA,YAAY;QACV,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACxB,IAAI,CAAC,cAAc,GAAG,IAAI,OAAO,IAAI,CAAC,SAAS;YAC/C,IAAI,CAAC,cAAc,CAAC,SAAS,GAAG,CAAC,QAC/B,IAAI,CAAC,mBAAmB,CAAC;QAC7B;QACA,OAAO,IAAI,CAAC,cAAc;IAC5B;IAEA,OAAO,qBAAqB,IAAI,EAAE;QAChC,MAAM,QAAQ,KAAK,IAAI,IAAI,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI,KAAK,UAAU;QACzE,OAAO,OAAO,UAAU,WACpB,KAAK,GAAG,CAAC,KAAK,KAAK,GAAG,CAAC,GAAG,KAAK,KAAK,CAAC,WACrC;IACN;IAEA,mBAAmB,IAAI,EAAE;QACvB,MAAM,WACJ,IAAI,CAAC,cAAc,KAAK,UAAU,cAAc;QAClD,MAAM,UAAU,IAAI,CAAC,eAAe,CAAC,SAAS;QAC9C,IAAI,KAAK,IAAI,YAAY,QAAQ,SAC/B,QAAQ;YAAE,CAAC,SAAS,EAAE,KAAK,IAAI;QAAC;IAEpC;IAEA,cAAc;QACZ,MAAM,MACJ,IAAI,CAAC,cAAc,KAAK,UAAU,iBAAiB;QACrD,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;YAAE;QAAI;IACrC;IAEA,oBAAoB,KAAK,EAAE;QACzB,MAAM,EAAE,IAAI,EAAE,GAAG;QACjB,QAAQ,KAAK,CAAC,mBAAmB;QACjC,IAAI,CAAC,KAAK,GAAG,EAAE;QAEf,MAAM,EAAE,GAAG,EAAE,GAAG;QAEhB,IAAI,QAAQ,YAAY;YACtB,MAAM,WAAW,SAAS,oBAAoB,CAAC;YAC/C,IAAI,aAAa,QAAQ,IAAI,CAAC,gBAAgB,EAC5C,IAAI,CAAC,gBAAgB,CAAC;YAExB,IAAI,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC;QACnE,OAAO,IAAI,QAAQ;YACjB,IAAI,KAAK,IAAI,YAAY,MACvB,IAAI,CAAC,kBAAkB,CAAC;iBAExB,IAAI,CAAC,WAAW;eAEb,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,EAClC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;IAE9B;IAEA,MAAM,YAAY,WAAW,EAAE;QAC7B,IAAI,CAAC,mBAAmB,CAAC;QACzB,IAAI,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,cACxB,OAAO,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;QAE/B,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,YAAY;QAC1C,MAAM,WAAW,MAAM,MAAM,QAAQ,UAAU;QAC/C,IAAI,CAAC,SAAS,EAAE,EACd,MAAM,IAAI,MAAM,CAAC,yBAAyB,EAAE,SAAS,UAAU,EAAE;QACnE,MAAM,UAAU,MAAM,SAAS,IAAI;QACnC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,aAAa;QACnC,OAAO;IACT;IAEA,OAAO,kBAAkB,WAAW,EAAE,QAAQ,EAAE;QAC9C,OAAO,IAAI,QAAQ,CAAC,SAAS;YAC3B,MAAM,OAAO,IAAI,KAAK;gBAAC;aAAY,EAAE;gBAAE,MAAM;YAAS;YACtD,MAAM,MAAM,IAAI,eAAe,CAAC;YAChC,MAAM,MAAM,IAAI;YAEhB,IAAI,MAAM,GAAG;gBACX,IAAI,eAAe,CAAC;gBACpB,QAAQ;oBAAE,OAAO,IAAI,KAAK;oBAAE,QAAQ,IAAI,MAAM;gBAAC;YACjD;YAEA,IAAI,OAAO,GAAG;gBACZ,IAAI,eAAe,CAAC;gBACpB,OAAO,IAAI,MAAM;YACnB;YAEA,IAAI,GAAG,GAAG;QACZ;IACF;IAEA,OAAO,kBAAkB,IAAI,EAAE,SAAS,EAAE;QACxC,OAAO,IAAI,QAAQ,CAAC,SAAS;YAC3B,MAAM,MAAM,IAAI,eAAe,CAAC;YAChC,MAAM,QAAQ,SAAS,aAAa,CAAC;YACrC,MAAM,GAAG,GAAG;YAEZ,MAAM,UAAU,WAAW,IAAM,OAAO,IAAI,MAAM,aAAa;YAE/D,MAAM,gBAAgB,GAAG;gBACvB,aAAa;gBACb,IAAI,eAAe,CAAC;gBACpB,QAAQ;oBACN,OAAO,MAAM,UAAU;oBACvB,QAAQ,MAAM,WAAW;oBACzB,UAAU,MAAM,QAAQ;gBAC1B;YACF;YAEA,MAAM,OAAO,GAAG;gBACd,aAAa;gBACb,IAAI,eAAe,CAAC;gBACpB,OAAO,IAAI,MAAM;YACnB;QACF;IACF;IAEA,sBAAsB,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE;QAC9C,MAAM,SAAS,OAAO,UAAU,YAAY,QAAQ,IAAI,QAAQ;QAChE,MAAM,SAAS,SAAS,aAAa,CAAC;QACtC,OAAO,KAAK,GAAG,QAAQ;QACvB,OAAO,MAAM,GAAG,SAAS;QACzB,IAAI,OAAO,OAAO,0BAA0B,KAAK,YAC/C,MAAM,IAAI,MAAM;QAElB,OAAO,OAAO,0BAA0B;IAC1C;IAEA,kBAAkB,QAAQ,EAAE,OAAO,EAAE;QACnC,OAAO,IAAI,QAAQ,CAAC,SAAS;YAC3B,MAAM,YAAY,WAAW;gBAC3B,IAAI,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE;oBAClC,OAAO,IAAI,CAAC,eAAe,CAAC,SAAS;oBACrC,OAAO,IAAI,MAAM,GAAG,SAAS,mBAAmB,CAAC;gBACnD;YACF,GAAG;YAEH,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,CAAC;gBAChC,OAAO,IAAI,CAAC,eAAe,CAAC,SAAS;gBACrC,aAAa;gBACb,MAAM,OAAO,GAAG,CAAC,SAAS,IAAI,IAAI,IAAI;gBACtC,IAAI,gBAAgB,MAClB,QAAQ;qBAER,OAAO,IAAI,MAAM,CAAC,QAAQ,EAAE,SAAS,OAAO,CAAC;YAEjD;QACF;IACF;IAEA,oBAAoB,IAAI,EAAE;QACxB,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,EACtB,MAAM,IAAI,MACR,qCACE,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IAGxC;IAEA,MAAM,aAAa,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE;QACxD,IAAI,CAAC,WAAW,MAAM,IAAI,MAAM;QAChC,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,IAAI,CAAC,mBAAmB,CAAC;QAEzB,IAAI,CAAC,cAAc,GAAG;QACtB,MAAM,cAAc,MAAM,UAAU,WAAW;QAC/C,MAAM,WAAW,UAAU,IAAI,IAAI;QACnC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,SAAS,iBAAiB,CACxD,aACA;QAGF,MAAM,UAAU,MAAM,IAAI,CAAC,WAAW,CAAC;QACvC,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK;QACnC,MAAM,QACJ,OAAO,kBAAkB,YAAY,gBAAgB,IACjD,gBACA,IAAI,CAAC,UAAU;QACrB,MAAM,CAAC,UAAU,WAAW,GAAG;YAC7B,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;YAC1C,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;SAC3C;QAED,MAAM,cAAc,IAAI,CAAC,iBAAiB,CACxC,aACA,IAAI,CAAC,QAAQ,CAAC,KAAK;QAGrB,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;YACE,KAAK;YACL,MAAM;gBACJ,kBAAkB;gBAClB,eAAe;gBACf,UAAU;gBACV,UAAU;gBACV,YAAY;oBAAE;oBAAO;gBAAO;gBAC5B,cAAc,QAAQ,IAAI;gBAC1B;YACF;QACF,GACA;YAAC;YAAU;SAAW;QAGxB,WAAW;YACT,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;gBAC3B,KAAK;gBACL,MAAM;oBACJ,MAAM,QAAQ,IAAI;oBAClB,kBAAkB;oBAClB,eAAe;oBACf;gBACF;YACF;YAEA,WAAW;gBACT,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;oBAC3B,KAAK;oBACL,MAAM;wBAAE,kBAAkB;wBAAa,eAAe;oBAAS;gBACjE;YACF,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO;QACxB,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI;QAEnB,OAAO;IACT;IAEA,MAAM,aAAa,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE;QACxD,IAAI,CAAC,WAAW,MAAM,IAAI,MAAM;QAChC,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,IAAI,CAAC,mBAAmB,CAAC;QAEzB,IAAI,CAAC,SAAS,gBAAgB,IAC5B,MAAM,IAAI,MAAM;QAGlB,IAAI,CAAC,cAAc,GAAG;QACtB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,SAAS,iBAAiB,CAClE,WACA,IAAI,CAAC,QAAQ,CAAC,QAAQ;QAGxB,MAAM,UAAU,MAAM,IAAI,CAAC,WAAW,CAAC;QACvC,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK;QACnC,MAAM,QACJ,OAAO,kBAAkB,YAAY,gBAAgB,IACjD,gBACA,IAAI,CAAC,UAAU;QACrB,MAAM,CAAC,WAAW,SAAS,GAAG;YAC5B,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;YAC1C,IAAI,CAAC,qBAAqB,CAAC,OAAO,QAAQ;SAC3C;QAED,MAAM,cAAc,IAAI,CAAC,iBAAiB,CACxC,aACA,IAAI,CAAC,QAAQ,CAAC,KAAK;QAGrB,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;YACE,KAAK;YACL,MAAM;YACN,UAAU,UAAU,IAAI;YACxB;YACA,oBAAoB;gBAClB,oBAAoB;gBACpB,qBAAqB;gBACrB,qBAAqB,QAAQ;gBAC7B,sBAAsB,SAAS;YACjC;YACA,UAAU;YACV,UAAU;YACV;YACA,cAAc,QAAQ,IAAI;YAC1B,mBAAmB;QACrB,GACA;YAAC;YAAW;SAAS;QAGvB,OAAO;IACT;IAEA,MAAM,qBACJ,YAAY,EACZ,aAAa,EACb,WAAW,EACX,aAAa,EACb;QACA,IAAI,CAAC,gBAAgB,CAAC,eACpB,MAAM,IAAI,MAAM;QAGlB,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,IAAI,CAAC,mBAAmB,CAAC;QAEzB,MAAM,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK;QACnC,MAAM,UAAU,MAAM,IAAI,CAAC,WAAW,CAAC;QAEvC,MAAM,QACJ,OAAO,kBAAkB,YAAY,gBAAgB,IACjD,gBACA,IAAI,CAAC,UAAU;QAErB,MAAM,iBAAiB;YACrB,OAAO,IAAI,QAAQ,CAAC,SAAS;gBAC3B,IAAI,aAAa,UAAU,IAAI,GAAG;oBAChC;oBACA;gBACF;gBACA,MAAM,WAAW;oBACf;oBACA;gBACF;gBACA,MAAM,UAAU;oBACd;oBACA,OAAO,IAAI,MAAM;gBACnB;gBACA,MAAM,UAAU;oBACd,aAAa,mBAAmB,CAAC,kBAAkB;oBACnD,aAAa,mBAAmB,CAAC,SAAS;gBAC5C;gBACA,aAAa,gBAAgB,CAAC,kBAAkB;gBAChD,aAAa,gBAAgB,CAAC,SAAS;YACzC;QACF;QAEA,MAAM;QAEN,MAAM,QAAQ,aAAa,UAAU;QACrC,MAAM,SAAS,aAAa,WAAW;QACvC,IAAI,CAAC,SAAS,CAAC,QACb,MAAM,IAAI,MAAM;QAGlB,MAAM,YAAY,CAAC,cAAc,oBAAoB;QAErD,IAAI,YAAY;QAChB,IAAI,WAAW;YACb,cAAc,KAAK,GAAG,QAAQ;YAC9B,cAAc,MAAM,GAAG,SAAS;YAEhC,IAAI,OAAO,cAAc,0BAA0B,KAAK,YACtD,MAAM,IAAI,MAAM;YAGlB,YAAY,cAAc,0BAA0B;YACpD,cAAc,oBAAoB,GAAG;QACvC;QAEA,MAAM,gBAAgB,SAAS,aAAa,CAAC;QAC7C,cAAc,KAAK,GAAG;QACtB,cAAc,MAAM,GAAG;QACvB,MAAM,aAAa,cAAc,UAAU,CAAC;QAE5C,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,qBAAqB,IAAI,CAAC,cAAc;YACxC,IAAI,CAAC,cAAc,GAAG;QACxB;QAEA,MAAM,cAAc;YAClB,KAAK;YACL,MAAM;gBACJ,UAAU,YAAY,YAAY;gBAClC,YAAY;oBACV;oBACA;oBACA;oBACA,aAAa,QAAQ;oBACrB,cAAc,SAAS;gBACzB;gBACA,cAAc,QAAQ,IAAI;gBAC1B;YACF;QACF;QAEA,IAAI,aAAa,WACf,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC,aAAa;YAAC;SAAU;aAErD,IAAI,CAAC,SAAS,GAAG,WAAW,CAAC;QAG/B,IAAI,CAAC,aAAa,GAAG;YACnB,SAAS;YACT,OAAO;YACP,QAAQ;YACR;YACA,MAAM;YACN,YAAY;YACZ;YACA;QACF;QAEA,MAAM,OAAO;YACX,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YACxD,MAAM,QAAQ,IAAI,CAAC,aAAa;YAChC,MAAM,IAAI,MAAM,KAAK;YAErB,MAAM,kBAAkB,EAAE,iBAAiB,IAAI;YAE/C,IACE,CAAC,EAAE,MAAM,IACT,CAAC,EAAE,KAAK,IACR,CAAC,MAAM,IAAI,IACX,EAAE,UAAU,IAAI,mBAChB,EAAE,UAAU,GAAG,KACf,EAAE,WAAW,GAAG,GAChB;gBACA,MAAM,IAAI,GAAG;gBACb,IAAI;oBACF,MAAM,gBAAgB,MAAM,aAAa;oBACzC,MAAM,aAAa,MAAM,UAAU;oBACnC,IAAI,CAAC,iBAAiB,CAAC,YACrB,MAAM,IAAI,MAAM;oBAElB,WAAW,SAAS,CAAC,GAAG,GAAG,GAAG,cAAc,KAAK,EAAE,cAAc,MAAM;oBACvE,MAAM,QAAQ,MAAM,kBAAkB;oBACtC,MAAM,UAAU,IAAI;oBAEpB,IAAI,CAAC,SAAS,GAAG,WAAW,CAC1B;wBACE,KAAK;wBACL;oBACF,GACA;wBAAC;qBAAM;gBAEX,EAAE,OAAO,GAAG;oBACV,QAAQ,IAAI,CAAC,uBAAuB;gBACtC,SAAU;oBACR,IAAI,IAAI,CAAC,aAAa,EACpB,IAAI,CAAC,aAAa,CAAC,IAAI,GAAG;gBAE9B;YACF;YAEA,IAAI,CAAC,cAAc,GAAG,sBAAsB;QAC9C;QAEA,IAAI,CAAC,cAAc,GAAG,sBAAsB;IAC9C;IAEA,sBAAsB;QACpB,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,qBAAqB,IAAI,CAAC,cAAc;YACxC,IAAI,CAAC,cAAc,GAAG;QACxB;QACA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,IAAI,CAAC,aAAa,CAAC,OAAO,GAAG;YAC7B,IAAI,CAAC,aAAa,GAAG;QACvB;IACF;IAEA,MAAM,iBAAiB,IAAI,EAAE,WAAW,EAAE,WAAW,IAAI,EAAE;QACzD,MAAM,UAAU,KAAK,IAAI,CAAC,UAAU,CAAC;QACrC,MAAM,OAAO,eAAe,IAAI,CAAC,WAAW;QAC5C,MAAM,OAAO,UACT,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM,QAC9B,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM;QAClC,MAAM,MAAM,IAAI,eAAe,CAAC;QAChC,MAAM,OAAO,SAAS,aAAa,CAAC;QACpC,KAAK,IAAI,GAAG;QACZ,KAAK,QAAQ,GACX,YAAY,CAAC,SAAS,EAAE,KAAK,GAAG,GAAG,CAAC,EAAE,UAAU,QAAQ,OAAO;QACjE,KAAK,KAAK;QACV,IAAI,eAAe,CAAC;QACpB,OAAO;IACT;IAEA,uBAAuB;QACrB,OAAO,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ;IAClC;IAEA,aAAa,mBAAmB;QAC9B,IAAI;YACF,IAAI,UAAU,GAAG,EAAE;gBACjB,MAAM,UAAU,MAAM,UAAU,GAAG,CAAC,cAAc;gBAClD,IAAI,SAAS;oBACX,MAAM,SAAS,QAAQ,MAAM,CAAC,2BAA2B,GAAG;oBAC5D,MAAM,UAAU;oBAChB,OAAO,KAAK,GAAG,CAAC,QAAQ;gBAC1B;YACF;YACA,MAAM,SAAS,SAAS,aAAa,CAAC;YACtC,MAAM,KAAK,OAAO,UAAU,CAAC;YAC7B,IAAI,IAAI,OAAO,GAAG,YAAY,CAAC,GAAG,gBAAgB,KAAK;YACvD,OAAO;QACT,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,OAAO,iBAAiB;QACtB,IAAI;YACF,IAAI,UAAU,GAAG,EAAE,OAAO;YAC1B,IAAI,SAAS,aAAa,CAAC,UAAU,UAAU,CAAC,WAAW,OAAO;YAClE,OAAO;QACT,EAAE,OAAM;YACN,OAAO;QACT;IACF;IAEA,cAAc;QACZ,OAAO;YACL,SAAS,SAAS,cAAc;YAChC,cAAc;YACd,UAAU;YACV,OAAO;YACP,QAAQ;QACV;IACF;IAEA,WAAW,QAAQ,EAAE;QACnB,IAAI,OAAO,aAAa,YACtB,IAAI,CAAC,gBAAgB,GAAG;IAE5B;IAEA,UAAU;QACR,IAAI,CAAC,mBAAmB;QACxB,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,cAAc,CAAC,SAAS;YAC7B,IAAI,CAAC,cAAc,GAAG;QACxB;QACA,IAAI,CAAC,eAAe,GAAG,CAAC;QACxB,IAAI,CAAC,gBAAgB,GAAG;QACxB,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,YAAY,CAAC,KAAK;IACzB;AACF;kBApmBqB;;;ACArB,QAAQ,cAAc,GAAG,SAAU,CAAC;IAClC,OAAO,KAAK,EAAE,UAAU,GAAG,IAAI;QAAC,SAAS;IAAC;AAC5C;AAEA,QAAQ,iBAAiB,GAAG,SAAU,CAAC;IACrC,OAAO,cAAc,CAAC,GAAG,cAAc;QAAC,OAAO;IAAI;AACrD;AAEA,QAAQ,SAAS,GAAG,SAAU,MAAM,EAAE,IAAI;IACxC,OAAO,IAAI,CAAC,QAAQ,OAAO,CAAC,SAAU,GAAG;QACvC,IACE,QAAQ,aACR,QAAQ,gBACR,OAAO,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,MAE3C;QAGF,OAAO,cAAc,CAAC,MAAM,KAAK;YAC/B,YAAY;YACZ,KAAK;gBACH,OAAO,MAAM,CAAC,IAAI;YACpB;QACF;IACF;IAEA,OAAO;AACT;AAEA,QAAQ,MAAM,GAAG,SAAU,IAAI,EAAE,QAAQ,EAAE,GAAG;IAC5C,OAAO,cAAc,CAAC,MAAM,UAAU;QACpC,YAAY;QACZ,KAAK;IACP;AACF","sources":["packages/artplayer-plugin-websr/src/index.js","packages/artplayer-plugin-websr/src/Upscaler.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import Upscaler from \"./Upscaler.js\";\r\n\r\nfunction artplayerPluginWebsr(\r\n    option = {\r\n        networkSize: \"medium\",\r\n        compare: false,\r\n        weightsBaseUrl: \"/weights\",\r\n        workerUrl: \"/worker/main.js\",\r\n        videoScale: 2,\r\n    },\r\n) {\r\n    return (art) => {\r\n        const { $video, $player } = art.template;\r\n\r\n        const $canvas = document.createElement(\"canvas\");\r\n        $player.appendChild($canvas);\r\n\r\n        $canvas.style.position = \"absolute\";\r\n        $canvas.style.zIndex = \"11\";\r\n        $canvas.style.pointerEvents = \"none\";\r\n        $canvas.style.top = \"50%\";\r\n        $canvas.style.left = \"50%\";\r\n        $canvas.style.transform = \"translate(-50%, -50%)\";\r\n        $canvas.style.opacity = \"0\";\r\n        $canvas.style.transition = \"opacity 0.2s ease\";\r\n\r\n        function calcCanvasSize() {\r\n            const videoElement = art.video;\r\n            const containerWidth = $player.offsetWidth || 640;\r\n            const containerHeight = $player.offsetHeight || 360;\r\n            const videoWidth = videoElement.videoWidth || 640;\r\n            const videoHeight = videoElement.videoHeight || 360;\r\n            const aspectRatio = videoWidth / videoHeight;\r\n            let displayWidth = containerWidth;\r\n            let displayHeight = containerHeight;\r\n            if (containerWidth / containerHeight > aspectRatio) {\r\n                displayWidth = containerHeight * aspectRatio;\r\n            } else {\r\n                displayHeight = containerWidth / aspectRatio;\r\n            }\r\n            return { displayWidth, displayHeight };\r\n        }\r\n\r\n        if (!Upscaler || !Upscaler.isSupported || !Upscaler.isSupported()) {\r\n            console.warn(\"Upscaler is not supported in this environment\");\r\n            return;\r\n        }\r\n\r\n        const upscaler = new Upscaler({\r\n            networkSize: option.networkSize || \"medium\",\r\n            weightsBaseUrl: option.weightsBaseUrl || \"/weights\",\r\n            workerUrl: option.workerUrl || \"/worker/main.js\",\r\n            videoScale: option.videoScale || 2,\r\n        });\r\n\r\n        let realtimeStarted = false;\r\n\r\n        async function startRealtime() {\r\n            if (realtimeStarted) return;\r\n            realtimeStarted = true;\r\n\r\n            try {\r\n                await new Promise((resolve, reject) => {\r\n                    if ($video.readyState >= 1) {\r\n                        resolve();\r\n                        return;\r\n                    }\r\n                    const onLoaded = () => {\r\n                        cleanup();\r\n                        resolve();\r\n                    };\r\n                    const onError = () => {\r\n                        cleanup();\r\n                        reject(new Error(\"Failed to load video metadata\"));\r\n                    };\r\n                    const cleanup = () => {\r\n                        $video.removeEventListener(\"loadedmetadata\", onLoaded);\r\n                        $video.removeEventListener(\"error\", onError);\r\n                    };\r\n                    $video.addEventListener(\"loadedmetadata\", onLoaded);\r\n                    $video.addEventListener(\"error\", onError);\r\n                });\r\n\r\n                await upscaler.startRealtimeUpscale(\r\n                    $video,\r\n                    $canvas,\r\n                    option.networkSize || upscaler.networkSize,\r\n                );\r\n\r\n                requestAnimationFrame(() => {\r\n                    $canvas.style.opacity = \"1\";\r\n                });\r\n            } catch (e) {\r\n                console.error(\r\n                    \"artplayer-plugin-upscaler: failed to start realtime\",\r\n                    e,\r\n                );\r\n            }\r\n        }\r\n\r\n        const { displayWidth, displayHeight } = calcCanvasSize();\r\n        $canvas.style.width = displayWidth + \"px\";\r\n        $canvas.style.height = displayHeight + \"px\";\r\n\r\n        let comparePosition = 50;\r\n        let isDragging = false;\r\n        let compareEnabled = !!option.compare;\r\n\r\n        const $handler = document.createElement(\"div\");\r\n        $handler.style.position = \"absolute\";\r\n        $handler.style.width = \"3px\";\r\n        $handler.style.backgroundColor = \"rgba(255, 255, 255, 0.75)\";\r\n        $handler.style.cursor = \"ew-resize\";\r\n        $handler.style.zIndex = \"12\";\r\n        $handler.style.pointerEvents = \"auto\";\r\n        $handler.style.display = compareEnabled ? \"block\" : \"none\";\r\n        $handler.style.boxShadow = \"0 0 2px rgba(0, 0, 0, 0.1)\";\r\n\r\n        if (compareEnabled) {\r\n            $player.appendChild($handler);\r\n            $handler.addEventListener(\"mousedown\", handleMouseDown);\r\n            document.addEventListener(\"mousemove\", handleMouseMove);\r\n            document.addEventListener(\"mouseup\", handleMouseUp);\r\n            updateCompareMask();\r\n        }\r\n\r\n        function updateCompareMask() {\r\n            if (compareEnabled) {\r\n                const { displayWidth, displayHeight } = calcCanvasSize();\r\n                const gradient = `linear-gradient(to right, transparent 0%, transparent ${comparePosition}%, black ${comparePosition}%, black 100%)`;\r\n                $canvas.style.maskImage = gradient;\r\n\r\n                const containerWidth = $player.offsetWidth || 640;\r\n                const containerHeight = $player.offsetHeight || 360;\r\n                const canvasLeft = (containerWidth - displayWidth) / 2;\r\n                const canvasTop = (containerHeight - displayHeight) / 2;\r\n                const handlerX =\r\n                    canvasLeft + (displayWidth * comparePosition) / 100;\r\n\r\n                $handler.style.top = canvasTop + \"px\";\r\n                $handler.style.left = handlerX + \"px\";\r\n                $handler.style.height = displayHeight + \"px\";\r\n                $handler.style.transform = \"translateX(-50%)\";\r\n            } else {\r\n                $canvas.style.maskImage = \"none\";\r\n            }\r\n        }\r\n\r\n        function handleMouseDown(e) {\r\n            if (compareEnabled) {\r\n                isDragging = true;\r\n            }\r\n        }\r\n\r\n        function handleMouseMove(e) {\r\n            if (compareEnabled && isDragging) {\r\n                const rect = $player.getBoundingClientRect();\r\n                const { displayWidth } = calcCanvasSize();\r\n                const containerWidth = $player.offsetWidth || 640;\r\n                const canvasLeft = (containerWidth - displayWidth) / 2;\r\n                const x = e.clientX - rect.left;\r\n                const relativeX = x - canvasLeft;\r\n                comparePosition = (relativeX / displayWidth) * 100;\r\n                comparePosition = Math.max(0, Math.min(100, comparePosition));\r\n                updateCompareMask();\r\n            }\r\n        }\r\n\r\n        function handleMouseUp(e) {\r\n            isDragging = false;\r\n        }\r\n\r\n        art.on(\"destroy\", () => {\r\n            if (upscaler && typeof upscaler.dispose === \"function\") {\r\n                upscaler.dispose();\r\n            }\r\n            $handler.removeEventListener(\"mousedown\", handleMouseDown);\r\n            document.removeEventListener(\"mousemove\", handleMouseMove);\r\n            document.removeEventListener(\"mouseup\", handleMouseUp);\r\n        });\r\n\r\n        art.on(\"resize\", () => {\r\n            const { displayWidth, displayHeight } = calcCanvasSize();\r\n            $canvas.style.width = displayWidth + \"px\";\r\n            $canvas.style.height = displayHeight + \"px\";\r\n            updateCompareMask();\r\n        });\r\n\r\n        art.on(\"play\", () => {\r\n            startRealtime();\r\n        });\r\n\r\n        function update(newOption = {}) {\r\n            if (!newOption || typeof newOption !== \"object\") return;\r\n\r\n            if (Object.prototype.hasOwnProperty.call(newOption, \"compare\")) {\r\n                const nextCompare = !!newOption.compare;\r\n                option.compare = nextCompare;\r\n                compareEnabled = nextCompare;\r\n\r\n                if (compareEnabled) {\r\n                    if (!$handler.parentNode) {\r\n                        $player.appendChild($handler);\r\n                    }\r\n                    $handler.style.display = \"block\";\r\n                    $handler.addEventListener(\"mousedown\", handleMouseDown);\r\n                    document.addEventListener(\"mousemove\", handleMouseMove);\r\n                    document.addEventListener(\"mouseup\", handleMouseUp);\r\n                    updateCompareMask();\r\n                } else {\r\n                    $canvas.style.maskImage = \"none\";\r\n                    $handler.style.display = \"none\";\r\n                    $handler.removeEventListener(\"mousedown\", handleMouseDown);\r\n                    document.removeEventListener(\"mousemove\", handleMouseMove);\r\n                    document.removeEventListener(\"mouseup\", handleMouseUp);\r\n                }\r\n            }\r\n\r\n            if (newOption.networkSize) {\r\n                const nextSize = newOption.networkSize;\r\n                option.networkSize = nextSize;\r\n                if (\r\n                    upscaler &&\r\n                    typeof upscaler.stopRealtimeUpscale === \"function\"\r\n                ) {\r\n                    upscaler.stopRealtimeUpscale();\r\n                }\r\n                realtimeStarted = false;\r\n                if (!art.paused) {\r\n                    startRealtime();\r\n                }\r\n            }\r\n        }\r\n\r\n        return {\r\n            name: \"artplayerPluginWebsr\",\r\n            upscaler,\r\n            update,\r\n        };\r\n    };\r\n}\r\n\r\nwindow.artplayerPluginWebsr = artplayerPluginWebsr;\r\n","export default class Upscaler {\n  static DEFAULT_TIMEOUTS = { IMAGE: 300000, VIDEO: 3600000, METADATA: 10000 };\n  static DEFAULT_DELAYS = { INIT: 500, NETWORK: 300 };\n\n  static isSupported() {\n    try {\n      const hasWorker = typeof Worker !== \"undefined\";\n      const hasOffscreen =\n        typeof OffscreenCanvas !== \"undefined\" ||\n        (typeof document !== \"undefined\" &&\n          !!document.createElement(\"canvas\").transferControlToOffscreen);\n      const hasBlob = typeof Blob !== \"undefined\";\n      return hasWorker && hasOffscreen && hasBlob;\n    } catch {\n      return false;\n    }\n  }\n\n  static isVideoSupported() {\n    try {\n      return (\n        typeof VideoEncoder !== \"undefined\" &&\n        typeof VideoDecoder !== \"undefined\"\n      );\n    } catch {\n      return false;\n    }\n  }\n\n  constructor(options = {}) {\n    const weightsBaseUrl = options.weightsBaseUrl || \"/weights\";\n\n    this.networks = options.networks || {\n      small: {\n        name: \"anime4k/cnn-2x-l\",\n        weightsUrl: `${weightsBaseUrl}/cnn-8.json`,\n      },\n      medium: {\n        name: \"anime4k/cnn-2x-16\",\n        weightsUrl: `${weightsBaseUrl}/cnn-16.json`,\n      },\n      large: {\n        name: \"anime4k/cnn-2x-28\",\n        weightsUrl: `${weightsBaseUrl}/cnn-28.json`,\n      },\n    };\n\n    this.weightsBaseUrl = weightsBaseUrl;\n    this.networkSize = options.networkSize || \"medium\";\n    this.workerUrl = options.workerUrl || \"/worker/main.js\";\n\n    this.timeouts = {\n      ...Upscaler.DEFAULT_TIMEOUTS,\n      ...(options.timeouts || {}),\n    };\n    this.delays = { ...Upscaler.DEFAULT_DELAYS, ...(options.delays || {}) };\n\n    this.imageScale =\n      typeof options.imageScale === \"number\" && options.imageScale > 0\n        ? options.imageScale\n        : 2;\n    this.videoScale =\n      typeof options.videoScale === \"number\" && options.videoScale > 0\n        ? options.videoScale\n        : 2;\n\n    this.weightsCache = new Map();\n    this.workerInstance = null;\n    this.messageHandlers = {};\n    this.progressCallback = null;\n    this.processingType = null;\n\n    this.realtimeLoopId = null;\n    this.realtimeState = null;\n\n    this.init();\n  }\n\n  init({ prewarm = true } = {}) {\n    if (!Upscaler.isSupported()) {\n      throw new Error(\"Upscaler is not supported in this environment\");\n    }\n    if (prewarm) {\n      this.getWorker().postMessage({ cmd: \"isSupported\" });\n    }\n    return this;\n  }\n\n  getWorker() {\n    if (!this.workerInstance) {\n      this.workerInstance = new Worker(this.workerUrl);\n      this.workerInstance.onmessage = (event) =>\n        this.handleWorkerMessage(event);\n    }\n    return this.workerInstance;\n  }\n\n  static extractProgressValue(data) {\n    const value = data.data ?? data.progress ?? data.value ?? data.percentage;\n    return typeof value === \"number\"\n      ? Math.min(100, Math.max(0, Math.round(value)))\n      : null;\n  }\n\n  handleBlobResponse(data) {\n    const blobType =\n      this.processingType === \"video\" ? \"videoBlob\" : \"imageBlob\";\n    const handler = this.messageHandlers[blobType];\n    if (data.data instanceof Blob && handler) {\n      handler({ [blobType]: data.data });\n    }\n  }\n\n  requestBlob() {\n    const cmd =\n      this.processingType === \"video\" ? \"getVideoBlob\" : \"getImageBlob\";\n    this.getWorker().postMessage({ cmd });\n  }\n\n  handleWorkerMessage(event) {\n    const { data } = event;\n    console.debug(\"Worker message:\", data);\n    if (!data.cmd) return;\n\n    const { cmd } = data;\n\n    if (cmd === \"progress\") {\n      const progress = Upscaler.extractProgressValue(data);\n      if (progress !== null && this.progressCallback) {\n        this.progressCallback(progress);\n      }\n      if (this.messageHandlers.progress) this.messageHandlers.progress(data);\n    } else if (cmd === \"finished\") {\n      if (data.data instanceof Blob) {\n        this.handleBlobResponse(data);\n      } else {\n        this.requestBlob();\n      }\n    } else if (this.messageHandlers[cmd]) {\n      this.messageHandlers[cmd](data);\n    }\n  }\n\n  async loadWeights(networkSize) {\n    this.validateNetworkSize(networkSize);\n    if (this.weightsCache.has(networkSize)) {\n      return this.weightsCache.get(networkSize);\n    }\n    const network = this.networks[networkSize];\n    const response = await fetch(network.weightsUrl);\n    if (!response.ok)\n      throw new Error(`Failed to fetch weights: ${response.statusText}`);\n    const weights = await response.json();\n    this.weightsCache.set(networkSize, weights);\n    return weights;\n  }\n\n  static loadImageMetadata(arrayBuffer, mimeType) {\n    return new Promise((resolve, reject) => {\n      const blob = new Blob([arrayBuffer], { type: mimeType });\n      const url = URL.createObjectURL(blob);\n      const img = new Image();\n\n      img.onload = () => {\n        URL.revokeObjectURL(url);\n        resolve({ width: img.width, height: img.height });\n      };\n\n      img.onerror = () => {\n        URL.revokeObjectURL(url);\n        reject(new Error(\"Failed to load image\"));\n      };\n\n      img.src = url;\n    });\n  }\n\n  static loadVideoMetadata(file, timeoutMs) {\n    return new Promise((resolve, reject) => {\n      const url = URL.createObjectURL(file);\n      const video = document.createElement(\"video\");\n      video.src = url;\n\n      const timeout = setTimeout(() => reject(new Error(\"Timeout\")), timeoutMs);\n\n      video.onloadedmetadata = () => {\n        clearTimeout(timeout);\n        URL.revokeObjectURL(url);\n        resolve({\n          width: video.videoWidth,\n          height: video.videoHeight,\n          duration: video.duration,\n        });\n      };\n\n      video.onerror = () => {\n        clearTimeout(timeout);\n        URL.revokeObjectURL(url);\n        reject(new Error(\"Failed to load video\"));\n      };\n    });\n  }\n\n  createOffscreenCanvas(width, height, scale = 2) {\n    const factor = typeof scale === \"number\" && scale > 0 ? scale : 1;\n    const canvas = document.createElement(\"canvas\");\n    canvas.width = width * factor;\n    canvas.height = height * factor;\n    if (typeof canvas.transferControlToOffscreen !== \"function\") {\n      throw new Error(\"OffscreenCanvas is not supported in this environment\");\n    }\n    return canvas.transferControlToOffscreen();\n  }\n\n  createBlobPromise(blobType, timeout) {\n    return new Promise((resolve, reject) => {\n      const timeoutId = setTimeout(() => {\n        if (this.messageHandlers[blobType]) {\n          delete this.messageHandlers[blobType];\n          reject(new Error(`${blobType} processing timeout`));\n        }\n      }, timeout);\n\n      this.messageHandlers[blobType] = (msg) => {\n        delete this.messageHandlers[blobType];\n        clearTimeout(timeoutId);\n        const blob = msg[blobType] || msg.data;\n        if (blob instanceof Blob) {\n          resolve(blob);\n        } else {\n          reject(new Error(`Invalid ${blobType} format`));\n        }\n      };\n    });\n  }\n\n  validateNetworkSize(size) {\n    if (!this.networks[size]) {\n      throw new Error(\n        \"Invalid networkSize: use one of \" +\n          Object.keys(this.networks).join(\", \"),\n      );\n    }\n  }\n\n  async upscaleImage(imageFile, networkSize, scaleOverride) {\n    if (!imageFile) throw new Error(\"Image file is required\");\n    const size = networkSize || this.networkSize;\n    this.validateNetworkSize(size);\n\n    this.processingType = \"image\";\n    const arrayBuffer = await imageFile.arrayBuffer();\n    const mimeType = imageFile.type || \"image/jpeg\";\n    const { width, height } = await Upscaler.loadImageMetadata(\n      arrayBuffer,\n      mimeType,\n    );\n\n    const weights = await this.loadWeights(size);\n    const network = this.networks[size];\n    const scale =\n      typeof scaleOverride === \"number\" && scaleOverride > 0\n        ? scaleOverride\n        : this.imageScale;\n    const [canvasUp, canvasOrig] = [\n      this.createOffscreenCanvas(width, height, scale),\n      this.createOffscreenCanvas(width, height, 1),\n    ];\n\n    const blobPromise = this.createBlobPromise(\n      \"imageBlob\",\n      this.timeouts.IMAGE,\n    );\n\n    this.getWorker().postMessage(\n      {\n        cmd: \"init\",\n        data: {\n          imageArrayBuffer: arrayBuffer,\n          imageMimeType: mimeType,\n          upscaled: canvasUp,\n          original: canvasOrig,\n          resolution: { width, height },\n          network_name: network.name,\n          weights,\n        },\n      },\n      [canvasUp, canvasOrig],\n    );\n\n    setTimeout(() => {\n      this.getWorker().postMessage({\n        cmd: \"network\",\n        data: {\n          name: network.name,\n          imageArrayBuffer: arrayBuffer,\n          imageMimeType: mimeType,\n          weights,\n        },\n      });\n\n      setTimeout(() => {\n        this.getWorker().postMessage({\n          cmd: \"getImageBlob\",\n          data: { imageArrayBuffer: arrayBuffer, imageMimeType: mimeType },\n        });\n      }, this.delays.NETWORK);\n    }, this.delays.INIT);\n\n    return blobPromise;\n  }\n\n  async upscaleVideo(videoFile, networkSize, scaleOverride) {\n    if (!videoFile) throw new Error(\"Video file is required\");\n    const size = networkSize || this.networkSize;\n    this.validateNetworkSize(size);\n\n    if (!Upscaler.isVideoSupported()) {\n      throw new Error(\"WebCodecs API not supported. Requires Chrome 94+\");\n    }\n\n    this.processingType = \"video\";\n    const { width, height, duration } = await Upscaler.loadVideoMetadata(\n      videoFile,\n      this.timeouts.METADATA,\n    );\n\n    const weights = await this.loadWeights(size);\n    const network = this.networks[size];\n    const scale =\n      typeof scaleOverride === \"number\" && scaleOverride > 0\n        ? scaleOverride\n        : this.videoScale;\n    const [canvasOut, canvasIn] = [\n      this.createOffscreenCanvas(width, height, scale),\n      this.createOffscreenCanvas(width, height, 1),\n    ];\n\n    const blobPromise = this.createBlobPromise(\n      \"videoBlob\",\n      this.timeouts.VIDEO,\n    );\n\n    this.getWorker().postMessage(\n      {\n        cmd: \"process\",\n        file: videoFile,\n        fileSize: videoFile.size,\n        duration,\n        adjustedResolution: {\n          adjustedInputWidth: width,\n          adjustedInputHeight: height,\n          adjustedOutputWidth: width * scale,\n          adjustedOutputHeight: height * scale,\n        },\n        upscaled: canvasOut,\n        original: canvasIn,\n        weights,\n        network_name: network.name,\n        skipDemuxProgress: true,\n      },\n      [canvasOut, canvasIn],\n    );\n\n    return blobPromise;\n  }\n\n  async startRealtimeUpscale(\n    videoElement,\n    canvasElement,\n    networkSize,\n    scaleOverride,\n  ) {\n    if (!videoElement || !canvasElement) {\n      throw new Error(\"videoElement and canvasElement are required\");\n    }\n\n    const size = networkSize || this.networkSize;\n    this.validateNetworkSize(size);\n\n    const network = this.networks[size];\n    const weights = await this.loadWeights(size);\n\n    const scale =\n      typeof scaleOverride === \"number\" && scaleOverride > 0\n        ? scaleOverride\n        : this.videoScale;\n\n    const ensureMetadata = () => {\n      return new Promise((resolve, reject) => {\n        if (videoElement.readyState >= 1) {\n          resolve();\n          return;\n        }\n        const onLoaded = () => {\n          cleanup();\n          resolve();\n        };\n        const onError = () => {\n          cleanup();\n          reject(new Error(\"Failed to load video metadata\"));\n        };\n        const cleanup = () => {\n          videoElement.removeEventListener(\"loadedmetadata\", onLoaded);\n          videoElement.removeEventListener(\"error\", onError);\n        };\n        videoElement.addEventListener(\"loadedmetadata\", onLoaded);\n        videoElement.addEventListener(\"error\", onError);\n      });\n    };\n\n    await ensureMetadata();\n\n    const width = videoElement.videoWidth;\n    const height = videoElement.videoHeight;\n    if (!width || !height) {\n      throw new Error(\"Invalid video dimensions\");\n    }\n\n    const firstInit = !canvasElement._upscalerTransferred;\n\n    let offscreen = null;\n    if (firstInit) {\n      canvasElement.width = width * scale;\n      canvasElement.height = height * scale;\n\n      if (typeof canvasElement.transferControlToOffscreen !== \"function\") {\n        throw new Error(\"OffscreenCanvas is not supported in this environment\");\n      }\n\n      offscreen = canvasElement.transferControlToOffscreen();\n      canvasElement._upscalerTransferred = true;\n    }\n\n    const captureCanvas = document.createElement(\"canvas\");\n    captureCanvas.width = width;\n    captureCanvas.height = height;\n    const captureCtx = captureCanvas.getContext(\"2d\");\n\n    if (this.realtimeLoopId) {\n      cancelAnimationFrame(this.realtimeLoopId);\n      this.realtimeLoopId = null;\n    }\n\n    const initPayload = {\n      cmd: \"realtimeInit\",\n      data: {\n        upscaled: firstInit ? offscreen : null,\n        resolution: {\n          width,\n          height,\n          scale,\n          outputWidth: width * scale,\n          outputHeight: height * scale,\n        },\n        network_name: network.name,\n        weights,\n      },\n    };\n\n    if (firstInit && offscreen) {\n      this.getWorker().postMessage(initPayload, [offscreen]);\n    } else {\n      this.getWorker().postMessage(initPayload);\n    }\n\n    this.realtimeState = {\n      running: true,\n      video: videoElement,\n      canvas: canvasElement,\n      scale,\n      busy: false,\n      frameIndex: 0,\n      captureCanvas,\n      captureCtx,\n    };\n\n    const loop = async () => {\n      if (!this.realtimeState || !this.realtimeState.running) return;\n      const state = this.realtimeState;\n      const v = state.video;\n\n      const haveCurrentData = v.HAVE_CURRENT_DATA || 2;\n\n      if (\n        !v.paused &&\n        !v.ended &&\n        !state.busy &&\n        v.readyState >= haveCurrentData &&\n        v.videoWidth > 0 &&\n        v.videoHeight > 0\n      ) {\n        state.busy = true;\n        try {\n          const captureCanvas = state.captureCanvas;\n          const captureCtx = state.captureCtx;\n          if (!captureCanvas || !captureCtx) {\n            throw new Error(\"Missing capture canvas\");\n          }\n          captureCtx.drawImage(v, 0, 0, captureCanvas.width, captureCanvas.height);\n          const frame = await createImageBitmap(captureCanvas);\n          state.frameIndex += 1;\n\n          this.getWorker().postMessage(\n            {\n              cmd: \"realtimeFrame\",\n              frame,\n            },\n            [frame],\n          );\n        } catch (e) {\n          console.warn(\"realtimeFrame error\", e);\n        } finally {\n          if (this.realtimeState) {\n            this.realtimeState.busy = false;\n          }\n        }\n      }\n\n      this.realtimeLoopId = requestAnimationFrame(loop);\n    };\n\n    this.realtimeLoopId = requestAnimationFrame(loop);\n  }\n\n  stopRealtimeUpscale() {\n    if (this.realtimeLoopId) {\n      cancelAnimationFrame(this.realtimeLoopId);\n      this.realtimeLoopId = null;\n    }\n    if (this.realtimeState) {\n      this.realtimeState.running = false;\n      this.realtimeState = null;\n    }\n  }\n\n  async downloadUpscaled(file, networkSize, filename = null) {\n    const isVideo = file.type.startsWith(\"video\");\n    const size = networkSize || this.networkSize;\n    const blob = isVideo\n      ? await this.upscaleVideo(file, size)\n      : await this.upscaleImage(file, size);\n    const url = URL.createObjectURL(blob);\n    const link = document.createElement(\"a\");\n    link.href = url;\n    link.download =\n      filename || `upscaled_${Date.now()}.${isVideo ? \"mp4\" : \"png\"}`;\n    link.click();\n    URL.revokeObjectURL(url);\n    return blob;\n  }\n\n  getSupportedNetworks() {\n    return Object.keys(this.networks);\n  }\n\n  static async getGPUCapability() {\n    try {\n      if (navigator.gpu) {\n        const adapter = await navigator.gpu.requestAdapter();\n        if (adapter) {\n          const buffer = adapter.limits.maxStorageBufferBindingSize / 512;\n          const texture = 8192 * 8192;\n          return Math.min(buffer, texture);\n        }\n      }\n      const canvas = document.createElement(\"canvas\");\n      const gl = canvas.getContext(\"webgl2\");\n      if (gl) return gl.getParameter(gl.MAX_TEXTURE_SIZE) ** 2;\n      return 8388608;\n    } catch {\n      return 8388608;\n    }\n  }\n\n  static getBackendType() {\n    try {\n      if (navigator.gpu) return \"webgpu\";\n      if (document.createElement(\"canvas\").getContext(\"webgl2\")) return \"webgl\";\n      return \"unknown\";\n    } catch {\n      return \"unknown\";\n    }\n  }\n\n  getAppState() {\n    return {\n      backend: Upscaler.getBackendType(),\n      isProcessing: false,\n      progress: 0,\n      width: 0,\n      height: 0,\n    };\n  }\n\n  onProgress(callback) {\n    if (typeof callback === \"function\") {\n      this.progressCallback = callback;\n    }\n  }\n\n  dispose() {\n    this.stopRealtimeUpscale();\n    if (this.workerInstance) {\n      this.workerInstance.terminate();\n      this.workerInstance = null;\n    }\n    this.messageHandlers = {};\n    this.progressCallback = null;\n    this.processingType = null;\n    this.weightsCache.clear();\n  }\n}","exports.interopDefault = function (a) {\n  return a && a.__esModule ? a : {default: a};\n};\n\nexports.defineInteropFlag = function (a) {\n  Object.defineProperty(a, '__esModule', {value: true});\n};\n\nexports.exportAll = function (source, dest) {\n  Object.keys(source).forEach(function (key) {\n    if (\n      key === 'default' ||\n      key === '__esModule' ||\n      Object.prototype.hasOwnProperty.call(dest, key)\n    ) {\n      return;\n    }\n\n    Object.defineProperty(dest, key, {\n      enumerable: true,\n      get: function () {\n        return source[key];\n      },\n    });\n  });\n\n  return dest;\n};\n\nexports.export = function (dest, destName, get) {\n  Object.defineProperty(dest, destName, {\n    enumerable: true,\n    get: get,\n  });\n};\n"],"names":[],"version":3,"file":"index.js.map","sourceRoot":"../../../"}
\ No newline at end of file
diff --git a/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.js b/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.js
index 595a03982..2e8afed40 100644
--- a/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.js
+++ b/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.js
@@ -5,4 +5,4 @@
  * (c) 2017-2026 Harvey Zack
  * Released under the MIT License.
  */
-!function(e,n,t,r,s){var i="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof i[r]&&i[r],u=o.i||{},a=o.cache||{},c="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(n,t){if(!a[n]){if(!e[n]){if(s[n])return s[n];var u="function"==typeof i[r]&&i[r];if(!t&&u)return u(n,!0);if(o)return o(n,!0);if(c&&"string"==typeof n)return c(n);var f=Error("Cannot find module '"+n+"'");throw f.code="MODULE_NOT_FOUND",f}_.resolve=p,_.cache={};var d=a[n]=new l.Module(n);e[n][0].call(d.exports,_,d,d.exports,i)}return a[n].exports;function _(e){var n=_.resolve(e);if(!1===n)return{};if(Array.isArray(n)){var t={__esModule:!0};return n.forEach(function(e){var n=e[0],r=e[1],s=e[2]||e[0],i=l(r);"*"===n?Object.keys(i).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:function(){return i[e]}})}):"*"===s?Object.defineProperty(t,n,{enumerable:!0,value:i}):Object.defineProperty(t,n,{enumerable:!0,get:function(){return"default"===s?i.__esModule?i.default:i:i[s]}})}),t}return l(n)}function p(t){var r=e[n][1][t];return null!=r?r:t}}function f(e){this.id=e,this.bundle=l,this.require=c,this.exports={}}l.isParcelRequire=!0,l.Module=f,l.modules=e,l.cache=a,l.parent=o,l.distDir=void 0,l.publicUrl=void 0,l.devServer=void 0,l.i=u,l.register=function(n,t){e[n]=[function(e,n){n.exports=t},{}]},Object.defineProperty(l,"root",{get:function(){return i[r]}}),i[r]=l;for(var d=0;d<n.length;d++)l(n[d]);if(t){var _=l(t);"object"==typeof exports&&"u">typeof module?module.exports=_:"function"==typeof define&&define.amd&&define(function(){return _})}}({"80h6e":[function(e,n,t,r){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(t),s.export(t,"default",()=>u);var i=e("@websr/websr"),o=s.interopDefault(i);function u(e={}){return n=>{let{template:{$player:t},constructor:{validator:r,utils:{append:s,setStyles:i}}}=n;(e=r({scale:2,networkName:"",weights:null,compare:!1,...e},{scale:"number",networkName:"string",weights:"?string|object",compare:"boolean"})).networkName||console.error("WebSR: networkName is required"),e.weights||console.error("WebSR: weights is required");let u=null,a=null,c=!1,l=!0,f=null,d=.5,_=!1,p=document.createElement("canvas");p.id="artplayer-websr-canvas",i(p,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"block",pointerEvents:"none",zIndex:"11",imageRendering:"crisp-edges"}),s(t,p);let h=document.createElement("div");function x(n){if(i(h,{left:100*(d=Math.max(0,Math.min(1,n)))+"%"}),e.compare){let e=100*d;i(p,{clipPath:`inset(0 0 0 ${e}%)`})}}function v(){let e=n.video;if(!e)return{displayWidth:640,displayHeight:360};let r=t.offsetWidth||640,s=t.offsetHeight||360,i=(e.videoWidth||640)/(e.videoHeight||360),o=r,u=s;return r/s>i?o=s*i:u=r/i,{displayWidth:o,displayHeight:u}}async function b(){try{let t;if(c)return!0;if(!navigator.gpu)return console.warn("WebGPU is not supported"),!1;if(!(a=await o.default.initWebGPU()))return console.warn("Failed to initialize WebGPU"),!1;if("string"==typeof e.weights){let n=await fetch(e.weights);if(!n.ok)return console.warn(`Failed to load weights from ${e.weights}`),!1;t=await n.json()}else{if("object"!=typeof e.weights)return console.warn("Invalid weights format"),!1;t=e.weights}let r=n.video;if(!r)return console.warn("Video element not found"),!1;let{displayWidth:s,displayHeight:l}=v();return p.width=s*e.scale,p.height=l*e.scale,i(p,{width:s+"px",height:l+"px"}),u=new(0,o.default)({source:r,network_name:e.networkName,weights:t,gpu:a,canvas:p}),c=!0,!0}catch(e){return console.error("WebSR initialization error:",e),!1}}async function m(){if(u&&l&&n.video)try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}}async function y(){if(!u||!l||!n.video||n.video.paused){f=null;return}try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}l&&!n.video.paused&&(f=requestAnimationFrame(y))}async function w(){if(!l){if(!c&&!await b())return void console.error("Failed to initialize WebSR");l=!0,setStyle(p,"display","block"),n.video&&!n.video.paused&&(f=requestAnimationFrame(y)),n.emit("artplayerPluginWebsr:enable")}}function g(){l&&(l=!1,i(p,{display:"none"}),f&&(cancelAnimationFrame(f),f=null),n.emit("artplayerPluginWebsr:disable"))}async function k(){l?g():await w()}return h.id="artplayer-websr-divider",i(h,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"2px",height:"100%",backgroundColor:"#fff",display:e.compare?"block":"none",pointerEvents:"auto",cursor:"col-resize",zIndex:"12"}),s(t,h),document.addEventListener("mousemove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.clientX-n.left)/n.width)}),document.addEventListener("mouseup",()=>{_=!1}),h.addEventListener("mousedown",()=>{_=!0}),document.addEventListener("touchmove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.touches[0].clientX-n.left)/n.width)},{passive:!0}),document.addEventListener("touchend",()=>{_=!1}),h.addEventListener("touchstart",()=>{_=!0}),n.on("play",()=>{m(),l&&c&&!f&&(f=requestAnimationFrame(y))}),n.on("pause",()=>{f&&(cancelAnimationFrame(f),f=null)}),n.on("seek",()=>{l&&c&&!n.video.paused&&!f&&(f=requestAnimationFrame(y))}),n.on("resize",()=>{if(u&&p.offsetParent){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}),n.on("destroy",()=>{g(),f&&(cancelAnimationFrame(f),f=null),p.parentNode&&p.parentNode.removeChild(p)}),b().then(()=>{l&&c&&n.video&&m()}).catch(e=>console.error("Failed to init WebSR:",e)),{name:"artplayerPluginWebsr",websr:()=>u,gpu:()=>a,canvas:()=>p,enable:w,disable:g,toggle:k,isEnabled:()=>l,isInitialized:()=>c,enableCompare:()=>{e.compare=!0,i(h,{display:"block"}),x(d)},disableCompare:()=>{e.compare=!1,i(h,{display:"none"}),i(p,{clipPath:"none"})},toggleCompare:()=>{e.compare?(i(h,{display:"none"}),i(p,{clipPath:"none"}),e.compare=!1):(e.compare=!0,i(h,{display:"block"}),x(d))},setComparePosition:e=>{x(e)},getComparePosition:()=>d,isComparing:()=>e.compare,update:async n=>{if((void 0!==n.weights&&n.weights!==e.weights||void 0!==n.networkName&&n.networkName!==e.networkName)&&(void 0!==n.weights&&(e.weights=n.weights),void 0!==n.networkName&&(e.networkName=n.networkName),c=!1,l&&await b()),void 0!==n.scale&&n.scale!==e.scale&&(e.scale=n.scale,p)){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}}}}"u">typeof window&&(window.artplayerPluginWebsr=u)},{"@websr/websr":"sfGe3","@parcel/transformer-js/src/esmodule-helpers.js":"6ykb1"}],sfGe3:[function(require,module,exports,__globalThis){!function(e,n){module.exports=n()}(self,()=>(()=>{"use strict";var __webpack_modules__={"./src/context.ts":function(__unused_webpack_module,exports){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nclass WebGPUContext {\n constructor(device, resolution, canvas, scale, debug) {\n this.device = device;\n this.canvas = canvas;\n this.resolution = resolution;\n this.textures = {};\n this.buffers = {};\n this.destroyed = false;\n this.scale = scale;\n this.debug = debug;\n let context = this.canvas.getContext('webgpu');\n if (context instanceof GPUCanvasContext) {\n this.context = context;\n }\n else {\n throw new Error(\"Unable to load WebGPU context\");\n }\n this.context.configure({\n device: this.device,\n format: navigator.gpu.getPreferredCanvasFormat()\n });\n this.textureUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;\n this.bufferUsage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST;\n if (this.debug) {\n // Read output pixel value\n this.textureUsage = this.textureUsage | GPUTextureUsage.COPY_SRC;\n this.bufferUsage = this.bufferUsage | GPUBufferUsage.COPY_SRC;\n }\n this.textures['output'] = this.context.getCurrentTexture();\n }\n readBuffer(bufferName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.buffers[bufferName])\n throw new Error(`No buffer with name ${bufferName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${bufferName} buffer encoder`,\n });\n const buffer = this.buffers[bufferName];\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: buffer.size,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyBufferToBuffer(buffer, 0, resultBuffer, 0, resultBuffer.size);\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n let range = resultBuffer.getMappedRange();\n return new Float32Array(range);\n });\n }\n readTexture(textureName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.textures[textureName])\n throw new Error(`No texture with name ${textureName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${textureName} texture encoder`,\n });\n const texture = this.textures[textureName];\n let bitsPerPixel = 16;\n if (texture.format === 'rgba8unorm')\n bitsPerPixel = 4;\n if (texture.format === 'r32float')\n bitsPerPixel = 4;\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: texture.width * texture.height * bitsPerPixel,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyTextureToBuffer({\n texture: this.textures[textureName],\n }, {\n buffer: resultBuffer,\n bytesPerRow: texture.width * bitsPerPixel\n }, {\n width: texture.width,\n height: texture.height,\n depthOrArrayLayers: 1,\n });\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n if (texture.format === 'r32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba8unorm')\n return new Uint8ClampedArray(resultBuffer.getMappedRange());\n return new Float32Array(0);\n });\n }\n destroy() {\n this.device.destroy();\n this.destroyed = true;\n }\n buffer(key, options) {\n if (!this.buffers[key]) {\n options = options || {};\n const width = options.width || this.resolution.width;\n const height = options.height || this.resolution.height;\n const channels = options.channels || 4;\n const bitdepth = options.bitdepth || 4;\n this.buffers[key] = this.device.createBuffer({\n label: key,\n size: width * height * channels * bitdepth,\n usage: this.bufferUsage\n });\n }\n return this.buffers[key];\n }\n texture(key, options) {\n if (!this.textures[key]) {\n options = options || {};\n this.textures[key] = this.device.createTexture({\n label: key,\n size: [options.width || this.resolution.width, options.height || this.resolution.height],\n format: options.format || 'rgba32float',\n usage: this.textureUsage\n });\n }\n return this.textures[key];\n }\n}\nexports[\"default\"] = WebGPUContext;\n\n\n//# sourceURL=webpack://WebSR/./src/context.ts?\n}")},"./src/layers/anime4k/conv2d-112x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv112x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights, first) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv112x4";\n const kernels = weights.weights;\n this.createUniform("kernels", "array<mat4x4f, 28>");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n if (first) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 2}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n else {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i + 1}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 3}]*max(-1.0*pixel_val${i}, vec4f(0.0));`;\n }\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv112x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-112x4.ts?\n}')},"./src/layers/anime4k/conv2d-16x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv16x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv16x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 36>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val0 = inputBuffer0[buff_ind];\n let pix_val1 = inputBuffer1[buff_ind];\n \n result += kernels[i]*max(pix_val0, vec4f(0.0));\n result += kernels[i+9]*max(pix_val1, vec4f(0.0));\n result += kernels[i+18]*max(-1.0*pix_val0, vec4f(0.0));\n result += kernels[i+27]*max(-1.0*pix_val1, vec4f(0.0));\n } \n \n\n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv16x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-16x4.ts?\n}')},"./src/layers/anime4k/conv2d-3x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv3x4 extends base_compute_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.label = "Anime4KConv3x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 9>");\n this.createUniform("bias", "vec4f");\n // Set up pipeline in Lazy Load\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[0] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureLoad(inputTexture0, coord + offset)\' :\n \'textureLoad(inputTexture0, coord + offset, 0)\';\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let offset = vec2<i32>(kernel_offsets[i].xy);\n result += kernels[i]*${textureLoad};\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n}\nexports["default"] = Anime4KConv3x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-3x4.ts?\n}')},"./src/layers/anime4k/conv2d-56x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv56x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv56x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernels", "array<mat4x4f, 14>");\n this.createUniform("bias", "vec4f");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${2 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${2 * i + 1}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n result += bias;\n \n outputBuffer[buff_ind] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv56x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-56x4.ts?\n}')},"./src/layers/anime4k/conv2d-8x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv8x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv8x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 18>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val = inputBuffer0[buff_ind];\n \n result += kernels[i]*max(pix_val, vec4f(0.0));\n result += kernels[i+9]*max(-1.0*pix_val, vec4f(0.0));\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv8x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-8x4.ts?\n}')},"./src/layers/anime4k/conv2d-concat2.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConcat2 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConcat2";\n this.createUniform("bias", "vec4f");\n const bias = weights.bias;\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n \n outputBuffer[buff_ind] = inputBuffer0[buff_ind] + inputBuffer1[buff_ind] + bias;\n }\n `);\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConcat2;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-concat2.ts?\n}')},"./src/layers/anime4k/display.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display.ts?\n}')},"./src/layers/anime4k/display_1x.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let bicubic = ${textureLoad};\n \n return bicubic + inputBuffer0[i];\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_1x.ts?\n}')},"./src/layers/anime4k/display_3c.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer3C extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer3C";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[3] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var<storage, read_write>inputBuffer1: array<vec4f>;\n @group(0) @binding(2) var<storage, read_write>inputBuffer2: array<vec4f>;\n @group(0) @binding(3) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(4) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n let value1 = inputBuffer1[i][c_index];\n let value2 = inputBuffer2[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value, value1, value2, value2);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n vertex: {\n module: this.shader,\n entryPoint: \'vertexMain\',\n },\n fragment: {\n module: this.shader,\n entryPoint: \'fragmentMain\',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer3C;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_3c.ts?\n}')},"./src/layers/base_compute_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ "./src/layers/base_layer.ts");\nclass ComputeLayer extends base_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.num_work_groups = 8;\n }\n createStandardShader(computeShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.computeShaderInputs()}\n \n ${computeShader}\n `\n });\n }\n computeShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n if (this.inputs[i] instanceof GPUTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_2d<f32>;`);\n }\n else if (this.inputs[i] instanceof GPUExternalTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_external;`);\n }\n else if (this.inputs[i] instanceof GPUBuffer) {\n inputs.push(`@group(0) @binding(${i}) var<storage, read_write>inputBuffer${i}: array<vec4f>;`);\n }\n else {\n console.log(this.inputs[i]);\n throw new Error("Input is undefined or non of the correct input type");\n }\n }\n // console.log("This layer", this.label);\n // console.log(this.inputs.length);\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n inputs.push(`@group(0) @binding(${this.inputs.length + this.uniforms.length}) var<storage, read_write>outputBuffer: array<vec4f>;`);\n return inputs.join(\'\\n\');\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n lazyLoadSetup() {\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginComputePass({ label: this.label });\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n // Dividing into work groups speeds up inference. If width or height aren\'t cleandly divided by work groups, we round to the nearest multiple of work-groups\n // Physically, this means shaving a few pixels (up to num_work_groups-1) off the bottom and right edges of the canvas but users shouldn\'t notice?\n pass.dispatchWorkgroups(Math.floor(this.resolution.width / this.num_work_groups), Math.floor(this.resolution.height / this.num_work_groups));\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n}\nexports["default"] = ComputeLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_compute_layer.ts?\n}')},"./src/layers/base_layer.ts":(__unused_webpack_module,exports)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass Layer {\n constructor(inputs, output, weights) {\n this.context = globalThis.context;\n this.device = this.context.device;\n this.resolution = this.context.resolution;\n this.inputs = inputs;\n this.output = output;\n this.uniforms = [];\n this.buffers = {};\n this.weights = weights;\n }\n createUniform(name, type) {\n this.uniforms.push({ name, type });\n }\n setUniform(name, value) {\n const buffer = this.device.createBuffer({\n label: `layer-${this.label}-buffer-${name}`,\n size: value.byteLength,\n usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,\n });\n this.device.queue.writeBuffer(buffer, /*bufferOffset=*/ 0, value);\n this.buffers[name] = buffer;\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n hasExternalTexture() {\n for (const input of this.inputs) {\n if (input instanceof GPUExternalTexture)\n return true;\n }\n return false;\n }\n lazyLoadSetup() { }\n run() { }\n}\nexports["default"] = Layer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_layer.ts?\n}')},"./src/layers/base_render_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ \"./src/layers/base_layer.ts\");\nclass RenderLayer extends base_layer_1.default {\n constructor(inputs, output, weights) {\n super(inputs, output, weights);\n this.vertexScale = this.context.resolution;\n }\n defaultVertexShader() {\n return `\n \n struct VertexShaderOutput {\n @builtin(position) position: vec4f,\n @location(0) tex_coord: vec2f,\n };\n\n @vertex\n fn vertexMain( @builtin(vertex_index) vertexIndex : u32) -> VertexShaderOutput{\n let pos = array(\n // 1st triangle\n vec2f( -1.0, -1.0), // center\n vec2f( 1.0, -1.0), // right, center\n vec2f( -1.0, 1.0), // center, top\n \n // 2st triangle\n vec2f( -1.0, 1.0), // center, top\n vec2f( 1.0, -1.0), // right, center\n vec2f( 1.0, 1.0), // right, top\n );\n \n var vsOutput: VertexShaderOutput;\n let xy = pos[vertexIndex];\n vsOutput.position = vec4f(xy, 0.0, 1.0);\n vsOutput.tex_coord = xy*0.5 + 0.5;\n vsOutput.tex_coord.y = - 1.0* vsOutput.tex_coord.y + 1.0;\n vsOutput.tex_coord.x = vsOutput.tex_coord.x*${this.vertexScale.width};\n vsOutput.tex_coord.y = vsOutput.tex_coord.y*${this.vertexScale.height};\n return vsOutput;\n }\n `;\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: 'auto',\n vertex: {\n module: this.shader,\n entryPoint: 'vertexMain',\n },\n fragment: {\n module: this.shader,\n entryPoint: 'fragmentMain',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultRenderPassDescriptor() {\n return {\n label: `${this.label}-render-pass`,\n colorAttachments: [\n {\n view: this.output.createView(),\n clearValue: [0, 0, 0, 1],\n loadOp: 'clear',\n storeOp: 'store',\n },\n ],\n };\n }\n createStandardShader(fragmentShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n \n ${this.fragmentShaderInputs()}\n \n ${fragmentShader}\n `\n });\n }\n fragmentShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n let type = (this.inputs[i] instanceof GPUTexture) ? 'texture_2d<f32>' : 'texture_external';\n inputs.push(`@group(0) @binding(0) var inputTexture${i}: ${type};`);\n }\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n return inputs.join('\\n');\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginRenderPass(this.renderPassDescriptor);\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n pass.draw(6); // call our vertex shader 6 times\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n setOutput(outputTexture) {\n this.output = outputTexture;\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n}\nexports[\"default\"] = RenderLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_render_layer.ts?\n}")},"./src/layers/utils/gaussian.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass GuassianLayer extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.label = "Gaussian";\n this.createUniform("gaussian", "array<vec3f, 3>");\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n var val = 0.0;\n \n for(var i = 0u; i< 3; i++){\n \n let a = vec3f(\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x\n );\n \n val += dot(a, gaussian[i]);\n \n } \n \n \n return vec4f(val, val, val, 1.0);\n } \n `);\n this.setUniform("gaussian", new Float32Array([\n 0.0675, 0.125, 0.0675, 0.0,\n 0.125, 0.250, 0.1250, 0.0,\n 0.0675, 0.125, 0.0675, 0.0\n ]));\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n 0, -1, 0, 0,\n 1, -1, 0, 0,\n -1, 0, 0, 0,\n 0, 0, 0, 0,\n 1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, 1, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = GuassianLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/gaussian.ts?\n}')},"./src/layers/utils/rgb_2_yuv.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass RGB2YUV extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.createUniform("rgb2yuv", "mat3x3f");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let color = textureLoad(inputTexture0, vec2<i32>(input.tex_coord), 0); \n let yuv = rgb2yuv*color.xyz;\n \n return vec4f(yuv, 1.0);\n } \n `);\n this.setUniform("rgb2yuv", new Float32Array([\n 0.299, -0.1473, 0.615, 1.0,\n 0.587, -.2886, -.51499, 1.0,\n 0.114, 0.436, -.1001, 1.0\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = RGB2YUV;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/rgb_2_yuv.ts?\n}')},"./src/main.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst context_1 = __webpack_require__(/*! ./context */ "./src/context.ts");\nconst renderer_1 = __webpack_require__(/*! ./renderer */ "./src/renderer.ts");\nconst network_list_1 = __webpack_require__(/*! ./networks/network_list */ "./src/networks/network_list.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSR {\n constructor(params) {\n if (!network_list_1.NetworkList[params.network_name])\n throw Error(`Network ${params.network_name} is not defined or implemented`);\n this.source = params.source;\n const source = this.source;\n this.resolution = params.resolution ? params.resolution : {\n width: (0, utils_1.getSourceWidth)(source),\n height: (0, utils_1.getSourceHeight)(source)\n };\n const scale = network_list_1.NetworkScales[params.network_name];\n if (params.canvas)\n this.canvas = params.canvas;\n else {\n this.canvas = new HTMLCanvasElement();\n this.canvas.width = this.resolution.width * scale;\n this.canvas.height = this.resolution.height * scale;\n }\n this.scale = scale;\n this.context = new context_1.default(params.gpu, this.resolution, this.canvas, this.scale, this.debug);\n globalThis.context = this.context;\n this.network = new network_list_1.NetworkList[params.network_name](params.weights);\n this.renderer = new renderer_1.default(this.network, this.source);\n }\n switchNetwork(network, weights) {\n if (!network_list_1.NetworkList[network])\n throw Error(`Network ${network} is not defined or implemented`);\n this.network = new network_list_1.NetworkList[network](weights);\n this.renderer.switchNetwork(this.network);\n }\n static initWebGPU() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!navigator.gpu)\n return false;\n const adapter = yield navigator.gpu.requestAdapter();\n if (!adapter)\n return false;\n const device = yield adapter.requestDevice();\n if (!device)\n return false;\n return device;\n });\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.start();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.render(source);\n });\n }\n destroy() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n this.context.destroy();\n });\n }\n}\nexports["default"] = WebSR;\n\n\n//# sourceURL=webpack://WebSR/./src/main.ts?\n}')},"./src/networks/anime4k/cnn-2x-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ "./src/layers/anime4k/display_3c.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst conv2d_112x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-112x4 */ "./src/layers/anime4k/conv2d-112x4.ts");\nconst conv2d_concat2_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-concat2 */ "./src/layers/anime4k/conv2d-concat2.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNN2XL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i< 7; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n for (let c = 0; c < 3; c++) {\n const sources_0 = [];\n const sources_1 = [];\n for (let i = 0; i < 7; i++) {\n let source = (i == 0) ? `conv2d_tf` : `conv2d_${i}_tf`;\n sources_0.push(context.buffer(source));\n sources_1.push(context.buffer(source + "1"));\n }\n const dest = (c == 0) ? `conv2d_last_tf` : `conv2d_last_tf${c}`;\n layers.push(new conv2d_112x4_1.default(sources_0, context.buffer(`conv2d_last_${c}_pt1`), weights[dest], true));\n layers.push(new conv2d_112x4_1.default(sources_1, context.buffer(`conv2d_last_${c}_pt2`), weights[dest], false));\n layers.push(new conv2d_concat2_1.default([context.buffer(`conv2d_last_${c}_pt1`), context.buffer(`conv2d_last_${c}_pt2`)], context.buffer(dest), weights[dest]));\n }\n const paint = new display_3c_1.default([context.buffer(\'conv2d_last_tf\'), context.buffer(\'conv2d_last_tf1\'), context.buffer(\'conv2d_last_tf2\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNN2XL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-l.ts?\n}')},"./src/networks/anime4k/cnn-2x-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ \"./src/layers/anime4k/display_3c.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_7_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf'), weights['conv2d_7_tf']);\n const conv2d_7_tf1 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf1'), weights['conv2d_7_tf1']);\n const conv2d_7_tf2 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf2'), weights['conv2d_7_tf2']);\n const paint = new display_3c_1.default([context.buffer('conv2d_7_tf'), context.buffer('conv2d_7_tf1'), context.buffer('conv2d_7_tf2'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_7_tf, conv2d_7_tf1, conv2d_7_tf2, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-m.ts?\n}")},"./src/networks/anime4k/cnn-2x-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1 = __webpack_require__(/*! ../../layers/anime4k/display */ \"./src/layers/anime4k/display.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_last_tf'), weights['conv2d_last_tf']);\n const paint = new display_1.default([context.buffer('conv2d_last_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-s.ts?\n}")},"./src/networks/anime4k/cnn-restore-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ "./src/layers/anime4k/display_1x.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNNRL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i < 4; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n layers.push(new conv2d_16x4_1.default([context.buffer(\'conv2d_3_tf\'), context.buffer(\'conv2d_3_tf1\')], context.buffer(`conv2d_out_tf`), weights[`conv2d_out_tf`]));\n const paint = new display_1x_1.default([context.buffer(\'conv2d_out_tf\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNNRL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-l.ts?\n}')},"./src/networks/anime4k/cnn-restore-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_out_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_out_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-m.ts?\n}")},"./src/networks/anime4k/cnn-restore-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-s.ts?\n}")},"./src/networks/base_network.ts":function(__unused_webpack_module,exports){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass NeuralNetwork {\n constructor(weights) {\n this.weights = weights;\n this.context = globalThis.context;\n this.layers = this.model();\n }\n model() {\n return [];\n }\n lastLayer() {\n return this.layers[this.layers.length - 1];\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n this.layers.forEach(layer =>{\n layer.run();\n });\n });\n }\n}\nexports["default"] = NeuralNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/base_network.ts?\n}')},"./src/networks/network_list.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nexports.NetworkScales = exports.NetworkList = void 0;\nconst cnn_2x_s_1 = __webpack_require__(/*! ./anime4k/cnn-2x-s */ "./src/networks/anime4k/cnn-2x-s.ts");\nconst cnn_2x_m_1 = __webpack_require__(/*! ./anime4k/cnn-2x-m */ "./src/networks/anime4k/cnn-2x-m.ts");\nconst cnn_2x_l_1 = __webpack_require__(/*! ./anime4k/cnn-2x-l */ "./src/networks/anime4k/cnn-2x-l.ts");\nconst cnn_restore_l_1 = __webpack_require__(/*! ./anime4k/cnn-restore-l */ "./src/networks/anime4k/cnn-restore-l.ts");\nconst cnn_restore_m_1 = __webpack_require__(/*! ./anime4k/cnn-restore-m */ "./src/networks/anime4k/cnn-restore-m.ts");\nconst cnn_restore_s_1 = __webpack_require__(/*! ./anime4k/cnn-restore-s */ "./src/networks/anime4k/cnn-restore-s.ts");\nconst poc_network_1 = __webpack_require__(/*! ./poc_network */ "./src/networks/poc_network.ts");\nexports.NetworkList = {\n "anime4k/cnn-2x-s": cnn_2x_s_1.default,\n "anime4k/cnn-2x-m": cnn_2x_m_1.default,\n "anime4k/cnn-2x-l": cnn_2x_l_1.default,\n "anime4k/cnn-restore-s": cnn_restore_s_1.default,\n "anime4k/cnn-restore-m": cnn_restore_m_1.default,\n "anime4k/cnn-restore-l": cnn_restore_l_1.default,\n "sb2702/blur-poc": poc_network_1.default\n};\nexports.NetworkScales = {\n "anime4k/cnn-2x-s": 2,\n "anime4k/cnn-2x-m": 2,\n "anime4k/cnn-2x-l": 2,\n "anime4k/cnn-restore-s": 1,\n "anime4k/cnn-restore-m": 1,\n "anime4k/cnn-restore-l": 1,\n "sb2702/blur-poc": 1\n};\n\n\n//# sourceURL=webpack://WebSR/./src/networks/network_list.ts?\n}')},"./src/networks/poc_network.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ./base_network */ "./src/networks/base_network.ts");\nconst rgb_2_yuv_1 = __webpack_require__(/*! ../layers/utils/rgb_2_yuv */ "./src/layers/utils/rgb_2_yuv.ts");\nconst gaussian_1 = __webpack_require__(/*! ../layers/utils/gaussian */ "./src/layers/utils/gaussian.ts");\nclass PoCNetwork extends base_network_1.default {\n constructor() {\n super();\n }\n model() {\n const layers = [];\n const context = this.context;\n layers.push(new rgb_2_yuv_1.default([context.texture(\'input\')], context.texture(\'yuv\')));\n layers.push(new gaussian_1.default([context.texture(\'yuv\')], context.texture(\'output\')));\n return layers;\n }\n}\nexports["default"] = PoCNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/poc_network.ts?\n}')},"./src/renderer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst display_1 = __webpack_require__(/*! ./layers/anime4k/display */ "./src/layers/anime4k/display.ts");\nconst base_render_layer_1 = __webpack_require__(/*! ./layers/base_render_layer */ "./src/layers/base_render_layer.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSRRenderer {\n constructor(network, source) {\n this.context = globalThis.context;\n this.network = network;\n this.source = source;\n this.active = false;\n }\n switchNetwork(network) {\n this.network = network;\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.context.destroyed) {\n throw new Error("WebSR instance was destroyed");\n }\n this.active = true;\n yield this.renderStep();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n this.active = false;\n if (this.vfc && this.source && (0, utils_1.isHTMLVideoElement)(this.source))\n this.source.cancelVideoFrameCallback(this.vfc);\n });\n }\n renderStep() {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof display_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.render();\n if (this.active && this.source && (0, utils_1.isHTMLVideoElement)(this.source)) {\n this.vfc = this.source.requestVideoFrameCallback(this.renderStep.bind(this));\n }\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof base_render_layer_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.network.feedForward(source ? source : this.source);\n });\n }\n}\nexports["default"] = WebSRRenderer;\n\n\n//# sourceURL=webpack://WebSR/./src/renderer.ts?\n}')},"./src/utils.ts":(__unused_webpack_module,exports)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isMainThread = isMainThread;\nexports.isHTMLVideoElement = isHTMLVideoElement;\nexports.isHTMLImageElement = isHTMLImageElement;\nexports.isImageBitmap = isImageBitmap;\nexports.isVideoFrame = isVideoFrame;\nexports.isVideoSource = isVideoSource;\nexports.isImageSource = isImageSource;\nexports.getSourceWidth = getSourceWidth;\nexports.getSourceHeight = getSourceHeight;\n/**\n * Check if we're running on the main thread (not in a worker)\n */\nfunction isMainThread() {\n return typeof HTMLVideoElement !== 'undefined';\n}\n/**\n * Check if a source is a video element (main thread only)\n */\nfunction isHTMLVideoElement(source) {\n return typeof HTMLVideoElement !== 'undefined' && source instanceof HTMLVideoElement;\n}\n/**\n * Check if a source is an image element (main thread only)\n */\nfunction isHTMLImageElement(source) {\n return typeof HTMLImageElement !== 'undefined' && source instanceof HTMLImageElement;\n}\n/**\n * Check if a source is an ImageBitmap (works in both contexts)\n */\nfunction isImageBitmap(source) {\n return typeof ImageBitmap !== 'undefined' && source instanceof ImageBitmap;\n}\n/**\n * Check if a source is a VideoFrame (worker context)\n */\nfunction isVideoFrame(source) {\n return typeof VideoFrame !== 'undefined' && source instanceof VideoFrame;\n}\n/**\n * Check if a source is any type of video source\n */\nfunction isVideoSource(source) {\n return isHTMLVideoElement(source) || isVideoFrame(source);\n}\n/**\n * Check if a source is any type of image source\n */\nfunction isImageSource(source) {\n return isHTMLImageElement(source) || isImageBitmap(source);\n}\n/**\n * Get the width of a media source\n */\nfunction getSourceWidth(source) {\n if (isHTMLVideoElement(source))\n return source.videoWidth;\n if (isHTMLImageElement(source))\n return source.naturalWidth;\n if (isVideoFrame(source))\n return source.displayWidth;\n if (isImageBitmap(source))\n return source.width;\n return 0;\n}\n/**\n * Get the height of a media source\n */\nfunction getSourceHeight(source) {\n if (isHTMLVideoElement(source))\n return source.videoHeight;\n if (isHTMLImageElement(source))\n return source.naturalHeight;\n if (isVideoFrame(source))\n return source.displayHeight;\n if (isImageBitmap(source))\n return source.height;\n return 0;\n}\n\n\n//# sourceURL=webpack://WebSR/./src/utils.ts?\n}")}},__webpack_module_cache__={};function __webpack_require__(e){var n=__webpack_module_cache__[e];if(void 0!==n)return n.exports;var t=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),t.exports}var __webpack_exports__=__webpack_require__("./src/main.ts");return __webpack_exports__.default})())},{}],"6ykb1":[function(e,n,t,r){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,n){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})}),n},t.export=function(e,n,t){Object.defineProperty(e,n,{enumerable:!0,get:t})}},{}]},["80h6e"],"80h6e","parcelRequire4dc0",{});
\ No newline at end of file
+!function(e,t,r,i,s){var a="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof a[i]&&a[i],n=o.i||{},l=o.cache||{},d="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function u(t,r){if(!l[t]){if(!e[t]){if(s[t])return s[t];var n="function"==typeof a[i]&&a[i];if(!r&&n)return n(t,!0);if(o)return o(t,!0);if(d&&"string"==typeof t)return d(t);var c=Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}h.resolve=function(r){var i=e[t][1][r];return null!=i?i:r},h.cache={};var m=l[t]=new u.Module(t);e[t][0].call(m.exports,h,m,m.exports,a)}return l[t].exports;function h(e){var t=h.resolve(e);if(!1===t)return{};if(Array.isArray(t)){var r={__esModule:!0};return t.forEach(function(e){var t=e[0],i=e[1],s=e[2]||e[0],a=u(i);"*"===t?Object.keys(a).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(r,e)||Object.defineProperty(r,e,{enumerable:!0,get:function(){return a[e]}})}):"*"===s?Object.defineProperty(r,t,{enumerable:!0,value:a}):Object.defineProperty(r,t,{enumerable:!0,get:function(){return"default"===s?a.__esModule?a.default:a:a[s]}})}),r}return u(t)}}u.isParcelRequire=!0,u.Module=function(e){this.id=e,this.bundle=u,this.require=d,this.exports={}},u.modules=e,u.cache=l,u.parent=o,u.distDir=void 0,u.publicUrl=void 0,u.devServer=void 0,u.i=n,u.register=function(t,r){e[t]=[function(e,t){t.exports=r},{}]},Object.defineProperty(u,"root",{get:function(){return a[i]}}),a[i]=u;for(var c=0;c<t.length;c++)u(t[c]);if(r){var m=u(r);"object"==typeof exports&&"u">typeof module?module.exports=m:"function"==typeof define&&define.amd&&define(function(){return m})}}({"80h6e":[function(e,t,r,i){var s=e("@parcel/transformer-js/src/esmodule-helpers.js"),a=e("./Upscaler.js"),o=s.interopDefault(a);window.artplayerPluginWebsr=function(e={networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2}){return t=>{let{$video:r,$player:i}=t.template,s=document.createElement("canvas");function a(){let e=t.video,r=i.offsetWidth||640,s=i.offsetHeight||360,a=(e.videoWidth||640)/(e.videoHeight||360),o=r,n=s;return r/s>a?o=s*a:n=r/a,{displayWidth:o,displayHeight:n}}if(i.appendChild(s),s.style.position="absolute",s.style.zIndex="11",s.style.pointerEvents="none",s.style.top="50%",s.style.left="50%",s.style.transform="translate(-50%, -50%)",s.style.opacity="0",s.style.transition="opacity 0.2s ease",!o.default||!o.default.isSupported||!o.default.isSupported())return void console.warn("Upscaler is not supported in this environment");let n=new(0,o.default)({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2}),l=!1;async function d(){if(!l){l=!0;try{await new Promise((e,t)=>{if(r.readyState>=1)return void e();let i=()=>{a(),e()},s=()=>{a(),t(Error("Failed to load video metadata"))},a=()=>{r.removeEventListener("loadedmetadata",i),r.removeEventListener("error",s)};r.addEventListener("loadedmetadata",i),r.addEventListener("error",s)}),await n.startRealtimeUpscale(r,s,e.networkSize||n.networkSize),requestAnimationFrame(()=>{s.style.opacity="1"})}catch(e){console.error("artplayer-plugin-upscaler: failed to start realtime",e)}}}let{displayWidth:u,displayHeight:c}=a();s.style.width=u+"px",s.style.height=c+"px";let m=50,h=!1,p=!!e.compare,f=document.createElement("div");function g(){if(p){let{displayWidth:e,displayHeight:t}=a(),r=`linear-gradient(to right, transparent 0%, transparent ${m}%, black ${m}%, black 100%)`;s.style.maskImage=r;let o=i.offsetWidth||640,n=i.offsetHeight||360,l=(o-e)/2+e*m/100;f.style.top=(n-t)/2+"px",f.style.left=l+"px",f.style.height=t+"px",f.style.transform="translateX(-50%)"}else s.style.maskImage="none"}function w(e){p&&(h=!0)}function y(e){if(p&&h){let t=i.getBoundingClientRect(),{displayWidth:r}=a(),s=i.offsetWidth||640;m=Math.max(0,Math.min(100,m=(e.clientX-t.left-(s-r)/2)/r*100)),g()}}function v(e){h=!1}return f.style.position="absolute",f.style.width="3px",f.style.backgroundColor="rgba(255, 255, 255, 0.75)",f.style.cursor="ew-resize",f.style.zIndex="12",f.style.pointerEvents="auto",f.style.display=p?"block":"none",f.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",p&&(i.appendChild(f),f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()),t.on("destroy",()=>{n&&"function"==typeof n.dispose&&n.dispose(),f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v)}),t.on("resize",()=>{let{displayWidth:e,displayHeight:t}=a();s.style.width=e+"px",s.style.height=t+"px",g()}),t.on("play",()=>{d()}),{name:"artplayerPluginWebsr",upscaler:n,update:function(r={}){if(r&&"object"==typeof r){if(Object.prototype.hasOwnProperty.call(r,"compare")){let t=!!r.compare;e.compare=t,(p=t)?(f.parentNode||i.appendChild(f),f.style.display="block",f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()):(s.style.maskImage="none",f.style.display="none",f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v))}r.networkSize&&(e.networkSize=r.networkSize,n&&"function"==typeof n.stopRealtimeUpscale&&n.stopRealtimeUpscale(),l=!1,t.paused||d())}}}}}},{"./Upscaler.js":"fDXhG","@parcel/transformer-js/src/esmodule-helpers.js":"6ykb1"}],fDXhG:[function(e,t,r,i){e("@parcel/transformer-js/src/esmodule-helpers.js").defineInteropFlag(r);class s{static DEFAULT_TIMEOUTS={IMAGE:3e5,VIDEO:36e5,METADATA:1e4};static DEFAULT_DELAYS={INIT:500,NETWORK:300};static isSupported(){try{let e="u">typeof Worker,t="u">typeof OffscreenCanvas||"u">typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="u">typeof Blob;return e&&t&&r}catch{return!1}}static isVideoSupported(){try{return"u">typeof VideoEncoder&&"u">typeof VideoDecoder}catch{return!1}}constructor(e={}){const t=e.weightsBaseUrl||"/weights";this.networks=e.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:`${t}/cnn-8.json`},medium:{name:"anime4k/cnn-2x-16",weightsUrl:`${t}/cnn-16.json`},large:{name:"anime4k/cnn-2x-28",weightsUrl:`${t}/cnn-28.json`}},this.weightsBaseUrl=t,this.networkSize=e.networkSize||"medium",this.workerUrl=e.workerUrl||"/worker/main.js",this.timeouts={...s.DEFAULT_TIMEOUTS,...e.timeouts||{}},this.delays={...s.DEFAULT_DELAYS,...e.delays||{}},this.imageScale="number"==typeof e.imageScale&&e.imageScale>0?e.imageScale:2,this.videoScale="number"==typeof e.videoScale&&e.videoScale>0?e.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}init({prewarm:e=!0}={}){if(!s.isSupported())throw Error("Upscaler is not supported in this environment");return e&&this.getWorker().postMessage({cmd:"isSupported"}),this}getWorker(){return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=e=>this.handleWorkerMessage(e)),this.workerInstance}static extractProgressValue(e){let t=e.data??e.progress??e.value??e.percentage;return"number"==typeof t?Math.min(100,Math.max(0,Math.round(t))):null}handleBlobResponse(e){let t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r({[t]:e.data})}requestBlob(){let e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}handleWorkerMessage(e){let{data:t}=e;if(console.debug("Worker message:",t),!t.cmd)return;let{cmd:r}=t;if("progress"===r){let e=s.extractProgressValue(t);null!==e&&this.progressCallback&&this.progressCallback(e),this.messageHandlers.progress&&this.messageHandlers.progress(t)}else"finished"===r?t.data instanceof Blob?this.handleBlobResponse(t):this.requestBlob():this.messageHandlers[r]&&this.messageHandlers[r](t)}async loadWeights(e){if(this.validateNetworkSize(e),this.weightsCache.has(e))return this.weightsCache.get(e);let t=this.networks[e],r=await fetch(t.weightsUrl);if(!r.ok)throw Error(`Failed to fetch weights: ${r.statusText}`);let i=await r.json();return this.weightsCache.set(e,i),i}static loadImageMetadata(e,t){return new Promise((r,i)=>{let s=new Blob([e],{type:t}),a=URL.createObjectURL(s),o=new Image;o.onload=()=>{URL.revokeObjectURL(a),r({width:o.width,height:o.height})},o.onerror=()=>{URL.revokeObjectURL(a),i(Error("Failed to load image"))},o.src=a})}static loadVideoMetadata(e,t){return new Promise((r,i)=>{let s=URL.createObjectURL(e),a=document.createElement("video");a.src=s;let o=setTimeout(()=>i(Error("Timeout")),t);a.onloadedmetadata=()=>{clearTimeout(o),URL.revokeObjectURL(s),r({width:a.videoWidth,height:a.videoHeight,duration:a.duration})},a.onerror=()=>{clearTimeout(o),URL.revokeObjectURL(s),i(Error("Failed to load video"))}})}createOffscreenCanvas(e,t,r=2){let i="number"==typeof r&&r>0?r:1,s=document.createElement("canvas");if(s.width=e*i,s.height=t*i,"function"!=typeof s.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");return s.transferControlToOffscreen()}createBlobPromise(e,t){return new Promise((r,i)=>{let s=setTimeout(()=>{this.messageHandlers[e]&&(delete this.messageHandlers[e],i(Error(`${e} processing timeout`)))},t);this.messageHandlers[e]=t=>{delete this.messageHandlers[e],clearTimeout(s);let a=t[e]||t.data;a instanceof Blob?r(a):i(Error(`Invalid ${e} format`))}})}validateNetworkSize(e){if(!this.networks[e])throw Error("Invalid networkSize: use one of "+Object.keys(this.networks).join(", "))}async upscaleImage(e,t,r){if(!e)throw Error("Image file is required");let i=t||this.networkSize;this.validateNetworkSize(i),this.processingType="image";let a=await e.arrayBuffer(),o=e.type||"image/jpeg",{width:n,height:l}=await s.loadImageMetadata(a,o),d=await this.loadWeights(i),u=this.networks[i],c="number"==typeof r&&r>0?r:this.imageScale,[m,h]=[this.createOffscreenCanvas(n,l,c),this.createOffscreenCanvas(n,l,1)],p=this.createBlobPromise("imageBlob",this.timeouts.IMAGE);return this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:a,imageMimeType:o,upscaled:m,original:h,resolution:{width:n,height:l},network_name:u.name,weights:d}},[m,h]),setTimeout(()=>{this.getWorker().postMessage({cmd:"network",data:{name:u.name,imageArrayBuffer:a,imageMimeType:o,weights:d}}),setTimeout(()=>{this.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:a,imageMimeType:o}})},this.delays.NETWORK)},this.delays.INIT),p}async upscaleVideo(e,t,r){if(!e)throw Error("Video file is required");let i=t||this.networkSize;if(this.validateNetworkSize(i),!s.isVideoSupported())throw Error("WebCodecs API not supported. Requires Chrome 94+");this.processingType="video";let{width:a,height:o,duration:n}=await s.loadVideoMetadata(e,this.timeouts.METADATA),l=await this.loadWeights(i),d=this.networks[i],u="number"==typeof r&&r>0?r:this.videoScale,[c,m]=[this.createOffscreenCanvas(a,o,u),this.createOffscreenCanvas(a,o,1)],h=this.createBlobPromise("videoBlob",this.timeouts.VIDEO);return this.getWorker().postMessage({cmd:"process",file:e,fileSize:e.size,duration:n,adjustedResolution:{adjustedInputWidth:a,adjustedInputHeight:o,adjustedOutputWidth:a*u,adjustedOutputHeight:o*u},upscaled:c,original:m,weights:l,network_name:d.name,skipDemuxProgress:!0},[c,m]),h}async startRealtimeUpscale(e,t,r,i){if(!e||!t)throw Error("videoElement and canvasElement are required");let s=r||this.networkSize;this.validateNetworkSize(s);let a=this.networks[s],o=await this.loadWeights(s),n="number"==typeof i&&i>0?i:this.videoScale;await new Promise((t,r)=>{if(e.readyState>=1)return void t();let i=()=>{a(),t()},s=()=>{a(),r(Error("Failed to load video metadata"))},a=()=>{e.removeEventListener("loadedmetadata",i),e.removeEventListener("error",s)};e.addEventListener("loadedmetadata",i),e.addEventListener("error",s)});let l=e.videoWidth,d=e.videoHeight;if(!l||!d)throw Error("Invalid video dimensions");let u=!t._upscalerTransferred,c=null;if(u){if(t.width=l*n,t.height=d*n,"function"!=typeof t.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");c=t.transferControlToOffscreen(),t._upscalerTransferred=!0}let m=document.createElement("canvas");m.width=l,m.height=d;let h=m.getContext("2d");this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null);let p={cmd:"realtimeInit",data:{upscaled:u?c:null,resolution:{width:l,height:d,scale:n,outputWidth:l*n,outputHeight:d*n},network_name:a.name,weights:o}};u&&c?this.getWorker().postMessage(p,[c]):this.getWorker().postMessage(p),this.realtimeState={running:!0,video:e,canvas:t,scale:n,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:h};let f=async()=>{if(!this.realtimeState||!this.realtimeState.running)return;let e=this.realtimeState,t=e.video,r=t.HAVE_CURRENT_DATA||2;if(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0){e.busy=!0;try{let r=e.captureCanvas,i=e.captureCtx;if(!r||!i)throw Error("Missing capture canvas");i.drawImage(t,0,0,r.width,r.height);let s=await createImageBitmap(r);e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:s},[s])}catch(e){console.warn("realtimeFrame error",e)}finally{this.realtimeState&&(this.realtimeState.busy=!1)}}this.realtimeLoopId=requestAnimationFrame(f)};this.realtimeLoopId=requestAnimationFrame(f)}stopRealtimeUpscale(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}async downloadUpscaled(e,t,r=null){let i=e.type.startsWith("video"),s=t||this.networkSize,a=i?await this.upscaleVideo(e,s):await this.upscaleImage(e,s),o=URL.createObjectURL(a),n=document.createElement("a");return n.href=o,n.download=r||`upscaled_${Date.now()}.${i?"mp4":"png"}`,n.click(),URL.revokeObjectURL(o),a}getSupportedNetworks(){return Object.keys(this.networks)}static async getGPUCapability(){try{if(navigator.gpu){let e=await navigator.gpu.requestAdapter();if(e){let t=e.limits.maxStorageBufferBindingSize/512;return Math.min(t,0x4000000)}}let e=document.createElement("canvas").getContext("webgl2");if(e)return e.getParameter(e.MAX_TEXTURE_SIZE)**2;return 8388608}catch{return 8388608}}static getBackendType(){try{if(navigator.gpu)return"webgpu";if(document.createElement("canvas").getContext("webgl2"))return"webgl";return"unknown"}catch{return"unknown"}}getAppState(){return{backend:s.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}onProgress(e){"function"==typeof e&&(this.progressCallback=e)}dispose(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}}r.default=s},{"@parcel/transformer-js/src/esmodule-helpers.js":"6ykb1"}],"6ykb1":[function(e,t,r,i){r.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},r.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},r.exportAll=function(e,t){return Object.keys(e).forEach(function(r){"default"===r||"__esModule"===r||Object.prototype.hasOwnProperty.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[r]}})}),t},r.export=function(e,t,r){Object.defineProperty(e,t,{enumerable:!0,get:r})}},{}]},["80h6e"],"80h6e","parcelRequire4dc0",{});
\ No newline at end of file
diff --git a/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.legacy.js b/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.legacy.js
index 1f464ef98..179d7589c 100644
--- a/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.legacy.js
+++ b/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.legacy.js
@@ -5,4 +5,4 @@
  * (c) 2017-2026 Harvey Zack
  * Released under the MIT License.
  */
-!function(e,n,t,r,s){var i="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof i[r]&&i[r],u=o.i||{},a=o.cache||{},c="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(n,t){if(!a[n]){if(!e[n]){if(s[n])return s[n];var u="function"==typeof i[r]&&i[r];if(!t&&u)return u(n,!0);if(o)return o(n,!0);if(c&&"string"==typeof n)return c(n);var f=Error("Cannot find module '"+n+"'");throw f.code="MODULE_NOT_FOUND",f}_.resolve=p,_.cache={};var d=a[n]=new l.Module(n);e[n][0].call(d.exports,_,d,d.exports,i)}return a[n].exports;function _(e){var n=_.resolve(e);if(!1===n)return{};if(Array.isArray(n)){var t={__esModule:!0};return n.forEach(function(e){var n=e[0],r=e[1],s=e[2]||e[0],i=l(r);"*"===n?Object.keys(i).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:function(){return i[e]}})}):"*"===s?Object.defineProperty(t,n,{enumerable:!0,value:i}):Object.defineProperty(t,n,{enumerable:!0,get:function(){return"default"===s?i.__esModule?i.default:i:i[s]}})}),t}return l(n)}function p(t){var r=e[n][1][t];return null!=r?r:t}}function f(e){this.id=e,this.bundle=l,this.require=c,this.exports={}}l.isParcelRequire=!0,l.Module=f,l.modules=e,l.cache=a,l.parent=o,l.distDir=void 0,l.publicUrl=void 0,l.devServer=void 0,l.i=u,l.register=function(n,t){e[n]=[function(e,n){n.exports=t},{}]},Object.defineProperty(l,"root",{get:function(){return i[r]}}),i[r]=l;for(var d=0;d<n.length;d++)l(n[d]);if(t){var _=l(t);"object"==typeof exports&&"u">typeof module?module.exports=_:"function"==typeof define&&define.amd&&define(function(){return _})}}({hrC3O:[function(e,n,t,r){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(t),s.export(t,"default",function(){return f});var i=e("@swc/helpers/cjs/_async_to_generator.cjs"),o=e("@swc/helpers/cjs/_object_spread.cjs"),u=e("@swc/helpers/cjs/_type_of.cjs"),a=e("@swc/helpers/cjs/_ts_generator.cjs"),c=e("@websr/websr"),l=s.interopDefault(c);function f(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return function(n){var t=n.template.$player,r=n.constructor,s=r.validator,c=r.utils,f=c.append,d=c.setStyles;(e=s((0,o._)({scale:2,networkName:"",weights:null,compare:!1},e),{scale:"number",networkName:"string",weights:"?string|object",compare:"boolean"})).networkName||console.error("WebSR: networkName is required"),e.weights||console.error("WebSR: weights is required");var _=null,p=null,h=!1,v=!0,x=null,b=.5,m=!1,y=document.createElement("canvas");y.id="artplayer-websr-canvas",d(y,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"block",pointerEvents:"none",zIndex:"11",imageRendering:"crisp-edges"}),f(t,y);var w=document.createElement("div");function g(n){if(d(w,{left:100*(b=Math.max(0,Math.min(1,n)))+"%"}),e.compare){var t=100*b;d(y,{clipPath:"inset(0 0 0 ".concat(t,"%)")})}}function k(){var e=n.video;if(!e)return{displayWidth:640,displayHeight:360};var r=t.offsetWidth||640,s=t.offsetHeight||360,i=(e.videoWidth||640)/(e.videoHeight||360),o=r,u=s;return r/s>i?o=s*i:u=r/i,{displayWidth:o,displayHeight:u}}function P(){return(0,i._)(function(){var t,r,s,i,o,c;return(0,a._)(this,function(a){switch(a.label){case 0:if(a.trys.push([0,6,,7]),h)return[2,!0];if(!navigator.gpu)return console.warn("WebGPU is not supported"),[2,!1];return[4,l.default.initWebGPU()];case 1:if(!(p=a.sent()))return console.warn("Failed to initialize WebGPU"),[2,!1];if("string"!=typeof e.weights)return[3,4];return[4,fetch(e.weights)];case 2:if(!(r=a.sent()).ok)return console.warn("Failed to load weights from ".concat(e.weights)),[2,!1];return[4,r.json()];case 3:return t=a.sent(),[3,5];case 4:if("object"!==(0,u._)(e.weights))return console.warn("Invalid weights format"),[2,!1];t=e.weights,a.label=5;case 5:if(!(s=n.video))return console.warn("Video element not found"),[2,!1];return o=(i=k()).displayWidth,c=i.displayHeight,y.width=o*e.scale,y.height=c*e.scale,d(y,{width:o+"px",height:c+"px"}),_=new(0,l.default)({source:s,network_name:e.networkName,weights:t,gpu:p,canvas:y}),h=!0,[2,!0];case 6:return console.error("WebSR initialization error:",a.sent()),[2,!1];case 7:return[2]}})})()}function S(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(!_||!v||!n.video)return[2];e.label=1;case 1:return e.trys.push([1,3,,4]),[4,_.render(n.video)];case 2:return e.sent(),[3,4];case 3:return console.error("WebSR render error:",e.sent()),[3,4];case 4:return[2]}})})()}function U(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(!_||!v||!n.video||n.video.paused)return x=null,[2];e.label=1;case 1:return e.trys.push([1,3,,4]),[4,_.render(n.video)];case 2:return e.sent(),[3,4];case 3:return console.error("WebSR render error:",e.sent()),[3,4];case 4:return v&&!n.video.paused&&(x=requestAnimationFrame(U)),[2]}})})()}function T(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(v)return[2];if(h)return[3,2];return[4,P()];case 1:if(!e.sent())return console.error("Failed to initialize WebSR"),[2];e.label=2;case 2:return v=!0,setStyle(y,"display","block"),n.video&&!n.video.paused&&(x=requestAnimationFrame(U)),n.emit("artplayerPluginWebsr:enable"),[2]}})})()}function B(){v&&(v=!1,d(y,{display:"none"}),x&&(cancelAnimationFrame(x),x=null),n.emit("artplayerPluginWebsr:disable"))}function L(){return(0,i._)(function(){return(0,a._)(this,function(e){switch(e.label){case 0:if(!v)return[3,1];return B(),[3,3];case 1:return[4,T()];case 2:e.sent(),e.label=3;case 3:return[2]}})})()}return w.id="artplayer-websr-divider",d(w,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"2px",height:"100%",backgroundColor:"#fff",display:e.compare?"block":"none",pointerEvents:"auto",cursor:"col-resize",zIndex:"12"}),f(t,w),document.addEventListener("mousemove",function(e){if(m){var n=t.getBoundingClientRect(),r=(e.clientX-n.left)/n.width;g(r)}}),document.addEventListener("mouseup",function(){m=!1}),w.addEventListener("mousedown",function(){m=!0}),document.addEventListener("touchmove",function(e){if(m){var n=t.getBoundingClientRect(),r=(e.touches[0].clientX-n.left)/n.width;g(r)}},{passive:!0}),document.addEventListener("touchend",function(){m=!1}),w.addEventListener("touchstart",function(){m=!0}),n.on("play",function(){S(),v&&h&&!x&&(x=requestAnimationFrame(U))}),n.on("pause",function(){x&&(cancelAnimationFrame(x),x=null)}),n.on("seek",function(){v&&h&&!n.video.paused&&!x&&(x=requestAnimationFrame(U))}),n.on("resize",function(){if(_&&y.offsetParent){var n=k(),t=n.displayWidth,r=n.displayHeight;y.width=t*e.scale,y.height=r*e.scale,d(y,{width:t+"px",height:r+"px"})}}),n.on("destroy",function(){B(),x&&(cancelAnimationFrame(x),x=null),y.parentNode&&y.parentNode.removeChild(y)}),P().then(function(){v&&h&&n.video&&S()}).catch(function(e){return console.error("Failed to init WebSR:",e)}),{name:"artplayerPluginWebsr",websr:function(){return _},gpu:function(){return p},canvas:function(){return y},enable:T,disable:B,toggle:L,isEnabled:function(){return v},isInitialized:function(){return h},enableCompare:function(){e.compare=!0,d(w,{display:"block"}),g(b)},disableCompare:function(){e.compare=!1,d(w,{display:"none"}),d(y,{clipPath:"none"})},toggleCompare:function(){e.compare?(d(w,{display:"none"}),d(y,{clipPath:"none"}),e.compare=!1):(e.compare=!0,d(w,{display:"block"}),g(b))},setComparePosition:function(e){g(e)},getComparePosition:function(){return b},isComparing:function(){return e.compare},update:function(n){return(0,i._)(function(){var t,r,s;return(0,a._)(this,function(i){switch(i.label){case 0:if((void 0===n.weights||n.weights===e.weights)&&(void 0===n.networkName||n.networkName===e.networkName)||(void 0!==n.weights&&(e.weights=n.weights),void 0!==n.networkName&&(e.networkName=n.networkName),h=!1,!v))return[3,2];return[4,P()];case 1:i.sent(),i.label=2;case 2:return void 0!==n.scale&&n.scale!==e.scale&&(e.scale=n.scale,y&&(r=(t=k()).displayWidth,s=t.displayHeight,y.width=r*e.scale,y.height=s*e.scale,d(y,{width:r+"px",height:s+"px"}))),[2]}})})()}}}}"u">typeof window&&(window.artplayerPluginWebsr=f)},{"@swc/helpers/cjs/_async_to_generator.cjs":"cZn0e","@swc/helpers/cjs/_object_spread.cjs":"kyoEj","@swc/helpers/cjs/_type_of.cjs":"iXhRw","@swc/helpers/cjs/_ts_generator.cjs":"eltGh","@websr/websr":"aOhGv","@parcel/transformer-js/src/esmodule-helpers.js":"qpMMf"}],cZn0e:[function(e,n,t,r){"use strict";function s(e,n,t,r,s,i,o){try{var u=e[i](o),a=u.value}catch(e){t(e);return}u.done?n(a):Promise.resolve(a).then(r,s)}t._=function(e){return function(){var n=this,t=arguments;return new Promise(function(r,i){var o=e.apply(n,t);function u(e){s(o,r,i,u,a,"next",e)}function a(e){s(o,r,i,u,a,"throw",e)}u(void 0)})}}},{}],kyoEj:[function(e,n,t,r){"use strict";var s=e("9f9b8a24218ee51e");t._=function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.forEach(function(n){s._(e,n,t[n])})}return e}},{"9f9b8a24218ee51e":"ltU3W"}],ltU3W:[function(e,n,t,r){"use strict";t._=function(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}},{}],iXhRw:[function(e,n,t,r){"use strict";t._=function(e){return e&&"u">typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}},{}],eltGh:[function(e,n,t,r){"use strict";t._=function(e,n){var t,r,s,i={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]},o=Object.create(("function"==typeof Iterator?Iterator:Object).prototype),u=Object.defineProperty;return u(o,"next",{value:a(0)}),u(o,"throw",{value:a(1)}),u(o,"return",{value:a(2)}),"function"==typeof Symbol&&u(o,Symbol.iterator,{value:function(){return this}}),o;function a(e){return function(n){return c([e,n])}}function c(u){if(t)throw TypeError("Generator is already executing.");for(;o&&(o=0,u[0]&&(i=0)),i;)try{if(t=1,r&&(s=2&u[0]?r.return:u[0]?r.throw||((s=r.return)&&s.call(r),0):r.next)&&!(s=s.call(r,u[1])).done)return s;switch(r=0,s&&(u=[2&u[0],s.value]),u[0]){case 0:case 1:s=u;break;case 4:return i.label++,{value:u[1],done:!1};case 5:i.label++,r=u[1],u=[0];continue;case 7:u=i.ops.pop(),i.trys.pop();continue;default:if(!(s=(s=i.trys).length>0&&s[s.length-1])&&(6===u[0]||2===u[0])){i=0;continue}if(3===u[0]&&(!s||u[1]>s[0]&&u[1]<s[3])){i.label=u[1];break}if(6===u[0]&&i.label<s[1]){i.label=s[1],s=u;break}if(s&&i.label<s[2]){i.label=s[2],i.ops.push(u);break}s[2]&&i.ops.pop(),i.trys.pop();continue}u=n.call(e,i)}catch(e){u=[6,e],r=0}finally{t=s=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}}},{}],aOhGv:[function(require,module,exports,__globalThis){!function(e,n){module.exports=n()}(self,function(){return function(){"use strict";var __webpack_modules__={"./src/context.ts":function(__unused_webpack_module,exports){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nclass WebGPUContext {\n constructor(device, resolution, canvas, scale, debug) {\n this.device = device;\n this.canvas = canvas;\n this.resolution = resolution;\n this.textures = {};\n this.buffers = {};\n this.destroyed = false;\n this.scale = scale;\n this.debug = debug;\n let context = this.canvas.getContext('webgpu');\n if (context instanceof GPUCanvasContext) {\n this.context = context;\n }\n else {\n throw new Error(\"Unable to load WebGPU context\");\n }\n this.context.configure({\n device: this.device,\n format: navigator.gpu.getPreferredCanvasFormat()\n });\n this.textureUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;\n this.bufferUsage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST;\n if (this.debug) {\n // Read output pixel value\n this.textureUsage = this.textureUsage | GPUTextureUsage.COPY_SRC;\n this.bufferUsage = this.bufferUsage | GPUBufferUsage.COPY_SRC;\n }\n this.textures['output'] = this.context.getCurrentTexture();\n }\n readBuffer(bufferName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.buffers[bufferName])\n throw new Error(`No buffer with name ${bufferName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${bufferName} buffer encoder`,\n });\n const buffer = this.buffers[bufferName];\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: buffer.size,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyBufferToBuffer(buffer, 0, resultBuffer, 0, resultBuffer.size);\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n let range = resultBuffer.getMappedRange();\n return new Float32Array(range);\n });\n }\n readTexture(textureName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.textures[textureName])\n throw new Error(`No texture with name ${textureName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${textureName} texture encoder`,\n });\n const texture = this.textures[textureName];\n let bitsPerPixel = 16;\n if (texture.format === 'rgba8unorm')\n bitsPerPixel = 4;\n if (texture.format === 'r32float')\n bitsPerPixel = 4;\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: texture.width * texture.height * bitsPerPixel,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyTextureToBuffer({\n texture: this.textures[textureName],\n }, {\n buffer: resultBuffer,\n bytesPerRow: texture.width * bitsPerPixel\n }, {\n width: texture.width,\n height: texture.height,\n depthOrArrayLayers: 1,\n });\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n if (texture.format === 'r32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba8unorm')\n return new Uint8ClampedArray(resultBuffer.getMappedRange());\n return new Float32Array(0);\n });\n }\n destroy() {\n this.device.destroy();\n this.destroyed = true;\n }\n buffer(key, options) {\n if (!this.buffers[key]) {\n options = options || {};\n const width = options.width || this.resolution.width;\n const height = options.height || this.resolution.height;\n const channels = options.channels || 4;\n const bitdepth = options.bitdepth || 4;\n this.buffers[key] = this.device.createBuffer({\n label: key,\n size: width * height * channels * bitdepth,\n usage: this.bufferUsage\n });\n }\n return this.buffers[key];\n }\n texture(key, options) {\n if (!this.textures[key]) {\n options = options || {};\n this.textures[key] = this.device.createTexture({\n label: key,\n size: [options.width || this.resolution.width, options.height || this.resolution.height],\n format: options.format || 'rgba32float',\n usage: this.textureUsage\n });\n }\n return this.textures[key];\n }\n}\nexports[\"default\"] = WebGPUContext;\n\n\n//# sourceURL=webpack://WebSR/./src/context.ts?\n}")},"./src/layers/anime4k/conv2d-112x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv112x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights, first) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv112x4";\n const kernels = weights.weights;\n this.createUniform("kernels", "array<mat4x4f, 28>");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n if (first) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 2}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n else {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i + 1}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 3}]*max(-1.0*pixel_val${i}, vec4f(0.0));`;\n }\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv112x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-112x4.ts?\n}')},"./src/layers/anime4k/conv2d-16x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv16x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv16x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 36>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val0 = inputBuffer0[buff_ind];\n let pix_val1 = inputBuffer1[buff_ind];\n \n result += kernels[i]*max(pix_val0, vec4f(0.0));\n result += kernels[i+9]*max(pix_val1, vec4f(0.0));\n result += kernels[i+18]*max(-1.0*pix_val0, vec4f(0.0));\n result += kernels[i+27]*max(-1.0*pix_val1, vec4f(0.0));\n } \n \n\n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv16x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-16x4.ts?\n}')},"./src/layers/anime4k/conv2d-3x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv3x4 extends base_compute_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.label = "Anime4KConv3x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 9>");\n this.createUniform("bias", "vec4f");\n // Set up pipeline in Lazy Load\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[0] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureLoad(inputTexture0, coord + offset)\' :\n \'textureLoad(inputTexture0, coord + offset, 0)\';\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let offset = vec2<i32>(kernel_offsets[i].xy);\n result += kernels[i]*${textureLoad};\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n}\nexports["default"] = Anime4KConv3x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-3x4.ts?\n}')},"./src/layers/anime4k/conv2d-56x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv56x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv56x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernels", "array<mat4x4f, 14>");\n this.createUniform("bias", "vec4f");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${2 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${2 * i + 1}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n result += bias;\n \n outputBuffer[buff_ind] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv56x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-56x4.ts?\n}')},"./src/layers/anime4k/conv2d-8x4.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv8x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv8x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 18>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val = inputBuffer0[buff_ind];\n \n result += kernels[i]*max(pix_val, vec4f(0.0));\n result += kernels[i+9]*max(-1.0*pix_val, vec4f(0.0));\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv8x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-8x4.ts?\n}')},"./src/layers/anime4k/conv2d-concat2.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConcat2 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConcat2";\n this.createUniform("bias", "vec4f");\n const bias = weights.bias;\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n \n outputBuffer[buff_ind] = inputBuffer0[buff_ind] + inputBuffer1[buff_ind] + bias;\n }\n `);\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConcat2;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-concat2.ts?\n}')},"./src/layers/anime4k/display.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display.ts?\n}')},"./src/layers/anime4k/display_1x.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let bicubic = ${textureLoad};\n \n return bicubic + inputBuffer0[i];\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_1x.ts?\n}')},"./src/layers/anime4k/display_3c.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer3C extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer3C";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[3] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var<storage, read_write>inputBuffer1: array<vec4f>;\n @group(0) @binding(2) var<storage, read_write>inputBuffer2: array<vec4f>;\n @group(0) @binding(3) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(4) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n let value1 = inputBuffer1[i][c_index];\n let value2 = inputBuffer2[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value, value1, value2, value2);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n vertex: {\n module: this.shader,\n entryPoint: \'vertexMain\',\n },\n fragment: {\n module: this.shader,\n entryPoint: \'fragmentMain\',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer3C;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_3c.ts?\n}')},"./src/layers/base_compute_layer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ "./src/layers/base_layer.ts");\nclass ComputeLayer extends base_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.num_work_groups = 8;\n }\n createStandardShader(computeShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.computeShaderInputs()}\n \n ${computeShader}\n `\n });\n }\n computeShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n if (this.inputs[i] instanceof GPUTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_2d<f32>;`);\n }\n else if (this.inputs[i] instanceof GPUExternalTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_external;`);\n }\n else if (this.inputs[i] instanceof GPUBuffer) {\n inputs.push(`@group(0) @binding(${i}) var<storage, read_write>inputBuffer${i}: array<vec4f>;`);\n }\n else {\n console.log(this.inputs[i]);\n throw new Error("Input is undefined or non of the correct input type");\n }\n }\n // console.log("This layer", this.label);\n // console.log(this.inputs.length);\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n inputs.push(`@group(0) @binding(${this.inputs.length + this.uniforms.length}) var<storage, read_write>outputBuffer: array<vec4f>;`);\n return inputs.join(\'\\n\');\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n lazyLoadSetup() {\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginComputePass({ label: this.label });\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n // Dividing into work groups speeds up inference. If width or height aren\'t cleandly divided by work groups, we round to the nearest multiple of work-groups\n // Physically, this means shaving a few pixels (up to num_work_groups-1) off the bottom and right edges of the canvas but users shouldn\'t notice?\n pass.dispatchWorkgroups(Math.floor(this.resolution.width / this.num_work_groups), Math.floor(this.resolution.height / this.num_work_groups));\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n}\nexports["default"] = ComputeLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_compute_layer.ts?\n}')},"./src/layers/base_layer.ts":function(__unused_webpack_module,exports){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass Layer {\n constructor(inputs, output, weights) {\n this.context = globalThis.context;\n this.device = this.context.device;\n this.resolution = this.context.resolution;\n this.inputs = inputs;\n this.output = output;\n this.uniforms = [];\n this.buffers = {};\n this.weights = weights;\n }\n createUniform(name, type) {\n this.uniforms.push({ name, type });\n }\n setUniform(name, value) {\n const buffer = this.device.createBuffer({\n label: `layer-${this.label}-buffer-${name}`,\n size: value.byteLength,\n usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,\n });\n this.device.queue.writeBuffer(buffer, /*bufferOffset=*/ 0, value);\n this.buffers[name] = buffer;\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n hasExternalTexture() {\n for (const input of this.inputs) {\n if (input instanceof GPUExternalTexture)\n return true;\n }\n return false;\n }\n lazyLoadSetup() { }\n run() { }\n}\nexports["default"] = Layer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_layer.ts?\n}')},"./src/layers/base_render_layer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ \"./src/layers/base_layer.ts\");\nclass RenderLayer extends base_layer_1.default {\n constructor(inputs, output, weights) {\n super(inputs, output, weights);\n this.vertexScale = this.context.resolution;\n }\n defaultVertexShader() {\n return `\n \n struct VertexShaderOutput {\n @builtin(position) position: vec4f,\n @location(0) tex_coord: vec2f,\n };\n\n @vertex\n fn vertexMain( @builtin(vertex_index) vertexIndex : u32) -> VertexShaderOutput{\n let pos = array(\n // 1st triangle\n vec2f( -1.0, -1.0), // center\n vec2f( 1.0, -1.0), // right, center\n vec2f( -1.0, 1.0), // center, top\n \n // 2st triangle\n vec2f( -1.0, 1.0), // center, top\n vec2f( 1.0, -1.0), // right, center\n vec2f( 1.0, 1.0), // right, top\n );\n \n var vsOutput: VertexShaderOutput;\n let xy = pos[vertexIndex];\n vsOutput.position = vec4f(xy, 0.0, 1.0);\n vsOutput.tex_coord = xy*0.5 + 0.5;\n vsOutput.tex_coord.y = - 1.0* vsOutput.tex_coord.y + 1.0;\n vsOutput.tex_coord.x = vsOutput.tex_coord.x*${this.vertexScale.width};\n vsOutput.tex_coord.y = vsOutput.tex_coord.y*${this.vertexScale.height};\n return vsOutput;\n }\n `;\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: 'auto',\n vertex: {\n module: this.shader,\n entryPoint: 'vertexMain',\n },\n fragment: {\n module: this.shader,\n entryPoint: 'fragmentMain',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultRenderPassDescriptor() {\n return {\n label: `${this.label}-render-pass`,\n colorAttachments: [\n {\n view: this.output.createView(),\n clearValue: [0, 0, 0, 1],\n loadOp: 'clear',\n storeOp: 'store',\n },\n ],\n };\n }\n createStandardShader(fragmentShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n \n ${this.fragmentShaderInputs()}\n \n ${fragmentShader}\n `\n });\n }\n fragmentShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n let type = (this.inputs[i] instanceof GPUTexture) ? 'texture_2d<f32>' : 'texture_external';\n inputs.push(`@group(0) @binding(0) var inputTexture${i}: ${type};`);\n }\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n return inputs.join('\\n');\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginRenderPass(this.renderPassDescriptor);\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n pass.draw(6); // call our vertex shader 6 times\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n setOutput(outputTexture) {\n this.output = outputTexture;\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n}\nexports[\"default\"] = RenderLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_render_layer.ts?\n}")},"./src/layers/utils/gaussian.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass GuassianLayer extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.label = "Gaussian";\n this.createUniform("gaussian", "array<vec3f, 3>");\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n var val = 0.0;\n \n for(var i = 0u; i< 3; i++){\n \n let a = vec3f(\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x\n );\n \n val += dot(a, gaussian[i]);\n \n } \n \n \n return vec4f(val, val, val, 1.0);\n } \n `);\n this.setUniform("gaussian", new Float32Array([\n 0.0675, 0.125, 0.0675, 0.0,\n 0.125, 0.250, 0.1250, 0.0,\n 0.0675, 0.125, 0.0675, 0.0\n ]));\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n 0, -1, 0, 0,\n 1, -1, 0, 0,\n -1, 0, 0, 0,\n 0, 0, 0, 0,\n 1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, 1, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = GuassianLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/gaussian.ts?\n}')},"./src/layers/utils/rgb_2_yuv.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass RGB2YUV extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.createUniform("rgb2yuv", "mat3x3f");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let color = textureLoad(inputTexture0, vec2<i32>(input.tex_coord), 0); \n let yuv = rgb2yuv*color.xyz;\n \n return vec4f(yuv, 1.0);\n } \n `);\n this.setUniform("rgb2yuv", new Float32Array([\n 0.299, -0.1473, 0.615, 1.0,\n 0.587, -.2886, -.51499, 1.0,\n 0.114, 0.436, -.1001, 1.0\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = RGB2YUV;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/rgb_2_yuv.ts?\n}')},"./src/main.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst context_1 = __webpack_require__(/*! ./context */ "./src/context.ts");\nconst renderer_1 = __webpack_require__(/*! ./renderer */ "./src/renderer.ts");\nconst network_list_1 = __webpack_require__(/*! ./networks/network_list */ "./src/networks/network_list.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSR {\n constructor(params) {\n if (!network_list_1.NetworkList[params.network_name])\n throw Error(`Network ${params.network_name} is not defined or implemented`);\n this.source = params.source;\n const source = this.source;\n this.resolution = params.resolution ? params.resolution : {\n width: (0, utils_1.getSourceWidth)(source),\n height: (0, utils_1.getSourceHeight)(source)\n };\n const scale = network_list_1.NetworkScales[params.network_name];\n if (params.canvas)\n this.canvas = params.canvas;\n else {\n this.canvas = new HTMLCanvasElement();\n this.canvas.width = this.resolution.width * scale;\n this.canvas.height = this.resolution.height * scale;\n }\n this.scale = scale;\n this.context = new context_1.default(params.gpu, this.resolution, this.canvas, this.scale, this.debug);\n globalThis.context = this.context;\n this.network = new network_list_1.NetworkList[params.network_name](params.weights);\n this.renderer = new renderer_1.default(this.network, this.source);\n }\n switchNetwork(network, weights) {\n if (!network_list_1.NetworkList[network])\n throw Error(`Network ${network} is not defined or implemented`);\n this.network = new network_list_1.NetworkList[network](weights);\n this.renderer.switchNetwork(this.network);\n }\n static initWebGPU() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!navigator.gpu)\n return false;\n const adapter = yield navigator.gpu.requestAdapter();\n if (!adapter)\n return false;\n const device = yield adapter.requestDevice();\n if (!device)\n return false;\n return device;\n });\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.start();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.render(source);\n });\n }\n destroy() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n this.context.destroy();\n });\n }\n}\nexports["default"] = WebSR;\n\n\n//# sourceURL=webpack://WebSR/./src/main.ts?\n}')},"./src/networks/anime4k/cnn-2x-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ "./src/layers/anime4k/display_3c.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst conv2d_112x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-112x4 */ "./src/layers/anime4k/conv2d-112x4.ts");\nconst conv2d_concat2_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-concat2 */ "./src/layers/anime4k/conv2d-concat2.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNN2XL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i< 7; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n for (let c = 0; c < 3; c++) {\n const sources_0 = [];\n const sources_1 = [];\n for (let i = 0; i < 7; i++) {\n let source = (i == 0) ? `conv2d_tf` : `conv2d_${i}_tf`;\n sources_0.push(context.buffer(source));\n sources_1.push(context.buffer(source + "1"));\n }\n const dest = (c == 0) ? `conv2d_last_tf` : `conv2d_last_tf${c}`;\n layers.push(new conv2d_112x4_1.default(sources_0, context.buffer(`conv2d_last_${c}_pt1`), weights[dest], true));\n layers.push(new conv2d_112x4_1.default(sources_1, context.buffer(`conv2d_last_${c}_pt2`), weights[dest], false));\n layers.push(new conv2d_concat2_1.default([context.buffer(`conv2d_last_${c}_pt1`), context.buffer(`conv2d_last_${c}_pt2`)], context.buffer(dest), weights[dest]));\n }\n const paint = new display_3c_1.default([context.buffer(\'conv2d_last_tf\'), context.buffer(\'conv2d_last_tf1\'), context.buffer(\'conv2d_last_tf2\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNN2XL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-l.ts?\n}')},"./src/networks/anime4k/cnn-2x-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ \"./src/layers/anime4k/display_3c.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_7_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf'), weights['conv2d_7_tf']);\n const conv2d_7_tf1 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf1'), weights['conv2d_7_tf1']);\n const conv2d_7_tf2 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf2'), weights['conv2d_7_tf2']);\n const paint = new display_3c_1.default([context.buffer('conv2d_7_tf'), context.buffer('conv2d_7_tf1'), context.buffer('conv2d_7_tf2'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_7_tf, conv2d_7_tf1, conv2d_7_tf2, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-m.ts?\n}")},"./src/networks/anime4k/cnn-2x-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1 = __webpack_require__(/*! ../../layers/anime4k/display */ \"./src/layers/anime4k/display.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_last_tf'), weights['conv2d_last_tf']);\n const paint = new display_1.default([context.buffer('conv2d_last_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-s.ts?\n}")},"./src/networks/anime4k/cnn-restore-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ "./src/layers/anime4k/display_1x.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNNRL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i < 4; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n layers.push(new conv2d_16x4_1.default([context.buffer(\'conv2d_3_tf\'), context.buffer(\'conv2d_3_tf1\')], context.buffer(`conv2d_out_tf`), weights[`conv2d_out_tf`]));\n const paint = new display_1x_1.default([context.buffer(\'conv2d_out_tf\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNNRL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-l.ts?\n}')},"./src/networks/anime4k/cnn-restore-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_out_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_out_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-m.ts?\n}")},"./src/networks/anime4k/cnn-restore-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-s.ts?\n}")},"./src/networks/base_network.ts":function(__unused_webpack_module,exports){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass NeuralNetwork {\n constructor(weights) {\n this.weights = weights;\n this.context = globalThis.context;\n this.layers = this.model();\n }\n model() {\n return [];\n }\n lastLayer() {\n return this.layers[this.layers.length - 1];\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n this.layers.forEach(layer =>{\n layer.run();\n });\n });\n }\n}\nexports["default"] = NeuralNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/base_network.ts?\n}')},"./src/networks/network_list.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nexports.NetworkScales = exports.NetworkList = void 0;\nconst cnn_2x_s_1 = __webpack_require__(/*! ./anime4k/cnn-2x-s */ "./src/networks/anime4k/cnn-2x-s.ts");\nconst cnn_2x_m_1 = __webpack_require__(/*! ./anime4k/cnn-2x-m */ "./src/networks/anime4k/cnn-2x-m.ts");\nconst cnn_2x_l_1 = __webpack_require__(/*! ./anime4k/cnn-2x-l */ "./src/networks/anime4k/cnn-2x-l.ts");\nconst cnn_restore_l_1 = __webpack_require__(/*! ./anime4k/cnn-restore-l */ "./src/networks/anime4k/cnn-restore-l.ts");\nconst cnn_restore_m_1 = __webpack_require__(/*! ./anime4k/cnn-restore-m */ "./src/networks/anime4k/cnn-restore-m.ts");\nconst cnn_restore_s_1 = __webpack_require__(/*! ./anime4k/cnn-restore-s */ "./src/networks/anime4k/cnn-restore-s.ts");\nconst poc_network_1 = __webpack_require__(/*! ./poc_network */ "./src/networks/poc_network.ts");\nexports.NetworkList = {\n "anime4k/cnn-2x-s": cnn_2x_s_1.default,\n "anime4k/cnn-2x-m": cnn_2x_m_1.default,\n "anime4k/cnn-2x-l": cnn_2x_l_1.default,\n "anime4k/cnn-restore-s": cnn_restore_s_1.default,\n "anime4k/cnn-restore-m": cnn_restore_m_1.default,\n "anime4k/cnn-restore-l": cnn_restore_l_1.default,\n "sb2702/blur-poc": poc_network_1.default\n};\nexports.NetworkScales = {\n "anime4k/cnn-2x-s": 2,\n "anime4k/cnn-2x-m": 2,\n "anime4k/cnn-2x-l": 2,\n "anime4k/cnn-restore-s": 1,\n "anime4k/cnn-restore-m": 1,\n "anime4k/cnn-restore-l": 1,\n "sb2702/blur-poc": 1\n};\n\n\n//# sourceURL=webpack://WebSR/./src/networks/network_list.ts?\n}')},"./src/networks/poc_network.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ./base_network */ "./src/networks/base_network.ts");\nconst rgb_2_yuv_1 = __webpack_require__(/*! ../layers/utils/rgb_2_yuv */ "./src/layers/utils/rgb_2_yuv.ts");\nconst gaussian_1 = __webpack_require__(/*! ../layers/utils/gaussian */ "./src/layers/utils/gaussian.ts");\nclass PoCNetwork extends base_network_1.default {\n constructor() {\n super();\n }\n model() {\n const layers = [];\n const context = this.context;\n layers.push(new rgb_2_yuv_1.default([context.texture(\'input\')], context.texture(\'yuv\')));\n layers.push(new gaussian_1.default([context.texture(\'yuv\')], context.texture(\'output\')));\n return layers;\n }\n}\nexports["default"] = PoCNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/poc_network.ts?\n}')},"./src/renderer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst display_1 = __webpack_require__(/*! ./layers/anime4k/display */ "./src/layers/anime4k/display.ts");\nconst base_render_layer_1 = __webpack_require__(/*! ./layers/base_render_layer */ "./src/layers/base_render_layer.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSRRenderer {\n constructor(network, source) {\n this.context = globalThis.context;\n this.network = network;\n this.source = source;\n this.active = false;\n }\n switchNetwork(network) {\n this.network = network;\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.context.destroyed) {\n throw new Error("WebSR instance was destroyed");\n }\n this.active = true;\n yield this.renderStep();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n this.active = false;\n if (this.vfc && this.source && (0, utils_1.isHTMLVideoElement)(this.source))\n this.source.cancelVideoFrameCallback(this.vfc);\n });\n }\n renderStep() {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof display_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.render();\n if (this.active && this.source && (0, utils_1.isHTMLVideoElement)(this.source)) {\n this.vfc = this.source.requestVideoFrameCallback(this.renderStep.bind(this));\n }\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof base_render_layer_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.network.feedForward(source ? source : this.source);\n });\n }\n}\nexports["default"] = WebSRRenderer;\n\n\n//# sourceURL=webpack://WebSR/./src/renderer.ts?\n}')},"./src/utils.ts":function(__unused_webpack_module,exports){eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isMainThread = isMainThread;\nexports.isHTMLVideoElement = isHTMLVideoElement;\nexports.isHTMLImageElement = isHTMLImageElement;\nexports.isImageBitmap = isImageBitmap;\nexports.isVideoFrame = isVideoFrame;\nexports.isVideoSource = isVideoSource;\nexports.isImageSource = isImageSource;\nexports.getSourceWidth = getSourceWidth;\nexports.getSourceHeight = getSourceHeight;\n/**\n * Check if we're running on the main thread (not in a worker)\n */\nfunction isMainThread() {\n return typeof HTMLVideoElement !== 'undefined';\n}\n/**\n * Check if a source is a video element (main thread only)\n */\nfunction isHTMLVideoElement(source) {\n return typeof HTMLVideoElement !== 'undefined' && source instanceof HTMLVideoElement;\n}\n/**\n * Check if a source is an image element (main thread only)\n */\nfunction isHTMLImageElement(source) {\n return typeof HTMLImageElement !== 'undefined' && source instanceof HTMLImageElement;\n}\n/**\n * Check if a source is an ImageBitmap (works in both contexts)\n */\nfunction isImageBitmap(source) {\n return typeof ImageBitmap !== 'undefined' && source instanceof ImageBitmap;\n}\n/**\n * Check if a source is a VideoFrame (worker context)\n */\nfunction isVideoFrame(source) {\n return typeof VideoFrame !== 'undefined' && source instanceof VideoFrame;\n}\n/**\n * Check if a source is any type of video source\n */\nfunction isVideoSource(source) {\n return isHTMLVideoElement(source) || isVideoFrame(source);\n}\n/**\n * Check if a source is any type of image source\n */\nfunction isImageSource(source) {\n return isHTMLImageElement(source) || isImageBitmap(source);\n}\n/**\n * Get the width of a media source\n */\nfunction getSourceWidth(source) {\n if (isHTMLVideoElement(source))\n return source.videoWidth;\n if (isHTMLImageElement(source))\n return source.naturalWidth;\n if (isVideoFrame(source))\n return source.displayWidth;\n if (isImageBitmap(source))\n return source.width;\n return 0;\n}\n/**\n * Get the height of a media source\n */\nfunction getSourceHeight(source) {\n if (isHTMLVideoElement(source))\n return source.videoHeight;\n if (isHTMLImageElement(source))\n return source.naturalHeight;\n if (isVideoFrame(source))\n return source.displayHeight;\n if (isImageBitmap(source))\n return source.height;\n return 0;\n}\n\n\n//# sourceURL=webpack://WebSR/./src/utils.ts?\n}")}},__webpack_module_cache__={};function __webpack_require__(e){var n=__webpack_module_cache__[e];if(void 0!==n)return n.exports;var t=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),t.exports}var __webpack_exports__=__webpack_require__("./src/main.ts");return __webpack_exports__.default}()})},{}],qpMMf:[function(e,n,t,r){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,n){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})}),n},t.export=function(e,n,t){Object.defineProperty(e,n,{enumerable:!0,get:t})}},{}]},["hrC3O"],"hrC3O","parcelRequire4dc0",{});
\ No newline at end of file
+!function(e,t,r,n,s){var o="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},i="function"==typeof o[n]&&o[n],a=i.i||{},c=i.cache||{},l="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function u(t,r){if(!c[t]){if(!e[t]){if(s[t])return s[t];var a="function"==typeof o[n]&&o[n];if(!r&&a)return a(t,!0);if(i)return i(t,!0);if(l&&"string"==typeof t)return l(t);var d=Error("Cannot find module '"+t+"'");throw d.code="MODULE_NOT_FOUND",d}h.resolve=function(r){var n=e[t][1][r];return null!=n?n:r},h.cache={};var f=c[t]=new u.Module(t);e[t][0].call(f.exports,h,f,f.exports,o)}return c[t].exports;function h(e){var t=h.resolve(e);if(!1===t)return{};if(Array.isArray(t)){var r={__esModule:!0};return t.forEach(function(e){var t=e[0],n=e[1],s=e[2]||e[0],o=u(n);"*"===t?Object.keys(o).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(r,e)||Object.defineProperty(r,e,{enumerable:!0,get:function(){return o[e]}})}):"*"===s?Object.defineProperty(r,t,{enumerable:!0,value:o}):Object.defineProperty(r,t,{enumerable:!0,get:function(){return"default"===s?o.__esModule?o.default:o:o[s]}})}),r}return u(t)}}u.isParcelRequire=!0,u.Module=function(e){this.id=e,this.bundle=u,this.require=l,this.exports={}},u.modules=e,u.cache=c,u.parent=i,u.distDir=void 0,u.publicUrl=void 0,u.devServer=void 0,u.i=a,u.register=function(t,r){e[t]=[function(e,t){t.exports=r},{}]},Object.defineProperty(u,"root",{get:function(){return o[n]}}),o[n]=u;for(var d=0;d<t.length;d++)u(t[d]);if(r){var f=u(r);"object"==typeof exports&&"u">typeof module?module.exports=f:"function"==typeof define&&define.amd&&define(function(){return f})}}({hrC3O:[function(e,t,r,n){var s=e("@parcel/transformer-js/src/esmodule-helpers.js"),o=e("@swc/helpers/cjs/_async_to_generator.cjs"),i=e("@swc/helpers/cjs/_type_of.cjs"),a=e("@swc/helpers/cjs/_ts_generator.cjs"),c=e("./Upscaler.js"),l=s.interopDefault(c);window.artplayerPluginWebsr=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2};return function(t){var r=t.template,n=r.$video,s=r.$player,c=document.createElement("canvas");function u(){var e=t.video,r=s.offsetWidth||640,n=s.offsetHeight||360,o=(e.videoWidth||640)/(e.videoHeight||360),i=r,a=n;return r/n>o?i=n*o:a=r/o,{displayWidth:i,displayHeight:a}}if(s.appendChild(c),c.style.position="absolute",c.style.zIndex="11",c.style.pointerEvents="none",c.style.top="50%",c.style.left="50%",c.style.transform="translate(-50%, -50%)",c.style.opacity="0",c.style.transition="opacity 0.2s ease",!l.default||!l.default.isSupported||!l.default.isSupported())return void console.warn("Upscaler is not supported in this environment");var d=new(0,l.default)({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2}),f=!1;function h(){return(0,o._)(function(){return(0,a._)(this,function(t){switch(t.label){case 0:if(f)return[2];f=!0,t.label=1;case 1:return t.trys.push([1,4,,5]),[4,new Promise(function(e,t){if(n.readyState>=1)return void e();var r=function(){o(),e()},s=function(){o(),t(Error("Failed to load video metadata"))},o=function(){n.removeEventListener("loadedmetadata",r),n.removeEventListener("error",s)};n.addEventListener("loadedmetadata",r),n.addEventListener("error",s)})];case 2:return t.sent(),[4,d.startRealtimeUpscale(n,c,e.networkSize||d.networkSize)];case 3:return t.sent(),requestAnimationFrame(function(){c.style.opacity="1"}),[3,5];case 4:return console.error("artplayer-plugin-upscaler: failed to start realtime",t.sent()),[3,5];case 5:return[2]}})})()}var p=u(),m=p.displayWidth,v=p.displayHeight;c.style.width=m+"px",c.style.height=v+"px";var g=50,y=!1,w=!!e.compare,b=document.createElement("div");function k(){if(w){var e=u(),t=e.displayWidth,r=e.displayHeight,n="linear-gradient(to right, transparent 0%, transparent ".concat(g,"%, black ").concat(g,"%, black 100%)");c.style.maskImage=n;var o=s.offsetWidth||640,i=s.offsetHeight||360,a=(o-t)/2+t*g/100;b.style.top=(i-r)/2+"px",b.style.left=a+"px",b.style.height=r+"px",b.style.transform="translateX(-50%)"}else c.style.maskImage="none"}function _(e){w&&(y=!0)}function j(e){if(w&&y){var t=s.getBoundingClientRect(),r=u().displayWidth,n=s.offsetWidth||640;g=Math.max(0,Math.min(100,g=(e.clientX-t.left-(n-r)/2)/r*100)),k()}}function E(e){y=!1}return b.style.position="absolute",b.style.width="3px",b.style.backgroundColor="rgba(255, 255, 255, 0.75)",b.style.cursor="ew-resize",b.style.zIndex="12",b.style.pointerEvents="auto",b.style.display=w?"block":"none",b.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",w&&(s.appendChild(b),b.addEventListener("mousedown",_),document.addEventListener("mousemove",j),document.addEventListener("mouseup",E),k()),t.on("destroy",function(){d&&"function"==typeof d.dispose&&d.dispose(),b.removeEventListener("mousedown",_),document.removeEventListener("mousemove",j),document.removeEventListener("mouseup",E)}),t.on("resize",function(){var e=u(),t=e.displayWidth,r=e.displayHeight;c.style.width=t+"px",c.style.height=r+"px",k()}),t.on("play",function(){h()}),{name:"artplayerPluginWebsr",upscaler:d,update:function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(r&&(void 0===r?"undefined":(0,i._)(r))==="object"){if(Object.prototype.hasOwnProperty.call(r,"compare")){var n=!!r.compare;e.compare=n,(w=n)?(b.parentNode||s.appendChild(b),b.style.display="block",b.addEventListener("mousedown",_),document.addEventListener("mousemove",j),document.addEventListener("mouseup",E),k()):(c.style.maskImage="none",b.style.display="none",b.removeEventListener("mousedown",_),document.removeEventListener("mousemove",j),document.removeEventListener("mouseup",E))}r.networkSize&&(e.networkSize=r.networkSize,d&&"function"==typeof d.stopRealtimeUpscale&&d.stopRealtimeUpscale(),f=!1,t.paused||h())}}}}}},{"@swc/helpers/cjs/_async_to_generator.cjs":"cZn0e","@swc/helpers/cjs/_type_of.cjs":"iXhRw","@swc/helpers/cjs/_ts_generator.cjs":"eltGh","./Upscaler.js":"7WXlf","@parcel/transformer-js/src/esmodule-helpers.js":"qpMMf"}],cZn0e:[function(e,t,r,n){"use strict";function s(e,t,r,n,s,o,i){try{var a=e[o](i),c=a.value}catch(e){r(e);return}a.done?t(c):Promise.resolve(c).then(n,s)}r._=function(e){return function(){var t=this,r=arguments;return new Promise(function(n,o){var i=e.apply(t,r);function a(e){s(i,n,o,a,c,"next",e)}function c(e){s(i,n,o,a,c,"throw",e)}a(void 0)})}}},{}],iXhRw:[function(e,t,r,n){"use strict";r._=function(e){return e&&"u">typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}},{}],eltGh:[function(e,t,r,n){"use strict";r._=function(e,t){var r,n,s,o={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]},i=Object.create(("function"==typeof Iterator?Iterator:Object).prototype),a=Object.defineProperty;return a(i,"next",{value:c(0)}),a(i,"throw",{value:c(1)}),a(i,"return",{value:c(2)}),"function"==typeof Symbol&&a(i,Symbol.iterator,{value:function(){return this}}),i;function c(a){return function(c){var l=[a,c];if(r)throw TypeError("Generator is already executing.");for(;i&&(i=0,l[0]&&(o=0)),o;)try{if(r=1,n&&(s=2&l[0]?n.return:l[0]?n.throw||((s=n.return)&&s.call(n),0):n.next)&&!(s=s.call(n,l[1])).done)return s;switch(n=0,s&&(l=[2&l[0],s.value]),l[0]){case 0:case 1:s=l;break;case 4:return o.label++,{value:l[1],done:!1};case 5:o.label++,n=l[1],l=[0];continue;case 7:l=o.ops.pop(),o.trys.pop();continue;default:if(!(s=(s=o.trys).length>0&&s[s.length-1])&&(6===l[0]||2===l[0])){o=0;continue}if(3===l[0]&&(!s||l[1]>s[0]&&l[1]<s[3])){o.label=l[1];break}if(6===l[0]&&o.label<s[1]){o.label=s[1],s=l;break}if(s&&o.label<s[2]){o.label=s[2],o.ops.push(l);break}s[2]&&o.ops.pop(),o.trys.pop();continue}l=t.call(e,o)}catch(e){l=[6,e],n=0}finally{r=s=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}}}},{}],"7WXlf":[function(e,t,r,n){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(r),s.export(r,"default",function(){return d});var o=e("@swc/helpers/cjs/_async_to_generator.cjs"),i=e("@swc/helpers/cjs/_class_call_check.cjs"),a=e("@swc/helpers/cjs/_create_class.cjs"),c=e("@swc/helpers/cjs/_define_property.cjs"),l=e("@swc/helpers/cjs/_object_spread.cjs"),u=e("@swc/helpers/cjs/_ts_generator.cjs"),d=function(){"use strict";function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};(0,i._)(this,e);var r=t.weightsBaseUrl||"/weights";this.networks=t.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:"".concat(r,"/cnn-8.json")},medium:{name:"anime4k/cnn-2x-16",weightsUrl:"".concat(r,"/cnn-16.json")},large:{name:"anime4k/cnn-2x-28",weightsUrl:"".concat(r,"/cnn-28.json")}},this.weightsBaseUrl=r,this.networkSize=t.networkSize||"medium",this.workerUrl=t.workerUrl||"/worker/main.js",this.timeouts=(0,l._)({},e.DEFAULT_TIMEOUTS,t.timeouts||{}),this.delays=(0,l._)({},e.DEFAULT_DELAYS,t.delays||{}),this.imageScale="number"==typeof t.imageScale&&t.imageScale>0?t.imageScale:2,this.videoScale="number"==typeof t.videoScale&&t.videoScale>0?t.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}return(0,a._)(e,[{key:"init",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=t.prewarm;if(!e.isSupported())throw Error("Upscaler is not supported in this environment");return(void 0===r||r)&&this.getWorker().postMessage({cmd:"isSupported"}),this}},{key:"getWorker",value:function(){var e=this;return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=function(t){return e.handleWorkerMessage(t)}),this.workerInstance}},{key:"handleBlobResponse",value:function(e){var t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r((0,c._)({},t,e.data))}},{key:"requestBlob",value:function(){var e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}},{key:"handleWorkerMessage",value:function(t){var r=t.data;if(console.debug("Worker message:",r),r.cmd){var n=r.cmd;if("progress"===n){var s=e.extractProgressValue(r);null!==s&&this.progressCallback&&this.progressCallback(s),this.messageHandlers.progress&&this.messageHandlers.progress(r)}else"finished"===n?r.data instanceof Blob?this.handleBlobResponse(r):this.requestBlob():this.messageHandlers[n]&&this.messageHandlers[n](r)}}},{key:"loadWeights",value:function(e){return(0,o._)(function(){var t,r;return(0,u._)(this,function(n){switch(n.label){case 0:if(this.validateNetworkSize(e),this.weightsCache.has(e))return[2,this.weightsCache.get(e)];return[4,fetch(this.networks[e].weightsUrl)];case 1:if(!(t=n.sent()).ok)throw Error("Failed to fetch weights: ".concat(t.statusText));return[4,t.json()];case 2:return r=n.sent(),this.weightsCache.set(e,r),[2,r]}})}).call(this)}},{key:"createOffscreenCanvas",value:function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:2,n="number"==typeof r&&r>0?r:1,s=document.createElement("canvas");if(s.width=e*n,s.height=t*n,"function"!=typeof s.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");return s.transferControlToOffscreen()}},{key:"createBlobPromise",value:function(e,t){var r=this;return new Promise(function(n,s){var o=setTimeout(function(){r.messageHandlers[e]&&(delete r.messageHandlers[e],s(Error("".concat(e," processing timeout"))))},t);r.messageHandlers[e]=function(t){delete r.messageHandlers[e],clearTimeout(o);var i=t[e]||t.data;i instanceof Blob?n(i):s(Error("Invalid ".concat(e," format")))}})}},{key:"validateNetworkSize",value:function(e){if(!this.networks[e])throw Error("Invalid networkSize: use one of "+Object.keys(this.networks).join(", "))}},{key:"upscaleImage",value:function(t,r,n){return(0,o._)(function(){var s,o,i,a,c,l,d,f,h,p,m,v,g,y;return(0,u._)(this,function(u){switch(u.label){case 0:if(s=this,!t)throw Error("Image file is required");return o=r||this.networkSize,this.validateNetworkSize(o),this.processingType="image",[4,t.arrayBuffer()];case 1:return i=u.sent(),a=t.type||"image/jpeg",[4,e.loadImageMetadata(i,a)];case 2:return l=(c=u.sent()).width,d=c.height,[4,this.loadWeights(o)];case 3:return f=u.sent(),h=this.networks[o],p="number"==typeof n&&n>0?n:this.imageScale,v=(m=[this.createOffscreenCanvas(l,d,p),this.createOffscreenCanvas(l,d,1)])[0],g=m[1],y=this.createBlobPromise("imageBlob",this.timeouts.IMAGE),this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:i,imageMimeType:a,upscaled:v,original:g,resolution:{width:l,height:d},network_name:h.name,weights:f}},[v,g]),setTimeout(function(){s.getWorker().postMessage({cmd:"network",data:{name:h.name,imageArrayBuffer:i,imageMimeType:a,weights:f}}),setTimeout(function(){s.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:i,imageMimeType:a}})},s.delays.NETWORK)},this.delays.INIT),[2,y]}})}).call(this)}},{key:"upscaleVideo",value:function(t,r,n){return(0,o._)(function(){var s,o,i,a,c,l,d,f,h,p,m,v;return(0,u._)(this,function(u){switch(u.label){case 0:if(!t)throw Error("Video file is required");if(s=r||this.networkSize,this.validateNetworkSize(s),!e.isVideoSupported())throw Error("WebCodecs API not supported. Requires Chrome 94+");return this.processingType="video",[4,e.loadVideoMetadata(t,this.timeouts.METADATA)];case 1:return i=(o=u.sent()).width,a=o.height,c=o.duration,[4,this.loadWeights(s)];case 2:return l=u.sent(),d=this.networks[s],f="number"==typeof n&&n>0?n:this.videoScale,p=(h=[this.createOffscreenCanvas(i,a,f),this.createOffscreenCanvas(i,a,1)])[0],m=h[1],v=this.createBlobPromise("videoBlob",this.timeouts.VIDEO),this.getWorker().postMessage({cmd:"process",file:t,fileSize:t.size,duration:c,adjustedResolution:{adjustedInputWidth:i,adjustedInputHeight:a,adjustedOutputWidth:i*f,adjustedOutputHeight:a*f},upscaled:p,original:m,weights:l,network_name:d.name,skipDemuxProgress:!0},[p,m]),[2,v]}})}).call(this)}},{key:"startRealtimeUpscale",value:function(e,t,r,n){return(0,o._)(function(){var s,i,a,c,l,d,f,h,p,m,v,g,y;return(0,u._)(this,function(w){switch(w.label){case 0:if(s=this,!e||!t)throw Error("videoElement and canvasElement are required");return i=r||this.networkSize,this.validateNetworkSize(i),a=this.networks[i],[4,this.loadWeights(i)];case 1:return c=w.sent(),l="number"==typeof n&&n>0?n:this.videoScale,[4,new Promise(function(t,r){if(e.readyState>=1)return void t();var n=function(){o(),t()},s=function(){o(),r(Error("Failed to load video metadata"))},o=function(){e.removeEventListener("loadedmetadata",n),e.removeEventListener("error",s)};e.addEventListener("loadedmetadata",n),e.addEventListener("error",s)})];case 2:if(w.sent(),d=e.videoWidth,f=e.videoHeight,!d||!f)throw Error("Invalid video dimensions");if(h=!t._upscalerTransferred,p=null,h){if(t.width=d*l,t.height=f*l,"function"!=typeof t.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");p=t.transferControlToOffscreen(),t._upscalerTransferred=!0}return(m=document.createElement("canvas")).width=d,m.height=f,v=m.getContext("2d"),this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),g={cmd:"realtimeInit",data:{upscaled:h?p:null,resolution:{width:d,height:f,scale:l,outputWidth:d*l,outputHeight:f*l},network_name:a.name,weights:c}},h&&p?this.getWorker().postMessage(g,[p]):this.getWorker().postMessage(g),this.realtimeState={running:!0,video:e,canvas:t,scale:l,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:v},y=function(){return(0,o._)(function(){var e,t,r,n,s,o;return(0,u._)(this,function(i){switch(i.label){case 0:if(!this.realtimeState||!this.realtimeState.running)return[2];if(r=(t=(e=this.realtimeState).video).HAVE_CURRENT_DATA||2,!(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0))return[3,5];e.busy=!0,i.label=1;case 1:if(i.trys.push([1,3,4,5]),n=e.captureCanvas,s=e.captureCtx,!n||!s)throw Error("Missing capture canvas");return s.drawImage(t,0,0,n.width,n.height),[4,createImageBitmap(n)];case 2:return o=i.sent(),e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:o},[o]),[3,5];case 3:return console.warn("realtimeFrame error",i.sent()),[3,5];case 4:return this.realtimeState&&(this.realtimeState.busy=!1),[7];case 5:return this.realtimeLoopId=requestAnimationFrame(y),[2]}})}).call(s)},this.realtimeLoopId=requestAnimationFrame(y),[2]}})}).call(this)}},{key:"stopRealtimeUpscale",value:function(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}},{key:"downloadUpscaled",value:function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return(0,o._)(function(){var n,s,o,i,a,c;return(0,u._)(this,function(l){switch(l.label){case 0:if(n=e.type.startsWith("video"),s=t||this.networkSize,!n)return[3,2];return[4,this.upscaleVideo(e,s)];case 1:return i=l.sent(),[3,4];case 2:return[4,this.upscaleImage(e,s)];case 3:i=l.sent(),l.label=4;case 4:return o=i,a=URL.createObjectURL(o),(c=document.createElement("a")).href=a,c.download=r||"upscaled_".concat(Date.now(),".").concat(n?"mp4":"png"),c.click(),URL.revokeObjectURL(a),[2,o]}})}).call(this)}},{key:"getSupportedNetworks",value:function(){return Object.keys(this.networks)}},{key:"getAppState",value:function(){return{backend:e.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}},{key:"onProgress",value:function(e){"function"==typeof e&&(this.progressCallback=e)}},{key:"dispose",value:function(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}}],[{key:"isSupported",value:function(){try{var e="u">typeof Worker,t="u">typeof OffscreenCanvas||"u">typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="u">typeof Blob;return e&&t&&r}catch(e){return!1}}},{key:"isVideoSupported",value:function(){try{return"u">typeof VideoEncoder&&"u">typeof VideoDecoder}catch(e){return!1}}},{key:"extractProgressValue",value:function(e){var t,r,n,s=null!=(n=null!=(r=null!=(t=e.data)?t:e.progress)?r:e.value)?n:e.percentage;return"number"==typeof s?Math.min(100,Math.max(0,Math.round(s))):null}},{key:"loadImageMetadata",value:function(e,t){return new Promise(function(r,n){var s=new Blob([e],{type:t}),o=URL.createObjectURL(s),i=new Image;i.onload=function(){URL.revokeObjectURL(o),r({width:i.width,height:i.height})},i.onerror=function(){URL.revokeObjectURL(o),n(Error("Failed to load image"))},i.src=o})}},{key:"loadVideoMetadata",value:function(e,t){return new Promise(function(r,n){var s=URL.createObjectURL(e),o=document.createElement("video");o.src=s;var i=setTimeout(function(){return n(Error("Timeout"))},t);o.onloadedmetadata=function(){clearTimeout(i),URL.revokeObjectURL(s),r({width:o.videoWidth,height:o.videoHeight,duration:o.duration})},o.onerror=function(){clearTimeout(i),URL.revokeObjectURL(s),n(Error("Failed to load video"))}})}},{key:"getGPUCapability",value:function(){return(0,o._)(function(){var e,t;return(0,u._)(this,function(r){switch(r.label){case 0:if(r.trys.push([0,3,,4]),!navigator.gpu)return[3,2];return[4,navigator.gpu.requestAdapter()];case 1:if(e=r.sent())return[2,Math.min(e.limits.maxStorageBufferBindingSize/512,0x4000000)];r.label=2;case 2:if(t=document.createElement("canvas").getContext("webgl2"))return[2,Math.pow(t.getParameter(t.MAX_TEXTURE_SIZE),2)];return[2,8388608];case 3:return r.sent(),[2,8388608];case 4:return[2]}})})()}},{key:"getBackendType",value:function(){try{if(navigator.gpu)return"webgpu";if(document.createElement("canvas").getContext("webgl2"))return"webgl";return"unknown"}catch(e){return"unknown"}}}]),e}();(0,c._)(d,"DEFAULT_TIMEOUTS",{IMAGE:3e5,VIDEO:36e5,METADATA:1e4}),(0,c._)(d,"DEFAULT_DELAYS",{INIT:500,NETWORK:300})},{"@swc/helpers/cjs/_async_to_generator.cjs":"cZn0e","@swc/helpers/cjs/_class_call_check.cjs":"4Uf9M","@swc/helpers/cjs/_create_class.cjs":"igUuK","@swc/helpers/cjs/_define_property.cjs":"ltU3W","@swc/helpers/cjs/_object_spread.cjs":"kyoEj","@swc/helpers/cjs/_ts_generator.cjs":"eltGh","@parcel/transformer-js/src/esmodule-helpers.js":"qpMMf"}],"4Uf9M":[function(e,t,r,n){"use strict";r._=function(e,t){if(!(e instanceof t))throw TypeError("Cannot call a class as a function")}},{}],igUuK:[function(e,t,r,n){"use strict";function s(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}r._=function(e,t,r){return t&&s(e.prototype,t),r&&s(e,r),e}},{}],ltU3W:[function(e,t,r,n){"use strict";r._=function(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}},{}],kyoEj:[function(e,t,r,n){"use strict";var s=e("9f9b8a24218ee51e");r._=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter(function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),n.forEach(function(t){s._(e,t,r[t])})}return e}},{"9f9b8a24218ee51e":"ltU3W"}],qpMMf:[function(e,t,r,n){r.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},r.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},r.exportAll=function(e,t){return Object.keys(e).forEach(function(r){"default"===r||"__esModule"===r||Object.prototype.hasOwnProperty.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[r]}})}),t},r.export=function(e,t,r){Object.defineProperty(e,t,{enumerable:!0,get:r})}},{}]},["hrC3O"],"hrC3O","parcelRequire4dc0",{});
\ No newline at end of file
diff --git a/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.mjs b/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.mjs
index e34928d74..b8f2d171a 100644
--- a/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.mjs
+++ b/packages/artplayer-plugin-websr/dist/artplayer-plugin-websr.mjs
@@ -5,4 +5,4 @@
  * (c) 2017-2026 Harvey Zack
  * Released under the MIT License.
  */
-!function(e,n,t,r,s){var i="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},o="function"==typeof i[r]&&i[r],u=o.i||{},a=o.cache||{},c="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(n,t){if(!a[n]){if(!e[n]){if(s[n])return s[n];var u="function"==typeof i[r]&&i[r];if(!t&&u)return u(n,!0);if(o)return o(n,!0);if(c&&"string"==typeof n)return c(n);var f=Error("Cannot find module '"+n+"'");throw f.code="MODULE_NOT_FOUND",f}_.resolve=p,_.cache={};var d=a[n]=new l.Module(n);e[n][0].call(d.exports,_,d,d.exports,i)}return a[n].exports;function _(e){var n=_.resolve(e);if(!1===n)return{};if(Array.isArray(n)){var t={__esModule:!0};return n.forEach(function(e){var n=e[0],r=e[1],s=e[2]||e[0],i=l(r);"*"===n?Object.keys(i).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:function(){return i[e]}})}):"*"===s?Object.defineProperty(t,n,{enumerable:!0,value:i}):Object.defineProperty(t,n,{enumerable:!0,get:function(){return"default"===s?i.__esModule?i.default:i:i[s]}})}),t}return l(n)}function p(t){var r=e[n][1][t];return null!=r?r:t}}function f(e){this.id=e,this.bundle=l,this.require=c,this.exports={}}l.isParcelRequire=!0,l.Module=f,l.modules=e,l.cache=a,l.parent=o,l.distDir=void 0,l.publicUrl=void 0,l.devServer=void 0,l.i=u,l.register=function(n,t){e[n]=[function(e,n){n.exports=t},{}]},Object.defineProperty(l,"root",{get:function(){return i[r]}}),i[r]=l;for(var d=0;d<n.length;d++)l(n[d]);if(t){var _=l(t);"object"==typeof exports&&"u">typeof module?module.exports=_:"function"==typeof define&&define.amd&&define(function(){return _})}}({hOg5u:[function(e,n,t,r){var s=e("@parcel/transformer-js/src/esmodule-helpers.js");s.defineInteropFlag(t),s.export(t,"default",()=>u);var i=e("@websr/websr"),o=s.interopDefault(i);function u(e={}){return n=>{let{template:{$player:t},constructor:{validator:r,utils:{append:s,setStyles:i}}}=n;(e=r({scale:2,networkName:"",weights:null,compare:!1,...e},{scale:"number",networkName:"string",weights:"?string|object",compare:"boolean"})).networkName||console.error("WebSR: networkName is required"),e.weights||console.error("WebSR: weights is required");let u=null,a=null,c=!1,l=!0,f=null,d=.5,_=!1,p=document.createElement("canvas");p.id="artplayer-websr-canvas",i(p,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"block",pointerEvents:"none",zIndex:"11",imageRendering:"crisp-edges"}),s(t,p);let h=document.createElement("div");function x(n){if(i(h,{left:100*(d=Math.max(0,Math.min(1,n)))+"%"}),e.compare){let e=100*d;i(p,{clipPath:`inset(0 0 0 ${e}%)`})}}function v(){let e=n.video;if(!e)return{displayWidth:640,displayHeight:360};let r=t.offsetWidth||640,s=t.offsetHeight||360,i=(e.videoWidth||640)/(e.videoHeight||360),o=r,u=s;return r/s>i?o=s*i:u=r/i,{displayWidth:o,displayHeight:u}}async function b(){try{let t;if(c)return!0;if(!navigator.gpu)return console.warn("WebGPU is not supported"),!1;if(!(a=await o.default.initWebGPU()))return console.warn("Failed to initialize WebGPU"),!1;if("string"==typeof e.weights){let n=await fetch(e.weights);if(!n.ok)return console.warn(`Failed to load weights from ${e.weights}`),!1;t=await n.json()}else{if("object"!=typeof e.weights)return console.warn("Invalid weights format"),!1;t=e.weights}let r=n.video;if(!r)return console.warn("Video element not found"),!1;let{displayWidth:s,displayHeight:l}=v();return p.width=s*e.scale,p.height=l*e.scale,i(p,{width:s+"px",height:l+"px"}),u=new(0,o.default)({source:r,network_name:e.networkName,weights:t,gpu:a,canvas:p}),c=!0,!0}catch(e){return console.error("WebSR initialization error:",e),!1}}async function m(){if(u&&l&&n.video)try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}}async function y(){if(!u||!l||!n.video||n.video.paused){f=null;return}try{await u.render(n.video)}catch(e){console.error("WebSR render error:",e)}l&&!n.video.paused&&(f=requestAnimationFrame(y))}async function w(){if(!l){if(!c&&!await b())return void console.error("Failed to initialize WebSR");l=!0,setStyle(p,"display","block"),n.video&&!n.video.paused&&(f=requestAnimationFrame(y)),n.emit("artplayerPluginWebsr:enable")}}function g(){l&&(l=!1,i(p,{display:"none"}),f&&(cancelAnimationFrame(f),f=null),n.emit("artplayerPluginWebsr:disable"))}async function k(){l?g():await w()}return h.id="artplayer-websr-divider",i(h,{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"2px",height:"100%",backgroundColor:"#fff",display:e.compare?"block":"none",pointerEvents:"auto",cursor:"col-resize",zIndex:"12"}),s(t,h),document.addEventListener("mousemove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.clientX-n.left)/n.width)}),document.addEventListener("mouseup",()=>{_=!1}),h.addEventListener("mousedown",()=>{_=!0}),document.addEventListener("touchmove",e=>{if(!_)return;let n=t.getBoundingClientRect();x((e.touches[0].clientX-n.left)/n.width)},{passive:!0}),document.addEventListener("touchend",()=>{_=!1}),h.addEventListener("touchstart",()=>{_=!0}),n.on("play",()=>{m(),l&&c&&!f&&(f=requestAnimationFrame(y))}),n.on("pause",()=>{f&&(cancelAnimationFrame(f),f=null)}),n.on("seek",()=>{l&&c&&!n.video.paused&&!f&&(f=requestAnimationFrame(y))}),n.on("resize",()=>{if(u&&p.offsetParent){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}),n.on("destroy",()=>{g(),f&&(cancelAnimationFrame(f),f=null),p.parentNode&&p.parentNode.removeChild(p)}),b().then(()=>{l&&c&&n.video&&m()}).catch(e=>console.error("Failed to init WebSR:",e)),{name:"artplayerPluginWebsr",websr:()=>u,gpu:()=>a,canvas:()=>p,enable:w,disable:g,toggle:k,isEnabled:()=>l,isInitialized:()=>c,enableCompare:()=>{e.compare=!0,i(h,{display:"block"}),x(d)},disableCompare:()=>{e.compare=!1,i(h,{display:"none"}),i(p,{clipPath:"none"})},toggleCompare:()=>{e.compare?(i(h,{display:"none"}),i(p,{clipPath:"none"}),e.compare=!1):(e.compare=!0,i(h,{display:"block"}),x(d))},setComparePosition:e=>{x(e)},getComparePosition:()=>d,isComparing:()=>e.compare,update:async n=>{if((void 0!==n.weights&&n.weights!==e.weights||void 0!==n.networkName&&n.networkName!==e.networkName)&&(void 0!==n.weights&&(e.weights=n.weights),void 0!==n.networkName&&(e.networkName=n.networkName),c=!1,l&&await b()),void 0!==n.scale&&n.scale!==e.scale&&(e.scale=n.scale,p)){let{displayWidth:n,displayHeight:t}=v();p.width=n*e.scale,p.height=t*e.scale,i(p,{width:n+"px",height:t+"px"})}}}}}"u">typeof window&&(window.artplayerPluginWebsr=u)},{"@websr/websr":"ePQAX","@parcel/transformer-js/src/esmodule-helpers.js":"loqXi"}],ePQAX:[function(require,module,exports,__globalThis){!function(e,n){module.exports=n()}(self,()=>(()=>{var __webpack_modules__={"./src/context.ts":function(__unused_webpack_module,exports){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nclass WebGPUContext {\n constructor(device, resolution, canvas, scale, debug) {\n this.device = device;\n this.canvas = canvas;\n this.resolution = resolution;\n this.textures = {};\n this.buffers = {};\n this.destroyed = false;\n this.scale = scale;\n this.debug = debug;\n let context = this.canvas.getContext('webgpu');\n if (context instanceof GPUCanvasContext) {\n this.context = context;\n }\n else {\n throw new Error(\"Unable to load WebGPU context\");\n }\n this.context.configure({\n device: this.device,\n format: navigator.gpu.getPreferredCanvasFormat()\n });\n this.textureUsage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;\n this.bufferUsage = GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST;\n if (this.debug) {\n // Read output pixel value\n this.textureUsage = this.textureUsage | GPUTextureUsage.COPY_SRC;\n this.bufferUsage = this.bufferUsage | GPUBufferUsage.COPY_SRC;\n }\n this.textures['output'] = this.context.getCurrentTexture();\n }\n readBuffer(bufferName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.buffers[bufferName])\n throw new Error(`No buffer with name ${bufferName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${bufferName} buffer encoder`,\n });\n const buffer = this.buffers[bufferName];\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: buffer.size,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyBufferToBuffer(buffer, 0, resultBuffer, 0, resultBuffer.size);\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n let range = resultBuffer.getMappedRange();\n return new Float32Array(range);\n });\n }\n readTexture(textureName) {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.textures[textureName])\n throw new Error(`No texture with name ${textureName}`);\n const readEncoder = this.device.createCommandEncoder({\n label: `Read ${textureName} texture encoder`,\n });\n const texture = this.textures[textureName];\n let bitsPerPixel = 16;\n if (texture.format === 'rgba8unorm')\n bitsPerPixel = 4;\n if (texture.format === 'r32float')\n bitsPerPixel = 4;\n const resultBuffer = this.device.createBuffer({\n label: 'result buffer',\n size: texture.width * texture.height * bitsPerPixel,\n usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST\n });\n readEncoder.copyTextureToBuffer({\n texture: this.textures[textureName],\n }, {\n buffer: resultBuffer,\n bytesPerRow: texture.width * bitsPerPixel\n }, {\n width: texture.width,\n height: texture.height,\n depthOrArrayLayers: 1,\n });\n this.device.queue.submit([readEncoder.finish()]);\n yield resultBuffer.mapAsync(GPUMapMode.READ);\n if (texture.format === 'r32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba32float')\n return new Float32Array(resultBuffer.getMappedRange());\n else if (texture.format === 'rgba8unorm')\n return new Uint8ClampedArray(resultBuffer.getMappedRange());\n return new Float32Array(0);\n });\n }\n destroy() {\n this.device.destroy();\n this.destroyed = true;\n }\n buffer(key, options) {\n if (!this.buffers[key]) {\n options = options || {};\n const width = options.width || this.resolution.width;\n const height = options.height || this.resolution.height;\n const channels = options.channels || 4;\n const bitdepth = options.bitdepth || 4;\n this.buffers[key] = this.device.createBuffer({\n label: key,\n size: width * height * channels * bitdepth,\n usage: this.bufferUsage\n });\n }\n return this.buffers[key];\n }\n texture(key, options) {\n if (!this.textures[key]) {\n options = options || {};\n this.textures[key] = this.device.createTexture({\n label: key,\n size: [options.width || this.resolution.width, options.height || this.resolution.height],\n format: options.format || 'rgba32float',\n usage: this.textureUsage\n });\n }\n return this.textures[key];\n }\n}\nexports[\"default\"] = WebGPUContext;\n\n\n//# sourceURL=webpack://WebSR/./src/context.ts?\n}")},"./src/layers/anime4k/conv2d-112x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv112x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights, first) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv112x4";\n const kernels = weights.weights;\n this.createUniform("kernels", "array<mat4x4f, 28>");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n if (first) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 2}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n else {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${4 * i + 1}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${4 * i + 3}]*max(-1.0*pixel_val${i}, vec4f(0.0));`;\n }\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv112x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-112x4.ts?\n}')},"./src/layers/anime4k/conv2d-16x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv16x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv16x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 36>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val0 = inputBuffer0[buff_ind];\n let pix_val1 = inputBuffer1[buff_ind];\n \n result += kernels[i]*max(pix_val0, vec4f(0.0));\n result += kernels[i+9]*max(pix_val1, vec4f(0.0));\n result += kernels[i+18]*max(-1.0*pix_val0, vec4f(0.0));\n result += kernels[i+27]*max(-1.0*pix_val1, vec4f(0.0));\n } \n \n\n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv16x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-16x4.ts?\n}')},"./src/layers/anime4k/conv2d-3x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv3x4 extends base_compute_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.label = "Anime4KConv3x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 9>");\n this.createUniform("bias", "vec4f");\n // Set up pipeline in Lazy Load\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[0] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureLoad(inputTexture0, coord + offset)\' :\n \'textureLoad(inputTexture0, coord + offset, 0)\';\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let offset = vec2<i32>(kernel_offsets[i].xy);\n result += kernels[i]*${textureLoad};\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n}\nexports["default"] = Anime4KConv3x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-3x4.ts?\n}')},"./src/layers/anime4k/conv2d-56x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv56x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv56x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernels", "array<mat4x4f, 14>");\n this.createUniform("bias", "vec4f");\n let read_buffers = \'\';\n for (let i = 0; i< 7; i++) {\n read_buffers += `\n let pixel_val${i} = inputBuffer${i}[buff_ind];\n result += kernels[${2 * i}]*max(pixel_val${i}, vec4f(0.0));\n result += kernels[${2 * i + 1}]*max(-1.0*pixel_val${i}, vec4f(0.0));\n `;\n }\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n ${read_buffers}\n \n result += bias;\n \n outputBuffer[buff_ind] = result;\n }\n `);\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = Anime4KConv56x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-56x4.ts?\n}')},"./src/layers/anime4k/conv2d-8x4.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConv8x4 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConv8x4";\n const kernels = weights.weights;\n const bias = weights.bias;\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.createUniform("kernels", "array<mat4x4f, 18>");\n this.createUniform("bias", "vec4f");\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n for(var i = 0u; i< 9; i++){\n let pixel_loc = coord + vec2<i32>(kernel_offsets[i].xy);\n let buff_ind = pixel_loc.y*${this.resolution.width} + pixel_loc.x;\n \n let pix_val = inputBuffer0[buff_ind];\n \n result += kernels[i]*max(pix_val, vec4f(0.0));\n result += kernels[i+9]*max(-1.0*pix_val, vec4f(0.0));\n } \n \n result += bias;\n \n outputBuffer[i] = result;\n }\n `);\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n -1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, -1, 0, 0,\n 0, 0, 0, 0,\n 0, 1, 0, 0,\n 1, -1, 0, 0,\n 1, 0, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.setUniform("kernels", new Float32Array(kernels));\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConv8x4;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-8x4.ts?\n}')},"./src/layers/anime4k/conv2d-concat2.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_compute_layer_1 = __webpack_require__(/*! ../base_compute_layer */ "./src/layers/base_compute_layer.ts");\nclass Anime4KConcat2 extends base_compute_layer_1.default {\n constructor(inputs, outputBuffer, weights) {\n super(inputs, outputBuffer, weights);\n this.label = "Anime4KConcat2";\n this.createUniform("bias", "vec4f");\n const bias = weights.bias;\n this.shader = this.createStandardShader(`\n \n @compute @workgroup_size(${this.num_work_groups}, ${this.num_work_groups}) fn main( @builtin(global_invocation_id) id: vec3<u32>) {\n \n let x = id.x;\n let y = id.y;\n \n let i = id.y*${this.resolution.width} + x;\n var result = vec4f(0.0, 0.0, 0.0, 0.0);\n \n let coord = vec2<i32>( i32(x), i32(y));\n \n let buff_ind = coord.y*${this.resolution.width} + coord.x;\n \n outputBuffer[buff_ind] = inputBuffer0[buff_ind] + inputBuffer1[buff_ind] + bias;\n }\n `);\n this.setUniform("bias", new Float32Array(bias));\n this.defaultSetup();\n }\n}\nexports["default"] = Anime4KConcat2;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/conv2d-concat2.ts?\n}')},"./src/layers/anime4k/display.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display.ts?\n}')},"./src/layers/anime4k/display_1x.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[1] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(2) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let bicubic = ${textureLoad};\n \n return bicubic + inputBuffer0[i];\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_1x.ts?\n}')},"./src/layers/anime4k/display_3c.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass DisplayLayer3C extends base_render_layer_1.default {\n constructor(inputs, output) {\n super(inputs, output);\n this.label = "DisplayLayer3C";\n this.vertexScale = {\n width: 1,\n height: 1\n };\n this.sampler = this.device.createSampler({\n addressModeU: "repeat",\n addressModeV: "repeat",\n magFilter: "linear",\n minFilter: "linear",\n mipmapFilter: "linear",\n });\n }\n lazyLoadSetup() {\n const externalTexture = this.inputs[3] instanceof GPUExternalTexture;\n const textureLoad = externalTexture ? \'textureSampleBaseClampToEdge(inputTexture, ourSampler, input.tex_coord)\' :\n \'textureSample(inputTexture, ourSampler, input.tex_coord)\';\n this.shader = this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n @group(0) @binding(0) var<storage, read_write>inputBuffer0: array<vec4f>;\n @group(0) @binding(1) var<storage, read_write>inputBuffer1: array<vec4f>;\n @group(0) @binding(2) var<storage, read_write>inputBuffer2: array<vec4f>;\n @group(0) @binding(3) var inputTexture: ${externalTexture ? \'texture_external\' : \'texture_2d<f32>\'};\n @group(0) @binding(4) var ourSampler: sampler;\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let x = ${this.resolution.width}.0*(input.tex_coord.x);\n let y = ${this.resolution.height}.0*(input.tex_coord.y);\n \n let y2 = u32(floor(y));\n let x2 = u32(floor(x));\n \n let i = y2*${Math.floor(this.resolution.width)} + x2;\n \n let x_floor = u32(fract(x)*2.0);\n let y_floor = u32(fract(y)*2.0);\n \n //I don t know, I think this is right? I found this by trial and error\n let c_index: u32 = x_floor + y_floor*2; \n \n let value = inputBuffer0[i][c_index];\n let value1 = inputBuffer1[i][c_index];\n let value2 = inputBuffer2[i][c_index];\n \n let bicubic = ${textureLoad};\n \n return bicubic + vec4f(value, value1, value2, value2);\n \n } \n `\n });\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n vertex: {\n module: this.shader,\n entryPoint: \'vertexMain\',\n },\n fragment: {\n module: this.shader,\n entryPoint: \'fragmentMain\',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n entries.push({ binding: this.inputs.length, resource: this.sampler });\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n}\nexports["default"] = DisplayLayer3C;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/anime4k/display_3c.ts?\n}')},"./src/layers/base_compute_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ "./src/layers/base_layer.ts");\nclass ComputeLayer extends base_layer_1.default {\n constructor(inputTextures, outputBuffer, weights) {\n super(inputTextures, outputBuffer, weights);\n this.num_work_groups = 8;\n }\n createStandardShader(computeShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.computeShaderInputs()}\n \n ${computeShader}\n `\n });\n }\n computeShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n if (this.inputs[i] instanceof GPUTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_2d<f32>;`);\n }\n else if (this.inputs[i] instanceof GPUExternalTexture) {\n inputs.push(`@group(0) @binding(${i}) var inputTexture${i}: texture_external;`);\n }\n else if (this.inputs[i] instanceof GPUBuffer) {\n inputs.push(`@group(0) @binding(${i}) var<storage, read_write>inputBuffer${i}: array<vec4f>;`);\n }\n else {\n console.log(this.inputs[i]);\n throw new Error("Input is undefined or non of the correct input type");\n }\n }\n // console.log("This layer", this.label);\n // console.log(this.inputs.length);\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n inputs.push(`@group(0) @binding(${this.inputs.length + this.uniforms.length}) var<storage, read_write>outputBuffer: array<vec4f>;`);\n return inputs.join(\'\\n\');\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: \'auto\',\n compute: {\n module: this.shader,\n entryPoint: \'main\',\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createComputePipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n }\n lazyLoadSetup() {\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginComputePass({ label: this.label });\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n // Dividing into work groups speeds up inference. If width or height aren\'t cleandly divided by work groups, we round to the nearest multiple of work-groups\n // Physically, this means shaving a few pixels (up to num_work_groups-1) off the bottom and right edges of the canvas but users shouldn\'t notice?\n pass.dispatchWorkgroups(Math.floor(this.resolution.width / this.num_work_groups), Math.floor(this.resolution.height / this.num_work_groups));\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n}\nexports["default"] = ComputeLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_compute_layer.ts?\n}')},"./src/layers/base_layer.ts":(__unused_webpack_module,exports)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass Layer {\n constructor(inputs, output, weights) {\n this.context = globalThis.context;\n this.device = this.context.device;\n this.resolution = this.context.resolution;\n this.inputs = inputs;\n this.output = output;\n this.uniforms = [];\n this.buffers = {};\n this.weights = weights;\n }\n createUniform(name, type) {\n this.uniforms.push({ name, type });\n }\n setUniform(name, value) {\n const buffer = this.device.createBuffer({\n label: `layer-${this.label}-buffer-${name}`,\n size: value.byteLength,\n usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,\n });\n this.device.queue.writeBuffer(buffer, /*bufferOffset=*/ 0, value);\n this.buffers[name] = buffer;\n }\n defaultBindGroup() {\n const entries = [];\n this.inputs.forEach(function (input, i) {\n if (input instanceof GPUExternalTexture) {\n entries.push({ binding: i, resource: input });\n }\n else if (input instanceof GPUTexture) {\n entries.push({ binding: i, resource: input.createView() });\n }\n else if (input instanceof GPUBuffer) {\n entries.push({ binding: i, resource: { buffer: input } });\n }\n });\n this.uniforms.forEach((uniform, i) => {\n entries.push({\n binding: i + this.inputs.length,\n resource: {\n buffer: this.buffers[uniform.name]\n }\n });\n });\n if (this.output instanceof GPUBuffer) {\n entries.push({\n binding: this.inputs.length + this.uniforms.length,\n resource: {\n buffer: this.output\n }\n });\n }\n if (entries.length === 0)\n return null;\n return this.device.createBindGroup({\n layout: this.pipeline.getBindGroupLayout(0),\n entries\n });\n }\n hasExternalTexture() {\n for (const input of this.inputs) {\n if (input instanceof GPUExternalTexture)\n return true;\n }\n return false;\n }\n lazyLoadSetup() { }\n run() { }\n}\nexports["default"] = Layer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_layer.ts?\n}')},"./src/layers/base_render_layer.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_layer_1 = __webpack_require__(/*! ./base_layer */ \"./src/layers/base_layer.ts\");\nclass RenderLayer extends base_layer_1.default {\n constructor(inputs, output, weights) {\n super(inputs, output, weights);\n this.vertexScale = this.context.resolution;\n }\n defaultVertexShader() {\n return `\n \n struct VertexShaderOutput {\n @builtin(position) position: vec4f,\n @location(0) tex_coord: vec2f,\n };\n\n @vertex\n fn vertexMain( @builtin(vertex_index) vertexIndex : u32) -> VertexShaderOutput{\n let pos = array(\n // 1st triangle\n vec2f( -1.0, -1.0), // center\n vec2f( 1.0, -1.0), // right, center\n vec2f( -1.0, 1.0), // center, top\n \n // 2st triangle\n vec2f( -1.0, 1.0), // center, top\n vec2f( 1.0, -1.0), // right, center\n vec2f( 1.0, 1.0), // right, top\n );\n \n var vsOutput: VertexShaderOutput;\n let xy = pos[vertexIndex];\n vsOutput.position = vec4f(xy, 0.0, 1.0);\n vsOutput.tex_coord = xy*0.5 + 0.5;\n vsOutput.tex_coord.y = - 1.0* vsOutput.tex_coord.y + 1.0;\n vsOutput.tex_coord.x = vsOutput.tex_coord.x*${this.vertexScale.width};\n vsOutput.tex_coord.y = vsOutput.tex_coord.y*${this.vertexScale.height};\n return vsOutput;\n }\n `;\n }\n defaultPipelineConfig() {\n return {\n label: `${this.label}-pipeline`,\n layout: 'auto',\n vertex: {\n module: this.shader,\n entryPoint: 'vertexMain',\n },\n fragment: {\n module: this.shader,\n entryPoint: 'fragmentMain',\n targets: [{ format: this.output.format }],\n },\n };\n }\n defaultSetup() {\n this.pipeline = this.device.createRenderPipeline(this.defaultPipelineConfig());\n this.bindGroup = this.defaultBindGroup();\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n defaultRenderPassDescriptor() {\n return {\n label: `${this.label}-render-pass`,\n colorAttachments: [\n {\n view: this.output.createView(),\n clearValue: [0, 0, 0, 1],\n loadOp: 'clear',\n storeOp: 'store',\n },\n ],\n };\n }\n createStandardShader(fragmentShader) {\n return this.device.createShaderModule({\n label: `${this.label}-shader`,\n code: `\n \n ${this.defaultVertexShader()}\n \n ${this.fragmentShaderInputs()}\n \n ${fragmentShader}\n `\n });\n }\n fragmentShaderInputs() {\n const inputs = [];\n for (let i = 0; i< this.inputs.length; i++) {\n let type = (this.inputs[i] instanceof GPUTexture) ? 'texture_2d<f32>' : 'texture_external';\n inputs.push(`@group(0) @binding(0) var inputTexture${i}: ${type};`);\n }\n this.uniforms.forEach((uniform, i) => {\n inputs.push(`@group(0) @binding(${i + this.inputs.length}) var<uniform>${uniform.name}: ${uniform.type};`);\n });\n return inputs.join('\\n');\n }\n run() {\n const encoder = this.device.createCommandEncoder({ label: this.label });\n if (!this.pipeline)\n this.lazyLoadSetup();\n const pass = encoder.beginRenderPass(this.renderPassDescriptor);\n pass.setPipeline(this.pipeline);\n if (this.hasExternalTexture()) {\n this.bindGroup = this.defaultBindGroup();\n }\n if (this.bindGroup) {\n pass.setBindGroup(0, this.bindGroup);\n }\n pass.draw(6); // call our vertex shader 6 times\n pass.end();\n this.device.queue.submit([encoder.finish()]);\n }\n setOutput(outputTexture) {\n this.output = outputTexture;\n this.renderPassDescriptor = this.defaultRenderPassDescriptor();\n }\n}\nexports[\"default\"] = RenderLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/base_render_layer.ts?\n}")},"./src/layers/utils/gaussian.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass GuassianLayer extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.label = "Gaussian";\n this.createUniform("gaussian", "array<vec3f, 3>");\n this.createUniform("kernel_offsets", "array<vec4f, 9>");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n var val = 0.0;\n \n for(var i = 0u; i< 3; i++){\n \n let a = vec3f(\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x,\n textureLoad(inputTexture0, vec2<i32>(input.tex_coord + kernel_offsets[i*3].xy), 0).x\n );\n \n val += dot(a, gaussian[i]);\n \n } \n \n \n return vec4f(val, val, val, 1.0);\n } \n `);\n this.setUniform("gaussian", new Float32Array([\n 0.0675, 0.125, 0.0675, 0.0,\n 0.125, 0.250, 0.1250, 0.0,\n 0.0675, 0.125, 0.0675, 0.0\n ]));\n this.setUniform("kernel_offsets", new Float32Array([\n -1, -1, 0, 0,\n 0, -1, 0, 0,\n 1, -1, 0, 0,\n -1, 0, 0, 0,\n 0, 0, 0, 0,\n 1, 0, 0, 0,\n -1, 1, 0, 0,\n 0, 1, 0, 0,\n 1, 1, 0, 0,\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = GuassianLayer;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/gaussian.ts?\n}')},"./src/layers/utils/rgb_2_yuv.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_render_layer_1 = __webpack_require__(/*! ../base_render_layer */ "./src/layers/base_render_layer.ts");\nclass RGB2YUV extends base_render_layer_1.default {\n constructor(inputTextures, outputTexture) {\n super(inputTextures, outputTexture);\n this.createUniform("rgb2yuv", "mat3x3f");\n this.shader = this.createStandardShader(`\n \n @fragment fn fragmentMain(input: VertexShaderOutput) -> @location(0) vec4f {\n \n let color = textureLoad(inputTexture0, vec2<i32>(input.tex_coord), 0); \n let yuv = rgb2yuv*color.xyz;\n \n return vec4f(yuv, 1.0);\n } \n `);\n this.setUniform("rgb2yuv", new Float32Array([\n 0.299, -0.1473, 0.615, 1.0,\n 0.587, -.2886, -.51499, 1.0,\n 0.114, 0.436, -.1001, 1.0\n ]));\n this.defaultSetup();\n }\n}\nexports["default"] = RGB2YUV;\n\n\n//# sourceURL=webpack://WebSR/./src/layers/utils/rgb_2_yuv.ts?\n}')},"./src/main.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst context_1 = __webpack_require__(/*! ./context */ "./src/context.ts");\nconst renderer_1 = __webpack_require__(/*! ./renderer */ "./src/renderer.ts");\nconst network_list_1 = __webpack_require__(/*! ./networks/network_list */ "./src/networks/network_list.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSR {\n constructor(params) {\n if (!network_list_1.NetworkList[params.network_name])\n throw Error(`Network ${params.network_name} is not defined or implemented`);\n this.source = params.source;\n const source = this.source;\n this.resolution = params.resolution ? params.resolution : {\n width: (0, utils_1.getSourceWidth)(source),\n height: (0, utils_1.getSourceHeight)(source)\n };\n const scale = network_list_1.NetworkScales[params.network_name];\n if (params.canvas)\n this.canvas = params.canvas;\n else {\n this.canvas = new HTMLCanvasElement();\n this.canvas.width = this.resolution.width * scale;\n this.canvas.height = this.resolution.height * scale;\n }\n this.scale = scale;\n this.context = new context_1.default(params.gpu, this.resolution, this.canvas, this.scale, this.debug);\n globalThis.context = this.context;\n this.network = new network_list_1.NetworkList[params.network_name](params.weights);\n this.renderer = new renderer_1.default(this.network, this.source);\n }\n switchNetwork(network, weights) {\n if (!network_list_1.NetworkList[network])\n throw Error(`Network ${network} is not defined or implemented`);\n this.network = new network_list_1.NetworkList[network](weights);\n this.renderer.switchNetwork(this.network);\n }\n static initWebGPU() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!navigator.gpu)\n return false;\n const adapter = yield navigator.gpu.requestAdapter();\n if (!adapter)\n return false;\n const device = yield adapter.requestDevice();\n if (!device)\n return false;\n return device;\n });\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.start();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.render(source);\n });\n }\n destroy() {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.renderer.stop();\n this.context.destroy();\n });\n }\n}\nexports["default"] = WebSR;\n\n\n//# sourceURL=webpack://WebSR/./src/main.ts?\n}')},"./src/networks/anime4k/cnn-2x-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ "./src/layers/anime4k/display_3c.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst conv2d_112x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-112x4 */ "./src/layers/anime4k/conv2d-112x4.ts");\nconst conv2d_concat2_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-concat2 */ "./src/layers/anime4k/conv2d-concat2.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNN2XL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i< 7; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n for (let c = 0; c < 3; c++) {\n const sources_0 = [];\n const sources_1 = [];\n for (let i = 0; i < 7; i++) {\n let source = (i == 0) ? `conv2d_tf` : `conv2d_${i}_tf`;\n sources_0.push(context.buffer(source));\n sources_1.push(context.buffer(source + "1"));\n }\n const dest = (c == 0) ? `conv2d_last_tf` : `conv2d_last_tf${c}`;\n layers.push(new conv2d_112x4_1.default(sources_0, context.buffer(`conv2d_last_${c}_pt1`), weights[dest], true));\n layers.push(new conv2d_112x4_1.default(sources_1, context.buffer(`conv2d_last_${c}_pt2`), weights[dest], false));\n layers.push(new conv2d_concat2_1.default([context.buffer(`conv2d_last_${c}_pt1`), context.buffer(`conv2d_last_${c}_pt2`)], context.buffer(dest), weights[dest]));\n }\n const paint = new display_3c_1.default([context.buffer(\'conv2d_last_tf\'), context.buffer(\'conv2d_last_tf1\'), context.buffer(\'conv2d_last_tf2\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNN2XL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-l.ts?\n}')},"./src/networks/anime4k/cnn-2x-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_3c_1 = __webpack_require__(/*! ../../layers/anime4k/display_3c */ \"./src/layers/anime4k/display_3c.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_7_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf'), weights['conv2d_7_tf']);\n const conv2d_7_tf1 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf1'), weights['conv2d_7_tf1']);\n const conv2d_7_tf2 = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_7_tf2'), weights['conv2d_7_tf2']);\n const paint = new display_3c_1.default([context.buffer('conv2d_7_tf'), context.buffer('conv2d_7_tf1'), context.buffer('conv2d_7_tf2'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_7_tf, conv2d_7_tf1, conv2d_7_tf2, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[3] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-m.ts?\n}")},"./src/networks/anime4k/cnn-2x-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1 = __webpack_require__(/*! ../../layers/anime4k/display */ \"./src/layers/anime4k/display.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNN2XS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_last_tf'), weights['conv2d_last_tf']);\n const paint = new display_1.default([context.buffer('conv2d_last_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers[0].lazyLoadSetup();\n this.layers[this.layers.length - 1].lazyLoadSetup();\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNN2XS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-2x-s.ts?\n}")},"./src/networks/anime4k/cnn-restore-l.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ "./src/networks/base_network.ts");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ "./src/layers/anime4k/conv2d-3x4.ts");\nconst conv2d_16x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-16x4 */ "./src/layers/anime4k/conv2d-16x4.ts");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ "./src/layers/anime4k/display_1x.ts");\nconst utils_1 = __webpack_require__(/*! ../../utils */ "./src/utils.ts");\nclass Anime4KCNNRL extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf\'), weights[\'conv2d_tf\']));\n layers.push(new conv2d_3x4_1.default([context.input], context.buffer(\'conv2d_tf1\'), weights[\'conv2d_tf1\']));\n for (let i = 1; i < 4; i++) {\n let source = (i == 1) ? `conv2d_tf` : `conv2d_${i - 1}_tf`;\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf`), weights[`conv2d_${i}_tf`]));\n layers.push(new conv2d_16x4_1.default([context.buffer(source), context.buffer(source + "1")], context.buffer(`conv2d_${i}_tf1`), weights[`conv2d_${i}_tf1`]));\n }\n layers.push(new conv2d_16x4_1.default([context.buffer(\'conv2d_3_tf\'), context.buffer(\'conv2d_3_tf1\')], context.buffer(`conv2d_out_tf`), weights[`conv2d_out_tf`]));\n const paint = new display_1x_1.default([context.buffer(\'conv2d_out_tf\'), context.input], context.texture(\'output\'));\n layers.push(paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture(\'input\', { format: "rgba8unorm" }) }, [width, height]);\n this.context.input = this.context.texture(\'input\');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports["default"] = Anime4KCNNRL;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-l.ts?\n}')},"./src/networks/anime4k/cnn-restore-m.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst conv2d_56x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-56x4 */ \"./src/layers/anime4k/conv2d-56x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRM extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_3_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_3_tf'), weights['conv2d_3_tf']);\n const conv2d_4_tf = new conv2d_8x4_1.default([context.buffer('conv2d_3_tf')], context.buffer('conv2d_4_tf'), weights['conv2d_4_tf']);\n const conv2d_5_tf = new conv2d_8x4_1.default([context.buffer('conv2d_4_tf')], context.buffer('conv2d_5_tf'), weights['conv2d_5_tf']);\n const conv2d_6_tf = new conv2d_8x4_1.default([context.buffer('conv2d_5_tf')], context.buffer('conv2d_6_tf'), weights['conv2d_6_tf']);\n const conv2d_out_tf = new conv2d_56x4_1.default([context.buffer('conv2d_tf'), context.buffer('conv2d_1_tf'), context.buffer('conv2d_2_tf'), context.buffer('conv2d_3_tf'), context.buffer('conv2d_4_tf'), context.buffer('conv2d_5_tf'), context.buffer('conv2d_6_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_3_tf, conv2d_4_tf, conv2d_5_tf, conv2d_6_tf, conv2d_out_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[1].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRM;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-m.ts?\n}")},"./src/networks/anime4k/cnn-restore-s.ts":function(__unused_webpack_module,exports,__webpack_require__){eval("{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ../base_network */ \"./src/networks/base_network.ts\");\nconst conv2d_3x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-3x4 */ \"./src/layers/anime4k/conv2d-3x4.ts\");\nconst conv2d_8x4_1 = __webpack_require__(/*! ../../layers/anime4k/conv2d-8x4 */ \"./src/layers/anime4k/conv2d-8x4.ts\");\nconst display_1x_1 = __webpack_require__(/*! ../../layers/anime4k/display_1x */ \"./src/layers/anime4k/display_1x.ts\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\nclass Anime4KCNNRS extends base_network_1.default {\n constructor(weights) {\n super(weights);\n }\n model() {\n const layers = [];\n const weights = this.weights.layers;\n const context = this.context;\n const conv2d_tf = new conv2d_3x4_1.default([context.input], context.buffer('conv2d_tf'), weights['conv2d_tf']);\n const conv2d_1_tf = new conv2d_8x4_1.default([context.buffer('conv2d_tf')], context.buffer('conv2d_1_tf'), weights['conv2d_1_tf']);\n const conv2d_2_tf = new conv2d_8x4_1.default([context.buffer('conv2d_1_tf')], context.buffer('conv2d_2_tf'), weights['conv2d_2_tf']);\n const conv2d_last_tf = new conv2d_8x4_1.default([context.buffer('conv2d_2_tf')], context.buffer('conv2d_out_tf'), weights['conv2d_out_tf']);\n const paint = new display_1x_1.default([context.buffer('conv2d_out_tf'), context.input], context.texture('output'));\n layers.push(conv2d_tf, conv2d_1_tf, conv2d_2_tf, conv2d_last_tf, paint);\n return layers;\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n if ((0, utils_1.isHTMLVideoElement)(source) || (0, utils_1.isVideoFrame)(source)) {\n this.context.input = this.context.device.importExternalTexture({ source });\n }\n else {\n const bitmap = (0, utils_1.isImageBitmap)(source) ? source : yield createImageBitmap(source);\n const width = (0, utils_1.getSourceWidth)(source);\n const height = (0, utils_1.getSourceHeight)(source);\n this.context.device.queue.copyExternalImageToTexture({ source: bitmap }, { texture: this.context.texture('input', { format: \"rgba8unorm\" }) }, [width, height]);\n this.context.input = this.context.texture('input');\n }\n this.layers[0].inputs[0] = this.context.input;\n this.layers[this.layers.length - 1].inputs[1] = this.context.input;\n this.layers.forEach(function (layer) {\n layer.run();\n });\n });\n }\n}\nexports[\"default\"] = Anime4KCNNRS;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/anime4k/cnn-restore-s.ts?\n}")},"./src/networks/base_network.ts":function(__unused_webpack_module,exports){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nclass NeuralNetwork {\n constructor(weights) {\n this.weights = weights;\n this.context = globalThis.context;\n this.layers = this.model();\n }\n model() {\n return [];\n }\n lastLayer() {\n return this.layers[this.layers.length - 1];\n }\n feedForward(source) {\n return __awaiter(this, void 0, void 0, function* () {\n this.layers.forEach(layer =>{\n layer.run();\n });\n });\n }\n}\nexports["default"] = NeuralNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/base_network.ts?\n}')},"./src/networks/network_list.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nexports.NetworkScales = exports.NetworkList = void 0;\nconst cnn_2x_s_1 = __webpack_require__(/*! ./anime4k/cnn-2x-s */ "./src/networks/anime4k/cnn-2x-s.ts");\nconst cnn_2x_m_1 = __webpack_require__(/*! ./anime4k/cnn-2x-m */ "./src/networks/anime4k/cnn-2x-m.ts");\nconst cnn_2x_l_1 = __webpack_require__(/*! ./anime4k/cnn-2x-l */ "./src/networks/anime4k/cnn-2x-l.ts");\nconst cnn_restore_l_1 = __webpack_require__(/*! ./anime4k/cnn-restore-l */ "./src/networks/anime4k/cnn-restore-l.ts");\nconst cnn_restore_m_1 = __webpack_require__(/*! ./anime4k/cnn-restore-m */ "./src/networks/anime4k/cnn-restore-m.ts");\nconst cnn_restore_s_1 = __webpack_require__(/*! ./anime4k/cnn-restore-s */ "./src/networks/anime4k/cnn-restore-s.ts");\nconst poc_network_1 = __webpack_require__(/*! ./poc_network */ "./src/networks/poc_network.ts");\nexports.NetworkList = {\n "anime4k/cnn-2x-s": cnn_2x_s_1.default,\n "anime4k/cnn-2x-m": cnn_2x_m_1.default,\n "anime4k/cnn-2x-l": cnn_2x_l_1.default,\n "anime4k/cnn-restore-s": cnn_restore_s_1.default,\n "anime4k/cnn-restore-m": cnn_restore_m_1.default,\n "anime4k/cnn-restore-l": cnn_restore_l_1.default,\n "sb2702/blur-poc": poc_network_1.default\n};\nexports.NetworkScales = {\n "anime4k/cnn-2x-s": 2,\n "anime4k/cnn-2x-m": 2,\n "anime4k/cnn-2x-l": 2,\n "anime4k/cnn-restore-s": 1,\n "anime4k/cnn-restore-m": 1,\n "anime4k/cnn-restore-l": 1,\n "sb2702/blur-poc": 1\n};\n\n\n//# sourceURL=webpack://WebSR/./src/networks/network_list.ts?\n}')},"./src/networks/poc_network.ts":(__unused_webpack_module,exports,__webpack_require__)=>{eval('{\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst base_network_1 = __webpack_require__(/*! ./base_network */ "./src/networks/base_network.ts");\nconst rgb_2_yuv_1 = __webpack_require__(/*! ../layers/utils/rgb_2_yuv */ "./src/layers/utils/rgb_2_yuv.ts");\nconst gaussian_1 = __webpack_require__(/*! ../layers/utils/gaussian */ "./src/layers/utils/gaussian.ts");\nclass PoCNetwork extends base_network_1.default {\n constructor() {\n super();\n }\n model() {\n const layers = [];\n const context = this.context;\n layers.push(new rgb_2_yuv_1.default([context.texture(\'input\')], context.texture(\'yuv\')));\n layers.push(new gaussian_1.default([context.texture(\'yuv\')], context.texture(\'output\')));\n return layers;\n }\n}\nexports["default"] = PoCNetwork;\n\n\n//# sourceURL=webpack://WebSR/./src/networks/poc_network.ts?\n}')},"./src/renderer.ts":function(__unused_webpack_module,exports,__webpack_require__){eval('{\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nObject.defineProperty(exports, "__esModule", ({ value: true }));\nconst display_1 = __webpack_require__(/*! ./layers/anime4k/display */ "./src/layers/anime4k/display.ts");\nconst base_render_layer_1 = __webpack_require__(/*! ./layers/base_render_layer */ "./src/layers/base_render_layer.ts");\nconst utils_1 = __webpack_require__(/*! ./utils */ "./src/utils.ts");\nclass WebSRRenderer {\n constructor(network, source) {\n this.context = globalThis.context;\n this.network = network;\n this.source = source;\n this.active = false;\n }\n switchNetwork(network) {\n this.network = network;\n }\n start() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.context.destroyed) {\n throw new Error("WebSR instance was destroyed");\n }\n this.active = true;\n yield this.renderStep();\n });\n }\n stop() {\n return __awaiter(this, void 0, void 0, function* () {\n this.active = false;\n if (this.vfc && this.source && (0, utils_1.isHTMLVideoElement)(this.source))\n this.source.cancelVideoFrameCallback(this.vfc);\n });\n }\n renderStep() {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof display_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.render();\n if (this.active && this.source && (0, utils_1.isHTMLVideoElement)(this.source)) {\n this.vfc = this.source.requestVideoFrameCallback(this.renderStep.bind(this));\n }\n });\n }\n render(source) {\n return __awaiter(this, void 0, void 0, function* () {\n const lastLayer = this.network.lastLayer();\n if (lastLayer instanceof base_render_layer_1.default)\n lastLayer.setOutput(this.context.context.getCurrentTexture());\n yield this.network.feedForward(source ? source : this.source);\n });\n }\n}\nexports["default"] = WebSRRenderer;\n\n\n//# sourceURL=webpack://WebSR/./src/renderer.ts?\n}')},"./src/utils.ts":(__unused_webpack_module,exports)=>{eval("{\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isMainThread = isMainThread;\nexports.isHTMLVideoElement = isHTMLVideoElement;\nexports.isHTMLImageElement = isHTMLImageElement;\nexports.isImageBitmap = isImageBitmap;\nexports.isVideoFrame = isVideoFrame;\nexports.isVideoSource = isVideoSource;\nexports.isImageSource = isImageSource;\nexports.getSourceWidth = getSourceWidth;\nexports.getSourceHeight = getSourceHeight;\n/**\n * Check if we're running on the main thread (not in a worker)\n */\nfunction isMainThread() {\n return typeof HTMLVideoElement !== 'undefined';\n}\n/**\n * Check if a source is a video element (main thread only)\n */\nfunction isHTMLVideoElement(source) {\n return typeof HTMLVideoElement !== 'undefined' && source instanceof HTMLVideoElement;\n}\n/**\n * Check if a source is an image element (main thread only)\n */\nfunction isHTMLImageElement(source) {\n return typeof HTMLImageElement !== 'undefined' && source instanceof HTMLImageElement;\n}\n/**\n * Check if a source is an ImageBitmap (works in both contexts)\n */\nfunction isImageBitmap(source) {\n return typeof ImageBitmap !== 'undefined' && source instanceof ImageBitmap;\n}\n/**\n * Check if a source is a VideoFrame (worker context)\n */\nfunction isVideoFrame(source) {\n return typeof VideoFrame !== 'undefined' && source instanceof VideoFrame;\n}\n/**\n * Check if a source is any type of video source\n */\nfunction isVideoSource(source) {\n return isHTMLVideoElement(source) || isVideoFrame(source);\n}\n/**\n * Check if a source is any type of image source\n */\nfunction isImageSource(source) {\n return isHTMLImageElement(source) || isImageBitmap(source);\n}\n/**\n * Get the width of a media source\n */\nfunction getSourceWidth(source) {\n if (isHTMLVideoElement(source))\n return source.videoWidth;\n if (isHTMLImageElement(source))\n return source.naturalWidth;\n if (isVideoFrame(source))\n return source.displayWidth;\n if (isImageBitmap(source))\n return source.width;\n return 0;\n}\n/**\n * Get the height of a media source\n */\nfunction getSourceHeight(source) {\n if (isHTMLVideoElement(source))\n return source.videoHeight;\n if (isHTMLImageElement(source))\n return source.naturalHeight;\n if (isVideoFrame(source))\n return source.displayHeight;\n if (isImageBitmap(source))\n return source.height;\n return 0;\n}\n\n\n//# sourceURL=webpack://WebSR/./src/utils.ts?\n}")}},__webpack_module_cache__={};function __webpack_require__(e){var n=__webpack_module_cache__[e];if(void 0!==n)return n.exports;var t=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),t.exports}var __webpack_exports__=__webpack_require__("./src/main.ts");return __webpack_exports__.default})())},{}],loqXi:[function(e,n,t,r){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,n){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})}),n},t.export=function(e,n,t){Object.defineProperty(e,n,{enumerable:!0,get:t})}},{}]},["hOg5u"],"hOg5u","parcelRequire4dc0",{});let{default:_default}=parcelRequire4dc0("hOg5u");export{_default as default};
\ No newline at end of file
+!function(e,t,r,i,a){var o="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},s="function"==typeof o[i]&&o[i],n=s.i||{},l=s.cache||{},d="u">typeof module&&"function"==typeof module.require&&module.require.bind(module);function u(t,r){if(!l[t]){if(!e[t]){if(a[t])return a[t];var n="function"==typeof o[i]&&o[i];if(!r&&n)return n(t,!0);if(s)return s(t,!0);if(d&&"string"==typeof t)return d(t);var c=Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}h.resolve=function(r){var i=e[t][1][r];return null!=i?i:r},h.cache={};var m=l[t]=new u.Module(t);e[t][0].call(m.exports,h,m,m.exports,o)}return l[t].exports;function h(e){var t=h.resolve(e);if(!1===t)return{};if(Array.isArray(t)){var r={__esModule:!0};return t.forEach(function(e){var t=e[0],i=e[1],a=e[2]||e[0],o=u(i);"*"===t?Object.keys(o).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(r,e)||Object.defineProperty(r,e,{enumerable:!0,get:function(){return o[e]}})}):"*"===a?Object.defineProperty(r,t,{enumerable:!0,value:o}):Object.defineProperty(r,t,{enumerable:!0,get:function(){return"default"===a?o.__esModule?o.default:o:o[a]}})}),r}return u(t)}}u.isParcelRequire=!0,u.Module=function(e){this.id=e,this.bundle=u,this.require=d,this.exports={}},u.modules=e,u.cache=l,u.parent=s,u.distDir=void 0,u.publicUrl=void 0,u.devServer=void 0,u.i=n,u.register=function(t,r){e[t]=[function(e,t){t.exports=r},{}]},Object.defineProperty(u,"root",{get:function(){return o[i]}}),o[i]=u;for(var c=0;c<t.length;c++)u(t[c]);if(r){var m=u(r);"object"==typeof exports&&"u">typeof module?module.exports=m:"function"==typeof define&&define.amd&&define(function(){return m})}}({hOg5u:[function(e,t,r,i){var a=e("@parcel/transformer-js/src/esmodule-helpers.js"),o=e("./Upscaler.js"),s=a.interopDefault(o);window.artplayerPluginWebsr=function(e={networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2}){return t=>{let{$video:r,$player:i}=t.template,a=document.createElement("canvas");function o(){let e=t.video,r=i.offsetWidth||640,a=i.offsetHeight||360,o=(e.videoWidth||640)/(e.videoHeight||360),s=r,n=a;return r/a>o?s=a*o:n=r/o,{displayWidth:s,displayHeight:n}}if(i.appendChild(a),a.style.position="absolute",a.style.zIndex="11",a.style.pointerEvents="none",a.style.top="50%",a.style.left="50%",a.style.transform="translate(-50%, -50%)",a.style.opacity="0",a.style.transition="opacity 0.2s ease",!s.default||!s.default.isSupported||!s.default.isSupported())return void console.warn("Upscaler is not supported in this environment");let n=new(0,s.default)({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2}),l=!1;async function d(){if(!l){l=!0;try{await new Promise((e,t)=>{if(r.readyState>=1)return void e();let i=()=>{o(),e()},a=()=>{o(),t(Error("Failed to load video metadata"))},o=()=>{r.removeEventListener("loadedmetadata",i),r.removeEventListener("error",a)};r.addEventListener("loadedmetadata",i),r.addEventListener("error",a)}),await n.startRealtimeUpscale(r,a,e.networkSize||n.networkSize),requestAnimationFrame(()=>{a.style.opacity="1"})}catch(e){console.error("artplayer-plugin-upscaler: failed to start realtime",e)}}}let{displayWidth:u,displayHeight:c}=o();a.style.width=u+"px",a.style.height=c+"px";let m=50,h=!1,p=!!e.compare,f=document.createElement("div");function g(){if(p){let{displayWidth:e,displayHeight:t}=o(),r=`linear-gradient(to right, transparent 0%, transparent ${m}%, black ${m}%, black 100%)`;a.style.maskImage=r;let s=i.offsetWidth||640,n=i.offsetHeight||360,l=(s-e)/2+e*m/100;f.style.top=(n-t)/2+"px",f.style.left=l+"px",f.style.height=t+"px",f.style.transform="translateX(-50%)"}else a.style.maskImage="none"}function w(e){p&&(h=!0)}function y(e){if(p&&h){let t=i.getBoundingClientRect(),{displayWidth:r}=o(),a=i.offsetWidth||640;m=Math.max(0,Math.min(100,m=(e.clientX-t.left-(a-r)/2)/r*100)),g()}}function v(e){h=!1}return f.style.position="absolute",f.style.width="3px",f.style.backgroundColor="rgba(255, 255, 255, 0.75)",f.style.cursor="ew-resize",f.style.zIndex="12",f.style.pointerEvents="auto",f.style.display=p?"block":"none",f.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",p&&(i.appendChild(f),f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()),t.on("destroy",()=>{n&&"function"==typeof n.dispose&&n.dispose(),f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v)}),t.on("resize",()=>{let{displayWidth:e,displayHeight:t}=o();a.style.width=e+"px",a.style.height=t+"px",g()}),t.on("play",()=>{d()}),{name:"artplayerPluginWebsr",upscaler:n,update:function(r={}){if(r&&"object"==typeof r){if(Object.prototype.hasOwnProperty.call(r,"compare")){let t=!!r.compare;e.compare=t,(p=t)?(f.parentNode||i.appendChild(f),f.style.display="block",f.addEventListener("mousedown",w),document.addEventListener("mousemove",y),document.addEventListener("mouseup",v),g()):(a.style.maskImage="none",f.style.display="none",f.removeEventListener("mousedown",w),document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",v))}r.networkSize&&(e.networkSize=r.networkSize,n&&"function"==typeof n.stopRealtimeUpscale&&n.stopRealtimeUpscale(),l=!1,t.paused||d())}}}}}},{"./Upscaler.js":"6fh0X","@parcel/transformer-js/src/esmodule-helpers.js":"loqXi"}],"6fh0X":[function(e,t,r,i){e("@parcel/transformer-js/src/esmodule-helpers.js").defineInteropFlag(r);class a{static DEFAULT_TIMEOUTS={IMAGE:3e5,VIDEO:36e5,METADATA:1e4};static DEFAULT_DELAYS={INIT:500,NETWORK:300};static isSupported(){try{let e="u">typeof Worker,t="u">typeof OffscreenCanvas||"u">typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="u">typeof Blob;return e&&t&&r}catch{return!1}}static isVideoSupported(){try{return"u">typeof VideoEncoder&&"u">typeof VideoDecoder}catch{return!1}}constructor(e={}){let t=e.weightsBaseUrl||"/weights";this.networks=e.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:`${t}/cnn-8.json`},medium:{name:"anime4k/cnn-2x-16",weightsUrl:`${t}/cnn-16.json`},large:{name:"anime4k/cnn-2x-28",weightsUrl:`${t}/cnn-28.json`}},this.weightsBaseUrl=t,this.networkSize=e.networkSize||"medium",this.workerUrl=e.workerUrl||"/worker/main.js",this.timeouts={...a.DEFAULT_TIMEOUTS,...e.timeouts||{}},this.delays={...a.DEFAULT_DELAYS,...e.delays||{}},this.imageScale="number"==typeof e.imageScale&&e.imageScale>0?e.imageScale:2,this.videoScale="number"==typeof e.videoScale&&e.videoScale>0?e.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}init({prewarm:e=!0}={}){if(!a.isSupported())throw Error("Upscaler is not supported in this environment");return e&&this.getWorker().postMessage({cmd:"isSupported"}),this}getWorker(){return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=e=>this.handleWorkerMessage(e)),this.workerInstance}static extractProgressValue(e){let t=e.data??e.progress??e.value??e.percentage;return"number"==typeof t?Math.min(100,Math.max(0,Math.round(t))):null}handleBlobResponse(e){let t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r({[t]:e.data})}requestBlob(){let e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}handleWorkerMessage(e){let{data:t}=e;if(console.debug("Worker message:",t),!t.cmd)return;let{cmd:r}=t;if("progress"===r){let e=a.extractProgressValue(t);null!==e&&this.progressCallback&&this.progressCallback(e),this.messageHandlers.progress&&this.messageHandlers.progress(t)}else"finished"===r?t.data instanceof Blob?this.handleBlobResponse(t):this.requestBlob():this.messageHandlers[r]&&this.messageHandlers[r](t)}async loadWeights(e){if(this.validateNetworkSize(e),this.weightsCache.has(e))return this.weightsCache.get(e);let t=this.networks[e],r=await fetch(t.weightsUrl);if(!r.ok)throw Error(`Failed to fetch weights: ${r.statusText}`);let i=await r.json();return this.weightsCache.set(e,i),i}static loadImageMetadata(e,t){return new Promise((r,i)=>{let a=new Blob([e],{type:t}),o=URL.createObjectURL(a),s=new Image;s.onload=()=>{URL.revokeObjectURL(o),r({width:s.width,height:s.height})},s.onerror=()=>{URL.revokeObjectURL(o),i(Error("Failed to load image"))},s.src=o})}static loadVideoMetadata(e,t){return new Promise((r,i)=>{let a=URL.createObjectURL(e),o=document.createElement("video");o.src=a;let s=setTimeout(()=>i(Error("Timeout")),t);o.onloadedmetadata=()=>{clearTimeout(s),URL.revokeObjectURL(a),r({width:o.videoWidth,height:o.videoHeight,duration:o.duration})},o.onerror=()=>{clearTimeout(s),URL.revokeObjectURL(a),i(Error("Failed to load video"))}})}createOffscreenCanvas(e,t,r=2){let i="number"==typeof r&&r>0?r:1,a=document.createElement("canvas");if(a.width=e*i,a.height=t*i,"function"!=typeof a.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");return a.transferControlToOffscreen()}createBlobPromise(e,t){return new Promise((r,i)=>{let a=setTimeout(()=>{this.messageHandlers[e]&&(delete this.messageHandlers[e],i(Error(`${e} processing timeout`)))},t);this.messageHandlers[e]=t=>{delete this.messageHandlers[e],clearTimeout(a);let o=t[e]||t.data;o instanceof Blob?r(o):i(Error(`Invalid ${e} format`))}})}validateNetworkSize(e){if(!this.networks[e])throw Error("Invalid networkSize: use one of "+Object.keys(this.networks).join(", "))}async upscaleImage(e,t,r){if(!e)throw Error("Image file is required");let i=t||this.networkSize;this.validateNetworkSize(i),this.processingType="image";let o=await e.arrayBuffer(),s=e.type||"image/jpeg",{width:n,height:l}=await a.loadImageMetadata(o,s),d=await this.loadWeights(i),u=this.networks[i],c="number"==typeof r&&r>0?r:this.imageScale,[m,h]=[this.createOffscreenCanvas(n,l,c),this.createOffscreenCanvas(n,l,1)],p=this.createBlobPromise("imageBlob",this.timeouts.IMAGE);return this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:o,imageMimeType:s,upscaled:m,original:h,resolution:{width:n,height:l},network_name:u.name,weights:d}},[m,h]),setTimeout(()=>{this.getWorker().postMessage({cmd:"network",data:{name:u.name,imageArrayBuffer:o,imageMimeType:s,weights:d}}),setTimeout(()=>{this.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:o,imageMimeType:s}})},this.delays.NETWORK)},this.delays.INIT),p}async upscaleVideo(e,t,r){if(!e)throw Error("Video file is required");let i=t||this.networkSize;if(this.validateNetworkSize(i),!a.isVideoSupported())throw Error("WebCodecs API not supported. Requires Chrome 94+");this.processingType="video";let{width:o,height:s,duration:n}=await a.loadVideoMetadata(e,this.timeouts.METADATA),l=await this.loadWeights(i),d=this.networks[i],u="number"==typeof r&&r>0?r:this.videoScale,[c,m]=[this.createOffscreenCanvas(o,s,u),this.createOffscreenCanvas(o,s,1)],h=this.createBlobPromise("videoBlob",this.timeouts.VIDEO);return this.getWorker().postMessage({cmd:"process",file:e,fileSize:e.size,duration:n,adjustedResolution:{adjustedInputWidth:o,adjustedInputHeight:s,adjustedOutputWidth:o*u,adjustedOutputHeight:s*u},upscaled:c,original:m,weights:l,network_name:d.name,skipDemuxProgress:!0},[c,m]),h}async startRealtimeUpscale(e,t,r,i){if(!e||!t)throw Error("videoElement and canvasElement are required");let a=r||this.networkSize;this.validateNetworkSize(a);let o=this.networks[a],s=await this.loadWeights(a),n="number"==typeof i&&i>0?i:this.videoScale;await new Promise((t,r)=>{if(e.readyState>=1)return void t();let i=()=>{o(),t()},a=()=>{o(),r(Error("Failed to load video metadata"))},o=()=>{e.removeEventListener("loadedmetadata",i),e.removeEventListener("error",a)};e.addEventListener("loadedmetadata",i),e.addEventListener("error",a)});let l=e.videoWidth,d=e.videoHeight;if(!l||!d)throw Error("Invalid video dimensions");let u=!t._upscalerTransferred,c=null;if(u){if(t.width=l*n,t.height=d*n,"function"!=typeof t.transferControlToOffscreen)throw Error("OffscreenCanvas is not supported in this environment");c=t.transferControlToOffscreen(),t._upscalerTransferred=!0}let m=document.createElement("canvas");m.width=l,m.height=d;let h=m.getContext("2d");this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null);let p={cmd:"realtimeInit",data:{upscaled:u?c:null,resolution:{width:l,height:d,scale:n,outputWidth:l*n,outputHeight:d*n},network_name:o.name,weights:s}};u&&c?this.getWorker().postMessage(p,[c]):this.getWorker().postMessage(p),this.realtimeState={running:!0,video:e,canvas:t,scale:n,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:h};let f=async()=>{if(!this.realtimeState||!this.realtimeState.running)return;let e=this.realtimeState,t=e.video,r=t.HAVE_CURRENT_DATA||2;if(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0){e.busy=!0;try{let r=e.captureCanvas,i=e.captureCtx;if(!r||!i)throw Error("Missing capture canvas");i.drawImage(t,0,0,r.width,r.height);let a=await createImageBitmap(r);e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:a},[a])}catch(e){console.warn("realtimeFrame error",e)}finally{this.realtimeState&&(this.realtimeState.busy=!1)}}this.realtimeLoopId=requestAnimationFrame(f)};this.realtimeLoopId=requestAnimationFrame(f)}stopRealtimeUpscale(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}async downloadUpscaled(e,t,r=null){let i=e.type.startsWith("video"),a=t||this.networkSize,o=i?await this.upscaleVideo(e,a):await this.upscaleImage(e,a),s=URL.createObjectURL(o),n=document.createElement("a");return n.href=s,n.download=r||`upscaled_${Date.now()}.${i?"mp4":"png"}`,n.click(),URL.revokeObjectURL(s),o}getSupportedNetworks(){return Object.keys(this.networks)}static async getGPUCapability(){try{if(navigator.gpu){let e=await navigator.gpu.requestAdapter();if(e){let t=e.limits.maxStorageBufferBindingSize/512;return Math.min(t,0x4000000)}}let e=document.createElement("canvas").getContext("webgl2");if(e)return e.getParameter(e.MAX_TEXTURE_SIZE)**2;return 8388608}catch{return 8388608}}static getBackendType(){try{if(navigator.gpu)return"webgpu";if(document.createElement("canvas").getContext("webgl2"))return"webgl";return"unknown"}catch{return"unknown"}}getAppState(){return{backend:a.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}onProgress(e){"function"==typeof e&&(this.progressCallback=e)}dispose(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}}r.default=a},{"@parcel/transformer-js/src/esmodule-helpers.js":"loqXi"}],loqXi:[function(e,t,r,i){r.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},r.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},r.exportAll=function(e,t){return Object.keys(e).forEach(function(r){"default"===r||"__esModule"===r||Object.prototype.hasOwnProperty.call(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[r]}})}),t},r.export=function(e,t,r){Object.defineProperty(e,t,{enumerable:!0,get:r})}},{}]},["hOg5u"],"hOg5u","parcelRequire4dc0",{});let{}=parcelRequire4dc0("hOg5u");export{};
\ No newline at end of file
diff --git a/packages/artplayer-plugin-websr/src/Upscaler.js b/packages/artplayer-plugin-websr/src/Upscaler.js
index 9f84736ac..74a481a59 100644
--- a/packages/artplayer-plugin-websr/src/Upscaler.js
+++ b/packages/artplayer-plugin-websr/src/Upscaler.js
@@ -45,8 +45,8 @@ export default class Upscaler {
       },
     };
 
-    this.networkSize = options.networkSize || "medium";
     this.weightsBaseUrl = weightsBaseUrl;
+    this.networkSize = options.networkSize || "medium";
     this.workerUrl = options.workerUrl || "/worker/main.js";
 
     this.timeouts = {
@@ -72,6 +72,8 @@ export default class Upscaler {
 
     this.realtimeLoopId = null;
     this.realtimeState = null;
+
+    this.init();
   }
 
   init({ prewarm = true } = {}) {
@@ -117,6 +119,7 @@ export default class Upscaler {
 
   handleWorkerMessage(event) {
     const { data } = event;
+    console.debug("Worker message:", data);
     if (!data.cmd) return;
 
     const { cmd } = data;
@@ -253,7 +256,6 @@ export default class Upscaler {
       mimeType,
     );
 
-
     const weights = await this.loadWeights(size);
     const network = this.networks[size];
     const scale =
@@ -323,7 +325,6 @@ export default class Upscaler {
       this.timeouts.METADATA,
     );
 
-
     const weights = await this.loadWeights(size);
     const network = this.networks[size];
     const scale =
@@ -416,41 +417,52 @@ export default class Upscaler {
       throw new Error("Invalid video dimensions");
     }
 
+    const firstInit = !canvasElement._upscalerTransferred;
 
-    canvasElement.width = width * scale;
-    canvasElement.height = height * scale;
+    let offscreen = null;
+    if (firstInit) {
+      canvasElement.width = width * scale;
+      canvasElement.height = height * scale;
 
-    if (typeof canvasElement.transferControlToOffscreen !== "function") {
-      throw new Error("OffscreenCanvas is not supported in this environment");
+      if (typeof canvasElement.transferControlToOffscreen !== "function") {
+        throw new Error("OffscreenCanvas is not supported in this environment");
+      }
+
+      offscreen = canvasElement.transferControlToOffscreen();
+      canvasElement._upscalerTransferred = true;
     }
 
-    const offscreen = canvasElement.transferControlToOffscreen();
-
+    const captureCanvas = document.createElement("canvas");
+    captureCanvas.width = width;
+    captureCanvas.height = height;
+    const captureCtx = captureCanvas.getContext("2d");
 
     if (this.realtimeLoopId) {
       cancelAnimationFrame(this.realtimeLoopId);
       this.realtimeLoopId = null;
     }
 
-    this.getWorker().postMessage(
-      {
-        cmd: "realtimeInit",
-        data: {
-          upscaled: offscreen,
-          resolution: {
-            width,
-            height,
-            scale,
-            outputWidth: width * scale,
-            outputHeight: height * scale,
-          },
-          network_name: network.name,
-          weights,
+    const initPayload = {
+      cmd: "realtimeInit",
+      data: {
+        upscaled: firstInit ? offscreen : null,
+        resolution: {
+          width,
+          height,
+          scale,
+          outputWidth: width * scale,
+          outputHeight: height * scale,
         },
+        network_name: network.name,
+        weights,
       },
-      [offscreen],
-    );
+    };
 
+    if (firstInit && offscreen) {
+      this.getWorker().postMessage(initPayload, [offscreen]);
+    } else {
+      this.getWorker().postMessage(initPayload);
+    }
 
     this.realtimeState = {
       running: true,
@@ -459,6 +471,8 @@ export default class Upscaler {
       scale,
       busy: false,
       frameIndex: 0,
+      captureCanvas,
+      captureCtx,
     };
 
     const loop = async () => {
@@ -466,12 +480,27 @@ export default class Upscaler {
       const state = this.realtimeState;
       const v = state.video;
 
-      if (!v.paused && !v.ended && !state.busy) {
+      const haveCurrentData = v.HAVE_CURRENT_DATA || 2;
+
+      if (
+        !v.paused &&
+        !v.ended &&
+        !state.busy &&
+        v.readyState >= haveCurrentData &&
+        v.videoWidth > 0 &&
+        v.videoHeight > 0
+      ) {
         state.busy = true;
         try {
-          const frame = await createImageBitmap(v);
+          const captureCanvas = state.captureCanvas;
+          const captureCtx = state.captureCtx;
+          if (!captureCanvas || !captureCtx) {
+            throw new Error("Missing capture canvas");
+          }
+          captureCtx.drawImage(v, 0, 0, captureCanvas.width, captureCanvas.height);
+          const frame = await createImageBitmap(captureCanvas);
           state.frameIndex += 1;
-          
+
           this.getWorker().postMessage(
             {
               cmd: "realtimeFrame",
diff --git a/packages/artplayer-plugin-websr/src/index.js b/packages/artplayer-plugin-websr/src/index.js
index 3b495134e..b681f5882 100644
--- a/packages/artplayer-plugin-websr/src/index.js
+++ b/packages/artplayer-plugin-websr/src/index.js
@@ -1,12 +1,15 @@
-import Upscaler from "./Upscaler";
+import Upscaler from "./Upscaler.js";
 
-export default function artplayerPluginWebsr(
+function artplayerPluginWebsr(
     option = {
         networkSize: "medium",
         compare: false,
+        weightsBaseUrl: "/weights",
+        workerUrl: "/worker/main.js",
+        videoScale: 2,
     },
 ) {
-    return async (art) => {
+    return (art) => {
         const { $video, $player } = art.template;
 
         const $canvas = document.createElement("canvas");
@@ -18,6 +21,8 @@ export default function artplayerPluginWebsr(
         $canvas.style.top = "50%";
         $canvas.style.left = "50%";
         $canvas.style.transform = "translate(-50%, -50%)";
+        $canvas.style.opacity = "0";
+        $canvas.style.transition = "opacity 0.2s ease";
 
         function calcCanvasSize() {
             const videoElement = art.video;
@@ -36,35 +41,82 @@ export default function artplayerPluginWebsr(
             return { displayWidth, displayHeight };
         }
 
-        const upscaler = new Upscaler(option);
-        upscaler.init();
-        await upscaler.startRealtimeUpscale(
-            $video,
-            $canvas,
-            option.networkSize,
-        );
+        if (!Upscaler || !Upscaler.isSupported || !Upscaler.isSupported()) {
+            console.warn("Upscaler is not supported in this environment");
+            return;
+        }
+
+        const upscaler = new Upscaler({
+            networkSize: option.networkSize || "medium",
+            weightsBaseUrl: option.weightsBaseUrl || "/weights",
+            workerUrl: option.workerUrl || "/worker/main.js",
+            videoScale: option.videoScale || 2,
+        });
+
+        let realtimeStarted = false;
+
+        async function startRealtime() {
+            if (realtimeStarted) return;
+            realtimeStarted = true;
+
+            try {
+                await new Promise((resolve, reject) => {
+                    if ($video.readyState >= 1) {
+                        resolve();
+                        return;
+                    }
+                    const onLoaded = () => {
+                        cleanup();
+                        resolve();
+                    };
+                    const onError = () => {
+                        cleanup();
+                        reject(new Error("Failed to load video metadata"));
+                    };
+                    const cleanup = () => {
+                        $video.removeEventListener("loadedmetadata", onLoaded);
+                        $video.removeEventListener("error", onError);
+                    };
+                    $video.addEventListener("loadedmetadata", onLoaded);
+                    $video.addEventListener("error", onError);
+                });
+
+                await upscaler.startRealtimeUpscale(
+                    $video,
+                    $canvas,
+                    option.networkSize || upscaler.networkSize,
+                );
+
+                requestAnimationFrame(() => {
+                    $canvas.style.opacity = "1";
+                });
+            } catch (e) {
+                console.error(
+                    "artplayer-plugin-upscaler: failed to start realtime",
+                    e,
+                );
+            }
+        }
 
-        // 初始化 canvas 显示尺寸
         const { displayWidth, displayHeight } = calcCanvasSize();
         $canvas.style.width = displayWidth + "px";
         $canvas.style.height = displayHeight + "px";
 
-        // 对比模式
         let comparePosition = 50;
         let isDragging = false;
+        let compareEnabled = !!option.compare;
 
-        // 创建对比手柄
         const $handler = document.createElement("div");
         $handler.style.position = "absolute";
         $handler.style.width = "3px";
-        $handler.style.backgroundColor = "rgba(255, 255, 255, 0.5)";
+        $handler.style.backgroundColor = "rgba(255, 255, 255, 0.75)";
         $handler.style.cursor = "ew-resize";
         $handler.style.zIndex = "12";
         $handler.style.pointerEvents = "auto";
-        $handler.style.display = option.compare ? "block" : "none";
-        $handler.style.boxShadow = "0 0 4px rgba(0, 0, 0, 0.1)";
+        $handler.style.display = compareEnabled ? "block" : "none";
+        $handler.style.boxShadow = "0 0 2px rgba(0, 0, 0, 0.1)";
 
-        if (option.compare) {
+        if (compareEnabled) {
             $player.appendChild($handler);
             $handler.addEventListener("mousedown", handleMouseDown);
             document.addEventListener("mousemove", handleMouseMove);
@@ -73,7 +125,7 @@ export default function artplayerPluginWebsr(
         }
 
         function updateCompareMask() {
-            if (option.compare) {
+            if (compareEnabled) {
                 const { displayWidth, displayHeight } = calcCanvasSize();
                 const gradient = `linear-gradient(to right, transparent 0%, transparent ${comparePosition}%, black ${comparePosition}%, black 100%)`;
                 $canvas.style.maskImage = gradient;
@@ -95,13 +147,13 @@ export default function artplayerPluginWebsr(
         }
 
         function handleMouseDown(e) {
-            if (option.compare) {
+            if (compareEnabled) {
                 isDragging = true;
             }
         }
 
         function handleMouseMove(e) {
-            if (option.compare && isDragging) {
+            if (compareEnabled && isDragging) {
                 const rect = $player.getBoundingClientRect();
                 const { displayWidth } = calcCanvasSize();
                 const containerWidth = $player.offsetWidth || 640;
@@ -119,7 +171,9 @@ export default function artplayerPluginWebsr(
         }
 
         art.on("destroy", () => {
-            upscaler.dispose();
+            if (upscaler && typeof upscaler.dispose === "function") {
+                upscaler.dispose();
+            }
             $handler.removeEventListener("mousedown", handleMouseDown);
             document.removeEventListener("mousemove", handleMouseMove);
             document.removeEventListener("mouseup", handleMouseUp);
@@ -132,12 +186,58 @@ export default function artplayerPluginWebsr(
             updateCompareMask();
         });
 
+        art.on("play", () => {
+            startRealtime();
+        });
+
+        function update(newOption = {}) {
+            if (!newOption || typeof newOption !== "object") return;
+
+            if (Object.prototype.hasOwnProperty.call(newOption, "compare")) {
+                const nextCompare = !!newOption.compare;
+                option.compare = nextCompare;
+                compareEnabled = nextCompare;
+
+                if (compareEnabled) {
+                    if (!$handler.parentNode) {
+                        $player.appendChild($handler);
+                    }
+                    $handler.style.display = "block";
+                    $handler.addEventListener("mousedown", handleMouseDown);
+                    document.addEventListener("mousemove", handleMouseMove);
+                    document.addEventListener("mouseup", handleMouseUp);
+                    updateCompareMask();
+                } else {
+                    $canvas.style.maskImage = "none";
+                    $handler.style.display = "none";
+                    $handler.removeEventListener("mousedown", handleMouseDown);
+                    document.removeEventListener("mousemove", handleMouseMove);
+                    document.removeEventListener("mouseup", handleMouseUp);
+                }
+            }
+
+            if (newOption.networkSize) {
+                const nextSize = newOption.networkSize;
+                option.networkSize = nextSize;
+                if (
+                    upscaler &&
+                    typeof upscaler.stopRealtimeUpscale === "function"
+                ) {
+                    upscaler.stopRealtimeUpscale();
+                }
+                realtimeStarted = false;
+                if (!art.paused) {
+                    startRealtime();
+                }
+            }
+        }
+
         return {
             name: "artplayerPluginWebsr",
+            upscaler,
+            update,
         };
     };
 }
 
-if (typeof window !== "undefined") {
-    window.artplayerPluginWebsr = artplayerPluginWebsr;
-}
+window.artplayerPluginWebsr = artplayerPluginWebsr;
diff --git a/packages/artplayer-plugin-websr/types/artplayer-plugin-websr.d.ts b/packages/artplayer-plugin-websr/types/artplayer-plugin-websr.d.ts
index a019c92b1..b15d428f9 100644
--- a/packages/artplayer-plugin-websr/types/artplayer-plugin-websr.d.ts
+++ b/packages/artplayer-plugin-websr/types/artplayer-plugin-websr.d.ts
@@ -1,92 +1,17 @@
 import type Artplayer from 'artplayer';
 
 interface Option {
-    /**
-     * Upscale factor
-     * @default 2
-     */
-    scale?: number;
-    /**
-     * Network name for upscaling (required)
-     * e.g., 'anime4k/cnn-2x-m-an'
-     */
-    networkName: string;
-    /**
-     * Weights for the neural network (required)
-     * Can be a URL string or a pre-loaded weights object
-     * e.g., '/path/to/weights.json' or { layers: [...] }
-     */
-    weights: string | object;
-    /**
-     * Enable comparison mode
-     * @default false
-     */
     compare?: boolean;
+    networkSize?: 'small' | 'medium' | 'large';
+    weightsBaseUrl?: string;
+    workerUrl?: string;
+    videoScale?: number;
 }
 
 interface Result {
     name: 'artplayerPluginWebsr';
-    /**
-     * Get WebSR instance
-     */
-    websr: () => any;
-    /**
-     * Get GPU context
-     */
-    gpu: () => any;
-    /**
-     * Get canvas element
-     */
-    canvas: () => HTMLCanvasElement;
-    /**
-     * Enable WebSR upscaling
-     */
-    enable: () => Promise<void>;
-    /**
-     * Disable WebSR upscaling
-     */
-    disable: () => void;
-    /**
-     * Toggle WebSR upscaling
-     */
-    toggle: () => Promise<void>;
-    /**
-     * Check if WebSR is enabled
-     */
-    isEnabled: () => boolean;
-    /**
-     * Check if WebSR is initialized
-     */
-    isInitialized: () => boolean;
-    /**
-     * Update options at runtime
-     * Supported options: enabled, weights, networkName, scale
-     */
-    update: (option: Partial<Option>) => Promise<void>;
-    /**
-     * Enable comparison mode
-     */
-    enableCompare: () => void;
-    /**
-     * Disable comparison mode
-     */
-    disableCompare: () => void;
-    /**
-     * Toggle comparison mode
-     */
-    toggleCompare: () => void;
-    /**
-     * Set comparison split position (0-1)
-     */
-    setComparePosition: (pos: number) => void;
-    /**
-     * Get current comparison split position (0-1)
-     */
-    getComparePosition: () => number;
-    /**
-     * Check if comparison mode is enabled
-     */
-    isComparing: () => boolean;
+    upscaler: any;
+    update: (option: Option) => void;
 }
 
 declare const artplayerPluginWebsr: (option?: Option) => (art: Artplayer) => Result;