docs(refactor): [DOC-HANDOFF-01] defer remaining work for user self-testing

* feat: support batch video upscaling with folder upload and directory save

- Add multi-file selection and entire folder upload (webkitdirectory)
- Support drag & drop of both files and folders via FileSystemEntry API
- Add save directory picker using File System Access API (showDirectoryPicker)
- Process videos sequentially with per-file progress and status tracking
- Add right-side result list with click-to-compare functionality
- Add per-video duration and total batch duration display
- Add retry button for failed items with error detail display
- Remove auto-play on comparison viewer load
- Fix worker error handling: handle "error" command to reject stale promises
- Fix event listener accumulation in video comparison (AbortController)
- Fix XSS risk by escaping HTML in all innerHTML injections
- Fix URL revocation timing in download to prevent large file truncation
- Extract writeToSaveDirectory and truncateName helpers to reduce duplication
- Add Usage Guide panel explaining single/multiple/folder upload options

Files changed:
  docs/upscaler/index.html  (+1110/-181)
  docs/upscaler/upscaler.js (+110)

* fix: prevent auto-play and resource consumption during upscaling

- Set preload="metadata" on preview and comparison video elements
- Explicitly pause preview video after setting src in showVideoPreview
- Remove preview video seek sync from batch processing progress callbacks
  (was causing continuous decode during upscaling, wasting GPU resources)
- Remove preview video seek sync from retry progress callback
- All videos now require manual play; no background resource usage

* fix: improve upscaled video quality with higher bitrate and codec support

- Raise base bitrate from 2.5 Mbps (25e5) to 8 Mbps (8e6) for standard and
  firefox processors, preventing quality loss when source videos have high
  bitrates (e.g. 720p @ 16.7 Mbps was producing 1440p @ 10 Mbps, smaller
  than the original file)
- Double the bitrate for mediabunny processor (X.n1 * 2) to account for the
  4x pixel increase from 2x upscaling
- Add H.264 Level 5.1 (avc1.640033) and Level 5.2 (avc1.640034) codecs to
  the fallback lists, since Level 4.0 (avc1.640028, ~24.6 Mbps) cannot
  support the higher bitrates for 1440p+ outputs
- Add latencyMode: "quality" to VideoEncoder configs for both standard and
  firefox processors, prioritizing encoding quality over latency (suitable
  for offline processing)

* feat: add video data comparison panel for original vs upscaled metrics

- Add a comparison data table below the file info bar showing 6 metrics:
  Resolution, File Size, Duration, Est. Bitrate, Pixels, Process Time
- Display per-metric change percentage with color-coded indicators:
  green (↑) for improvements, red (↓) for regressions, gray for neutral
- Estimated bitrate calculated from file size × 8 / video duration
- Table renders after both original and upscaled video metadata loads
- Auto-hide panel on reset

* fix: make video data comparison panel full-width and responsive

- Move comparison data table from inside the left column to the full-width
  area below the left/right layout, so it is no longer constrained by the
  comparison viewer column width
- Remove table-fixed colgroup and overflow-x-auto that caused horizontal
  scrolling on smaller screens
- Table now uses w-full auto-layout, displaying all 4 columns (Metric,
  Original, Upscaled, Change) without requiring horizontal scrolling

---------

Co-authored-by: rionzhao <rionzhao@tencent.com>

.gitattributes

@@ -1,2 +1,55 @@
 * text=auto
-*.js text eol=lf
+*.js text eol=lf
+test/browser/media/hls/*.m3u8 text eol=lf
+test/browser/fixtures/hls-grouped.m3u8 text eol=lf
+test/browser/media/hls/*.mpegts binary
+# Preserve generated XML whitespace and its frozen playback-input hashes.
+test/browser/media/dash/*.mpd text eol=lf whitespace=-blank-at-eol
+test/browser/media/dash/*.m4s binary
+test/browser/media/*.m4a binary
+refactor/baselines/core-vendor/*.txt text eol=lf
+refactor/baselines/thumbnail-vendor/* text eol=lf whitespace=-blank-at-eof
+# Preserve the exact upstream WebVTT reference bytes, including license trailing lines.
+refactor/baselines/multiple-subtitles-vendor/* text eol=lf whitespace=-blank-at-eof
+# Preserve upstream documentation-site license bytes, including final blank lines.
+refactor/baselines/site-vendor/*.txt text eol=lf whitespace=-blank-at-eof
+docs/licenses/** text eol=lf whitespace=-blank-at-eof
+docs/THIRD_PARTY_NOTICES.md text eol=lf
+
+# Preserve historical Codicons archive notice bytes, including CRLF.
+refactor/baselines/site-vendor/codicons-0.0.26/LICENSE* -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/codicons-0.0.26/README.txt -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/codicons/LICENSE* -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/codicons/README.md -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/codicons-0.0.26/ATTRIBUTION.txt text eol=lf
+refactor/baselines/site-vendor/vconsole-3.15.0/** text eol=lf whitespace=-blank-at-eof
+refactor/baselines/site-vendor/console-original.js text eol=lf
+refactor/baselines/site-vendor/console-commonjs/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/console-esm/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/console-embedded/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/console/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/console-attribution/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/console-stackoverflow/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-typescript/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/typescript/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-languages/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-language-notices/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/language-services/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-modes/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-basic/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/monaco-basic-fixtures.json text eol=lf
+refactor/baselines/site-vendor/monaco-core-origins/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/core-origins/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-core-build/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/monaco-core-locales.json text eol=lf
+refactor/baselines/site-vendor/monaco-contributions/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-css-build/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-node-path/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/monaco-dom/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/core-dom/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/core-path/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/monaco-node-path-fixtures.json text eol=lf
+refactor/baselines/site-vendor/monaco-unicode/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/monaco-editor/core-unicode/** -text whitespace=-trailing-space,cr-at-eol
+refactor/baselines/site-vendor/jassub-fonts/** -text whitespace=-trailing-space,cr-at-eol
+docs/licenses/jassub-fonts/** -text whitespace=-trailing-space,cr-at-eol

.github/dependabot.yml

@@ -1,20 +0,0 @@
-version: 2
-updates:
-- package-ecosystem: npm
-  directory: "/"
-  schedule:
-    interval: daily
-    time: "19:00"
-  open-pull-requests-limit: 10
-  ignore:
-  - dependency-name: cssnano
-    versions:
-    - 5.0.0
-    - 5.0.1
-  - dependency-name: autoprefixer
-    versions:
-    - 10.2.4
-    - 10.2.5
-  - dependency-name: eslint-config-prettier
-    versions:
-    - 8.0.0

.github/workflows/nodejs.yml

@@ -1,41 +1,370 @@
 name: Node CI
 
 on:
+  pull_request:
   push:
-    branches:
+    branches: [ master, 'codex/**' ]
-      - master
+  workflow_dispatch:
+  workflow_call:
+    inputs:
+      pages-artifact:
+        description: Prepare the checked docs directory for the separate Pages workflow
+        type: boolean
+        default: false
+
+permissions:
+  contents: read
+
+concurrency:
+  group: checks-${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: ${{ github.event_name == 'pull_request' || github.event_name == 'push' }}
 
 jobs:
-  build:
+  coverage:
-
+    name: TS coverage (${{ matrix.os }})
-    runs-on: ubuntu-latest
+    runs-on: ${{ matrix.os }}
-
+    timeout-minutes: 15
     strategy:
+      fail-fast: false
       matrix:
-        node-version: [20.x]
+        os: [ ubuntu-latest, windows-latest ]
-
+    defaults:
+      run:
+        shell: bash
+    env:
+      CI: true
     steps:
-    - uses: actions/checkout@v2
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-    - name: Use Node.js ${{ matrix.node-version }}
+        with:
-      uses: actions/setup-node@v2
+          persist-credentials: false
-      with:
+          fetch-depth: 0
-        node-version: ${{ matrix.node-version }}
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-    - name: npm install, lint, build, and test
+        with:
-      run: |
+          node-version-file: .node-version
-        npm install
+          package-manager-cache: false
-        npm run lint
+      - name: Record source and cache inputs
-        npm run build:all
+        id: context
-      env:
+        run: node scripts/ci-context.mjs
-        CI: true
+      - name: Cache locked Yarn downloads
-
+        uses: actions/cache@caa296126883cff596d87d8935842f9db880ef25 # v5 ref verified 2026-09-13; node24
-    - name: Deploy to GitHub Pages
+        with:
-      if: success()
+          path: ${{ steps.context.outputs.yarn_cache }}
-      run: |
+          key: yarn-${{ runner.os }}-${{ runner.arch }}-node-${{ steps.context.outputs.node }}-yarn-${{ steps.context.outputs.yarn }}-${{ github.ref }}-${{ hashFiles('yarn.lock') }}
-        git config --global user.name 'github-actions[bot]'
+      - name: Install the pinned toolchain and dependencies
-        git config --global user.email 'github-actions[bot]@users.noreply.github.com'
+        run: |
-        git add -f docs
+          npm install --global --force yarn@1.22.22 2>&1 | tee refactor/.cache/ci/toolchain-install.log
-        git commit -m 'Deploy to GitHub Pages'
+          yarn install --frozen-lockfile --non-interactive 2>&1 | tee refactor/.cache/ci/install.log
-        git subtree split --prefix docs master -b gh-pages-temp
+          yarn check:toolchain --strict
-        git push origin gh-pages-temp:refs/heads/gh-pages --force
+      - name: Verify source maps and critical lifecycle coverage
-      env:
+        run: yarn test:coverage 2>&1 | tee refactor/.cache/ci/coverage.log
-        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Upload coverage and source-map evidence
+        if: always()
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        with:
+          name: coverage-${{ matrix.os }}-${{ github.run_id }}-${{ github.run_attempt }}
+          path: |
+            refactor/.cache/ci/
+            refactor/.cache/coverage/latest.json
+            refactor/.cache/coverage/run-*/
+          include-hidden-files: true
+          retention-days: 14
+          if-no-files-found: warn
+  browser-consumers:
+    name: Browser consumers (${{ matrix.os }})
+    runs-on: ${{ matrix.os }}
+    timeout-minutes: 60
+    env:
+      CI: true
+    steps:
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        with:
+          persist-credentials: false
+          fetch-depth: 0
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version-file: .node-version
+          package-manager-cache: false
+      - name: Record source and cache inputs
+        id: context
+        run: node scripts/ci-context.mjs
+      - name: Cache locked Yarn downloads
+        uses: actions/cache@caa296126883cff596d87d8935842f9db880ef25 # v5 ref verified 2026-09-13; node24
+        with:
+          path: ${{ steps.context.outputs.yarn_cache }}
+          key: yarn-${{ runner.os }}-${{ runner.arch }}-node-${{ steps.context.outputs.node }}-yarn-${{ steps.context.outputs.yarn }}-${{ github.ref }}-${{ hashFiles('yarn.lock') }}
+      - name: Install the pinned package manager and dependencies
+        run: |
+          npm install --global --force yarn@1.22.22 2>&1 | tee refactor/.cache/ci/toolchain-install.log
+          yarn install --frozen-lockfile --non-interactive 2>&1 | tee refactor/.cache/ci/install.log
+      - name: Cache versioned browser downloads
+        uses: actions/cache@caa296126883cff596d87d8935842f9db880ef25 # v5 ref verified 2026-09-13; node24
+        with:
+          path: ${{ steps.context.outputs.browser_cache }}
+          key: playwright-${{ runner.os }}-${{ runner.arch }}-node-${{ steps.context.outputs.node }}-yarn-${{ steps.context.outputs.yarn }}-${{ github.ref }}-${{ hashFiles('yarn.lock') }}-${{ steps.context.outputs.playwright }}
+      - name: Install test browsers
+        run: yarn test:browser:install --with-deps 2>&1 | tee refactor/.cache/ci/browser-install.log
+      - name: Build and check installed tarballs
+        run: |
+          yarn test:package 2>&1 | tee refactor/.cache/ci/package.log
+          node --input-type=module -e 'import fs from "node:fs"; const { output } = JSON.parse(fs.readFileSync("refactor/.cache/packages/latest.json")); fs.appendFileSync(process.env.GITHUB_ENV, `ARTPLAYER_BROWSER_ARTIFACTS=${output}/browser-artifacts.json\n`);'
+      - name: Select Node 20 consumer runtime
+        id: consumer-node-20
+        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version: 20.19.0
+          package-manager-cache: false
+      - name: Verify Node 20 installed consumers
+        run: node scripts/package-runtime.mjs --expected-node 20.19.0 2>&1 | tee refactor/.cache/ci/consumer-node-20.log
+      - name: Select Node 22 consumer runtime
+        id: consumer-node-22
+        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version: 22.12.0
+          package-manager-cache: false
+      - name: Verify Node 22 installed consumers
+        run: node scripts/package-runtime.mjs --expected-node 22.12.0 2>&1 | tee refactor/.cache/ci/consumer-node-22.log
+      - name: Restore canonical runtime for browser tools
+        id: restore-canonical-node
+        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version-file: .node-version
+          package-manager-cache: false
+      - name: Verify canonical installed consumers
+        run: node scripts/package-runtime.mjs --canonical 2>&1 | tee refactor/.cache/ci/consumer-node-canonical.log
+      - name: Verify React installed consumers
+        run: yarn test:react-consumer 2>&1 | tee refactor/.cache/ci/react-consumer.log
+      - name: Verify Vue installed consumers
+        run: yarn test:vue-consumer 2>&1 | tee refactor/.cache/ci/vue-consumer.log
+      - name: Verify iframe cached history and interrupted navigation
+        run: yarn test:iframe-history 2>&1 | tee refactor/.cache/ci/iframe-history.log
+      - name: Compare installed performance and verify resource cleanup
+        run: yarn test:performance 2>&1 | tee refactor/.cache/ci/performance.log
+      - name: Verify all installed library type contracts
+        run: yarn test:ecosystem-types 2>&1 | tee refactor/.cache/ci/ecosystem-types.log
+      - name: Upload browser evidence
+        if: always()
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        with:
+          name: browser-consumers-${{ matrix.os }}-${{ github.run_id }}-${{ github.run_attempt }}
+          path: |
+            refactor/.cache/ci/
+            refactor/.cache/iframe-history/
+            refactor/.cache/react-consumer-*/
+            refactor/.cache/vue-consumer-*/
+            refactor/.cache/performance/
+            refactor/.cache/ecosystem-types/
+            refactor/.cache/*-package-types-*/*.json
+            refactor/.cache/*-package-types-*/*.log
+            refactor/.cache/packages/latest.json
+            refactor/.cache/packages/run-*/*.json
+            refactor/.cache/packages/run-*/*.log
+            refactor/.cache/packages/run-*/*.tgz
+            refactor/.cache/packages/run-*/artifacts/
+          include-hidden-files: true
+          retention-days: 14
+          if-no-files-found: warn
+    defaults:
+      run:
+        shell: bash
+    strategy:
+      fail-fast: false
+      max-parallel: 3
+      matrix:
+        os:
+          - ubuntu-latest
+          - windows-latest
+          - macos-latest
+  browser-smoke:
+    name: Browser playback (${{ matrix.os }}, ${{ matrix.browser }})
+    runs-on: ${{ matrix.os }}
+    timeout-minutes: 60
+    env:
+      CI: true
+    steps:
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        with:
+          persist-credentials: false
+          fetch-depth: 0
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version-file: .node-version
+          package-manager-cache: false
+      - name: Record source and cache inputs
+        id: context
+        run: node scripts/ci-context.mjs
+      - name: Cache locked Yarn downloads
+        uses: actions/cache@caa296126883cff596d87d8935842f9db880ef25 # v5 ref verified 2026-09-13; node24
+        with:
+          path: ${{ steps.context.outputs.yarn_cache }}
+          key: yarn-${{ runner.os }}-${{ runner.arch }}-node-${{ steps.context.outputs.node }}-yarn-${{ steps.context.outputs.yarn }}-${{ github.ref }}-${{ hashFiles('yarn.lock') }}
+      - name: Install the pinned package manager and dependencies
+        run: |
+          npm install --global --force yarn@1.22.22 2>&1 | tee refactor/.cache/ci/toolchain-install.log
+          yarn install --frozen-lockfile --non-interactive 2>&1 | tee refactor/.cache/ci/install.log
+      - name: Cache versioned browser downloads
+        uses: actions/cache@caa296126883cff596d87d8935842f9db880ef25 # v5 ref verified 2026-09-13; node24
+        with:
+          path: ${{ steps.context.outputs.browser_cache }}
+          key: playwright-${{ runner.os }}-${{ runner.arch }}-node-${{ steps.context.outputs.node }}-yarn-${{ steps.context.outputs.yarn }}-${{ github.ref }}-${{ hashFiles('yarn.lock') }}-${{ steps.context.outputs.playwright }}
+      - name: Install test browsers
+        run: yarn test:browser:install --with-deps 2>&1 | tee refactor/.cache/ci/browser-install.log
+      - name: Prepare installed browser plugin packages
+        # Each engine builds and freezes its own complete installed browser roster.
+        # Other ecosystem installation/SDK gates remain tracked by CI-01.
+        run: |
+          yarn test:package --browser 2>&1 | tee refactor/.cache/ci/browser-packages.log
+          node --input-type=module -e 'import fs from "node:fs"; const { output } = JSON.parse(fs.readFileSync("refactor/.cache/packages/latest.json")); fs.appendFileSync(process.env.GITHUB_ENV, `ARTPLAYER_BROWSER_ARTIFACTS=${output}/browser-artifacts.json\n`);'
+      - name: Run all source browser checks
+        if: ${{ !cancelled() }}
+        run: yarn test:browser:source --project=${{ matrix.browser }} 2>&1 | tee refactor/.cache/ci/browser-source.log
+      - name: Run installed browser checks
+        if: ${{ !cancelled() }}
+        run: yarn test:browser:installed --project=${{ matrix.browser }} 2>&1 | tee refactor/.cache/ci/browser-installed.log
+      - name: Upload browser evidence
+        if: always()
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        with:
+          name: browser-smoke-${{ matrix.os }}-${{ matrix.browser }}-${{ github.run_id }}-${{ github.run_attempt }}
+          path: |
+            refactor/.cache/ci/
+            refactor/.cache/browser-source/
+            refactor/.cache/browser-installed/
+            refactor/.cache/packages/latest.json
+            refactor/.cache/packages/run-*/*.json
+            refactor/.cache/packages/run-*/*.log
+            refactor/.cache/packages/run-*/*.tgz
+            refactor/.cache/packages/run-*/artifacts/
+          include-hidden-files: true
+          retention-days: 14
+          if-no-files-found: warn
+    defaults:
+      run:
+        shell: bash
+    strategy:
+      fail-fast: false
+      max-parallel: 6
+      matrix:
+        browser: [chromium, firefox, webkit]
+        os:
+          - ubuntu-latest
+          - windows-latest
+          - macos-latest
+  checks:
+    name: Checks and build (${{ matrix.os }})
+    runs-on: ${{ matrix.os }}
+    timeout-minutes: 45
+    env:
+      CI: true
+    defaults:
+      run:
+        shell: bash
+    steps:
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        with:
+          persist-credentials: false
+          fetch-depth: 0
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version-file: .node-version
+          package-manager-cache: false
+      - name: Record source and cache inputs
+        id: context
+        run: node scripts/ci-context.mjs
+      - name: Cache locked Yarn downloads
+        uses: actions/cache@caa296126883cff596d87d8935842f9db880ef25 # v5 ref verified 2026-09-13; node24
+        with:
+          path: ${{ steps.context.outputs.yarn_cache }}
+          key: yarn-${{ runner.os }}-${{ runner.arch }}-node-${{ steps.context.outputs.node }}-yarn-${{ steps.context.outputs.yarn }}-${{ github.ref }}-${{ hashFiles('yarn.lock') }}
+      - name: Install the pinned package manager
+        run: npm install --global --force yarn@1.22.22 2>&1 | tee refactor/.cache/ci/toolchain-install.log
+      - name: Validate workflow syntax
+        run: |
+          curl --fail --silent --show-error --location https://github.com/rhysd/actionlint/releases/download/v1.7.12/actionlint_1.7.12_linux_amd64.tar.gz --output "$RUNNER_TEMP/actionlint.tar.gz"
+          printf '%s  %s\n' '8aca8db96f1b94770f1b0d72b6dddcb1ebb8123cb3712530b08cc387b349a3d8' "$RUNNER_TEMP/actionlint.tar.gz" | sha256sum --check
+          tar -xzf "$RUNNER_TEMP/actionlint.tar.gz" -C "$RUNNER_TEMP" actionlint
+          "$RUNNER_TEMP/actionlint" -color
+        if: matrix.os == 'ubuntu-latest'
+      - name: Frozen install
+        run: |
+          mkdir -p refactor/.cache/ci
+          yarn install --frozen-lockfile --non-interactive 2>&1 | tee refactor/.cache/ci/install.log
+      - name: Read-only checks and tests
+        run: yarn ci:check 2>&1 | tee refactor/.cache/ci/check.log
+      - name: Build libraries and documentation
+        run: yarn ci:build 2>&1 | tee refactor/.cache/ci/build.log
+      - name: Validate and stage Pages paths
+        id: pages
+        if: inputs.pages-artifact && github.ref == 'refs/heads/master' && matrix.os == 'ubuntu-latest'
+        run: yarn prepare:pages 2>&1 | tee refactor/.cache/ci/pages.log
+      - name: Install staged Pages browser dependencies
+        if: inputs.pages-artifact && github.ref == 'refs/heads/master' && matrix.os == 'ubuntu-latest'
+        run: yarn test:browser:install --with-deps 2>&1 | tee refactor/.cache/ci/pages-browser-install.log
+      - name: Verify staged Pages entrypoints
+        if: inputs.pages-artifact && github.ref == 'refs/heads/master' && matrix.os == 'ubuntu-latest'
+        run: yarn test:pages:browser 2>&1 | tee refactor/.cache/ci/pages-browser.log
+      - name: Record source and tool versions
+        if: always()
+        run: |
+          mkdir -p refactor/.cache/ci
+          git rev-parse HEAD > refactor/.cache/ci/source.txt
+          node --version > refactor/.cache/ci/node.txt
+          yarn --version > refactor/.cache/ci/yarn.txt
+          sha256sum yarn.lock > refactor/.cache/ci/lock.sha256
+          git diff --stat > refactor/.cache/ci/generated-diff.txt
+      - name: Upload available logs
+        if: always()
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        with:
+          name: checks-${{ matrix.os }}-${{ github.run_id }}-${{ github.run_attempt }}
+          path: |
+            refactor/.cache/ci/
+            refactor/.cache/pages/run-*/report.json
+            refactor/.cache/pages/run-*/browser.json
+          include-hidden-files: true
+          retention-days: 14
+          if-no-files-found: warn
+      - name: Prepare Pages artifact
+        if: inputs.pages-artifact && github.ref == 'refs/heads/master' && matrix.os == 'ubuntu-latest'
+        uses: actions/upload-pages-artifact@fc324d3547104276b827a68afc52ff2a11cc49c9 # v5.0.0
+        with:
+          path: ${{ steps.pages.outputs.site }}
+          include-hidden-files: true
+    strategy:
+      fail-fast: false
+      max-parallel: 2
+      matrix:
+        os:
+          - ubuntu-latest
+          - windows-latest
+  ci-result:
+    name: CI result
+    if: always()
+    needs:
+      - checks
+      - coverage
+      - browser-smoke
+      - browser-consumers
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    steps:
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        with:
+          persist-credentials: false
+          fetch-depth: 0
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version-file: .node-version
+          package-manager-cache: false
+      - name: Require every matrix job to succeed
+        env:
+          ARTPLAYER_CI_NEEDS: ${{ toJSON(needs) }}
+        run: node scripts/ci-summary.mjs
+      - name: Upload final status
+        if: always()
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        with:
+          name: ci-result-${{ github.run_id }}-${{ github.run_attempt }}
+          path: refactor/.cache/ci/
+          include-hidden-files: true
+          retention-days: 14
+          if-no-files-found: warn

.github/workflows/pages.yml

@@ -0,0 +1,34 @@
+name: Deploy Pages
+
+on:
+  workflow_dispatch:
+
+permissions:
+  contents: read
+
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  validate:
+    if: github.ref == 'refs/heads/master' && vars.PAGES_DEPLOY_ENABLED == 'true'
+    uses: ./.github/workflows/nodejs.yml
+    with:
+      pages-artifact: true
+
+  deploy:
+    if: github.ref == 'refs/heads/master' && vars.PAGES_DEPLOY_ENABLED == 'true'
+    needs: validate
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    permissions:
+      pages: write
+      id-token: write
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - name: Deploy the validated artifact
+        id: deployment
+        uses: actions/deploy-pages@368f82528645a54fb793d4d04e342629a3f51346 # v5.0.1

.gitignore

@@ -1,8 +1,7 @@
 .env
 .vscode
 .DS_Store
-.parcel-cache
 node_modules
-package-lock.json
+**/package-lock.json
 lerna-debug.log
-yarn.lock
+refactor/.cache/

.node-version

@@ -0,0 +1 @@
+24.21.0

.prettierignore

@@ -1,11 +0,0 @@
-docs
-.github
-.docusaurus
-node_modules
-.parcel-cache
-packages/*/dist
-packages/*/node_modules
-packages/*/.parcel-cache
-packages/artplayer-template/*/.next
-packages/artplayer-template/*/.nuxt
-scripts/plugin/template

.prettierrc

@@ -1,12 +0,0 @@
-{
-    "useTabs": false,
-    "tabWidth": 4,
-    "singleQuote": true,
-    "trailingComma": "all",
-    "printWidth": 120,
-    "semi": true,
-    "bracketSpacing": true,
-    "arrowParens": "always",
-    "endOfLine": "lf",
-    "quoteProps": "as-needed"
-}

AGENTS.md

@@ -0,0 +1,362 @@
+# AGENTS.md
+
+## Compatibility Refactor
+
+2026-09-16 user scope update: stop autonomous refactor implementation and hand off for
+the user's extended self-testing. Read [refactor/self-test-handoff.md](refactor/self-test-handoff.md)
+first. Remaining tasks are deferred, not passed; do not resume long tests, new fixes,
+full matrices, release preparation, or formal reviews without a new user instruction.
+Existing compatibility requirements and future publication gates remain in force.
+
+The compatibility modernization plan is maintained in [refactor/README.md](refactor/README.md).
+For refactor work, read its compatibility contract, task plan, and progress log before editing.
+Use `refactor/tasks.json` as the task status source and regenerate the readable plan with
+`node refactor/scripts/plan.mjs --write`; validate it with `node refactor/scripts/plan.mjs --check`.
+Preserve existing public APIs, event behavior, types, DOM/CSS hooks, and distribution entrypoints.
+The planned TypeScript migration permits incremental JS/TS coexistence; it does not authorize
+changing consumer APIs or treating planned validation as completed validation.
+Apply [refactor/quality-contract.md](refactor/quality-contract.md) to every implementation task:
+the user authorizes improving unreasonable internals while preserving old public contracts.
+Refactor responsibilities and dependencies alongside TypeScript migration, add meaningful
+risk-based tests, and update package architecture/maintenance documentation in the same change.
+The user requires one separate local Git commit for each completed refactor task.
+Include the task ID in the commit subject and include its implementation, tests, documentation,
+and status updates together. Verify the commit before starting the next task. Do not bundle
+multiple newly completed tasks or include unrelated work. This does not authorize pushing or publishing.
+Use Yarn Classic 1.22.22 as packageManager and maintain only the root yarn.lock.
+Core public declarations are authored in packages/artplayer/public/ and generated
+with yarn build:types into the existing types/ entrypoints. Do not hand-edit the
+generated core declarations; yarn check:types is read-only and rejects drift.
+Use Node from .node-version; frozen Yarn installs and strict toolchain checks are required.
+Bun remains an isolated evaluation and must not replace Yarn without a new user decision.
+The user also authorizes installing needed dependencies and adding or improving reasonable
+project scripts for the refactor without asking again for routine tooling choices.
+Record their purpose and versions, use the appropriate workspace/dependency category, update
+the lockfile when applicable, and verify compatibility and reproducible execution.
+After implementation and its necessary tests, hand off the results and wait for the
+user to guide and start the review phase. Do not automatically begin REVIEW-01/02/03,
+including an early first review. Follow [refactor/release-reviews.md](refactor/release-reviews.md):
+the three review rounds and closure of blocking findings remain required before candidate publication.
+Connected Chrome interaction checks complement committed automated browser tests; neither
+connection availability nor mocks replace actual playback or required device evidence.
+If Chrome is unavailable, use the Codex in-app browser for supported real-page tests.
+The user explicitly authorizes this fallback; record the actual browser/version and limitations.
+Do not block ordinary browser checks solely on the Chrome extension connection.
+Each review fix remains a separate task and commit. Revalidate changed candidate contents.
+The user explicitly includes GitHub CI/CD modernization in this refactor.
+Follow [refactor/github-ci-cd.md](refactor/github-ci-cd.md) for PR checks, regression matrices,
+artifacts, Pages and npm workflows. Distinguish local configuration from verified remote runs.
+The user requires every workspace package to move to its own next major version for this
+refactor (M.m.p -> (M+1).0.0). Follow refactor/version-policy.md; independent versions and
+old API compatibility remain mandatory. This version policy is not publication authorization.
+
+## Project Summary
+
+ArtPlayer is a monorepo for a modern HTML5 video player and its ecosystem packages.
+
+- Homepage: `https://artplayer.org`
+- Local dev site: `http://localhost:8082`
+- API docs: `https://artplayer.org/document`
+- Packaging model: workspace monorepo with per-package versioning and per-package build output
+
+The repository contains:
+
+- `packages/artplayer`: the core player
+- `packages/artplayer-plugin-*`: UI and playback plugins
+- `packages/artplayer-proxy-*`: proxy renderers and playback adapters
+- `packages/artplayer-tool-*`: helper tools
+- `packages/artplayer-vitepress`: docs site package
+- `docs/`: local demo site, examples, compiled assets, generated docs
+- `scripts/`: custom build/dev/doc tooling
+
+## Working Style For This Repo
+
+- Verify the real implementation before editing docs or examples.
+- Prefer changing the source package first, then regenerate build artifacts only when needed.
+- Keep package APIs small and consistent with existing ArtPlayer plugin conventions.
+- Preserve the existing visual and API style of sibling packages instead of inventing a new pattern.
+- When touching demo examples, make sure the example still works in `http://localhost:8082`.
+- Do not hand-edit `dist/`, `docs/compiled/`, or `docs/uncompiled/` unless a build step generated them.
+- Desktop editor sources live in `packages/artplayer-vitepress/browser/`; `docs/assets/js/common.js`,
+  `bootstrap.js`, `loader.js`, `mobile.js` and `packages/artplayer-vitepress/docs/public/main.js`
+  are generated with `yarn build:site-assets`. `editor-libraries.ts` is generated by `yarn build:ts`.
+
+## Primary Commands
+
+Use the repo scripts rather than ad hoc bundler commands.
+
+### Development
+
+```bash
+yarn dev
+```
+
+Starts the local dev site on port `8082` and interactively selects a package to watch. The selected package is built into:
+
+- `docs/uncompiled/<package>/`
+
+### Production Build
+
+```bash
+yarn build
+```
+
+Interactive build for one package. Outputs:
+
+- `packages/<name>/dist/*.js|*.legacy.js|*.mjs`
+- copied artifacts into `docs/compiled/`
+
+Build all packages:
+
+```bash
+yarn build all
+```
+
+### Other Project Scripts
+
+```bash
+yarn build:i18n
+yarn build:ts
+yarn build:docs
+yarn build:llm
+yarn build:test
+yarn lint
+yarn build:all
+```
+
+Notes:
+
+- `yarn lint` is read-only; `yarn lint:fix` explicitly fixes the same source/type/script range.
+- `yarn ci:check` runs strict toolchain/plan/lint/tests; `yarn ci:build` generates outputs and checks imports.
+- See `refactor/ci-setup.md` for CI and separate Pages deployment; remote activation is tracked separately.
+- `yarn build:all` is expensive; use it when a change truly spans builds/docs/types/lint together.
+
+## Useful Local URLs
+
+- Root demo index: `http://localhost:8082`
+- Demo by package/example:
+  - `http://localhost:8082/?libs=./uncompiled/<package>/index.js&example=<example>`
+- Docs: `http://localhost:8082/document/`
+
+For proxy/plugin work, prefer validating on the local demo page rather than reasoning only from source.
+
+## Repository Layout
+
+### Core package
+
+- `packages/artplayer/src/index.ts`: player entry
+- `packages/artplayer/src/player/`: playback mixins and player-facing behavior
+- `packages/artplayer/src/control/`: bottom controls
+- `packages/artplayer/src/setting/`: settings panel
+- `packages/artplayer/src/contextmenu/`: context menu items
+- `packages/artplayer/src/plugins/`: built-in plugins
+- `packages/artplayer/src/utils/`: shared helpers, component base classes, DOM utilities
+- `packages/artplayer/public/`: public TypeScript declaration sources
+- `packages/artplayer/types/`: generated public declarations and compatibility documentation
+
+### Ecosystem packages
+
+Migrated ecosystem packages follow this pattern:
+
+```text
+packages/<package>/
+  src/index.ts
+  src/*.ts         # internal modules; see the package maintenance map
+  src/*.less        # optional
+  types/*.d.ts      # public compatibility declarations
+  ARCHITECTURE.md   # maintenance map, or a maintenance section in README.md
+  README.md
+  package.json
+  dist/*
+```
+
+Read the package maintenance map before changing module ownership. Some packages
+also expose accurate types through `/runtime`, with `.d.mts`/`.d.cts` declarations.
+Do not replace historical root declarations with internal implementation types;
+follow [the approved type policy](refactor/type-compatibility-policy.md) and each
+package's recorded compatibility decisions. Check package.json for exact exports.
+
+### Demo and docs assets
+
+- `docs/assets/example/*.js`: runnable browser examples
+- `docs/assets/ts/*.js`: TypeScript demo assets targeted by lint/docs flows
+- `docs/uncompiled/`: dev output
+- `docs/compiled/`: production-copied output
+- `docs/document/`: generated docs content
+
+## Architecture Notes
+
+### Core player
+
+ArtPlayer composes many subsystems during construction. Common integration points:
+
+- `art.template`
+- `art.events`
+- `art.controls`
+- `art.setting`
+- `art.contextmenu`
+- `art.layers`
+- `art.plugins`
+- `art.player`
+
+When extending behavior, prefer integrating with these existing systems rather than bypassing them.
+
+### Control and setting components
+
+Controls and setting entries are managed through component registries.
+
+Relevant implementation:
+
+- `packages/artplayer/src/control/index.ts`
+- `packages/artplayer/src/setting/index.ts`
+- `packages/artplayer/src/utils/component.ts`
+
+Important behavior:
+
+- `art.controls.update(...)` and `art.setting.update(...)` replace existing entries by `name`
+- `art.controls.remove(name)` and `art.setting.remove(name)` are the correct cleanup APIs
+- selector-style controls rely on `default` flags to determine highlighted items
+
+If a plugin conditionally shows UI, it must also clean that UI up when the condition no longer holds.
+
+### Plugin shape
+
+Standard plugin/export shape:
+
+```js
+export default function somePlugin(option = {}) {
+  return (art) => {
+    return {
+      name: 'somePlugin',
+    }
+  }
+}
+```
+
+Naming conventions:
+
+- package: `artplayer-plugin-<name>`
+- global: `artplayerPlugin<Name>`
+- exported function name should match the global naming convention
+
+### Proxy packages
+
+Proxy packages usually return a non-video element or video-like shim and emulate media element behavior for ArtPlayer.
+
+Examples:
+
+- `packages/artplayer-proxy-canvas`
+- `packages/artplayer-proxy-mediabunny`
+
+When editing proxy packages:
+
+- keep the HTMLMediaElement-like surface coherent
+- keep event ordering stable
+- treat `loadedmetadata`, `loadeddata`, `canplay`, `seeked`, `waiting`, and `pause/play` semantics carefully
+- ensure UI state is updated and cleaned up when source topology changes
+
+### HLS / adaptive playback controls
+
+The reference implementation for adaptive selector UI is:
+
+- `packages/artplayer-plugin-hls-control/src/index.ts`
+- `packages/artplayer-plugin-dash-control/src/index.ts` (SDK 4.x/5.x capability adapter)
+
+If adding HLS-like quality/audio selection elsewhere:
+
+- follow the selector format used there
+- derive highlighted items from actual current tracks, not only from mode flags
+- avoid stale selectors when changing to streams without the same topology
+
+## Build and Artifact Rules
+
+- Always edit source first: core runtime in `src/`, core declarations in `public/`;
+  other packages retain `types/` until their own declaration source migration.
+- Rebuild package artifacts after source changes that should ship.
+- Do not treat `dist/` as source of truth.
+- If a change affects demo behavior, also verify the matching file in `docs/assets/example/`.
+
+For package-specific builds, the normal flow is:
+
+1. `yarn dev` and pick the package for fast local iteration
+2. validate in `http://localhost:8082`
+3. `yarn build` and pick the package when ready to update shippable artifacts
+
+## Documentation Expectations
+
+If a public package API changes, check whether these also need updates:
+
+- the package `README.md`
+- `docs/assets/example/<name>.js`
+- `types/<name>.d.ts`
+- any generated compiled outputs if you built the package
+
+Keep examples realistic and runnable. Prefer local demo URLs or stable public sample streams.
+
+## Code Quality Expectations
+
+- Follow the existing TypeScript style for migrated production modules and the
+  existing JavaScript style for tests, launchers and documented legacy exceptions.
+- Use ASCII unless a file already requires otherwise.
+- Match the minimal-comment style of neighboring files.
+- Avoid unnecessary abstraction; this codebase generally prefers direct implementation.
+- Respect current browser targets:
+  - modern build: `es2020`
+  - legacy build: `es2015`
+
+## Validation Checklist
+
+For most package changes, validate as many of these as apply:
+
+- source file lint passes
+- local demo page loads
+- expected events fire once and in the correct order
+- controls/settings render correctly
+- cleanup works after restart, source switch, or destroy
+- package build succeeds
+
+For playback/proxy changes specifically:
+
+- test initial load
+- test play/pause
+- test seek
+- test switching source or track topology
+- test whether UI reflects the actual selected track/quality
+
+## Notes Specific To `artplayer-proxy-mediabunny`
+
+This package now depends on modern `mediabunny` and supports HLS through `mediabunny` input handling.
+
+Files to understand first:
+
+- `packages/artplayer-proxy-mediabunny/ARCHITECTURE.md`
+- `packages/artplayer-proxy-mediabunny/src/index.ts`
+- `packages/artplayer-proxy-mediabunny/src/VideoShim.ts`
+- `packages/artplayer-proxy-mediabunny/src/MediaBunnyEngine.ts`
+- `packages/artplayer-proxy-mediabunny/src/input.ts`
+- `packages/artplayer-proxy-mediabunny/src/m3u8.ts`
+
+Key expectations:
+
+- HLS source detection should happen in `input.ts`
+- track selection should use actual pairable audio/video relationships
+- selector UI should mirror the behavior of `artplayer-plugin-hls-control`
+- selector cleanup is required when a later source no longer supports the same controls
+- avoid duplicate readiness events during load and track switches
+
+For sustained playback, use `yarn test:mediabunny-soak` with explicit artifacts and
+media; see [the long-test procedure](refactor/changes/2026-09-16-PKG-MB-09-hour-soak.md).
+It shares port 8084 with ordinary browser tests. Do not start another browser
+server or change the measured source, artifacts or media during a live run.
+Use its live process handle and per-case progress samples to check progress;
+an old report or a start snapshot does not prove current execution or completion.
+
+## When Unsure
+
+Start with the nearest sibling implementation instead of inventing a new pattern:
+
+- control/setting UI: `artplayer-plugin-hls-control`, `artplayer-plugin-dash-control`
+- proxy behavior: `artplayer-proxy-canvas`, `artplayer-proxy-mediabunny`
+- component lifecycle: `packages/artplayer/src/utils/component.ts`
+
+If a change spans source, examples, and packaging, make all three consistent in the same pass.

CHANGELOG.md

@@ -0,0 +1,435 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [Unreleased]
+
+- Fix safe area issue when enter web fullscreen [#1033](https://github.com/zhw2590582/ArtPlayer/issues/1033)
+
+## [5.4.0] - 2026-03-12
+
+- Refactor `Parcel` to `Vite`
+- Change `Artplayer.FULLSCREEN_WEB_IN_BODY` defaults to `true`
+- The `reset` method is used to reset video request
+- Fix [#1014](https://github.com/zhw2590582/ArtPlayer/issues/1014)
+- Fix [#1023](https://github.com/zhw2590582/ArtPlayer/issues/1023)
+- Fix [#1028](https://github.com/zhw2590582/ArtPlayer/issues/1028)
+- Add `artplayer-plugin-jassub` plugin
+- Add `artplayer-proxy-mediabunny` plugin
+- Add `artplayer-plugin-audio-track` plugin
+- Add `artplayer-plugin-asr` plugin
+- Add `artplayer-plugin-danmuku-mask` plugin
+- Deprecate `artplayer-plugin-libass` plugin
+- Prevent `Hint.css` from polluting global styles
+
+## [5.3.0] - 2025-09-06
+
+- Rename `.esm.js` to `.mjs`
+- Remove the default `fill` color value of `svg`
+- Optimize the `autoOrientation` logic
+- Add `Artplayer.REMOVE_SRC_WHEN_DESTROY`
+- Add `artplayer-plugin-document-pip` plugin
+- Add `art.events.bindGlobalEvents` method for rebinding global methods
+- Optimize `artplayer.d.ts`, now you can directly import `Option`
+
+```ts
+import type { Option } from 'artplayer'
+
+const option: Option = {
+  container: '.artplayer-app',
+  url: './assets/sample/video.mp4',
+}
+```
+
+- Simplify `i18n` import
+
+```ts
+import fr from 'artplayer/i18n/fr'
+import id from 'artplayer/i18n/id'
+
+const option = {
+  container: '.artplayer-app',
+  url: './assets/sample/video.mp4',
+  i18n: { id, fr },
+  lang: 'fr',
+}
+```
+
+## [5.2.5] - 2025-08-01
+
+- Add `ESM` version for all packages, such as `artplayer/dist/artplayer.esm.js`
+- Recognize `globalThis.CUSTOM_USER_AGENT` global variable for customizing `navigator.userAgent`
+- Fix missing `mount` parameter when initializing `artplayer-plugin-danmuku`
+
+## [5.2.3] - 2025-04-20
+
+- Add Vietnamese `vi`
+- Clear the `video.src` property on destroy
+- Add `onClick` option for `Setting`
+- Fix style loading failure of danmuku and chapter plugins when the page has no head tag
+- Add `gesture` option to enable or disable gesture events on mobile `video` element
+
+## [5.2.2] - 2025-01-19
+
+- Fix thumbnail crossover issue
+- Fix style loading failure when the page has no head tag
+- Add slider support in subtitle plugin settings panel for mobile dragging
+- Fix positioning error of settings panel when rotating screen
+- Fix classname switching error when fullscreen state changes
+
+## [5.2.1] - 2024-10-26
+
+- Refactor `Setting` component, fix state loss issue
+- For `Setting` of type `range`, callback now returns an array of numbers instead of a single number
+- Remove `isStringOrNumber` utility function
+- Fix inconsistent state issue in `artplayer-plugin-hls-control`
+- Deprecate `artplayer-plugin-dash-quality` plugin
+- Add new `artplayer-plugin-dash-control` plugin
+- Use `code` instead of deprecated `keyCode` for keyboard events
+- Add `keydown` event to listen for `keydown` from `document`
+
+## [5.2.0] - 2024-10-19
+
+- Add `option.proxy` for proxying third-party `video` and `canvas`
+- Add `artplayer-proxy-canvas` proxy, enabling video playback via `canvas`
+- Add `option.thumbnails.scale` for preview image scaling
+- Fix bug where changing `art.url` didn’t trigger `autoPlayback`: [#797](https://github.com/zhw2590582/ArtPlayer/issues/797)
+- Add `art.subtitle.cues` property for retrieving all subtitle list
+- Add `art.subtitle.activeCues` property for retrieving active subtitles
+- Add `subtitleBeforeUpdate` event triggered before subtitle element rendering
+- Change `subtitleUpdate` event to `subtitleAfterUpdate`, triggered after subtitle element rendering
+- Optimize trigger timing and callback parameters of `subtitleLoad` event
+- Remove `subtitleSwitch` event; use `subtitleLoad` instead
+- Upgrade `artplayer-plugin-hls-quality` to `artplayer-plugin-hls-control`
+- Add `artplayer-plugin-ambilight` plugin
+- Fix `thumbnails` display bug
+
+## [5.1.7] - 2024-08-15
+
+- Add `Artplayer.STYLE` property to return player style text
+- `art.screenshot('your-name')` now supports custom file names
+- When `Artplayer.CONTEXTMENU` is `false`, default context menu is no longer hidden
+- Add `art.thumbnails` property for dynamically setting `thumbnails`
+
+## [5.1.6] - 2024-06-15
+
+- Optimize `setBar` event
+- Add `artplayerPluginChapter` plugin
+- Add `art.plugins.artplayerPluginDanmuku.load(target)` parameter for appending danmuku library
+- Add `width` option to danmuku plugin; when player width is smaller than this, danmuku sender is placed at the bottom
+- Fix `artplayerPluginVttThumbnail` not displaying on mobile
+- Fix danmuku plugin style and percentage font-size bug
+- `thumbnails` are now visible on mobile too
+- Restore `screen.orientation.lock` functionality
+
+## [5.1.5] - 2024-06-01
+
+- Refactor `artplayerPluginDanmuku` plugin
+- Add `artplayerPluginChromecast` plugin
+- Add `fullscreenError` event
+- Optimize double-click event: [#728](https://github.com/zhw2590582/ArtPlayer/pull/728)
+- Fix delayed display of `thumbnails`
+- Add `art.plugins.lock.state = true/false` for manually controlling `lock` state
+- Control bar no longer auto-hides when mouse is on it or when settings panel is open
+- Remove `screen.orientation.lock` due to compatibility issues
+- Fix `fullscreen` bug on mobile
+
+## [5.1.1] - 2024-01-11
+
+- Plugin functions now support both synchronous and asynchronous returns
+
+## [5.1.0] - 2023-12-23
+
+- Plugin functions now support async return
+- Player will no longer be destroyed after reaching error limit for playback address
+- Split language files, core no longer bundles multiple languages [Language Settings](https://artplayer.org/document/start/i18n.html)
+- Updating components now supports updating only specified fields [pull/549](https://github.com/zhw2590582/ArtPlayer/pull/549)
+- Add `muted` event triggered when mute state changes
+- Add `Artplayer.LOG_VERSION` global config to control whether to print player version (default `true`)
+- Add `Artplayer.USE_RAF` global config to control whether to use `requestAnimationFrame` (default `false`), currently for smooth progress bar effect
+- Remove default styles `margin:0;padding:0;` to avoid conflicts with third-party libraries
+- Subtitle line changed from `p` to `div` tag, with classname `art-subtitle-line`
+- On mobile, tapping video toggles control bar display
+- Remove `art.loop` interval playback feature (not commonly used)
+- Subtitle track now has `label` attribute to display subtitle names on mobile
+- Add utility functions `unescape`, `isBrowser`, `setStyleText`
+- Add `artplayerPluginMultipleSubtitles` plugin for merged subtitle files: [demo](https://www.artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles)
+- Modify mini progress bar display
+
+## [5.0.9] - 2023-05-14
+
+- Fix `art.autoOrientation` style bug
+- Remove animation effect of player container
+
+## [5.0.8] - 2023-05-13
+
+- Fix conflict of `art.mini`
+- Fix animation bug of `art.aspectRatio`
+
+## [5.0.7] - 2023-05-13
+
+- Switching via `switchUrl` or `switchQuality` preserves existing adjustments such as `aspectRatio`, `playbackRate`, `flip`, `autoSize`
+- Remove the second `name` parameter from `switchUrl` and `switchQuality`
+- Add `isIOS13` utility to fix inaccurate `isMobile` detection on iOS 13+
+- `art.autoSize` and `art.autoHeight` are now methods: `art.autoSize()` and `art.autoHeight()`
+- Add new property `art.quality` for dynamically updating quality list
+- Fix incorrect `art.aspectRatio` property
+- Add `art.switch` setter property, same as `art.switchUrl` method
+
+## [5.0.6] - 2023-05-03
+
+- Fix style bug of settings panel
+
+## [5.0.5] - 2023-05-03
+
+- Add `heatmap` option to danmuku plugin for enabling heatmap (default: off)
+- Fix English subtitle line break style bug
+- Fix settings panel style bug
+- Remove unnecessary global properties
+- Remove `title` option (not useful now)
+- Remove `whitelist` option (not useful now)
+
+## [5.0.4] - 2023-04-27
+
+- Fix controller dropdown list style bug
+
+## [5.0.3] - 2023-04-26
+
+- Fix `event.pageY` value error in volume controller
+- Update build config, `artplayer.legacy.js` now compatible with IE 11
+
+## [5.0.2] - 2023-04-24
+
+- Fix style compatibility issue of control bar position
+
+## [5.0.1] - 2023-04-24
+
+- Fix web fullscreen style bug
+- Fix built-in settings text error
+
+## [5.0.0] - 2023-04-23
+
+- Rewrite volume controller
+- Fix incorrect progress drag angle on mobile
+- Rewrite `mini` mode, now video detaches from original container
+- All components (layers, controller, contextmenu, settings panel) support dynamic deletion and updating
+- Subtitle option adds `onVttLoad` for modifying vtt text before output
+- Rewrite all styles, add many `css` variables
+- Add `cssVar` option for initializing `css` variables
+- Add `cssVar` method for getting/setting `css` variables
+- `artplayer-plugin-hls-quality` adds `getResolution` function option for getting resolution text from level
+- Add `artplayer-plugin-dash-quality` plugin for adding Dash quality list to player
+- Fix `lock` and `loop` event issues
+- Add Russian `ru` and Indonesian `id` languages
+- Update `artplayer-plugin-control` for `artplayer@5.0.0`
+- Update `artplayer-plugin-dash-quality` for `artplayer@5.0.0`
+- Update `artplayer-plugin-hls-quality` for `artplayer@5.0.0`
+- Update `artplayer-plugin-danmuku` for `artplayer@5.0.0`
+
+## [4.6.2] - 2023-01-26
+
+- Default `Artplayer.PROGRESS_HEIGHT` changed to `6`
+- Add `artplayer-plugin-vtt-thumbnail` to generate video preview images from vtt subtitle files
+- Add `Artplayer.FULLSCREEN_WEB_IN_BODY` for whether to mount player to `document.body` in web fullscreen (default `false`)
+- Change subtitle offset adjustment to slider
+- Subtitle option adds `escape` (default `true`) for HTML escaping
+
+## [4.6.1] - 2023-01-11
+
+- Write brand new docs
+- Optimize `d.ts`
+- Remove redundant events
+- Optimize some styles
+- Add `i18n` option
+
+## [4.6.0] - 2022-12-31
+
+- Optimize style effects of control bar icons
+- Optimize style effects of settings panel
+- Fix incorrect `art.fullscreen` state detection
+- Add `artplayer-plugin-control` plugin to change control bar style
+
+## [4.5.12] - 2022-11-20
+
+- Fix `art.loop = []` display bug
+
+## [4.5.11] - 2022-11-06
+
+- Add `Artplayer.CONTEXTMENU` for controlling whether to show contextmenu (default `true`)
+- Whitelist function default `true` on mobile, all devices use player UI
+
+## [4.5.10] - 2022-11-05
+
+- Fix subtitle not showing in Firefox: [#pull/415](https://github.com/zhw2590582/ArtPlayer/pull/415)
+- Info popup supports clicking to select video property text
+
+## [4.5.9] - 2022-11-05
+
+- Add `art.type` property to get/set video type
+- Add `art.video` property to get video element
+- Add `artplayer-tool-iframe` plugin to control player inside iframe
+- Add `artplayer-plugin-hls-quality` plugin for adding Hls quality list
+- Add `Artplayer.PLAYBACK_RATE` for default playback rates `[0.5, 0.75, 1, 1.25, 1.5, 2]`
+- Add `Artplayer.ASPECT_RATIO` for default ratios `['default','4:3','16:9']`
+- Add `Artplayer.FLIP` for default flip options `['normal','horizontal','vertical']`
+- Add `Artplayer.PROGRESS_HEIGHT` (default: `4`)
+- Add `legacy.js` version for older browsers (larger size)
+- Remove `examples` dir, no longer provide Vue/React examples
+
+## [4.5.8] - 2022-10-09
+
+- Add Farsi language
+- Add `Artplayer.DEBUG` (default `false`) for debug logs
+- Add `art.setting.update()` for dynamic settings update
+- Optimize `artplayer.d.ts`
+
+## [4.5.7] - 2022-09-28
+
+- Add `Artplayer.VOLUME_STEP` for controlling volume step (default `0.1`)
+- Add `Artplayer.SEEK_STEP` for controlling seek step (default `5s`)
+- Fix some svg icons not showing on mobile
+- Fix desktop progress bar cannot click+drag simultaneously
+- Fix mobile progress bar cannot click+drag
+- Add `art.isRotate` property for detecting auto fullscreen rotation
+- Settings panel `range` adds `onChange` option for real-time values
+
+```js
+var art = new Artplayer({
+    container: '.artplayer-app',
+    url: '/assets/sample/video.mp4',
+    setting: true,
+    settings: [
+        {
+            html: 'Slider',
+            tooltip: '5x',
+            range: [5, 1, 10, 0.1],
+            onChange: function (item) {
+                return item.range + 'x';
+            },
+        },
+    ],
+});
+```
+
+## [4.5.6] - 2022-09-19
+
+- Fix hls.js not working in Safari
+
+## [4.5.5] - 2022-09-19
+
+- Ad plugin adds `option.muted` for autoplay muted ads
+- Danmuku plugin exposes `art.plugins.artplayerPluginDanmuku.reset()` to clear display
+- Danmuku plugin exposes `art.plugins.artplayerPluginDanmuku.option` for current config
+- Fix subtitle bug in iOS fullscreen
+- Add Spanish `es`
+
+## [4.5.4] - 2022-08-01
+
+### Added
+
+- Add `Artplayer.AUTO_PLAYBACK_MIN` for min playback memory value (default `5s`)
+- Add `Artplayer.TOUCH_MOVE_RATIO` for mobile progress drag ratio (default `0.5`)
+- `option.thumbnails` adds optional `width`/`height`
+- Add `option.id` for unique playback memory identifier
+
+## [4.5.3] - 2022-07-13
+
+### Added
+
+- `url` option allows empty string for async `art.url`
+
+```js
+const art = new Artplayer({
+    url: '',
+    container: '.artplayer-app',
+});
+
+setTimeout(() => {
+    art.url = '/assets/sample/video.mp4';
+}, 1000);
+```
+
+- `art.play()` always returns Promise; `play` event is async
+
+```js
+const art = new Artplayer({
+    url: '/assets/sample/video.mp4',
+    container: '.artplayer-app',
+});
+
+art.on('ready', async () => {
+    try {
+        await art.play();
+        console.log('Play success');
+    } catch (error) {
+        console.log('Play failed', error.message);
+    }
+});
+```
+
+- Add `airplay` (only Safari)
+
+```js
+const art = new Artplayer({
+    url: '/assets/sample/video.mp4',
+    container: '.artplayer-app',
+    airplay: true,
+});
+```
+
+## [4.5.2] - 2022-06-22
+
+- Optimize auto-playback to allow user choice
+
+## [4.5.0] - 2022-06-21
+
+- Remove built-in ads
+- Add ad plugin
+
+## [4.4.7] - 2022-06-13
+
+- Support danmuku lib d.ts
+- Update deps
+
+## [4.4.6] - 2022-06-11
+
+- Add danmuku lib d.ts
+- Adjust subtitle font-size param
+- Optimize regex parsing of xml danmuku
+
+## [4.4.5] - 2022-06-02
+
+- Fix theme color missing in mini mode
+
+## [4.4.3] - 2022-05-26
+
+- Fix custom mounted input residual on danmuku destroy
+- Fix mini mode size calculation error
+
+## [4.4.2] - 2022-05-20
+
+- Remove UI init `video:loadedmetadata` event
+- Danmuku exposes `load` for switching sources
+- Add error icon after video load error limit
+- Fix multiple init of setting panel bug
+
+## [4.4.1] - 2022-05-17
+
+- Add `art.isInput`, when true control bar won’t auto-hide (e.g. typing danmuku)
+- Add `art.isLock`, when true on mobile prevents seek/play/pause
+- Fix fixed width bug of danmuku input box
+- Settings panel supports `range` and `onRange`
+- Add `isAndroid` and `isIOS` utils
+- Danmuku adds `lockTime`, `maxLength`, `minWidth`, `maxWidth`, `mount`, `beforeEmit`, `theme`
+
+## [4.4.0] - 2022-05-15
+
+- Settings panel supports `switch` and `onSwitch`
+- Danmuku plugin adds settings panel and send
+- Danmuku adds default mode and font-size
+- Danmuku font-size supports percentage of player
+- Fix flip icon missing
+- Player with focus won’t auto-hide control bar
+- Remove subtitle toggle button (manual config required)

CHANGELOG_CN.md

@@ -1,352 +0,0 @@
-# Changelog
-
-All notable changes to this project will be documented in this file.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-## [Unreleased]
-
-## [5.1.6] - 2024-6-15
-
--   优化 `setBar` 事件
--   新增 `artplayerPluginChapter` 插件
--   新增 `art.plugins.artplayerPluginDanmuku.load(target)` 参数，用于追加弹幕库
--   新增弹幕插件的 `width` 选项参数，当播放器宽度小于此值时，弹幕发射器置于播放器底部
--   修复 `artplayerPluginVttThumbnail` 在移动端不显示的问题
--   修复弹幕插件样式，和字号百分比显示的 `bug`
--   移动端也可以看到 `thumbnails` 了
--   恢复 `screen.orientation.lock` 功能
-
-## [5.1.5] - 2024-6-1
-
--   重构 `artplayerPluginDanmuku` 插件
--   新增 `artplayerPluginChromecast` 插件
--   添加 `fullscreenError` 事件
--   优化双击事件: [#728](https://github.com/zhw2590582/ArtPlayer/pull/728)
--   修复 `thumbnails` 延迟显示问题
--   新增 `art.plugins.lock.state = true/false`, 用于手动控制 `lock` 状态
--   当鼠标在控制栏上，或者打开了设置面板，控制栏不再自动隐藏
--   由于兼容性不足，删除 `screen.orientation.lock` 功能
--   修复移动端的 `fullscreen` bug
-
-## [5.1.1] - 2024-1-11
-
--   插件函数支持同步和异步返回
-
-## [5.1.0] - 2023-12-23
-
--   插件函数改为支持异步返回
--   当播放地址发生错误到达上限后，不会再主动销毁播放器
--   分离语言文件，核心代码不再捆绑多国语言 [语言设置](https://artplayer.org/document/start/i18n.html)
--   更新组件时，支持填写只更新的字段 [pull/549](https://github.com/zhw2590582/ArtPlayer/pull/549)
--   添加 `muted` 事件，当静音的状态变化时触发
--   添加 `Artplayer.LOG_VERSION` 全局配置，设置是否打印播放器版本，默认为 `true`
--   添加 `Artplayer.USE_RAF` 全局配置，设置是否使用 `requestAnimationFrame` ，默认为 `false`，目前主要用于进度条的平滑效果
--   移除默认样式 `margin:0;padding:0;`，因为容易与第三方库起样式冲突，导致难以覆写
--   字幕行从 `p` 标签改为 `div` 标签，并且添加类名 `art-subtitle-line`
--   在移动端，点击视频会切换控制栏的显示与隐藏
--   由于功能不常用，删除 `art.loop` 区间播放功能
--   字幕轨添加 `label` 属性，用于在移动设备上显示字幕名字
--   添加 `unescape`, `isBrowser`, `setStyleText` 工具函数
--   添加 `artplayerPluginMultipleSubtitles` 插件，用于显示合并后的字幕文件: [demo](https://www.artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles)
--   修改迷你进度条的显示方式
-
-## [5.0.9] - 2023-5-14
-
--   修复 `art.autoOrientation` 样式错误问题
--   移除播放器容器的动画效果
-
-## [5.0.8] - 2023-5-13
-
--   修复 `art.mini` 的互斥关系
--   修复 `art.aspectRatio` 动画效果问题
-
-## [5.0.7] - 2023-5-13
-
--   使用 `switchUrl` 或者 `switchQuality` 方法切换地址后会保持原有的调整如：`aspectRatio`, `playbackRate`, `flip`, `autoSize`
--   删除 `switchUrl` 方法和 `switchQuality` 方法的第二个 `name` 参数
--   添加 `isIOS13` 工具，用于修复在 `IOS13` 以上版本的设备上的 `isMobile` 判断不准确的问题
--   `art.autoSize` 和 `art.autoHeight` 改为方法的形式调用，即 `art.autoSize()` 和 `art.autoHeight()`
--   添加新的属性 `art.quality`，用于动态更新画质列表
--   修复 `art.aspectRatio` 属性不正确的问题
--   添加 `art.switch` Setter 属性, 功能和 `art.switchUrl` 方法一样
-
-## [5.0.6] - 2023-5-3
-
--   修复设置面板的样式错误
-
-## [5.0.5] - 2023-5-3
-
--   弹幕插件添加 `heatmap` 选项，用于是否开启热度图，默认为关闭
--   修复英文字幕换行的样式错误
--   修复设置面板的样式错误
--   移除多余的全局属性
--   移除 `title` 选项，因为目前用处不大
--   移除 `whitelist` 选项，因为目前用处不大
-
-## [5.0.4] - 2023-4-27
-
--   修复控制器的上拉列表的样式 bug
-
-## [5.0.3] - 2023-4-26
-
--   修复音量控制器 `event.pageY` 取值错误
--   修改构建配置，`artplayer.legacy.js` 可以兼容到 `IE 11`
-
-## [5.0.2] - 2023-4-24
-
--   修复控制栏位置的样式兼容问题
-
-## [5.0.1] - 2023-4-24
-
--   修复网页全屏的样式错误
--   修改内置设置项的文本错误
-
-## [5.0.0] - 2023-4-23
-
--   重写了音量控制器
--   修复在移动端下，进度拖动的角度不正确的问题
--   重写了 `mini` 模式，现在这个模式下，视频会脱离原来的容器
--   全部组件（层，控制器，右键菜单，设置面板）支持动态删除和动态更新
--   字幕选项添加了 `onVttLoad` 方法，用于在字幕输出前修改 `vtt` 文本
--   重写了全部样式，添加了许多 `css` 变量
--   添加 `cssVar` 选项，用于初始化 `css` 变量
--   添加 `cssVar` 方法，用于设置和获取 `css` 变量
--   插件 `artplayer-plugin-hls-quality` 添加 `getResolution` 函数选项，用于获取从 `level` 中分辨率的文本
--   新增 `artplayer-plugin-dash-quality` 插件，用于添加 `Dash` 画质列表到播放器
--   修复 `lock` 和 `loop` 事件失效问题
--   添加俄语 `ru` 和印度尼西亚 `id` 语言
--   更新 `artplayer-plugin-control`，用于兼容`artplayer@5.0.0`
--   更新 `artplayer-plugin-dash-quality`，用于兼容`artplayer@5.0.0`
--   更新 `artplayer-plugin-hls-quality`，用于兼容`artplayer@5.0.0`
--   更新 `artplayer-plugin-danmuku`，用于兼容`artplayer@5.0.0`
-
-## [4.6.2] - 2023-1-26
-
--   `Artplayer.PROGRESS_HEIGHT` 默认值改为 `6`
--   添加 `artplayer-plugin-vtt-thumbnail` 用于使用 `vtt` 字幕文件生成视频预览图
--   添加 `Artplayer.FULLSCREEN_WEB_IN_BODY` 用于网页全屏时，是否把播放器挂载于 `document.body` 上，默认为 `false`
--   修改字幕偏移的方式为滑块
--   字幕选项添加 `escape`，用于是否转义 `html` 标签，默认为 `true`
-
-## [4.6.1] - 2023-1-11
-
--   编写全新的文档
--   优化`d.ts`
--   移除多余的事件
--   优化部分样式
--   添加`i18n`选项
-
-## [4.6.0] - 2022-12-31
-
--   优化控制栏图标的样式效果
--   优化设置面板的样式效果
--   修复 `art.fullscreen` 监听状态错误的问题
--   添加 `artplayer-plugin-control` 插件，用于改变控制栏样式
-
-## [4.5.12] - 2022-11-20
-
--   修复 `art.loop = []` 的显示 `bug`
-
-## [4.5.11] - 2022-11-6
-
--   新增 `Artplayer.CONTEXTMENU` 用于设置是否显示右键菜单，默认为 `true`
--   移动设备 `Whitelist` 功能默认为 `true`，即全部移动设备都使用播放器 `UI`
-
-## [4.5.10] - 2022-11-5
-
--   修复字幕在 `firefox` 不显示的问题：[#pull/415](https://github.com/zhw2590582/ArtPlayer/pull/415)
--   信息弹窗支持点击选中视频属性文本值
-
-## [4.5.9] - 2022-11-5
-
--   添加 `art.type` 属性，用于获取和设置视频类型
--   添加 `art.video` 属性，用于获取 `video` 元素
--   添加 `artplayer-plugin-iframe` 插件，用于控制 `iframe` 里的播放器
--   添加 `artplayer-plugin-hls-quality` 插件，用于添加 `Hls` 画质列表到播放器
--   新增 `Artplayer.PLAYBACK_RATE` 用于设置默认播放速度，默认 `[0.5, 0.75, 1, 1.25, 1.5, 2]`
--   新增 `Artplayer.ASPECT_RATIO` 用于设置默认长宽比，默认 `['default', '4:3', '16:9']`
--   新增 `Artplayer.FLIP` 用于设置默认翻转功能，默认 `['normal', 'horizontal', 'vertical']`
--   新增 `Artplayer.PROGRESS_HEIGHT` 用于设置进度条高度，默认为 `4`
--   添加 `legacy.js` 版本，用于兼容更老的浏览器，但相对体积较大
--   移除 `examples` 目录，不再提供 `vue.js` 和 `react.js` 的例子文件
-
-## [4.5.8] - 2022-10-9
-
--   添加 `farsi` 语言
--   新增 `Artplayer.DEBUG` 用于打印 `debug` 信息，默认为 `false`
--   新增 `art.setting.update()` 用于动态更新设置面板
--   优化 `artplayer.d.ts`
-
-## [4.5.7] - 2022-9-28
-
--   新增 `Artplayer.VOLUME_STEP` 用于控制调整 `音量` 的步长，默认为 `0.1`
--   新增 `Artplayer.SEEK_STEP` 用于控制调整 `快进/快退` 的步长，默认为 `5` 秒
--   修复部分 `svg` 图标在移动端不显示的问题
--   修复在桌面端进度条不能同时点击和拖动的问题
--   修复在移动端进度条不能点击和拖动的问题
--   新增 `art.isRotate` 属性，用于识别是否自动全屏旋转
--   设置面板 `range` 添加 `onChange` 选项，可以实时获取当前值
-
-```js
-var art = new Artplayer({
-    container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
-    setting: true,
-    settings: [
-        {
-            html: 'Slider',
-            tooltip: '5x',
-            range: [5, 1, 10, 0.1],
-            onChange: function (item) {
-                return item.range + 'x';
-            },
-        },
-    ],
-});
-```
-
-## [4.5.6] - 2022-9-19
-
--   修复 `hls.js` 在 `Safari` 播放失效的问题
-
-## [4.5.5] - 2022-9-19
-
--   广告插件添加 `option.muted` 选项，用于静音自动播放广告
--   弹幕库插件暴露 `art.plugins.artplayerPluginDanmuku.reset()` 方法，用于清空当前弹幕显示
--   弹幕库插件暴露 `art.plugins.artplayerPluginDanmuku.option` 属性，用于获取当前弹幕配置
--   修复在 `IOS` 全屏模式下，字幕失效的问题
--   添加 `es` 语言
-
-## [4.5.4] - 2022-8-1
-
-### Added
-
--   新增 `Artplayer.AUTO_PLAYBACK_MIN` 用于控制最小可以记忆播放的进度值，默认为 `5` 秒
--   新增 `Artplayer.TOUCH_MOVE_RATIO` 用于控制移动端进度条拖放比例，默认为 `0.5`
--   `option.thumbnails` 添加可选的 `width` 和 `height`
--   新增播放器编号选项 `option.id`，可用于记忆播放时的唯一标识
-
-## [4.5.3] - 2022-7-13
-
-### Added
-
--   `url` 选项允许传空字符串，可用于异步设置 `art.url`
-
-```js
-const art = new Artplayer({
-    url: '',
-    container: '.artplayer-app',
-});
-
-setTimeout(() => {
-    art.url = '/assets/sample/video.mp4';
-}, 1000);
-```
-
--   `art.play()` 方法统一返回 `Promise`, `play` 事件也改为异步触发
-
-```js
-const art = new Artplayer({
-    url: '/assets/sample/video.mp4',
-    container: '.artplayer-app',
-});
-
-art.on('ready', async () => {
-    try {
-        await art.play();
-        console.log('播放成功');
-    } catch (error) {
-        console.log('播放失败', error.message);
-    }
-});
-```
-
--   新增 `airplay` (隔空播放) 功能，当前只在 Safari 下可用
-
-```js
-const art = new Artplayer({
-    url: '/assets/sample/video.mp4',
-    container: '.artplayer-app',
-    airplay: true,
-});
-```
-
-## [4.5.2] - 2022-6-22
-
-### Added
-
--   优化自动回放功能，让用户自行选择
-
-## [4.5.0] - 2022-6-21
-
-### Added
-
--   移除内置广告功能
--   新增广告插件
-
-## [4.4.7] - 2022-6-13
-
-### Added
-
--   兼容弹幕库 d.ts
--   更新依赖库
-
-## [4.4.6] - 2022-6-11
-
-### Added
-
--   添加弹幕库 d.ts
--   调整字幕字体大小参数
--   优化正则解析 xml 弹幕
-
-## [4.4.5] - 2022-6-2
-
-### Added
-
--   修复迷你模式时，主题色缺失的 bug
-
-## [4.4.3] - 2022-05-26
-
-### Added
-
--   修复弹幕库销毁时，自定义挂载输入框的残留
--   修复迷你模式的尺寸计算错误
-
-## [4.4.2] - 2022-05-20
-
-### Added
-
--   移除播放器 UI 初始化的 video:loadedmetadata 事件
--   弹幕库暴露 load 方法，用于切换弹幕源
--   添加 error 图标，出现于视频加载错误达到上限后
--   修复 setting 多次初始化时产生的 bug
-
-## [4.4.1] - 2022-05-17
-
-### Added
-
--   添加 art.isInput 属性，当为 true 的时候不自动隐藏控制栏，如弹幕正在输入时
--   添加 art.isLock 属性，在移动端当为 true 的时候不能操作快进、开始和暂停
--   修复弹幕输入框的固定宽度 bug
--   设置面板支持 range 和 onRange 选项
--   添加 isAndroid 和 isIOS 工具函数
--   弹幕库添加 lockTime 选项，可自定义输入框的锁定时间
--   弹幕库添加 maxLength 选项，控制输入最大可输入字数
--   弹幕库添加 minWidth 选项，控制输入框最小宽度
--   弹幕库添加 maxWidth 选项，控制输入框最大宽度
--   弹幕库添加 mount 选项，控制输入框自定义挂载位置
--   弹幕库添加 beforeEmit 选项，控制弹幕发送前的校验
--   弹幕库添加 theme 选项，控制输入框自定义挂载的主题色
-
-## [4.4.0] - 2022-05-15
-
-### Added
-
--   设置面板支持 switch 和 onSwitch 选项
--   弹幕库插件添加设置面板和弹幕发送
--   弹幕库的选项添加默认模式和默认字号
--   弹幕库字号支持按播放器的百分百
--   修复翻转设置的图标缺失
--   默认播放器获取了焦点后，不会自动隐藏控制栏
--   删除字幕开关按钮，需要自行配置字幕开关

CLAUDE.md

@@ -0,0 +1,202 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Project Overview
+
+ArtPlayer.js is a modern, full-featured HTML5 video player. It's organized as a monorepo using Lerna with independent versioning.
+
+- **Homepage**: https://artplayer.org
+- **Online Editor**: https://artplayer.org (for testing examples)
+- **API Docs**: https://artplayer.org/document
+
+## Repository Structure
+
+```
+packages/
+  artplayer/              # Core player package
+  artplayer-plugin-*/     # 17+ plugins (danmuku, ads, chromecast, etc.)
+  artplayer-proxy-*/       # Canvas, Mediabunny proxies
+  artplayer-tool-*/       # iframe, thumbnail tools
+  artplayer-vitepress/    # Documentation site
+
+docs/                     # Documentation and demo site
+  assets/                  # Example assets and TypeScript demos
+  compiled/               # Built packages output
+  document/               # Generated API documentation
+  uncompiled/             # Development build output
+  test/                   # Browser test files
+
+scripts/                  # Build tooling
+  build.js                # Production build
+  dev.js                  # Development server
+  build-i18n.js           # I18n bundle builder
+  build-docs.js           # Documentation generator
+  build-llm.js            # LLMs.txt generator
+  plugin/create.js         # New plugin scaffolding
+```
+
+## Common Commands
+
+### Development
+```bash
+# Start dev server on port 8082 with hot reload
+npm run dev
+
+# Build for production (interactive prompt to select package)
+npm run build
+
+# Build all packages
+npm run build all
+
+# Build everything (packages, i18n, types, docs) + lint
+npm run build:all
+```
+
+### Code Quality
+```bash
+# Lint with auto-fix (covers packages, scripts, tests, docs assets)
+npm run lint
+```
+
+### Plugin Development
+```bash
+# Create new plugin from template
+npm run create:plugin <kebab-case-name>
+
+# Example:
+npm run create:plugin my-feature
+```
+
+### I18n
+```bash
+# Build i18n bundles for all languages
+npm run build:i18n
+```
+
+### TypeScript
+```bash
+# Generate TypeScript declaration files
+npm run build:ts
+```
+
+## Architecture
+
+### Core Player (`packages/artplayer`)
+
+The main `Artplayer` class extends `Emitter` and initializes sub-components:
+
+```javascript
+// Key components instantiated in constructor:
+this.template = new Template(this)    // DOM structure
+this.events = new Events(this)        // Event handling
+this.player = new Player(this)        // Video playback
+this.controls = new Control(this)     // Control bar
+this.layers = new Layer(this)         // Custom layers
+this.contextmenu = new Contextmenu(this)
+this.subtitle = new Subtitle(this)
+this.setting = new Setting(this)
+this.plugins = new Plugins(this)      // Plugin manager
+// ... and more
+```
+
+Source organization in `src/`:
+- `config/` - Default configuration values
+- `control/` - UI controls (play, progress, volume, etc.)
+- `events/` - Event handling (click, hover, resize, etc.)
+- `i18n/` - Localization files
+- `icons/` - SVG icons
+- `player/` - Video playback logic (hls, flv, dash, etc.)
+- `plugins/` - Built-in plugins
+- `setting/` - Settings panel components
+- `style/` - LESS stylesheets
+- `template.js` - HTML template generation
+- `utils/` - Utility functions
+
+### Plugin Architecture
+
+Plugins are functions that receive the player instance and options:
+
+```javascript
+// Template from scripts/plugin/template/src/index.js
+export default function artplayerPluginTemplate(option = {}) {
+  return (art) => {
+    // Plugin initialization
+    // Access: art.player, art.controls, art.template, etc.
+
+    return {
+      name: 'artplayerPluginTemplate',
+      // Expose methods to art.plugins['artplayerPluginTemplate']
+    }
+  }
+}
+```
+
+Plugin naming convention:
+- Package: `artplayer-plugin-<name>`
+- Global variable: `artplayerPlugin<Name>` (camelCase)
+- Exported function uses same name as global
+
+### Styling
+
+Uses LESS with inline imports:
+```javascript
+import style from './style/index.less?inline'
+```
+
+Styles are injected at runtime via `utils.setStyleText()`.
+
+### Build System
+
+Uses Vite via custom Node.js scripts:
+
+**Development** (`scripts/dev.js`):
+- Builds IIFE bundle to `docs/uncompiled/<package>/`
+- Serves `docs/` directory on port 8082
+- Watches source files for changes
+
+**Production** (`scripts/build.js`):
+- Builds 3 formats: UMD (`.js`), UMD legacy (`.legacy.js`), ESM (`.mjs`)
+- Outputs to `packages/<name>/dist/`
+- Copies to `docs/compiled/`
+
+### I18n System
+
+Language files in `packages/artplayer/src/i18n/`:
+- Base language: `zh-cn.js`
+- Additional languages: `en.js`, `fr.js`, etc.
+- Built as separate UMD/ESM bundles via `build-i18n.js`
+- Global naming: `artplayerI18n<Language>` (e.g., `artplayerI18nEn`)
+
+### Creating New Plugins
+
+The `npm run create:plugin <name>` command:
+1. Copies `scripts/plugin/template/` to `packages/artplayer-plugin-<name>/`
+2. Replaces placeholders in filenames and content
+3. Creates example file at `docs/assets/example/<name>.js`
+
+Plugin template structure:
+```
+src/
+  index.js       # Main plugin code
+  style.less     # Plugin styles
+package.json
+README.md
+types/
+  <name>.d.ts    # TypeScript declarations (optional)
+```
+
+### Utility Functions
+
+Core utilities in `packages/artplayer/src/utils/`:
+- `utils.js` - Common helpers (isMobile, isSafari, query, etc.)
+- `emitter.js` - Event emitter base class
+- `scheme.js` - Option validation schema
+
+## Development Notes
+
+- **Package manager**: Uses Yarn with Lerna
+- **Node version**: >= 20.0.0
+- **ESLint**: Uses @antfu/eslint-config
+- **Browser support**: Last 1 Chrome version (ES2020), legacy builds target ES2015
+- **UMD builds**: Always expose global even in AMD/RequireJS environments

CONTRIBUTING.md

@@ -1,4 +1,4 @@
-This project uses `parcel` as a development and packaging tool, so there are few overall configuration options
+This project uses `vite` as a development and packaging tool, so there are few overall configuration options
 
 ## 1. Install dependencies
 

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2018 Harvey Zack
+Copyright (c) 2018 Harvey Zhao
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -8,10 +8,13 @@
 </p>
 
 <p align="center">
-  <img src="https://img.shields.io/bundlephobia/minzip/artplayer" alt="Size">
+  <a href="https://www.npmjs.com/package/artplayer">
-  <img src="https://img.shields.io/npm/dm/artplayer.svg?sanitize=true" alt="Downloads">
+    <img src="https://img.shields.io/bundlephobia/minzip/artplayer" alt="Size">
-  <img src="https://img.shields.io/npm/v/artplayer.svg?sanitize=true" alt="Version">
+    <img src="https://img.shields.io/npm/dm/artplayer.svg?sanitize=true" alt="Downloads">
-  <img src="https://img.shields.io/npm/l/artplayer.svg?sanitize=true" alt="License">
+    <img src="https://img.shields.io/npm/v/artplayer.svg?sanitize=true" alt="Version">
+    <img src="https://img.shields.io/npm/l/artplayer.svg?sanitize=true" alt="License">
+    <img src="https://data.jsdelivr.com/v1/package/npm/artplayer/badge?style=rounded" alt="jsdelivr">
+  </a>
 </p>
 
 <p align="center">
@@ -20,15 +23,17 @@
   <span>・</span>
   <a href="https://artplayer.org/document">API Document</a>
   <span>・</span>
-  <a href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&example=danmuku">弹幕演示</a>
+  <a href="https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&example=danmuku">Danmuku</a>
   <span>・</span>
-  <a href="./CHANGELOG_CN.md">更新记录</a>
+  <a href="./CHANGELOG.md">Changelog</a>
+  <span>・</span>
+  <a href="https://artplayer.org/llms.txt">🤖LLMs</a>
   <span>・</span>
 </p>
 
 <p align="center">
     <a href="https://artplayer.org">
-        <img src="./images/screenshot.png" alt="screenshot">
+        <img src="./images/screenshot.png" alt="screenshot" width="720">
     </a>
 </p>
 
@@ -58,8 +63,20 @@ Or install with `yarn`:
 $ yarn add artplayer
 ```
 
+Or install with `pnpm`:
+
+```bash
+$ pnpm add artplayer
+```
+
+Or install with `bun`:
+
+```bash
+$ bun add artplayer
+```
+
 ```js
-import Artplayer from 'artplayer';
+import Artplayer from 'artplayer'
 ```
 
 Or umd build also available:
@@ -87,37 +104,53 @@ Will expose the global variable to `window.Artplayer`.
 ```
 
 ```js
-var art = new Artplayer({
+let art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: 'path/to/video.mp4',
+  url: 'path/to/video.mp4',
-});
+})
 ```
 
 ## Plugins
 
--   [artplayer-plugin-danmuku](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&example=danmuku)
+| Name | Describe | State |
--   [artplayer-plugin-ads](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads)
+| :--- | :--- | :--- |
--   [artplayer-plugin-iframe](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe)
+| [artplayer-plugin-danmuku](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js&example=danmuku) | Danmuku (bullet comment) system | <img src="https://img.shields.io/npm/v/artplayer-plugin-danmuku.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-danmuku.svg?sanitize=true"> |
--   [artplayer-plugin-hls-quality](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/8.0.0-beta.3/hls.min.js%0A./uncompiled/artplayer-plugin-hls-quality/index.js&example=hls.quality)
+| [artplayer-plugin-hls-control](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) | HLS quality control | <img src="https://img.shields.io/npm/v/artplayer-plugin-hls-control.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-hls-control.svg?sanitize=true"> |
--   [artplayer-plugin-dash-quality](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-quality/index.js&example=dash.quality)
+| [artplayer-plugin-dash-control](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/5.2.1/modern/umd/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control) | DASH quality control | <img src="https://img.shields.io/npm/v/artplayer-plugin-dash-control.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-dash-control.svg?sanitize=true"> |
--   [artplayer-plugin-vtt-thumbnail](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail)
+| [artplayer-plugin-vtt-thumbnail](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail) | VTT thumbnail preview | <img src="https://img.shields.io/npm/v/artplayer-plugin-vtt-thumbnail.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-vtt-thumbnail.svg?sanitize=true"> |
--   [artplayer-plugin-multiple-subtitles](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles)
+| [artplayer-plugin-multiple-subtitles](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles) | Multiple subtitles support | <img src="https://img.shields.io/npm/v/artplayer-plugin-multiple-subtitles.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-multiple-subtitles.svg?sanitize=true"> |
--   [artplayer-plugin-libass](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-libass/index.js&example=libass)
+| [artplayer-plugin-chromecast](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast) | Google Chromecast support | <img src="https://img.shields.io/npm/v/artplayer-plugin-chromecast.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-chromecast.svg?sanitize=true"> |
--   [artplayer-plugin-chromecast](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast)
+| [artplayer-plugin-vast](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast) | VAST/VPAID advertising | <img src="https://img.shields.io/npm/v/artplayer-plugin-vast.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-vast.svg?sanitize=true"> |
--   [artplayer-plugin-vast](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast)
+| [artplayer-plugin-chapter](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter) | Video chapters support | <img src="https://img.shields.io/npm/v/artplayer-plugin-chapter.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-chapter.svg?sanitize=true"> |
--   [artplayer-plugin-chapter](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter)
+| [artplayer-plugin-auto-thumbnail](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-auto-thumbnail/index.js&example=auto.thumbnail) | Auto-generated thumbnails | <img src="https://img.shields.io/npm/v/artplayer-plugin-auto-thumbnail.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-auto-thumbnail.svg?sanitize=true"> |
+| [artplayer-plugin-ambilight](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight) | Ambilight effect | <img src="https://img.shields.io/npm/v/artplayer-plugin-ambilight.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-ambilight.svg?sanitize=true"> |
+| [artplayer-plugin-document-pip](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pip) | Document Picture-in-Picture | <img src="https://img.shields.io/npm/v/artplayer-plugin-document-pip.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-document-pip.svg?sanitize=true"> |
+| [artplayer-plugin-audio-track](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-audio-track/index.js&example=audio.track) | Independent audio track playback | <img src="https://img.shields.io/npm/v/artplayer-plugin-audio-track.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-audio-track.svg?sanitize=true"> |
+| [artplayer-plugin-jassub](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-jassub/index.js&example=jassub) | ASS/SSA subtitle support | <img src="https://img.shields.io/npm/v/artplayer-plugin-jassub.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-jassub.svg?sanitize=true"> |
+| [artplayer-plugin-danmuku-mask](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-danmuku/index.js%0A./uncompiled/artplayer-plugin-danmuku-mask/index.js&example=danmuku.mask) | Danmuku masking (smart blocking) | <img src="https://img.shields.io/npm/v/artplayer-plugin-danmuku-mask.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-danmuku-mask.svg?sanitize=true"> |
+| [artplayer-plugin-asr](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-asr/index.js&example=asr) | Automatic Speech Recognition | <img src="https://img.shields.io/npm/v/artplayer-plugin-asr.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-plugin-asr.svg?sanitize=true"> |
+| [artplayer-plugin-ads](https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads) | Video advertising plugin | WIP |
 
-## Library
+## Libraries
 
--   [hls.js](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/8.0.0-beta.3/hls.min.js&example=hls)
+| Name | Describe | State |
--   [dash.js](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash)
+| :--- | :--- | :--- |
--   [flv.js](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv)
+| [hls.js](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls) | HLS client | <img src="https://img.shields.io/npm/v/hls.js.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/hls.js.svg?sanitize=true"> |
--   [mpegts.js](https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts)
+| [dash.js](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/5.2.1/modern/umd/dash.all.min.js&example=dash) | MPEG DASH player | <img src="https://img.shields.io/npm/v/dashjs.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/dashjs.svg?sanitize=true"> |
--   [webtorrent.js](https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent)
+| [flv.js](https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv) | HTML5 FLV Player | <img src="https://img.shields.io/npm/v/flv.js.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/flv.js.svg?sanitize=true"> |
+| [mpegts.js](https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts) | MPEG-TS/FLV Player | <img src="https://img.shields.io/npm/v/mpegts.js.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/mpegts.js.svg?sanitize=true"> |
+| [webtorrent.js](https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent) | Streaming torrent client | <img src="https://img.shields.io/npm/v/webtorrent.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/webtorrent.svg?sanitize=true"> |
+
+## Proxys
+
+| Name | Describe | State |
+| :--- | :--- | :--- |
+| [Canvas](https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas) | Proxy video to canvas | <img src="https://img.shields.io/npm/v/artplayer-proxy-canvas.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-proxy-canvas.svg?sanitize=true"> |
+| [Mediabunny](https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunny) | Mediabunny proxy | <img src="https://img.shields.io/npm/v/artplayer-proxy-mediabunny.svg?sanitize=true"><br><img src="https://img.shields.io/npm/dm/artplayer-proxy-mediabunny.svg?sanitize=true"> |
 
 ## Changelog
 
-[CHANGELOG_CN.md](./CHANGELOG_CN.md)
+[CHANGELOG.md](./CHANGELOG.md)
 
 ## Contributing
 
@@ -129,8 +162,8 @@ We accept donations through these channels:
 
 ![pay](./images/pay.png)
 
--   [Patreon](https://www.patreon.com/artplayer)
+- [Patreon](https://www.patreon.com/artplayer)
--   [Paypal](https://www.paypal.me/harveyzack)
+- [Paypal](https://www.paypal.me/harveyzack)
 
 ## QQ Group
 
@@ -138,4 +171,4 @@ We accept donations through these channels:
 
 ## License
 
-MIT © Harvey Zack
+MIT © Harvey Zhao

docs/CNAME

@@ -1 +1 @@
-artplayer.org
+github.artplayer.org

docs/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,420 @@
+# Verified site component notices
+
+Frozen source identities and complete upstream notice texts for selected site components and font references. Unresolved font/media and embedded provenance gates remain open; this inventory is not publication clearance.
+
+Generated by yarn build:site-notices. Runtime asset URLs are retained; reviewed local patches are identified below.
+
+## vconsole 3.15.0
+
+Source: https://registry.npmjs.org/vconsole/-/vconsole-3.15.0.tgz
+
+The original 3.15.0 LICENSE is preserved unchanged; its missing MIT body is supplemented separately using the MIT text explicitly referenced by upstream. Exact reconstruction from the pinned source and lockfile establishes eight bundled package dependencies and webpack bootstrap; their complete notices and attribution are distributed below. ArtPlayer retains its reproducible lifecycle patch and the original script URL/UMD/CSS contracts.
+
+Included component: @babel/runtime 7.17.9
+
+Source: https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.9.tgz
+
+Included component: core-js 3.21.1
+
+Source: https://registry.npmjs.org/core-js/-/core-js-3.21.1.tgz
+
+Included component: copy-text-to-clipboard 3.0.1
+
+Source: https://registry.npmjs.org/copy-text-to-clipboard/-/copy-text-to-clipboard-3.0.1.tgz
+
+Included component: mutation-observer 1.0.3
+
+Source: https://registry.npmjs.org/mutation-observer/-/mutation-observer-1.0.3.tgz
+
+Included component: svelte 3.47.0
+
+Source: https://registry.npmjs.org/svelte/-/svelte-3.47.0.tgz
+
+Included component: regenerator-runtime 0.13.9
+
+Source: https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz
+
+Included component: style-loader 3.3.1
+
+Source: https://registry.npmjs.org/style-loader/-/style-loader-3.3.1.tgz
+
+Included component: css-loader 6.7.1
+
+Source: https://registry.npmjs.org/css-loader/-/css-loader-6.7.1.tgz
+
+Included component: webpack 5.72.0
+
+Source: https://registry.npmjs.org/webpack/-/webpack-5.72.0.tgz
+
+- licenses/vconsole/LICENSE
+- licenses/vconsole/babel-runtime/LICENSE
+- licenses/vconsole/core-js/LICENSE
+- licenses/vconsole/copy-text-to-clipboard/LICENSE
+- licenses/vconsole/mutation-observer/LICENSE
+- licenses/vconsole/svelte/LICENSE
+- licenses/vconsole/regenerator-runtime/LICENSE
+- licenses/vconsole/style-loader/LICENSE
+- licenses/vconsole/css-loader/LICENSE
+- licenses/vconsole/webpack/LICENSE
+- licenses/vconsole/MIT-LICENSE
+- licenses/vconsole/ATTRIBUTION.md
+
+## monaco-editor 0.30.1
+
+Source: https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.30.1.tgz
+
+The complete upstream Monaco LICENSE/ThirdPartyNotices are retained. The unmodified bundled Codicons font exactly matches @vscode/codicons 0.0.26; its historical README, CC BY 4.0 content license, MIT code license and added attribution are distributed below. Other site assets remain subject to their separate provenance reviews.
+
+Included component: @vscode/codicons 0.0.26
+
+Source: https://registry.npmjs.org/@vscode/codicons/-/codicons-0.0.26.tgz
+
+Included component: typescript (Monaco worker) 4.4.4
+
+Source: https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz
+
+Included component: jsonc-parser 3.0.0
+
+Source: https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.0.0.tgz
+
+Included component: vscode-css-languageservice 5.1.8
+
+Source: https://registry.npmjs.org/vscode-css-languageservice/-/vscode-css-languageservice-5.1.8.tgz
+
+Included component: vscode-html-languageservice 4.1.1
+
+Source: https://registry.npmjs.org/vscode-html-languageservice/-/vscode-html-languageservice-4.1.1.tgz
+
+Included component: vscode-json-languageservice 4.1.9
+
+Source: https://registry.npmjs.org/vscode-json-languageservice/-/vscode-json-languageservice-4.1.9.tgz
+
+Included component: vscode-languageserver-textdocument 1.0.2
+
+Source: https://registry.npmjs.org/vscode-languageserver-textdocument/-/vscode-languageserver-textdocument-1.0.2.tgz
+
+Included component: vscode-languageserver-types 3.16.0
+
+Source: https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.16.0.tgz
+
+Included component: vscode-uri 3.0.2
+
+Source: https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.0.2.tgz
+
+Included component: js-beautify (Monaco HTML embedded) embedded sources in vscode-html-languageservice 4.1.1
+
+Source: https://registry.npmjs.org/vscode-html-languageservice/-/vscode-html-languageservice-4.1.1.tgz
+
+Included component: glob-to-regexp (Monaco JSON fork) embedded source in vscode-json-languageservice 4.1.9
+
+Source: https://registry.npmjs.org/vscode-json-languageservice/-/vscode-json-languageservice-4.1.9.tgz
+
+Included component: dompurify (Monaco core) 2.3.1
+
+Source: https://registry.npmjs.org/dompurify/-/dompurify-2.3.1.tgz
+
+Included component: marked (Monaco core) 3.0.2
+
+Source: https://registry.npmjs.org/marked/-/marked-3.0.2.tgz
+
+Included component: nodejs path (Monaco core) 14.16.0
+
+Source: https://github.com/nodejs/node/blob/bd60e93357a118204ea238d94e7a9e4209d93062/lib/path.js
+
+Included component: WinJS-derived DOM helpers (Monaco core) unversioned adaptation; reference WinJS 4.4.5
+
+Source: https://github.com/winjs/winjs/tree/4329b1133b243d9ded3b5a1f98d096ee8e80e889
+
+Included component: Unicode data (Monaco core) mixed historical inputs: 10.0.0d5, 13.0 drafts, Emoji 13.1
+
+Source: https://github.com/alexdima/unicode-utils
+
+- licenses/monaco-editor/LICENSE
+- licenses/monaco-editor/ThirdPartyNotices.txt
+- licenses/monaco-editor/codicons/LICENSE
+- licenses/monaco-editor/codicons/LICENSE-CODE
+- licenses/monaco-editor/codicons/README.md
+- licenses/monaco-editor/codicons/ATTRIBUTION.md
+- licenses/monaco-editor/typescript/LICENSE.txt
+- licenses/monaco-editor/typescript/CopyrightNotice.txt
+- licenses/monaco-editor/typescript/ThirdPartyNoticeText.txt
+- licenses/monaco-editor/typescript/ATTRIBUTION.md
+- licenses/monaco-editor/language-services/jsonc-parser/LICENSE.md
+- licenses/monaco-editor/language-services/vscode-css-languageservice/LICENSE.md
+- licenses/monaco-editor/language-services/vscode-html-languageservice/LICENSE.md
+- licenses/monaco-editor/language-services/vscode-html-languageservice/thirdpartynotices.txt
+- licenses/monaco-editor/language-services/vscode-json-languageservice/LICENSE.md
+- licenses/monaco-editor/language-services/vscode-languageserver-textdocument/License.txt
+- licenses/monaco-editor/language-services/vscode-languageserver-textdocument/thirdpartynotices.txt
+- licenses/monaco-editor/language-services/vscode-languageserver-types/License.txt
+- licenses/monaco-editor/language-services/vscode-uri/LICENSE.md
+- licenses/monaco-editor/language-services/beautify-css-NOTICE.txt
+- licenses/monaco-editor/language-services/beautify-html-NOTICE.txt
+- licenses/monaco-editor/language-services/ATTRIBUTION.md
+- licenses/monaco-editor/core-origins/DOMPurify-LICENSE
+- licenses/monaco-editor/core-origins/marked-LICENSE
+- licenses/monaco-editor/core-origins/marked-vscode-license.txt
+- licenses/monaco-editor/core-origins/ATTRIBUTION.md
+- licenses/monaco-editor/core-path/ATTRIBUTION.md
+- licenses/monaco-editor/core-dom/LICENSE.txt
+- licenses/monaco-editor/core-dom/ATTRIBUTION.md
+- licenses/monaco-editor/core-unicode/LICENSE.txt
+- licenses/monaco-editor/core-unicode/ATTRIBUTION.md
+
+## console legacy-vendor-with-TS-adapter
+
+Source: https://github.com/zhw2590582/ArtPlayer/blob/5d6b2f22bc75213ac97cff0bcffa4a1ce2bc786c/docs/assets/js/console.js
+
+The 100 third-party Parcel modules and loader have exact source reproduction. The two owned adapter modules are built from TypeScript. Preserved notices also cover two embedded license headers, all 17 react-inspector external source-map members, and all seven HTML tokenizer sources from its fixed Git dependency. The identified embedded-source and attribution review is complete for this frozen vendor boundary. Source records bind each component to its original notices; this inventory is not publication clearance. The original full lockfile and historical online Closure service are not recovered. Modified replicator and Emotion/Stylis copies retain upstream author licenses; the original Emotion online Closure stage is not claimed to be reproducible. MurmurHash credits include Gary Court and Austin Appleby. The customStringify snippet matches Stack Overflow answer revision 5 under CC BY-SA 4.0; its separate attribution, source and full license are supplied. This is a mixed-license bundle, not MIT-only.
+
+Included component: console-feed 3.2.2
+
+Source: https://registry.npmjs.org/console-feed/-/console-feed-3.2.2.tgz
+
+Included component: react 17.0.2
+
+Source: https://registry.npmjs.org/react/-/react-17.0.2.tgz
+
+Included component: react-dom 17.0.2
+
+Source: https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz
+
+Included component: scheduler 0.20.2
+
+Source: https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz
+
+Included component: object-assign 4.1.1
+
+Source: https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz
+
+Included component: react-is 16.13.1
+
+Source: https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz
+
+Included component: prop-types 15.7.2
+
+Source: https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz
+
+Included component: shallowequal 1.1.0
+
+Source: https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz
+
+Included component: process 0.11.10
+
+Source: https://registry.npmjs.org/process/-/process-0.11.10.tgz
+
+Included component: hoist-non-react-statics 3.3.2
+
+Source: https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz
+
+Included component: is-dom 1.1.0
+
+Source: https://registry.npmjs.org/is-dom/-/is-dom-1.1.0.tgz
+
+Included component: is-object 1.0.2
+
+Source: https://registry.npmjs.org/is-object/-/is-object-1.0.2.tgz
+
+Included component: is-window 1.0.2
+
+Source: https://registry.npmjs.org/is-window/-/is-window-1.0.2.tgz
+
+Included component: linkifyjs 2.1.9
+
+Source: https://registry.npmjs.org/linkifyjs/-/linkifyjs-2.1.9.tgz
+
+Included component: @emotion/core 10.3.0
+
+Source: https://registry.npmjs.org/@emotion/core/-/core-10.3.0.tgz
+
+Included component: @emotion/css 10.0.27
+
+Source: https://registry.npmjs.org/@emotion/css/-/css-10.0.27.tgz
+
+Included component: @emotion/cache 10.0.29
+
+Source: https://registry.npmjs.org/@emotion/cache/-/cache-10.0.29.tgz
+
+Included component: @emotion/styled 10.0.27
+
+Source: https://registry.npmjs.org/@emotion/styled/-/styled-10.0.27.tgz
+
+Included component: @emotion/styled-base 10.3.0
+
+Source: https://registry.npmjs.org/@emotion/styled-base/-/styled-base-10.3.0.tgz
+
+Included component: emotion-theming 10.3.0
+
+Source: https://registry.npmjs.org/emotion-theming/-/emotion-theming-10.3.0.tgz
+
+Included component: styled-components 5.3.3
+
+Source: https://registry.npmjs.org/styled-components/-/styled-components-5.3.3.tgz
+
+Included component: @babel/runtime 7.16.3
+
+Source: https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.3.tgz
+
+Included component: @emotion/sheet 0.9.4
+
+Source: https://registry.npmjs.org/@emotion/sheet/-/sheet-0.9.4.tgz
+
+Included component: @emotion/stylis 0.8.5
+
+Source: https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz
+
+Included component: @emotion/weak-memoize 0.2.5
+
+Source: https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz
+
+Included component: @emotion/utils 0.11.3
+
+Source: https://registry.npmjs.org/@emotion/utils/-/utils-0.11.3.tgz
+
+Included component: @emotion/hash 0.8.0
+
+Source: https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz
+
+Included component: @emotion/unitless 0.7.5
+
+Source: https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz
+
+Included component: @emotion/memoize 0.7.4
+
+Source: https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz
+
+Included component: @emotion/serialize 0.11.16
+
+Source: https://registry.npmjs.org/@emotion/serialize/-/serialize-0.11.16.tgz
+
+Included component: @emotion/is-prop-valid 0.8.8
+
+Source: https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz
+
+Included component: react-inspector 5.1.1
+
+Source: https://registry.npmjs.org/react-inspector/-/react-inspector-5.1.1.tgz
+
+Included component: parcel-bundler 1.12.5
+
+Source: https://registry.npmjs.org/parcel-bundler/-/parcel-bundler-1.12.5.tgz
+
+Included component: chromium-string-utils embedded in console-feed-3.2.2
+
+Source: https://registry.npmjs.org/console-feed/-/console-feed-3.2.2.tgz
+
+Included component: stylis-rule-sheet embedded in styled-components-5.3.3
+
+Source: https://registry.npmjs.org/styled-components/-/styled-components-5.3.3.tgz
+
+Included component: @babel/runtime (react-inspector embedded) 7.13.10
+
+Source: https://registry.npmjs.org/@babel/runtime/-/runtime-7.13.10.tgz
+
+Included component: regenerator-runtime 0.13.7
+
+Source: https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz
+
+Included component: simple-html-tokenizer git-04799f4638ec5ed903a4e5aa6e832269fa59be6b
+
+Source: https://api.github.com/repos/nfrasser/simple-html-tokenizer/tarball/04799f4638ec5ed903a4e5aa6e832269fa59be6b
+
+Included component: replicator (console-feed fork) modified; upstream 1.0.x license
+
+Source: https://registry.npmjs.org/replicator/-/replicator-1.0.1.tgz
+
+Included component: stylis (Emotion fork) 3.5.4-derived
+
+Source: https://registry.npmjs.org/stylis/-/stylis-3.5.4.tgz
+
+Included component: murmurhash-js (Gary Court) license commit 23dc2e7
+
+Source: https://github.com/garycourt/murmurhash-js/blob/23dc2e7008582ca3ef69d8623f02bba4c8dd05e5/README.md
+
+Included component: murmurhash2 (Austin Appleby) 61a0530
+
+Source: https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp
+
+Included component: stackoverflow-custom-stringify answer 48254637 revision 5 (CC BY-SA 4.0)
+
+Source: https://api.stackexchange.com/2.3/revisions/8FD5F52A-B16F-4C66-AB48-830EABB36CC0?site=stackoverflow&filter=withbody
+
+Included component: react-pure-render (shallowequal origin) source commit 729cdbd
+
+Source: https://github.com/gaearon/react-pure-render/blob/729cdbd51df00068816376544738cc1fc4720cf2/LICENSE
+
+- licenses/console/console-feed/console-feed-3.2.2-LICENSE
+- licenses/console/react/react-17.0.2-LICENSE
+- licenses/console/react-dom/react-dom-17.0.2-LICENSE
+- licenses/console/scheduler/scheduler-0.20.2-LICENSE
+- licenses/console/object-assign/object-assign-4.1.1-license
+- licenses/console/react-is/react-is-16.13.1-LICENSE
+- licenses/console/prop-types/prop-types-15.7.2-LICENSE
+- licenses/console/shallowequal/shallowequal-1.1.0-LICENSE
+- licenses/console/process/process-0.11.10-LICENSE
+- licenses/console/hoist-non-react-statics/hoist-non-react-statics-3.3.2-LICENSE.md
+- licenses/console/is-dom/is-dom-1.1.0-LICENSE
+- licenses/console/is-object/is-object-1.0.2-LICENSE
+- licenses/console/is-window/is-window-1.0.2-LICENSE
+- licenses/console/linkifyjs/linkifyjs-2.1.9-LICENSE
+- licenses/console/emotion-core/emotion-core-10.3.0-LICENSE
+- licenses/console/emotion-css/emotion-css-10.0.27-LICENSE
+- licenses/console/emotion-cache/emotion-cache-10.0.29-LICENSE
+- licenses/console/emotion-styled/emotion-styled-10.0.27-LICENSE
+- licenses/console/emotion-styled-base/emotion-styled-base-10.3.0-LICENSE
+- licenses/console/emotion-theming/emotion-theming-10.3.0-LICENSE
+- licenses/console/styled-components/styled-components-5.3.3-UPSTREAM-LICENSE
+- licenses/console/babel-runtime/babel-runtime-7.16.3-LICENSE
+- licenses/console/emotion-sheet/emotion-sheet-0.9.4-LICENSE
+- licenses/console/emotion-stylis/emotion-stylis-0.8.5-LICENSE
+- licenses/console/emotion-weak-memoize/emotion-weak-memoize-0.2.5-LICENSE
+- licenses/console/emotion-utils/emotion-utils-0.11.3-LICENSE
+- licenses/console/emotion-hash/emotion-hash-0.8.0-LICENSE
+- licenses/console/emotion-unitless/emotion-unitless-0.7.5-LICENSE
+- licenses/console/emotion-memoize/emotion-memoize-0.7.4-LICENSE
+- licenses/console/emotion-serialize/emotion-serialize-0.11.16-LICENSE
+- licenses/console/emotion-is-prop-valid/emotion-is-prop-valid-0.8.8-LICENSE
+- licenses/console/react-inspector/react-inspector-5.1.1-LICENSE
+- licenses/console/parcel-bundler/parcel-bundler-1.12.5-LICENSE
+- licenses/console/chromium-string-utils/LICENSE
+- licenses/console/stylis-rule-sheet/LICENSE
+- licenses/console/react-inspector-babel/LICENSE
+- licenses/console/regenerator-runtime/LICENSE
+- licenses/console/simple-html-tokenizer/LICENSE
+- licenses/console/replicator/LICENSE
+- licenses/console/stylis/LICENSE
+- licenses/console/murmurhash-js/README.md
+- licenses/console/murmurhash2/PUBLIC-DOMAIN.txt
+- licenses/console/stackoverflow/LICENSE
+- licenses/console/stackoverflow/SOURCE.js
+- licenses/console/stackoverflow/ATTRIBUTION.md
+- licenses/console/react-pure-render/LICENSE
+- licenses/console/react-pure-render/ATTRIBUTION.md
+
+## jassub-fonts selected historical references
+
+Source: https://github.com/ThaUnknown/jassub/tree/25d1ea7ca1f827dbed2c8ea539c9bc917ccbfab1
+
+Four selected font families only. CHAWP matches author bytes; other full notice references have explicit font-table differences. Other fonts and complete redistribution provenance remain open under SITE-07/VENDOR-05.
+
+Included component: Liberation Sans 2.00.5 reference
+
+Source: https://github.com/liberationfonts/liberation-fonts/files/2926169/liberation-fonts-ttf-2.00.5.tar.gz
+
+Included component: Averia Sans Libre Light 1.002 reference
+
+Source: https://github.com/google/fonts/blob/0f81bc90462b862dbfe3d16403ff284a68473833/ofl/averiasanslibre/AveriaSansLibre-Light.ttf
+
+Included component: Lato Regular 2.015 reference
+
+Source: https://github.com/google/fonts/blob/f3b885d5590e307e02542f1a724cec55d567fdaa/ofl/lato/Lato-Regular.ttf
+
+Included component: CHAWP 1.000 exact bytes
+
+Source: https://github.com/awp/chawp/blob/3c4f6317bebd6783c8d0db3bc9206aa62d602f90/chawp.otf
+
+- licenses/jassub-fonts/liberation/OFL.txt
+- licenses/jassub-fonts/averia-sans/OFL.txt
+- licenses/jassub-fonts/lato/OFL.txt
+- licenses/jassub-fonts/chawp/OFL.txt
+- licenses/jassub-fonts/ATTRIBUTION.md

docs/ads.txt

@@ -0,0 +1 @@
+google.com, pub-8579453810848662, DIRECT, f08c47fec0942fa0

docs/assets/@mediapipe/selfie_segmentation/README.md

@@ -0,0 +1,10 @@
+# MediaPipe JavaScript Solutions
+
+MediaPipe offers out of the box solutions to use our ML technology with live and streaming media.
+
+Visit us as [mediapipe.dev]()
+
+See live demos of our JavaScript solutions at [code.mediapipe.dev/codepen]()
+
+For more information on each of the solutions and how to use them, visit https://google.github.io/mediapipe/getting_started/javascript.
+

docs/assets/@mediapipe/selfie_segmentation/index.d.ts

@@ -0,0 +1,111 @@
+/**
+ * @fileoverview Declarations for the face tracking API.
+ */
+
+/**
+ * Version number of this package.
+ */
+export const VERSION: string;
+
+/**
+ * We support several ways to get image inputs.
+ */
+export type InputImage = HTMLVideoElement | HTMLImageElement | HTMLCanvasElement;
+
+/**
+ * Legal inputs.
+ */
+export interface InputMap {
+  image: InputImage;
+}
+
+/**
+ * GpuBuffers should all be compatible with Canvas' `drawImage`
+ */
+type GpuBuffer = HTMLCanvasElement | HTMLImageElement | ImageBitmap;
+
+/**
+ * Possible results from SelfieSegmentation.
+ */
+export interface Results {
+  image: GpuBuffer;
+  segmentationMask: GpuBuffer;
+}
+
+/**
+ * Configurable options for SelfieSegmentation.
+ */
+export interface Options {
+  selfieMode?: boolean;
+  modelSelection?: number;
+}
+
+/**
+ * Listener for any results from SelfieSegmentation.
+ */
+export type ResultsListener = (results: Results) => (Promise<void>|void);
+
+/**
+ * Contains all of the setup options to drive the face solution.
+ */
+export interface SelfieSegmentationConfig {
+  locateFile?: (path: string, prefix?: string) => string;
+}
+
+/**
+ * Declares the interface of SelfieSegmentation.
+ */
+declare interface SelfieSegmentationInterface {
+  close(): Promise<void>;
+  onResults(listener: ResultsListener): void;
+  initialize(): Promise<void>;
+  reset(): void;
+  send(inputs: InputMap): Promise<void>;
+  setOptions(options: Options): void;
+}
+
+/**
+ * Encapsulates the entire SelfieSegmentation solution. All that is needed from the
+ * developer is the source of the image data. The user will call `send`
+ * repeatedly and if a face is detected, then the user can receive callbacks
+ * with this metadata.
+ */
+export declare class SelfieSegmentation implements SelfieSegmentationInterface {
+  constructor(config?: SelfieSegmentationConfig);
+
+  /**
+   * Shuts down the object. Call before creating a new instance.
+   */
+  close(): Promise<void>;
+
+  /**
+   * Registers a single callback that will carry any results that occur
+   * after calling Send().
+   */
+  onResults(listener: ResultsListener): void;
+
+  /**
+   * Initializes the solution. This includes loading ML models and mediapipe
+   * configurations, as well as setting up potential listeners for metadata. If
+   * `initialize` is not called manually, then it will be called the first time
+   * the developer calls `send`.
+   */
+  initialize(): Promise<void>;
+
+  /**
+   * Tells the graph to restart before the next frame is sent.
+   */
+  reset(): void;
+
+  /**
+   * Processes a single frame of data, which depends on the options sent to the
+   * constructor.
+   */
+  send(inputs: InputMap): Promise<void>;
+
+  /**
+   * Adjusts options in the solution. This may trigger a graph reload the next
+   * time the graph tries to run.
+   */
+  setOptions(options: Options): void;
+}

docs/assets/@mediapipe/selfie_segmentation/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@mediapipe/selfie_segmentation",
+  "version": "0.1.1675465747",
+  "description": "Mediapipe Selfie Segmentation Solution",
+  "main": "selfie_segmentation.js",
+  "module": "selfie_segmentation.js",
+  "jsdelivr": "selfie_segmentation.js",
+  "unpkg": "selfie_segmentation.js",
+  "types": "index.d.ts",
+  "author": "mhays@google.com",
+  "license": "Apache-2.0",
+  "homepage": "https://google.github.io/mediapipe/solutions/selfie_segmentation",
+  "keywords": [ "AR", "ML", "Augmented" ],
+  "devDependencies": {
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "dependencies": {
+  },
+  "browser": {
+    "node-fetch": false,
+    "util": false,
+    "crypto": false
+  },
+  "sideEffects" : []
+}

docs/assets/@mediapipe/selfie_segmentation/selfie_segmentation.js

@@ -0,0 +1,93 @@
+(function(){/*
+
+ Copyright The Closure Library Authors.
+ SPDX-License-Identifier: Apache-2.0
+*/
+'use strict';var x;function aa(a){var b=0;return function(){return b<a.length?{done:!1,value:a[b++]}:{done:!0}}}var ba="function"==typeof Object.defineProperties?Object.defineProperty:function(a,b,c){if(a==Array.prototype||a==Object.prototype)return a;a[b]=c.value;return a};
+function ca(a){a=["object"==typeof globalThis&&globalThis,a,"object"==typeof window&&window,"object"==typeof self&&self,"object"==typeof global&&global];for(var b=0;b<a.length;++b){var c=a[b];if(c&&c.Math==Math)return c}throw Error("Cannot find global object");}var y=ca(this);function z(a,b){if(b)a:{var c=y;a=a.split(".");for(var d=0;d<a.length-1;d++){var e=a[d];if(!(e in c))break a;c=c[e]}a=a[a.length-1];d=c[a];b=b(d);b!=d&&null!=b&&ba(c,a,{configurable:!0,writable:!0,value:b})}}
+z("Symbol",function(a){function b(g){if(this instanceof b)throw new TypeError("Symbol is not a constructor");return new c(d+(g||"")+"_"+e++,g)}function c(g,f){this.h=g;ba(this,"description",{configurable:!0,writable:!0,value:f})}if(a)return a;c.prototype.toString=function(){return this.h};var d="jscomp_symbol_"+(1E9*Math.random()>>>0)+"_",e=0;return b});
+z("Symbol.iterator",function(a){if(a)return a;a=Symbol("Symbol.iterator");for(var b="Array Int8Array Uint8Array Uint8ClampedArray Int16Array Uint16Array Int32Array Uint32Array Float32Array Float64Array".split(" "),c=0;c<b.length;c++){var d=y[b[c]];"function"===typeof d&&"function"!=typeof d.prototype[a]&&ba(d.prototype,a,{configurable:!0,writable:!0,value:function(){return da(aa(this))}})}return a});function da(a){a={next:a};a[Symbol.iterator]=function(){return this};return a}
+function A(a){var b="undefined"!=typeof Symbol&&Symbol.iterator&&a[Symbol.iterator];return b?b.call(a):{next:aa(a)}}function ea(a){if(!(a instanceof Array)){a=A(a);for(var b,c=[];!(b=a.next()).done;)c.push(b.value);a=c}return a}var fa="function"==typeof Object.assign?Object.assign:function(a,b){for(var c=1;c<arguments.length;c++){var d=arguments[c];if(d)for(var e in d)Object.prototype.hasOwnProperty.call(d,e)&&(a[e]=d[e])}return a};z("Object.assign",function(a){return a||fa});
+var ha="function"==typeof Object.create?Object.create:function(a){function b(){}b.prototype=a;return new b},ia;if("function"==typeof Object.setPrototypeOf)ia=Object.setPrototypeOf;else{var ja;a:{var ka={a:!0},la={};try{la.__proto__=ka;ja=la.a;break a}catch(a){}ja=!1}ia=ja?function(a,b){a.__proto__=b;if(a.__proto__!==b)throw new TypeError(a+" is not extensible");return a}:null}var ma=ia;
+function na(a,b){a.prototype=ha(b.prototype);a.prototype.constructor=a;if(ma)ma(a,b);else for(var c in b)if("prototype"!=c)if(Object.defineProperties){var d=Object.getOwnPropertyDescriptor(b,c);d&&Object.defineProperty(a,c,d)}else a[c]=b[c];a.za=b.prototype}function oa(){this.m=!1;this.j=null;this.i=void 0;this.h=1;this.v=this.s=0;this.l=null}function pa(a){if(a.m)throw new TypeError("Generator is already running");a.m=!0}oa.prototype.u=function(a){this.i=a};
+function qa(a,b){a.l={ma:b,na:!0};a.h=a.s||a.v}oa.prototype.return=function(a){this.l={return:a};this.h=this.v};function D(a,b,c){a.h=c;return{value:b}}function ra(a){this.h=new oa;this.i=a}function sa(a,b){pa(a.h);var c=a.h.j;if(c)return ta(a,"return"in c?c["return"]:function(d){return{value:d,done:!0}},b,a.h.return);a.h.return(b);return ua(a)}
+function ta(a,b,c,d){try{var e=b.call(a.h.j,c);if(!(e instanceof Object))throw new TypeError("Iterator result "+e+" is not an object");if(!e.done)return a.h.m=!1,e;var g=e.value}catch(f){return a.h.j=null,qa(a.h,f),ua(a)}a.h.j=null;d.call(a.h,g);return ua(a)}function ua(a){for(;a.h.h;)try{var b=a.i(a.h);if(b)return a.h.m=!1,{value:b.value,done:!1}}catch(c){a.h.i=void 0,qa(a.h,c)}a.h.m=!1;if(a.h.l){b=a.h.l;a.h.l=null;if(b.na)throw b.ma;return{value:b.return,done:!0}}return{value:void 0,done:!0}}
+function va(a){this.next=function(b){pa(a.h);a.h.j?b=ta(a,a.h.j.next,b,a.h.u):(a.h.u(b),b=ua(a));return b};this.throw=function(b){pa(a.h);a.h.j?b=ta(a,a.h.j["throw"],b,a.h.u):(qa(a.h,b),b=ua(a));return b};this.return=function(b){return sa(a,b)};this[Symbol.iterator]=function(){return this}}function wa(a){function b(d){return a.next(d)}function c(d){return a.throw(d)}return new Promise(function(d,e){function g(f){f.done?d(f.value):Promise.resolve(f.value).then(b,c).then(g,e)}g(a.next())})}
+function E(a){return wa(new va(new ra(a)))}
+z("Promise",function(a){function b(f){this.i=0;this.j=void 0;this.h=[];this.u=!1;var h=this.l();try{f(h.resolve,h.reject)}catch(k){h.reject(k)}}function c(){this.h=null}function d(f){return f instanceof b?f:new b(function(h){h(f)})}if(a)return a;c.prototype.i=function(f){if(null==this.h){this.h=[];var h=this;this.j(function(){h.m()})}this.h.push(f)};var e=y.setTimeout;c.prototype.j=function(f){e(f,0)};c.prototype.m=function(){for(;this.h&&this.h.length;){var f=this.h;this.h=[];for(var h=0;h<f.length;++h){var k=
+f[h];f[h]=null;try{k()}catch(l){this.l(l)}}}this.h=null};c.prototype.l=function(f){this.j(function(){throw f;})};b.prototype.l=function(){function f(l){return function(m){k||(k=!0,l.call(h,m))}}var h=this,k=!1;return{resolve:f(this.I),reject:f(this.m)}};b.prototype.I=function(f){if(f===this)this.m(new TypeError("A Promise cannot resolve to itself"));else if(f instanceof b)this.L(f);else{a:switch(typeof f){case "object":var h=null!=f;break a;case "function":h=!0;break a;default:h=!1}h?this.F(f):this.s(f)}};
+b.prototype.F=function(f){var h=void 0;try{h=f.then}catch(k){this.m(k);return}"function"==typeof h?this.M(h,f):this.s(f)};b.prototype.m=function(f){this.v(2,f)};b.prototype.s=function(f){this.v(1,f)};b.prototype.v=function(f,h){if(0!=this.i)throw Error("Cannot settle("+f+", "+h+"): Promise already settled in state"+this.i);this.i=f;this.j=h;2===this.i&&this.K();this.H()};b.prototype.K=function(){var f=this;e(function(){if(f.D()){var h=y.console;"undefined"!==typeof h&&h.error(f.j)}},1)};b.prototype.D=
+function(){if(this.u)return!1;var f=y.CustomEvent,h=y.Event,k=y.dispatchEvent;if("undefined"===typeof k)return!0;"function"===typeof f?f=new f("unhandledrejection",{cancelable:!0}):"function"===typeof h?f=new h("unhandledrejection",{cancelable:!0}):(f=y.document.createEvent("CustomEvent"),f.initCustomEvent("unhandledrejection",!1,!0,f));f.promise=this;f.reason=this.j;return k(f)};b.prototype.H=function(){if(null!=this.h){for(var f=0;f<this.h.length;++f)g.i(this.h[f]);this.h=null}};var g=new c;b.prototype.L=
+function(f){var h=this.l();f.T(h.resolve,h.reject)};b.prototype.M=function(f,h){var k=this.l();try{f.call(h,k.resolve,k.reject)}catch(l){k.reject(l)}};b.prototype.then=function(f,h){function k(p,n){return"function"==typeof p?function(q){try{l(p(q))}catch(t){m(t)}}:n}var l,m,r=new b(function(p,n){l=p;m=n});this.T(k(f,l),k(h,m));return r};b.prototype.catch=function(f){return this.then(void 0,f)};b.prototype.T=function(f,h){function k(){switch(l.i){case 1:f(l.j);break;case 2:h(l.j);break;default:throw Error("Unexpected state: "+
+l.i);}}var l=this;null==this.h?g.i(k):this.h.push(k);this.u=!0};b.resolve=d;b.reject=function(f){return new b(function(h,k){k(f)})};b.race=function(f){return new b(function(h,k){for(var l=A(f),m=l.next();!m.done;m=l.next())d(m.value).T(h,k)})};b.all=function(f){var h=A(f),k=h.next();return k.done?d([]):new b(function(l,m){function r(q){return function(t){p[q]=t;n--;0==n&&l(p)}}var p=[],n=0;do p.push(void 0),n++,d(k.value).T(r(p.length-1),m),k=h.next();while(!k.done)})};return b});
+function xa(a,b){a instanceof String&&(a+="");var c=0,d=!1,e={next:function(){if(!d&&c<a.length){var g=c++;return{value:b(g,a[g]),done:!1}}d=!0;return{done:!0,value:void 0}}};e[Symbol.iterator]=function(){return e};return e}z("Array.prototype.keys",function(a){return a?a:function(){return xa(this,function(b){return b})}});
+z("Array.prototype.fill",function(a){return a?a:function(b,c,d){var e=this.length||0;0>c&&(c=Math.max(0,e+c));if(null==d||d>e)d=e;d=Number(d);0>d&&(d=Math.max(0,e+d));for(c=Number(c||0);c<d;c++)this[c]=b;return this}});function F(a){return a?a:Array.prototype.fill}z("Int8Array.prototype.fill",F);z("Uint8Array.prototype.fill",F);z("Uint8ClampedArray.prototype.fill",F);z("Int16Array.prototype.fill",F);z("Uint16Array.prototype.fill",F);z("Int32Array.prototype.fill",F);
+z("Uint32Array.prototype.fill",F);z("Float32Array.prototype.fill",F);z("Float64Array.prototype.fill",F);z("Object.is",function(a){return a?a:function(b,c){return b===c?0!==b||1/b===1/c:b!==b&&c!==c}});z("Array.prototype.includes",function(a){return a?a:function(b,c){var d=this;d instanceof String&&(d=String(d));var e=d.length;c=c||0;for(0>c&&(c=Math.max(c+e,0));c<e;c++){var g=d[c];if(g===b||Object.is(g,b))return!0}return!1}});
+z("String.prototype.includes",function(a){return a?a:function(b,c){if(null==this)throw new TypeError("The 'this' value for String.prototype.includes must not be null or undefined");if(b instanceof RegExp)throw new TypeError("First argument to String.prototype.includes must not be a regular expression");return-1!==this.indexOf(b,c||0)}});var ya=this||self;
+function Aa(a,b){a=a.split(".");var c=ya;a[0]in c||"undefined"==typeof c.execScript||c.execScript("var "+a[0]);for(var d;a.length&&(d=a.shift());)a.length||void 0===b?c[d]&&c[d]!==Object.prototype[d]?c=c[d]:c=c[d]={}:c[d]=b};function Ba(a){var b;a:{if(b=ya.navigator)if(b=b.userAgent)break a;b=""}return-1!=b.indexOf(a)};var Ca=Array.prototype.map?function(a,b){return Array.prototype.map.call(a,b,void 0)}:function(a,b){for(var c=a.length,d=Array(c),e="string"===typeof a?a.split(""):a,g=0;g<c;g++)g in e&&(d[g]=b.call(void 0,e[g],g,a));return d};var Da={},Ea=null;function Fa(a){var b=a.length,c=3*b/4;c%3?c=Math.floor(c):-1!="=.".indexOf(a[b-1])&&(c=-1!="=.".indexOf(a[b-2])?c-2:c-1);var d=new Uint8Array(c),e=0;Ga(a,function(g){d[e++]=g});return e!==c?d.subarray(0,e):d}
+function Ga(a,b){function c(k){for(;d<a.length;){var l=a.charAt(d++),m=Ea[l];if(null!=m)return m;if(!/^[\s\xa0]*$/.test(l))throw Error("Unknown base64 encoding at char: "+l);}return k}Ha();for(var d=0;;){var e=c(-1),g=c(0),f=c(64),h=c(64);if(64===h&&-1===e)break;b(e<<2|g>>4);64!=f&&(b(g<<4&240|f>>2),64!=h&&b(f<<6&192|h))}}
+function Ha(){if(!Ea){Ea={};for(var a="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789".split(""),b=["+/=","+/","-_=","-_.","-_"],c=0;5>c;c++){var d=a.concat(b[c].split(""));Da[c]=d;for(var e=0;e<d.length;e++){var g=d[e];void 0===Ea[g]&&(Ea[g]=e)}}}};var Ia="undefined"!==typeof Uint8Array,Ja=!(Ba("Trident")||Ba("MSIE"))&&"function"===typeof ya.btoa;
+function Ka(a){if(!Ja){var b;void 0===b&&(b=0);Ha();b=Da[b];for(var c=Array(Math.floor(a.length/3)),d=b[64]||"",e=0,g=0;e<a.length-2;e+=3){var f=a[e],h=a[e+1],k=a[e+2],l=b[f>>2];f=b[(f&3)<<4|h>>4];h=b[(h&15)<<2|k>>6];k=b[k&63];c[g++]=l+f+h+k}l=0;k=d;switch(a.length-e){case 2:l=a[e+1],k=b[(l&15)<<2]||d;case 1:a=a[e],c[g]=b[a>>2]+b[(a&3)<<4|l>>4]+k+d}return c.join("")}for(b="";10240<a.length;)b+=String.fromCharCode.apply(null,a.subarray(0,10240)),a=a.subarray(10240);b+=String.fromCharCode.apply(null,
+a);return btoa(b)}var La=RegExp("[-_.]","g");function Ma(a){switch(a){case "-":return"+";case "_":return"/";case ".":return"=";default:return""}}function Na(a){if(!Ja)return Fa(a);La.test(a)&&(a=a.replace(La,Ma));a=atob(a);for(var b=new Uint8Array(a.length),c=0;c<a.length;c++)b[c]=a.charCodeAt(c);return b}var Oa;function Pa(){return Oa||(Oa=new Uint8Array(0))}var Qa={};var Ra="function"===typeof Uint8Array.prototype.slice,G=0,H=0;function Sa(a){var b=0>a;a=Math.abs(a);var c=a>>>0;a=Math.floor((a-c)/4294967296);b&&(c=A(Ta(c,a)),b=c.next().value,a=c.next().value,c=b);G=c>>>0;H=a>>>0}var Ua="function"===typeof BigInt;function Ta(a,b){b=~b;a?a=~a+1:b+=1;return[a,b]};function Va(a,b){this.i=a>>>0;this.h=b>>>0}
+function Wa(a){if(!a)return Xa||(Xa=new Va(0,0));if(!/^-?\d+$/.test(a))return null;if(16>a.length)Sa(Number(a));else if(Ua)a=BigInt(a),G=Number(a&BigInt(4294967295))>>>0,H=Number(a>>BigInt(32)&BigInt(4294967295));else{var b=+("-"===a[0]);H=G=0;for(var c=a.length,d=b,e=(c-b)%6+b;e<=c;d=e,e+=6)d=Number(a.slice(d,e)),H*=1E6,G=1E6*G+d,4294967296<=G&&(H+=G/4294967296|0,G%=4294967296);b&&(b=A(Ta(G,H)),a=b.next().value,b=b.next().value,G=a,H=b)}return new Va(G,H)}var Xa;function Ya(a,b){return Error("Invalid wire type: "+a+" (at position "+b+")")}function Za(){return Error("Failed to read varint, encoding is invalid.")}function $a(a,b){return Error("Tried to read past the end of the data "+b+" > "+a)};function K(){throw Error("Invalid UTF8");}function ab(a,b){b=String.fromCharCode.apply(null,b);return null==a?b:a+b}var bb=void 0,cb,db="undefined"!==typeof TextDecoder,eb,fb="undefined"!==typeof TextEncoder;var gb;function hb(a){if(a!==Qa)throw Error("illegal external caller");}function ib(a,b){hb(b);this.V=a;if(null!=a&&0===a.length)throw Error("ByteString should be constructed with non-empty values");}function jb(){return gb||(gb=new ib(null,Qa))}function kb(a){hb(Qa);var b=a.V;b=null==b||Ia&&null!=b&&b instanceof Uint8Array?b:"string"===typeof b?Na(b):null;return null==b?b:a.V=b};function lb(a){if("string"===typeof a)return{buffer:Na(a),C:!1};if(Array.isArray(a))return{buffer:new Uint8Array(a),C:!1};if(a.constructor===Uint8Array)return{buffer:a,C:!1};if(a.constructor===ArrayBuffer)return{buffer:new Uint8Array(a),C:!1};if(a.constructor===ib)return{buffer:kb(a)||Pa(),C:!0};if(a instanceof Uint8Array)return{buffer:new Uint8Array(a.buffer,a.byteOffset,a.byteLength),C:!1};throw Error("Type not convertible to a Uint8Array, expected a Uint8Array, an ArrayBuffer, a base64 encoded string, a ByteString or an Array of numbers");
+};function mb(a,b){this.i=null;this.m=!1;this.h=this.j=this.l=0;nb(this,a,b)}function nb(a,b,c){c=void 0===c?{}:c;a.S=void 0===c.S?!1:c.S;b&&(b=lb(b),a.i=b.buffer,a.m=b.C,a.l=0,a.j=a.i.length,a.h=a.l)}mb.prototype.reset=function(){this.h=this.l};function L(a,b){a.h=b;if(b>a.j)throw $a(a.j,b);}
+function ob(a){var b=a.i,c=a.h,d=b[c++],e=d&127;if(d&128&&(d=b[c++],e|=(d&127)<<7,d&128&&(d=b[c++],e|=(d&127)<<14,d&128&&(d=b[c++],e|=(d&127)<<21,d&128&&(d=b[c++],e|=d<<28,d&128&&b[c++]&128&&b[c++]&128&&b[c++]&128&&b[c++]&128&&b[c++]&128)))))throw Za();L(a,c);return e}function pb(a,b){if(0>b)throw Error("Tried to read a negative byte length: "+b);var c=a.h,d=c+b;if(d>a.j)throw $a(b,a.j-c);a.h=d;return c}var qb=[];function rb(){this.h=[]}rb.prototype.length=function(){return this.h.length};rb.prototype.end=function(){var a=this.h;this.h=[];return a};function sb(a,b,c){for(;0<c||127<b;)a.h.push(b&127|128),b=(b>>>7|c<<25)>>>0,c>>>=7;a.h.push(b)}function M(a,b){for(;127<b;)a.h.push(b&127|128),b>>>=7;a.h.push(b)};function tb(a,b){if(qb.length){var c=qb.pop();nb(c,a,b);a=c}else a=new mb(a,b);this.h=a;this.j=this.h.h;this.i=this.l=-1;this.setOptions(b)}tb.prototype.setOptions=function(a){a=void 0===a?{}:a;this.ca=void 0===a.ca?!1:a.ca};tb.prototype.reset=function(){this.h.reset();this.j=this.h.h;this.i=this.l=-1};
+function ub(a){var b=a.h;if(b.h==b.j)return!1;a.j=a.h.h;var c=ob(a.h)>>>0;b=c>>>3;c&=7;if(!(0<=c&&5>=c))throw Ya(c,a.j);if(1>b)throw Error("Invalid field number: "+b+" (at position "+a.j+")");a.l=b;a.i=c;return!0}
+function vb(a){switch(a.i){case 0:if(0!=a.i)vb(a);else a:{a=a.h;for(var b=a.h,c=b+10,d=a.i;b<c;)if(0===(d[b++]&128)){L(a,b);break a}throw Za();}break;case 1:a=a.h;L(a,a.h+8);break;case 2:2!=a.i?vb(a):(b=ob(a.h)>>>0,a=a.h,L(a,a.h+b));break;case 5:a=a.h;L(a,a.h+4);break;case 3:b=a.l;do{if(!ub(a))throw Error("Unmatched start-group tag: stream EOF");if(4==a.i){if(a.l!=b)throw Error("Unmatched end-group tag");break}vb(a)}while(1);break;default:throw Ya(a.i,a.j);}}var wb=[];function xb(){this.j=[];this.i=0;this.h=new rb}function N(a,b){0!==b.length&&(a.j.push(b),a.i+=b.length)}function yb(a,b){if(b=b.R){N(a,a.h.end());for(var c=0;c<b.length;c++)N(a,kb(b[c])||Pa())}};var O="function"===typeof Symbol&&"symbol"===typeof Symbol()?Symbol():void 0;function P(a,b){if(O)return a[O]|=b;if(void 0!==a.A)return a.A|=b;Object.defineProperties(a,{A:{value:b,configurable:!0,writable:!0,enumerable:!1}});return b}function zb(a,b){O?a[O]&&(a[O]&=~b):void 0!==a.A&&(a.A&=~b)}function Q(a){var b;O?b=a[O]:b=a.A;return null==b?0:b}function R(a,b){O?a[O]=b:void 0!==a.A?a.A=b:Object.defineProperties(a,{A:{value:b,configurable:!0,writable:!0,enumerable:!1}})}
+function Ab(a){P(a,1);return a}function Bb(a,b){R(b,(a|0)&-51)}function Cb(a,b){R(b,(a|18)&-41)};var Db={};function Eb(a){return null!==a&&"object"===typeof a&&!Array.isArray(a)&&a.constructor===Object}var Fb,Gb=[];R(Gb,23);Fb=Object.freeze(Gb);function Hb(a){if(Q(a.o)&2)throw Error("Cannot mutate an immutable Message");}function Ib(a){var b=a.length;(b=b?a[b-1]:void 0)&&Eb(b)?b.g=1:(b={},a.push((b.g=1,b)))};function Jb(a){var b=a.i+a.G;return a.B||(a.B=a.o[b]={})}function S(a,b){return-1===b?null:b>=a.i?a.B?a.B[b]:void 0:a.o[b+a.G]}function U(a,b,c,d){Hb(a);Kb(a,b,c,d)}function Kb(a,b,c,d){a.j&&(a.j=void 0);b>=a.i||d?Jb(a)[b]=c:(a.o[b+a.G]=c,(a=a.B)&&b in a&&delete a[b])}function Lb(a,b,c,d){var e=S(a,b);Array.isArray(e)||(e=Fb);var g=Q(e);g&1||Ab(e);if(d)g&2||P(e,2),c&1||Object.freeze(e);else{d=!(c&2);var f=g&2;c&1||!f?d&&g&16&&!f&&zb(e,16):(e=Ab(Array.prototype.slice.call(e)),Kb(a,b,e))}return e}
+function Mb(a,b){var c=S(a,b);var d=null==c?c:"number"===typeof c||"NaN"===c||"Infinity"===c||"-Infinity"===c?Number(c):void 0;null!=d&&d!==c&&Kb(a,b,d);return d}
+function Nb(a,b,c,d,e){a.h||(a.h={});var g=a.h[c],f=Lb(a,c,3,e);if(!g){var h=f;g=[];var k=!!(Q(a.o)&16);f=!!(Q(h)&2);var l=h;!e&&f&&(h=Array.prototype.slice.call(h));for(var m=f,r=0;r<h.length;r++){var p=h[r];var n=b,q=!1;q=void 0===q?!1:q;p=Array.isArray(p)?new n(p):q?new n:void 0;if(void 0!==p){n=p.o;var t=q=Q(n);f&&(t|=2);k&&(t|=16);t!=q&&R(n,t);n=t;m=m||!!(2&n);g.push(p)}}a.h[c]=g;k=Q(h);b=k|33;b=m?b&-9:b|8;k!=b&&(m=h,Object.isFrozen(m)&&(m=Array.prototype.slice.call(m)),R(m,b),h=m);l!==h&&Kb(a,
+c,h);(e||d&&f)&&P(g,2);d&&Object.freeze(g);return g}e||(e=Object.isFrozen(g),d&&!e?Object.freeze(g):!d&&e&&(g=Array.prototype.slice.call(g),a.h[c]=g));return g}function Ob(a,b,c){var d=!!(Q(a.o)&2);b=Nb(a,b,c,d,d);a=Lb(a,c,3,d);if(!(d||Q(a)&8)){for(d=0;d<b.length;d++){c=b[d];if(Q(c.o)&2){var e=Pb(c,!1);e.j=c}else e=c;c!==e&&(b[d]=e,a[d]=e.o)}P(a,8)}return b}
+function V(a,b,c){if(null!=c&&"number"!==typeof c)throw Error("Value of float/double field must be a number|null|undefined, found "+typeof c+": "+c);U(a,b,c)}function Qb(a,b,c,d,e){Hb(a);var g=Nb(a,c,b,!1,!1);c=null!=d?d:new c;a=Lb(a,b,2,!1);void 0!=e?(g.splice(e,0,c),a.splice(e,0,c.o)):(g.push(c),a.push(c.o));c.C()&&zb(a,8);return c}function Rb(a,b){return null==a?b:a}function W(a,b,c){c=void 0===c?0:c;return Rb(Mb(a,b),c)};var Sb;function Tb(a){switch(typeof a){case "number":return isFinite(a)?a:String(a);case "object":if(a)if(Array.isArray(a)){if(0!==(Q(a)&128))return a=Array.prototype.slice.call(a),Ib(a),a}else{if(Ia&&null!=a&&a instanceof Uint8Array)return Ka(a);if(a instanceof ib){var b=a.V;return null==b?"":"string"===typeof b?b:a.V=Ka(b)}}}return a};function Ub(a,b,c,d){if(null!=a){if(Array.isArray(a))a=Vb(a,b,c,void 0!==d);else if(Eb(a)){var e={},g;for(g in a)e[g]=Ub(a[g],b,c,d);a=e}else a=b(a,d);return a}}function Vb(a,b,c,d){var e=Q(a);d=d?!!(e&16):void 0;a=Array.prototype.slice.call(a);for(var g=0;g<a.length;g++)a[g]=Ub(a[g],b,c,d);c(e,a);return a}function Wb(a){return a.ja===Db?a.toJSON():Tb(a)}function Xb(a,b){a&128&&Ib(b)};function Yb(a,b,c){c=void 0===c?Cb:c;if(null!=a){if(Ia&&a instanceof Uint8Array)return a.length?new ib(new Uint8Array(a),Qa):jb();if(Array.isArray(a)){var d=Q(a);if(d&2)return a;if(b&&!(d&32)&&(d&16||0===d))return R(a,d|2),a;a=Vb(a,Yb,d&4?Cb:c,!0);b=Q(a);b&4&&b&2&&Object.freeze(a);return a}return a.ja===Db?Zb(a):a}}
+function $b(a,b,c,d,e,g,f){if(a=a.h&&a.h[c]){d=Q(a);d&2?d=a:(g=Ca(a,Zb),Cb(d,g),Object.freeze(g),d=g);Hb(b);f=null==d?Fb:Ab([]);if(null!=d){g=!!d.length;for(a=0;a<d.length;a++){var h=d[a];g=g&&!(Q(h.o)&2);f[a]=h.o}g=(g?8:0)|1;a=Q(f);(a&g)!==g&&(Object.isFrozen(f)&&(f=Array.prototype.slice.call(f)),R(f,a|g));b.h||(b.h={});b.h[c]=d}else b.h&&(b.h[c]=void 0);Kb(b,c,f,e)}else U(b,c,Yb(d,g,f),e)}function Zb(a){if(Q(a.o)&2)return a;a=Pb(a,!0);P(a.o,2);return a}
+function Pb(a,b){var c=a.o,d=[];P(d,16);var e=a.constructor.h;e&&d.push(e);e=a.B;if(e){d.length=c.length;d.fill(void 0,d.length,c.length);var g={};d[d.length-1]=g}0!==(Q(c)&128)&&Ib(d);b=b||a.C()?Cb:Bb;g=a.constructor;Sb=d;d=new g(d);Sb=void 0;a.R&&(d.R=a.R.slice());g=!!(Q(c)&16);for(var f=e?c.length-1:c.length,h=0;h<f;h++)$b(a,d,h-a.G,c[h],!1,g,b);if(e)for(var k in e)$b(a,d,+k,e[k],!0,g,b);return d};function X(a,b,c){null==a&&(a=Sb);Sb=void 0;var d=this.constructor.i||0,e=0<d,g=this.constructor.h,f=!1;if(null==a){a=g?[g]:[];var h=48;var k=!0;e&&(d=0,h|=128);R(a,h)}else{if(!Array.isArray(a))throw Error();if(g&&g!==a[0])throw Error();var l=h=P(a,0);if(k=0!==(16&l))(f=0!==(32&l))||(l|=32);if(e)if(128&l)d=0;else{if(0<a.length){var m=a[a.length-1];if(Eb(m)&&"g"in m){d=0;l|=128;delete m.g;var r=!0,p;for(p in m){r=!1;break}r&&a.pop()}}}else if(128&l)throw Error();h!==l&&R(a,l)}this.G=(g?0:-1)-d;this.h=
+void 0;this.o=a;a:{g=this.o.length;d=g-1;if(g&&(g=this.o[d],Eb(g))){this.B=g;this.i=d-this.G;break a}void 0!==b&&-1<b?(this.i=Math.max(b,d+1-this.G),this.B=void 0):this.i=Number.MAX_VALUE}if(!e&&this.B&&"g"in this.B)throw Error('Unexpected "g" flag in sparse object of message that is not a group type.');if(c){b=k&&!f&&!0;e=this.i;var n;for(k=0;k<c.length;k++)f=c[k],f<e?(f+=this.G,(d=a[f])?ac(d,b):a[f]=Fb):(n||(n=Jb(this)),(d=n[f])?ac(d,b):n[f]=Fb)}}
+X.prototype.toJSON=function(){return Vb(this.o,Wb,Xb)};X.prototype.C=function(){return!!(Q(this.o)&2)};function ac(a,b){if(Array.isArray(a)){var c=Q(a),d=1;!b||c&2||(d|=16);(c&d)!==d&&R(a,c|d)}}X.prototype.ja=Db;X.prototype.toString=function(){return this.o.toString()};function bc(a,b,c){if(c){var d={},e;for(e in c){var g=c[e],f=g.ra;f||(d.J=g.xa||g.oa.W,g.ia?(d.aa=cc(g.ia),f=function(h){return function(k,l,m){return h.J(k,l,m,h.aa)}}(d)):g.ka?(d.Z=dc(g.da.P,g.ka),f=function(h){return function(k,l,m){return h.J(k,l,m,h.Z)}}(d)):f=d.J,g.ra=f);f(b,a,g.da);d={J:d.J,aa:d.aa,Z:d.Z}}}yb(b,a)}var ec=Symbol();function fc(a,b,c){return a[ec]||(a[ec]=function(d,e){return b(d,e,c)})}
+function gc(a){var b=a[ec];if(!b){var c=hc(a);b=function(d,e){return ic(d,e,c)};a[ec]=b}return b}function jc(a){var b=a.ia;if(b)return gc(b);if(b=a.wa)return fc(a.da.P,b,a.ka)}function kc(a){var b=jc(a),c=a.da,d=a.oa.U;return b?function(e,g){return d(e,g,c,b)}:function(e,g){return d(e,g,c)}}function lc(a,b){var c=a[b];"function"==typeof c&&0===c.length&&(c=c(),a[b]=c);return Array.isArray(c)&&(mc in c||nc in c||0<c.length&&"function"==typeof c[0])?c:void 0}
+function oc(a,b,c,d,e,g){b.P=a[0];var f=1;if(a.length>f&&"number"!==typeof a[f]){var h=a[f++];c(b,h)}for(;f<a.length;){c=a[f++];for(var k=f+1;k<a.length&&"number"!==typeof a[k];)k++;h=a[f++];k-=f;switch(k){case 0:d(b,c,h);break;case 1:(k=lc(a,f))?(f++,e(b,c,h,k)):d(b,c,h,a[f++]);break;case 2:k=f++;k=lc(a,k);e(b,c,h,k,a[f++]);break;case 3:g(b,c,h,a[f++],a[f++],a[f++]);break;case 4:g(b,c,h,a[f++],a[f++],a[f++],a[f++]);break;default:throw Error("unexpected number of binary field arguments: "+k);}}return b}
+var pc=Symbol();function cc(a){var b=a[pc];if(!b){var c=qc(a);b=function(d,e){return rc(d,e,c)};a[pc]=b}return b}function dc(a,b){var c=a[pc];c||(c=function(d,e){return bc(d,e,b)},a[pc]=c);return c}var nc=Symbol();function sc(a,b){a.push(b)}function tc(a,b,c){a.push(b,c.W)}function uc(a,b,c,d){var e=cc(d),g=qc(d).P,f=c.W;a.push(b,function(h,k,l){return f(h,k,l,g,e)})}function vc(a,b,c,d,e,g){var f=dc(d,g),h=c.W;a.push(b,function(k,l,m){return h(k,l,m,d,f)})}
+function qc(a){var b=a[nc];if(b)return b;b=oc(a,a[nc]=[],sc,tc,uc,vc);mc in a&&nc in a&&(a.length=0);return b}var mc=Symbol();function wc(a,b){a[0]=b}function xc(a,b,c,d){var e=c.U;a[b]=d?function(g,f,h){return e(g,f,h,d)}:e}function yc(a,b,c,d,e){var g=c.U,f=gc(d),h=hc(d).P;a[b]=function(k,l,m){return g(k,l,m,h,f,e)}}function zc(a,b,c,d,e,g,f){var h=c.U,k=fc(d,e,g);a[b]=function(l,m,r){return h(l,m,r,d,k,f)}}
+function hc(a){var b=a[mc];if(b)return b;b=oc(a,a[mc]={},wc,xc,yc,zc);mc in a&&nc in a&&(a.length=0);return b}
+function ic(a,b,c){for(;ub(b)&&4!=b.i;){var d=b.l,e=c[d];if(!e){var g=c[0];g&&(g=g[d])&&(e=c[d]=kc(g))}if(!e||!e(b,a,d)){e=b;d=a;g=e.j;vb(e);var f=e;if(!f.ca){e=f.h.h-g;f.h.h=g;f=f.h;if(0==e)e=jb();else{g=pb(f,e);if(f.S&&f.m)e=f.i.subarray(g,g+e);else{f=f.i;var h=g;e=g+e;e=h===e?Pa():Ra?f.slice(h,e):new Uint8Array(f.subarray(h,e))}e=0==e.length?jb():new ib(e,Qa)}(g=d.R)?g.push(e):d.R=[e]}}}return a}
+function rc(a,b,c){for(var d=c.length,e=1==d%2,g=e?1:0;g<d;g+=2)(0,c[g+1])(b,a,c[g]);bc(a,b,e?c[0]:void 0)}function Ac(a,b){return{U:a,W:b}}
+var Y=Ac(function(a,b,c){if(5!==a.i)return!1;a=a.h;var d=a.i,e=a.h,g=d[e];var f=d[e+1];var h=d[e+2];d=d[e+3];L(a,a.h+4);f=(g<<0|f<<8|h<<16|d<<24)>>>0;a=2*(f>>31)+1;g=f>>>23&255;f&=8388607;U(b,c,255==g?f?NaN:Infinity*a:0==g?a*Math.pow(2,-149)*f:a*Math.pow(2,g-150)*(f+Math.pow(2,23)));return!0},function(a,b,c){b=Mb(b,c);if(null!=b){M(a.h,8*c+5);a=a.h;var d=+b;0===d?0<1/d?G=H=0:(H=0,G=2147483648):isNaN(d)?(H=0,G=2147483647):(d=(c=0>d?-2147483648:0)?-d:d,3.4028234663852886E38<d?(H=0,G=(c|2139095040)>>>
+0):1.1754943508222875E-38>d?(d=Math.round(d/Math.pow(2,-149)),H=0,G=(c|d)>>>0):(b=Math.floor(Math.log(d)/Math.LN2),d*=Math.pow(2,-b),d=Math.round(8388608*d),16777216<=d&&++b,H=0,G=(c|b+127<<23|d&8388607)>>>0));c=G;a.h.push(c>>>0&255);a.h.push(c>>>8&255);a.h.push(c>>>16&255);a.h.push(c>>>24&255)}}),Bc=Ac(function(a,b,c){if(0!==a.i)return!1;var d=a.h,e=0,g=a=0,f=d.i,h=d.h;do{var k=f[h++];e|=(k&127)<<g;g+=7}while(32>g&&k&128);32<g&&(a|=(k&127)>>4);for(g=3;32>g&&k&128;g+=7)k=f[h++],a|=(k&127)<<g;L(d,
+h);if(128>k){d=e>>>0;k=a>>>0;if(a=k&2147483648)d=~d+1>>>0,k=~k>>>0,0==d&&(k=k+1>>>0);d=4294967296*k+(d>>>0)}else throw Za();U(b,c,a?-d:d);return!0},function(a,b,c){b=S(b,c);null!=b&&("string"===typeof b&&Wa(b),null!=b&&(M(a.h,8*c),"number"===typeof b?(a=a.h,Sa(b),sb(a,G,H)):(c=Wa(b),sb(a.h,c.i,c.h))))}),Cc=Ac(function(a,b,c){if(0!==a.i)return!1;U(b,c,ob(a.h));return!0},function(a,b,c){b=S(b,c);if(null!=b&&null!=b)if(M(a.h,8*c),a=a.h,c=b,0<=c)M(a,c);else{for(b=0;9>b;b++)a.h.push(c&127|128),c>>=7;a.h.push(1)}}),
+Dc=Ac(function(a,b,c){if(2!==a.i)return!1;var d=ob(a.h)>>>0;a=a.h;var e=pb(a,d);a=a.i;if(db){var g=a,f;(f=cb)||(f=cb=new TextDecoder("utf-8",{fatal:!0}));a=e+d;g=0===e&&a===g.length?g:g.subarray(e,a);try{var h=f.decode(g)}catch(r){if(void 0===bb){try{f.decode(new Uint8Array([128]))}catch(p){}try{f.decode(new Uint8Array([97])),bb=!0}catch(p){bb=!1}}!bb&&(cb=void 0);throw r;}}else{h=e;d=h+d;e=[];for(var k=null,l,m;h<d;)l=a[h++],128>l?e.push(l):224>l?h>=d?K():(m=a[h++],194>l||128!==(m&192)?(h--,K()):
+e.push((l&31)<<6|m&63)):240>l?h>=d-1?K():(m=a[h++],128!==(m&192)||224===l&&160>m||237===l&&160<=m||128!==((g=a[h++])&192)?(h--,K()):e.push((l&15)<<12|(m&63)<<6|g&63)):244>=l?h>=d-2?K():(m=a[h++],128!==(m&192)||0!==(l<<28)+(m-144)>>30||128!==((g=a[h++])&192)||128!==((f=a[h++])&192)?(h--,K()):(l=(l&7)<<18|(m&63)<<12|(g&63)<<6|f&63,l-=65536,e.push((l>>10&1023)+55296,(l&1023)+56320))):K(),8192<=e.length&&(k=ab(k,e),e.length=0);h=ab(k,e)}U(b,c,h);return!0},function(a,b,c){b=S(b,c);if(null!=b){var d=!1;
+d=void 0===d?!1:d;if(fb){if(d&&/(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])/.test(b))throw Error("Found an unpaired surrogate");b=(eb||(eb=new TextEncoder)).encode(b)}else{for(var e=0,g=new Uint8Array(3*b.length),f=0;f<b.length;f++){var h=b.charCodeAt(f);if(128>h)g[e++]=h;else{if(2048>h)g[e++]=h>>6|192;else{if(55296<=h&&57343>=h){if(56319>=h&&f<b.length){var k=b.charCodeAt(++f);if(56320<=k&&57343>=k){h=1024*(h-55296)+k-56320+65536;g[e++]=h>>18|240;g[e++]=h>>12&63|128;
+g[e++]=h>>6&63|128;g[e++]=h&63|128;continue}else f--}if(d)throw Error("Found an unpaired surrogate");h=65533}g[e++]=h>>12|224;g[e++]=h>>6&63|128}g[e++]=h&63|128}}b=e===g.length?g:g.subarray(0,e)}M(a.h,8*c+2);M(a.h,b.length);N(a,a.h.end());N(a,b)}}),Ec=Ac(function(a,b,c,d,e){if(2!==a.i)return!1;b=Qb(b,c,d);c=a.h.j;d=ob(a.h)>>>0;var g=a.h.h+d,f=g-c;0>=f&&(a.h.j=g,e(b,a,void 0,void 0,void 0),f=g-a.h.h);if(f)throw Error("Message parsing ended unexpectedly. Expected to read "+(d+" bytes, instead read "+
+(d-f)+" bytes, either the data ended unexpectedly or the message misreported its own length"));a.h.h=g;a.h.j=c;return!0},function(a,b,c,d,e){b=Ob(b,d,c);if(null!=b)for(d=0;d<b.length;d++){var g=a;M(g.h,8*c+2);var f=g.h.end();N(g,f);f.push(g.i);g=f;e(b[d],a);f=a;var h=g.pop();for(h=f.i+f.h.length()-h;127<h;)g.push(h&127|128),h>>>=7,f.i++;g.push(h);f.i++}});function Fc(a){return function(b,c){a:{if(wb.length){var d=wb.pop();d.setOptions(c);nb(d.h,b,c);b=d}else b=new tb(b,c);try{var e=hc(a);var g=ic(new e.P,b,e);break a}finally{e=b.h,e.i=null,e.m=!1,e.l=0,e.j=0,e.h=0,e.S=!1,b.l=-1,b.i=-1,100>wb.length&&wb.push(b)}g=void 0}return g}}function Gc(a){return function(){var b=new xb;rc(this,b,qc(a));N(b,b.h.end());for(var c=new Uint8Array(b.i),d=b.j,e=d.length,g=0,f=0;f<e;f++){var h=d[f];c.set(h,g);g+=h.length}b.j=[c];return c}};function Z(a){X.call(this,a)}na(Z,X);var Hc=[Z,1,Cc,2,Y,3,Dc,4,Dc];Z.prototype.l=Gc(Hc);function Ic(a){X.call(this,a,-1,Jc)}na(Ic,X);Ic.prototype.addClassification=function(a,b){Qb(this,1,Z,a,b);return this};var Jc=[1],Kc=Fc([Ic,1,Ec,Hc]);function Lc(a){X.call(this,a)}na(Lc,X);var Mc=[Lc,1,Y,2,Y,3,Y,4,Y,5,Y];Lc.prototype.l=Gc(Mc);function Nc(a){X.call(this,a,-1,Oc)}na(Nc,X);var Oc=[1],Pc=Fc([Nc,1,Ec,Mc]);function Qc(a){X.call(this,a)}na(Qc,X);var Rc=[Qc,1,Y,2,Y,3,Y,4,Y,5,Y,6,Bc],Sc=Fc(Rc);Qc.prototype.l=Gc(Rc);function Tc(a,b,c){c=a.createShader(0===c?a.VERTEX_SHADER:a.FRAGMENT_SHADER);a.shaderSource(c,b);a.compileShader(c);if(!a.getShaderParameter(c,a.COMPILE_STATUS))throw Error("Could not compile WebGL shader.\n\n"+a.getShaderInfoLog(c));return c};function Uc(a){return Ob(a,Z,1).map(function(b){var c=S(b,1);return{index:null==c?0:c,qa:W(b,2),label:null!=S(b,3)?Rb(S(b,3),""):void 0,displayName:null!=S(b,4)?Rb(S(b,4),""):void 0}})};function Vc(a){return{x:W(a,1),y:W(a,2),z:W(a,3),visibility:null!=Mb(a,4)?W(a,4):void 0}};function Wc(a,b){this.i=a;this.h=b;this.m=0}
+function Xc(a,b,c){Yc(a,b);if("function"===typeof a.h.canvas.transferToImageBitmap)return Promise.resolve(a.h.canvas.transferToImageBitmap());if(c)return Promise.resolve(a.h.canvas);if("function"===typeof createImageBitmap)return createImageBitmap(a.h.canvas);void 0===a.j&&(a.j=document.createElement("canvas"));return new Promise(function(d){a.j.height=a.h.canvas.height;a.j.width=a.h.canvas.width;a.j.getContext("2d",{}).drawImage(a.h.canvas,0,0,a.h.canvas.width,a.h.canvas.height);d(a.j)})}
+function Yc(a,b){var c=a.h;if(void 0===a.s){var d=Tc(c,"\n  attribute vec2 aVertex;\n  attribute vec2 aTex;\n  varying vec2 vTex;\n  void main(void) {\n    gl_Position = vec4(aVertex, 0.0, 1.0);\n    vTex = aTex;\n  }",0),e=Tc(c,"\n  precision mediump float;\n  varying vec2 vTex;\n  uniform sampler2D sampler0;\n  void main(){\n    gl_FragColor = texture2D(sampler0, vTex);\n  }",1),g=c.createProgram();c.attachShader(g,d);c.attachShader(g,e);c.linkProgram(g);if(!c.getProgramParameter(g,c.LINK_STATUS))throw Error("Could not compile WebGL program.\n\n"+
+c.getProgramInfoLog(g));d=a.s=g;c.useProgram(d);e=c.getUniformLocation(d,"sampler0");a.l={O:c.getAttribLocation(d,"aVertex"),N:c.getAttribLocation(d,"aTex"),ya:e};a.v=c.createBuffer();c.bindBuffer(c.ARRAY_BUFFER,a.v);c.enableVertexAttribArray(a.l.O);c.vertexAttribPointer(a.l.O,2,c.FLOAT,!1,0,0);c.bufferData(c.ARRAY_BUFFER,new Float32Array([-1,-1,-1,1,1,1,1,-1]),c.STATIC_DRAW);c.bindBuffer(c.ARRAY_BUFFER,null);a.u=c.createBuffer();c.bindBuffer(c.ARRAY_BUFFER,a.u);c.enableVertexAttribArray(a.l.N);c.vertexAttribPointer(a.l.N,
+2,c.FLOAT,!1,0,0);c.bufferData(c.ARRAY_BUFFER,new Float32Array([0,1,0,0,1,0,1,1]),c.STATIC_DRAW);c.bindBuffer(c.ARRAY_BUFFER,null);c.uniform1i(e,0)}d=a.l;c.useProgram(a.s);c.canvas.width=b.width;c.canvas.height=b.height;c.viewport(0,0,b.width,b.height);c.activeTexture(c.TEXTURE0);a.i.bindTexture2d(b.glName);c.enableVertexAttribArray(d.O);c.bindBuffer(c.ARRAY_BUFFER,a.v);c.vertexAttribPointer(d.O,2,c.FLOAT,!1,0,0);c.enableVertexAttribArray(d.N);c.bindBuffer(c.ARRAY_BUFFER,a.u);c.vertexAttribPointer(d.N,
+2,c.FLOAT,!1,0,0);c.bindFramebuffer(c.DRAW_FRAMEBUFFER?c.DRAW_FRAMEBUFFER:c.FRAMEBUFFER,null);c.clearColor(0,0,0,0);c.clear(c.COLOR_BUFFER_BIT);c.colorMask(!0,!0,!0,!0);c.drawArrays(c.TRIANGLE_FAN,0,4);c.disableVertexAttribArray(d.O);c.disableVertexAttribArray(d.N);c.bindBuffer(c.ARRAY_BUFFER,null);a.i.bindTexture2d(0)}function Zc(a){this.h=a};var $c=new Uint8Array([0,97,115,109,1,0,0,0,1,4,1,96,0,0,3,2,1,0,10,9,1,7,0,65,0,253,15,26,11]);function ad(a,b){return b+a}function bd(a,b){window[a]=b}function cd(a){var b=document.createElement("script");b.setAttribute("src",a);b.setAttribute("crossorigin","anonymous");return new Promise(function(c){b.addEventListener("load",function(){c()},!1);b.addEventListener("error",function(){c()},!1);document.body.appendChild(b)})}
+function dd(){return E(function(a){switch(a.h){case 1:return a.s=2,D(a,WebAssembly.instantiate($c),4);case 4:a.h=3;a.s=0;break;case 2:return a.s=0,a.l=null,a.return(!1);case 3:return a.return(!0)}})}
+function ed(a){this.h=a;this.listeners={};this.l={};this.L={};this.s={};this.v={};this.M=this.u=this.ga=!0;this.I=Promise.resolve();this.fa="";this.D={};this.locateFile=a&&a.locateFile||ad;if("object"===typeof window)var b=window.location.pathname.toString().substring(0,window.location.pathname.toString().lastIndexOf("/"))+"/";else if("undefined"!==typeof location)b=location.pathname.toString().substring(0,location.pathname.toString().lastIndexOf("/"))+"/";else throw Error("solutions can only be loaded on a web page or in a web worker");
+this.ha=b;if(a.options){b=A(Object.keys(a.options));for(var c=b.next();!c.done;c=b.next()){c=c.value;var d=a.options[c].default;void 0!==d&&(this.l[c]="function"===typeof d?d():d)}}}x=ed.prototype;x.close=function(){this.j&&this.j.delete();return Promise.resolve()};
+function fd(a){var b,c,d,e,g,f,h,k,l,m,r;return E(function(p){switch(p.h){case 1:if(!a.ga)return p.return();b=void 0===a.h.files?[]:"function"===typeof a.h.files?a.h.files(a.l):a.h.files;return D(p,dd(),2);case 2:c=p.i;if("object"===typeof window)return bd("createMediapipeSolutionsWasm",{locateFile:a.locateFile}),bd("createMediapipeSolutionsPackedAssets",{locateFile:a.locateFile}),f=b.filter(function(n){return void 0!==n.data}),h=b.filter(function(n){return void 0===n.data}),k=Promise.all(f.map(function(n){var q=
+gd(a,n.url);if(void 0!==n.path){var t=n.path;q=q.then(function(w){a.overrideFile(t,w);return Promise.resolve(w)})}return q})),l=Promise.all(h.map(function(n){return void 0===n.simd||n.simd&&c||!n.simd&&!c?cd(a.locateFile(n.url,a.ha)):Promise.resolve()})).then(function(){var n,q,t;return E(function(w){if(1==w.h)return n=window.createMediapipeSolutionsWasm,q=window.createMediapipeSolutionsPackedAssets,t=a,D(w,n(q),2);t.i=w.i;w.h=0})}),m=function(){return E(function(n){a.h.graph&&a.h.graph.url?n=D(n,
+gd(a,a.h.graph.url),0):(n.h=0,n=void 0);return n})}(),D(p,Promise.all([l,k,m]),7);if("function"!==typeof importScripts)throw Error("solutions can only be loaded on a web page or in a web worker");d=b.filter(function(n){return void 0===n.simd||n.simd&&c||!n.simd&&!c}).map(function(n){return a.locateFile(n.url,a.ha)});importScripts.apply(null,ea(d));e=a;return D(p,createMediapipeSolutionsWasm(Module),6);case 6:e.i=p.i;a.m=new OffscreenCanvas(1,1);a.i.canvas=a.m;g=a.i.GL.createContext(a.m,{antialias:!1,
+alpha:!1,va:"undefined"!==typeof WebGL2RenderingContext?2:1});a.i.GL.makeContextCurrent(g);p.h=4;break;case 7:a.m=document.createElement("canvas");r=a.m.getContext("webgl2",{});if(!r&&(r=a.m.getContext("webgl",{}),!r))return alert("Failed to create WebGL canvas context when passing video frame."),p.return();a.K=r;a.i.canvas=a.m;a.i.createContext(a.m,!0,!0,{});case 4:a.j=new a.i.SolutionWasm,a.ga=!1,p.h=0}})}
+function hd(a){var b,c,d,e,g,f,h,k;return E(function(l){if(1==l.h){if(a.h.graph&&a.h.graph.url&&a.fa===a.h.graph.url)return l.return();a.u=!0;if(!a.h.graph||!a.h.graph.url){l.h=2;return}a.fa=a.h.graph.url;return D(l,gd(a,a.h.graph.url),3)}2!=l.h&&(b=l.i,a.j.loadGraph(b));c=A(Object.keys(a.D));for(d=c.next();!d.done;d=c.next())e=d.value,a.j.overrideFile(e,a.D[e]);a.D={};if(a.h.listeners)for(g=A(a.h.listeners),f=g.next();!f.done;f=g.next())h=f.value,id(a,h);k=a.l;a.l={};a.setOptions(k);l.h=0})}
+x.reset=function(){var a=this;return E(function(b){a.j&&(a.j.reset(),a.s={},a.v={});b.h=0})};
+x.setOptions=function(a,b){var c=this;if(b=b||this.h.options){for(var d=[],e=[],g={},f=A(Object.keys(a)),h=f.next();!h.done;g={X:g.X,Y:g.Y},h=f.next())if(h=h.value,!(h in this.l&&this.l[h]===a[h])){this.l[h]=a[h];var k=b[h];void 0!==k&&(k.onChange&&(g.X=k.onChange,g.Y=a[h],d.push(function(l){return function(){var m;return E(function(r){if(1==r.h)return D(r,l.X(l.Y),2);m=r.i;!0===m&&(c.u=!0);r.h=0})}}(g))),k.graphOptionXref&&(h=Object.assign({},{calculatorName:"",calculatorIndex:0},k.graphOptionXref,
+{valueNumber:1===k.type?a[h]:0,valueBoolean:0===k.type?a[h]:!1,valueString:2===k.type?a[h]:""}),e.push(h)))}if(0!==d.length||0!==e.length)this.u=!0,this.H=(void 0===this.H?[]:this.H).concat(e),this.F=(void 0===this.F?[]:this.F).concat(d)}};
+function jd(a){var b,c,d,e,g,f,h;return E(function(k){switch(k.h){case 1:if(!a.u)return k.return();if(!a.F){k.h=2;break}b=A(a.F);c=b.next();case 3:if(c.done){k.h=5;break}d=c.value;return D(k,d(),4);case 4:c=b.next();k.h=3;break;case 5:a.F=void 0;case 2:if(a.H){e=new a.i.GraphOptionChangeRequestList;g=A(a.H);for(f=g.next();!f.done;f=g.next())h=f.value,e.push_back(h);a.j.changeOptions(e);e.delete();a.H=void 0}a.u=!1;k.h=0}})}
+x.initialize=function(){var a=this;return E(function(b){return 1==b.h?D(b,fd(a),2):3!=b.h?D(b,hd(a),3):D(b,jd(a),0)})};function gd(a,b){var c,d;return E(function(e){if(b in a.L)return e.return(a.L[b]);c=a.locateFile(b,"");d=fetch(c).then(function(g){return g.arrayBuffer()});a.L[b]=d;return e.return(d)})}x.overrideFile=function(a,b){this.j?this.j.overrideFile(a,b):this.D[a]=b};x.clearOverriddenFiles=function(){this.D={};this.j&&this.j.clearOverriddenFiles()};
+x.send=function(a,b){var c=this,d,e,g,f,h,k,l,m,r;return E(function(p){switch(p.h){case 1:if(!c.h.inputs)return p.return();d=1E3*(void 0===b||null===b?performance.now():b);return D(p,c.I,2);case 2:return D(p,c.initialize(),3);case 3:e=new c.i.PacketDataList;g=A(Object.keys(a));for(f=g.next();!f.done;f=g.next())if(h=f.value,k=c.h.inputs[h]){a:{var n=a[h];switch(k.type){case "video":var q=c.s[k.stream];q||(q=new Wc(c.i,c.K),c.s[k.stream]=q);0===q.m&&(q.m=q.i.createTexture());if("undefined"!==typeof HTMLVideoElement&&
+n instanceof HTMLVideoElement){var t=n.videoWidth;var w=n.videoHeight}else"undefined"!==typeof HTMLImageElement&&n instanceof HTMLImageElement?(t=n.naturalWidth,w=n.naturalHeight):(t=n.width,w=n.height);w={glName:q.m,width:t,height:w};t=q.h;t.canvas.width=w.width;t.canvas.height=w.height;t.activeTexture(t.TEXTURE0);q.i.bindTexture2d(q.m);t.texImage2D(t.TEXTURE_2D,0,t.RGBA,t.RGBA,t.UNSIGNED_BYTE,n);q.i.bindTexture2d(0);q=w;break a;case "detections":q=c.s[k.stream];q||(q=new Zc(c.i),c.s[k.stream]=q);
+q.data||(q.data=new q.h.DetectionListData);q.data.reset(n.length);for(w=0;w<n.length;++w){t=n[w];var v=q.data,B=v.setBoundingBox,J=w;var I=t.la;var u=new Qc;V(u,1,I.sa);V(u,2,I.ta);V(u,3,I.height);V(u,4,I.width);V(u,5,I.rotation);U(u,6,I.pa);I=u.l();B.call(v,J,I);if(t.ea)for(v=0;v<t.ea.length;++v){u=t.ea[v];B=q.data;J=B.addNormalizedLandmark;I=w;u=Object.assign({},u,{visibility:u.visibility?u.visibility:0});var C=new Lc;V(C,1,u.x);V(C,2,u.y);V(C,3,u.z);u.visibility&&V(C,4,u.visibility);u=C.l();J.call(B,
+I,u)}if(t.ba)for(v=0;v<t.ba.length;++v)B=q.data,J=B.addClassification,I=w,u=t.ba[v],C=new Z,V(C,2,u.qa),u.index&&U(C,1,u.index),u.label&&U(C,3,u.label),u.displayName&&U(C,4,u.displayName),u=C.l(),J.call(B,I,u)}q=q.data;break a;default:q={}}}l=q;m=k.stream;switch(k.type){case "video":e.pushTexture2d(Object.assign({},l,{stream:m,timestamp:d}));break;case "detections":r=l;r.stream=m;r.timestamp=d;e.pushDetectionList(r);break;default:throw Error("Unknown input config type: '"+k.type+"'");}}c.j.send(e);
+return D(p,c.I,4);case 4:e.delete(),p.h=0}})};
+function kd(a,b,c){var d,e,g,f,h,k,l,m,r,p,n,q,t,w;return E(function(v){switch(v.h){case 1:if(!c)return v.return(b);d={};e=0;g=A(Object.keys(c));for(f=g.next();!f.done;f=g.next())h=f.value,k=c[h],"string"!==typeof k&&"texture"===k.type&&void 0!==b[k.stream]&&++e;1<e&&(a.M=!1);l=A(Object.keys(c));f=l.next();case 2:if(f.done){v.h=4;break}m=f.value;r=c[m];if("string"===typeof r)return t=d,w=m,D(v,ld(a,m,b[r]),14);p=b[r.stream];if("detection_list"===r.type){if(p){var B=p.getRectList();for(var J=p.getLandmarksList(),
+I=p.getClassificationsList(),u=[],C=0;C<B.size();++C){var T=Sc(B.get(C)),od=W(T,1),pd=W(T,2),qd=W(T,3),rd=W(T,4),sd=W(T,5,0),za=void 0;za=void 0===za?0:za;T={la:{sa:od,ta:pd,height:qd,width:rd,rotation:sd,pa:Rb(S(T,6),za)},ea:Ob(Pc(J.get(C)),Lc,1).map(Vc),ba:Uc(Kc(I.get(C)))};u.push(T)}B=u}else B=[];d[m]=B;v.h=7;break}if("proto_list"===r.type){if(p){B=Array(p.size());for(J=0;J<p.size();J++)B[J]=p.get(J);p.delete()}else B=[];d[m]=B;v.h=7;break}if(void 0===p){v.h=3;break}if("float_list"===r.type){d[m]=
+p;v.h=7;break}if("proto"===r.type){d[m]=p;v.h=7;break}if("texture"!==r.type)throw Error("Unknown output config type: '"+r.type+"'");n=a.v[m];n||(n=new Wc(a.i,a.K),a.v[m]=n);return D(v,Xc(n,p,a.M),13);case 13:q=v.i,d[m]=q;case 7:r.transform&&d[m]&&(d[m]=r.transform(d[m]));v.h=3;break;case 14:t[w]=v.i;case 3:f=l.next();v.h=2;break;case 4:return v.return(d)}})}
+function ld(a,b,c){var d;return E(function(e){return"number"===typeof c||c instanceof Uint8Array||c instanceof a.i.Uint8BlobList?e.return(c):c instanceof a.i.Texture2dDataOut?(d=a.v[b],d||(d=new Wc(a.i,a.K),a.v[b]=d),e.return(Xc(d,c,a.M))):e.return(void 0)})}
+function id(a,b){for(var c=b.name||"$",d=[].concat(ea(b.wants)),e=new a.i.StringList,g=A(b.wants),f=g.next();!f.done;f=g.next())e.push_back(f.value);g=a.i.PacketListener.implement({onResults:function(h){for(var k={},l=0;l<b.wants.length;++l)k[d[l]]=h.get(l);var m=a.listeners[c];m&&(a.I=kd(a,k,b.outs).then(function(r){r=m(r);for(var p=0;p<b.wants.length;++p){var n=k[d[p]];"object"===typeof n&&n.hasOwnProperty&&n.hasOwnProperty("delete")&&n.delete()}r&&(a.I=r)}))}});a.j.attachMultiListener(e,g);e.delete()}
+x.onResults=function(a,b){this.listeners[b||"$"]=a};Aa("Solution",ed);Aa("OptionType",{BOOL:0,NUMBER:1,ua:2,0:"BOOL",1:"NUMBER",2:"STRING"});function md(a){void 0===a&&(a=0);switch(a){case 1:return"selfie_segmentation_landscape.tflite";default:return"selfie_segmentation.tflite"}}
+function nd(a){var b=this;a=a||{};this.h=new ed({locateFile:a.locateFile,files:function(c){return[{simd:!0,url:"selfie_segmentation_solution_simd_wasm_bin.js"},{simd:!1,url:"selfie_segmentation_solution_wasm_bin.js"},{data:!0,url:md(c.modelSelection)}]},graph:{url:"selfie_segmentation.binarypb"},listeners:[{wants:["segmentation_mask","image_transformed"],outs:{image:{type:"texture",stream:"image_transformed"},segmentationMask:{type:"texture",stream:"segmentation_mask"}}}],inputs:{image:{type:"video",
+stream:"input_frames_gpu"}},options:{useCpuInference:{type:0,graphOptionXref:{calculatorType:"InferenceCalculator",fieldName:"use_cpu_inference"},default:"object"!==typeof window||void 0===window.navigator?!1:"iPad Simulator;iPhone Simulator;iPod Simulator;iPad;iPhone;iPod".split(";").includes(navigator.platform)||navigator.userAgent.includes("Mac")&&"ontouchend"in document},selfieMode:{type:0,graphOptionXref:{calculatorType:"GlScalerCalculator",calculatorIndex:1,fieldName:"flip_horizontal"}},modelSelection:{type:1,
+graphOptionXref:{calculatorType:"ConstantSidePacketCalculator",calculatorName:"ConstantSidePacketCalculatorModelSelection",fieldName:"int_value"},onChange:function(c){var d,e,g;return E(function(f){if(1==f.h)return d=md(c),e="third_party/mediapipe/modules/selfie_segmentation/"+d,D(f,gd(b.h,d),2);g=f.i;b.h.overrideFile(e,g);return f.return(!0)})}}}})}x=nd.prototype;x.close=function(){this.h.close();return Promise.resolve()};x.onResults=function(a){this.h.onResults(a)};
+x.initialize=function(){var a=this;return E(function(b){return D(b,a.h.initialize(),0)})};x.reset=function(){this.h.reset()};x.send=function(a){var b=this;return E(function(c){return D(c,b.h.send(a),0)})};x.setOptions=function(a){this.h.setOptions(a)};Aa("SelfieSegmentation",nd);Aa("VERSION","0.1.1675465747");}).call(this);

docs/assets/@mediapipe/selfie_segmentation/selfie_segmentation_solution_simd_wasm_bin.js

@@ -0,0 +1,21 @@
+
+var createMediapipeSolutionsWasm = (() => {
+  var _scriptDir = typeof document !== 'undefined' && document.currentScript ? document.currentScript.src : undefined;
+  if (typeof __filename !== 'undefined') _scriptDir = _scriptDir || __filename;
+  return (
+function(createMediapipeSolutionsWasm) {
+  createMediapipeSolutionsWasm = createMediapipeSolutionsWasm || {};
+
+var Module=typeof createMediapipeSolutionsWasm!="undefined"?createMediapipeSolutionsWasm:{};var readyPromiseResolve,readyPromiseReject;Module["ready"]=new Promise(function(resolve,reject){readyPromiseResolve=resolve;readyPromiseReject=reject});["_main","_fflush","___getTypeName","__embind_initialize_bindings","onRuntimeInitialized"].forEach(prop=>{if(!Object.getOwnPropertyDescriptor(Module["ready"],prop)){Object.defineProperty(Module["ready"],prop,{get:()=>abort("You are getting "+prop+" on the Promise object, instead of the instance. Use .then() to get called back with the instance, see the MODULARIZE docs in src/settings.js"),set:()=>abort("You are setting "+prop+" on the Promise object, instead of the instance. Use .then() to get called back with the instance, see the MODULARIZE docs in src/settings.js")})}});var moduleOverrides=Object.assign({},Module);var arguments_=[];var thisProgram="./this.program";var quit_=(status,toThrow)=>{throw toThrow};var ENVIRONMENT_IS_WEB=typeof window=="object";var ENVIRONMENT_IS_WORKER=typeof importScripts=="function";var ENVIRONMENT_IS_NODE=typeof process=="object"&&typeof process.versions=="object"&&typeof process.versions.node=="string";var ENVIRONMENT_IS_SHELL=!ENVIRONMENT_IS_WEB&&!ENVIRONMENT_IS_NODE&&!ENVIRONMENT_IS_WORKER;if(Module["ENVIRONMENT"]){throw new Error("Module.ENVIRONMENT has been deprecated. To force the environment, use the ENVIRONMENT compile-time option (for example, -sENVIRONMENT=web or -sENVIRONMENT=node)")}var scriptDirectory="";function locateFile(path){if(Module["locateFile"]){return Module["locateFile"](path,scriptDirectory)}return scriptDirectory+path}var read_,readAsync,readBinary,setWindowTitle;function logExceptionOnExit(e){if(e instanceof ExitStatus)return;let toLog=e;if(e&&typeof e=="object"&&e.stack){toLog=[e,e.stack]}err("exiting due to exception: "+toLog)}if(ENVIRONMENT_IS_NODE){if(typeof process=="undefined"||!process.release||process.release.name!=="node")throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - and run it someplace else - like on the web?)");var fs=require("fs");var nodePath=require("path");if(ENVIRONMENT_IS_WORKER){scriptDirectory=nodePath.dirname(scriptDirectory)+"/"}else{scriptDirectory=__dirname+"/"}read_=(filename,binary)=>{filename=isFileURI(filename)?new URL(filename):nodePath.normalize(filename);return fs.readFileSync(filename,binary?undefined:"utf8")};readBinary=filename=>{var ret=read_(filename,true);if(!ret.buffer){ret=new Uint8Array(ret)}assert(ret.buffer);return ret};readAsync=(filename,onload,onerror)=>{filename=isFileURI(filename)?new URL(filename):nodePath.normalize(filename);fs.readFile(filename,function(err,data){if(err)onerror(err);else onload(data.buffer)})};if(process["argv"].length>1){thisProgram=process["argv"][1].replace(/\\/g,"/")}arguments_=process["argv"].slice(2);process["on"]("uncaughtException",function(ex){if(!(ex instanceof ExitStatus)){throw ex}});process["on"]("unhandledRejection",function(reason){throw reason});quit_=(status,toThrow)=>{if(keepRuntimeAlive()){process["exitCode"]=status;throw toThrow}logExceptionOnExit(toThrow);process["exit"](status)};Module["inspect"]=function(){return"[Emscripten Module object]"}}else if(ENVIRONMENT_IS_SHELL){if(typeof process=="object"&&typeof require==="function"||typeof window=="object"||typeof importScripts=="function")throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - and run it someplace else - like on the web?)");if(typeof read!="undefined"){read_=function shell_read(f){return read(f)}}readBinary=function readBinary(f){let data;if(typeof readbuffer=="function"){return new Uint8Array(readbuffer(f))}data=read(f,"binary");assert(typeof data=="object");return data};readAsync=function readAsync(f,onload,onerror){setTimeout(()=>onload(readBinary(f)),0)};if(typeof scriptArgs!="undefined"){arguments_=scriptArgs}else if(typeof arguments!="undefined"){arguments_=arguments}if(typeof quit=="function"){quit_=(status,toThrow)=>{logExceptionOnExit(toThrow);quit(status)}}if(typeof print!="undefined"){if(typeof console=="undefined")console={};console.log=print;console.warn=console.error=typeof printErr!="undefined"?printErr:print}}else if(ENVIRONMENT_IS_WEB||ENVIRONMENT_IS_WORKER){if(ENVIRONMENT_IS_WORKER){scriptDirectory=self.location.href}else if(typeof document!="undefined"&&document.currentScript){scriptDirectory=document.currentScript.src}if(_scriptDir){scriptDirectory=_scriptDir}if(scriptDirectory.indexOf("blob:")!==0){scriptDirectory=scriptDirectory.substr(0,scriptDirectory.replace(/[?#].*/,"").lastIndexOf("/")+1)}else{scriptDirectory=""}if(!(typeof window=="object"||typeof importScripts=="function"))throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - anLine truncated
+
+
+  return createMediapipeSolutionsWasm.ready
+}
+);
+})();
+if (typeof exports === 'object' && typeof module === 'object')
+  module.exports = createMediapipeSolutionsWasm;
+else if (typeof define === 'function' && define['amd'])
+  define([], function() { return createMediapipeSolutionsWasm; });
+else if (typeof exports === 'object')
+  exports["createMediapipeSolutionsWasm"] = createMediapipeSolutionsWasm;

docs/assets/@mediapipe/selfie_segmentation/selfie_segmentation_solution_wasm_bin.js

@@ -0,0 +1,21 @@
+
+var createMediapipeSolutionsWasm = (() => {
+  var _scriptDir = typeof document !== 'undefined' && document.currentScript ? document.currentScript.src : undefined;
+  if (typeof __filename !== 'undefined') _scriptDir = _scriptDir || __filename;
+  return (
+function(createMediapipeSolutionsWasm) {
+  createMediapipeSolutionsWasm = createMediapipeSolutionsWasm || {};
+
+var Module=typeof createMediapipeSolutionsWasm!="undefined"?createMediapipeSolutionsWasm:{};var readyPromiseResolve,readyPromiseReject;Module["ready"]=new Promise(function(resolve,reject){readyPromiseResolve=resolve;readyPromiseReject=reject});["_main","_fflush","___getTypeName","__embind_initialize_bindings","onRuntimeInitialized"].forEach(prop=>{if(!Object.getOwnPropertyDescriptor(Module["ready"],prop)){Object.defineProperty(Module["ready"],prop,{get:()=>abort("You are getting "+prop+" on the Promise object, instead of the instance. Use .then() to get called back with the instance, see the MODULARIZE docs in src/settings.js"),set:()=>abort("You are setting "+prop+" on the Promise object, instead of the instance. Use .then() to get called back with the instance, see the MODULARIZE docs in src/settings.js")})}});var moduleOverrides=Object.assign({},Module);var arguments_=[];var thisProgram="./this.program";var quit_=(status,toThrow)=>{throw toThrow};var ENVIRONMENT_IS_WEB=typeof window=="object";var ENVIRONMENT_IS_WORKER=typeof importScripts=="function";var ENVIRONMENT_IS_NODE=typeof process=="object"&&typeof process.versions=="object"&&typeof process.versions.node=="string";var ENVIRONMENT_IS_SHELL=!ENVIRONMENT_IS_WEB&&!ENVIRONMENT_IS_NODE&&!ENVIRONMENT_IS_WORKER;if(Module["ENVIRONMENT"]){throw new Error("Module.ENVIRONMENT has been deprecated. To force the environment, use the ENVIRONMENT compile-time option (for example, -sENVIRONMENT=web or -sENVIRONMENT=node)")}var scriptDirectory="";function locateFile(path){if(Module["locateFile"]){return Module["locateFile"](path,scriptDirectory)}return scriptDirectory+path}var read_,readAsync,readBinary,setWindowTitle;function logExceptionOnExit(e){if(e instanceof ExitStatus)return;let toLog=e;if(e&&typeof e=="object"&&e.stack){toLog=[e,e.stack]}err("exiting due to exception: "+toLog)}if(ENVIRONMENT_IS_NODE){if(typeof process=="undefined"||!process.release||process.release.name!=="node")throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - and run it someplace else - like on the web?)");var fs=require("fs");var nodePath=require("path");if(ENVIRONMENT_IS_WORKER){scriptDirectory=nodePath.dirname(scriptDirectory)+"/"}else{scriptDirectory=__dirname+"/"}read_=(filename,binary)=>{filename=isFileURI(filename)?new URL(filename):nodePath.normalize(filename);return fs.readFileSync(filename,binary?undefined:"utf8")};readBinary=filename=>{var ret=read_(filename,true);if(!ret.buffer){ret=new Uint8Array(ret)}assert(ret.buffer);return ret};readAsync=(filename,onload,onerror)=>{filename=isFileURI(filename)?new URL(filename):nodePath.normalize(filename);fs.readFile(filename,function(err,data){if(err)onerror(err);else onload(data.buffer)})};if(process["argv"].length>1){thisProgram=process["argv"][1].replace(/\\/g,"/")}arguments_=process["argv"].slice(2);process["on"]("uncaughtException",function(ex){if(!(ex instanceof ExitStatus)){throw ex}});process["on"]("unhandledRejection",function(reason){throw reason});quit_=(status,toThrow)=>{if(keepRuntimeAlive()){process["exitCode"]=status;throw toThrow}logExceptionOnExit(toThrow);process["exit"](status)};Module["inspect"]=function(){return"[Emscripten Module object]"}}else if(ENVIRONMENT_IS_SHELL){if(typeof process=="object"&&typeof require==="function"||typeof window=="object"||typeof importScripts=="function")throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - and run it someplace else - like on the web?)");if(typeof read!="undefined"){read_=function shell_read(f){return read(f)}}readBinary=function readBinary(f){let data;if(typeof readbuffer=="function"){return new Uint8Array(readbuffer(f))}data=read(f,"binary");assert(typeof data=="object");return data};readAsync=function readAsync(f,onload,onerror){setTimeout(()=>onload(readBinary(f)),0)};if(typeof scriptArgs!="undefined"){arguments_=scriptArgs}else if(typeof arguments!="undefined"){arguments_=arguments}if(typeof quit=="function"){quit_=(status,toThrow)=>{logExceptionOnExit(toThrow);quit(status)}}if(typeof print!="undefined"){if(typeof console=="undefined")console={};console.log=print;console.warn=console.error=typeof printErr!="undefined"?printErr:print}}else if(ENVIRONMENT_IS_WEB||ENVIRONMENT_IS_WORKER){if(ENVIRONMENT_IS_WORKER){scriptDirectory=self.location.href}else if(typeof document!="undefined"&&document.currentScript){scriptDirectory=document.currentScript.src}if(_scriptDir){scriptDirectory=_scriptDir}if(scriptDirectory.indexOf("blob:")!==0){scriptDirectory=scriptDirectory.substr(0,scriptDirectory.replace(/[?#].*/,"").lastIndexOf("/")+1)}else{scriptDirectory=""}if(!(typeof window=="object"||typeof importScripts=="function"))throw new Error("not compiled for this environment (did you build to HTML and try to run it not on the web, or set ENVIRONMENT to something - like node - anLine truncated
+
+
+  return createMediapipeSolutionsWasm.ready
+}
+);
+})();
+if (typeof exports === 'object' && typeof module === 'object')
+  module.exports = createMediapipeSolutionsWasm;
+else if (typeof define === 'function' && define['amd'])
+  define([], function() { return createMediapipeSolutionsWasm; });
+else if (typeof exports === 'object')
+  exports["createMediapipeSolutionsWasm"] = createMediapipeSolutionsWasm;

docs/assets/example/ads.js

@@ -1,48 +1,48 @@
 // npm i artplayer-plugin-ads
 // import artplayerPluginAds from 'artplayer-plugin-ads';
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    autoSize: true,
+  autoSize: true,
-    fullscreen: true,
+  fullscreen: true,
-    fullscreenWeb: true,
+  fullscreenWeb: true,
-    plugins: [
+  plugins: [
-        artplayerPluginAds({
+    artplayerPluginAds({
-            // html广告，假如是视频广告则忽略该值
+      // html广告，假如是视频广告则忽略该值
-            html: '<img src="/assets/sample/poster.jpg">',
+      html: '<img src="/assets/sample/poster.jpg">',
 
-            // 视频广告的地址
+      // 视频广告的地址
-            video: '/assets/sample/test1.mp4',
+      video: '/assets/sample/test1.mp4',
 
-            // 广告跳转网址，为空则不跳转
+      // 广告跳转网址，为空则不跳转
-            url: 'http://artplayer.org',
+      url: 'http://artplayer.org',
 
-            // 必须观看的时长，期间不能被跳过，单位为秒
+      // 必须观看的时长，期间不能被跳过，单位为秒
-            // 当该值大于或等于totalDuration时，不能提前关闭广告
+      // 当该值大于或等于totalDuration时，不能提前关闭广告
-            // 当该值等于或小于0时，则随时都可以关闭广告
+      // 当该值等于或小于0时，则随时都可以关闭广告
-            playDuration: 5,
+      playDuration: 5,
 
-            // 广告总时长，单位为秒
+      // 广告总时长，单位为秒
-            totalDuration: 10,
+      totalDuration: 10,
 
-            // 多语言支持
+      // 多语言支持
-            i18n: {
+      i18n: {
-                close: '关闭广告',
+        close: '关闭广告',
-                countdown: '%s秒',
+        countdown: '%s秒',
-                detail: '查看详情',
+        detail: '查看详情',
-                canBeClosed: '%s秒后可关闭广告',
+        canBeClosed: '%s秒后可关闭广告',
-            },
+      },
-        }),
+    }),
-    ],
+  ],
-});
+})
 
 // 广告被点击
 art.on('artplayerPluginAds:click', (ads) => {
-    console.info('广告被点击', ads);
+  console.info('广告被点击', ads)
-});
+})
 
 // 广告被跳过
 art.on('artplayerPluginAds:skip', (ads) => {
-    console.info('广告被跳过', ads);
+  console.info('广告被跳过', ads)
-});
+})

docs/assets/example/ambilight.js

@@ -0,0 +1,16 @@
+// npm i artplayer-plugin-ambilight
+// import artplayerPluginAmbilight from 'artplayer-plugin-ambilight';
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/video.mp4',
+  autoSize: true,
+  plugins: [
+    artplayerPluginAmbilight({
+      blur: '50px',
+      opacity: 1,
+      frequency: 10,
+      duration: 0.3,
+    }),
+  ],
+})

docs/assets/example/asr.js

@@ -0,0 +1,61 @@
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/steve-jobs.mp4',
+  autoSize: true,
+  fullscreen: true,
+  fullscreenWeb: true,
+  moreVideoAttr: {
+    // crossOrigin: 'anonymous',
+  },
+  plugins: [
+    artplayerPluginAsr({
+      length: 2,
+      interval: 40,
+      sampleRate: 16000,
+      autoHideTimeout: 10000,
+      // Use your AI tool to convert pcm into subtitles
+      onAudioChunk: ({ pcm }) => startAsr(pcm),
+    }),
+  ],
+})
+
+let ws = null
+let loading = false
+
+function stopAsr() {
+  try {
+    ws.send(JSON.stringify({ type: 'end' }))
+    ws.close()
+  }
+  catch {}
+  ws = null
+  loading = false
+}
+
+async function startAsr(buffer) {
+  if (loading)
+    return
+  if (!ws) {
+    loading = true
+    const api = 'https://api.aimu.app/asr/tencent?engine_model_type=16k_en'
+    const { url } = await (await fetch(api)).json()
+    ws = new WebSocket(url)
+    ws.binaryType = 'arraybuffer'
+    ws.onmessage = (event) => {
+      const { code, result, message } = JSON.parse(event.data)
+      if (code === 0) {
+        art.plugins.artplayerPluginAsr.append(result?.voice_text_str)
+      }
+      else {
+        console.error(code, message)
+        stopAsr()
+      }
+    }
+    loading = false
+  }
+  if (ws?.readyState === WebSocket.OPEN) {
+    ws.send(buffer)
+  }
+}
+
+art.on('destroy', stopAsr)

docs/assets/example/asr.local.js

@@ -0,0 +1,68 @@
+/* global Artplayer, artplayerPluginAsr */
+// Local audio capture demo. The subtitles below are simulated, not recognized speech.
+// No audio is uploaded; only the sample media is loaded from this local site.
+const statistics = document.createElement('div')
+statistics.textContent = 'Local ASR demo: press play. No recognition service is used.'
+let chunks = 0
+let pcmBytes = 0
+let wavBytes = 0
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/steve-jobs.mp4',
+  autoSize: true,
+  fullscreen: true,
+  fullscreenWeb: true,
+  layers: [{
+    name: 'asr-local-statistics',
+    html: statistics,
+    style: {
+      position: 'absolute',
+      top: '12px',
+      left: '12px',
+      right: '12px',
+      padding: '8px 12px',
+      background: 'rgba(0, 0, 0, 0.65)',
+      color: '#fff',
+      fontSize: '12px',
+      whiteSpace: 'pre-line',
+      pointerEvents: 'none',
+    },
+  }],
+  controls: [{
+    name: 'asr-local-stop',
+    position: 'right',
+    html: 'Stop ASR',
+    tooltip: 'Stop capture; pause and play to restart',
+    async click() {
+      await art.plugins.artplayerPluginAsr.stop()
+      if (!art.isDestroy)
+        statistics.textContent = 'Local capture stopped. Pause and play to restart. Nothing was uploaded.'
+    },
+  }],
+  plugins: [artplayerPluginAsr({
+    length: 2,
+    interval: 250,
+    sampleRate: 16000,
+    autoHideTimeout: 5000,
+    onAudioChunk({ pcm, wav }) {
+      if (art.isDestroy)
+        return
+      chunks++
+      pcmBytes += pcm.byteLength
+      wavBytes += wav.byteLength
+      const sampleRate = new DataView(wav).getUint32(24, true)
+      const samples = new DataView(pcm)
+      let peak = 0
+      for (let offset = 0; offset < pcm.byteLength; offset += 2)
+        peak = Math.max(peak, Math.abs(samples.getInt16(offset, true)))
+      const duration = (pcmBytes / 2 / sampleRate).toFixed(2)
+      statistics.textContent = [
+        'Local capture only - simulated subtitles, no speech recognition',
+        `Chunks: ${chunks} | ${sampleRate} Hz mono PCM16 | ${duration} seconds captured`,
+        `PCM: ${pcmBytes} bytes | WAV: ${wavBytes} bytes | Current peak: ${peak}`,
+      ].join('\n')
+      return `Simulated local subtitle: audio chunk ${chunks} received.`
+    },
+  })],
+})

docs/assets/example/audio.track.js

@@ -0,0 +1,14 @@
+// npm i artplayer-plugin-audio-track
+// import artplayerPluginAudioTrack from 'artplayer-plugin-audio-track';
+
+var art = new Artplayer({
+    container: '.artplayer-app',
+    url: '/assets/sample/sprite-fight.mp4',
+    plugins: [
+        artplayerPluginAudioTrack({
+            url: '/assets/sample/sprite-fight.aac',
+            offset: 0, 
+            sync: 0.3, 
+        }),
+    ],
+});

docs/assets/example/auto.thumbnail.js

@@ -0,0 +1,12 @@
+// npm i artplayer-plugin-auto-thumbnail
+// import artplayerPluginAutoThumbnail from 'artplayer-plugin-auto-thumbnail';
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/video.mp4',
+  plugins: [
+    artplayerPluginAutoThumbnail({
+      //
+    }),
+  ],
+})

docs/assets/example/canvas.js

@@ -0,0 +1,33 @@
+// npm i artplayer-proxy-canvas
+// import artplayerProxyCanvas from 'artplayer-proxy-canvas';
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/video.mp4',
+  poster: '/assets/sample/poster.jpg',
+  volume: 0.5,
+  autoplay: false,
+  autoSize: false,
+  screenshot: true,
+  setting: true,
+  loop: true,
+  flip: true,
+  pip: true,
+  playbackRate: true,
+  aspectRatio: true,
+  fullscreen: true,
+  fullscreenWeb: true,
+  miniProgressBar: true,
+  autoPlayback: true,
+  autoOrientation: true,
+  subtitle: {
+    url: '/assets/sample/subtitle.srt',
+  },
+  thumbnails: {
+    url: '/assets/sample/thumbnails.png',
+    number: 60,
+    column: 10,
+    scale: 0.85,
+  },
+  proxy: artplayerProxyCanvas(),
+})

docs/assets/example/chapter.js

@@ -1,28 +1,28 @@
 // npm i artplayer-plugin-chapter
 // import artplayerPluginChapter from 'artplayer-plugin-chapter';
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    autoSize: true,
+  autoSize: true,
-	fullscreen: true,
+  fullscreen: true,
-	fullscreenWeb: true,
+  fullscreenWeb: true,
-	miniProgressBar: true,
+  miniProgressBar: true,
-	autoOrientation: true,
+  autoOrientation: true,
-	thumbnails: {
+  thumbnails: {
-        url: '/assets/sample/thumbnails.png',
+    url: '/assets/sample/thumbnails.png',
-        number: 60,
+    number: 60,
-        column: 10,
+    column: 10,
-    },
+  },
-    plugins: [
+  plugins: [
-        artplayerPluginChapter({
+    artplayerPluginChapter({
-            chapters: [
+      chapters: [
-                { start: 0, end: 18, title: 'One more chance' },
+        { start: 0, end: 18, title: 'One more chance' },
-                { start: 18, end: 36, title: '谁でもいいはずなのに' },
+        { start: 18, end: 36, title: '谁でもいいはずなのに' },
-                { start: 36, end: 54, title: '夏の想い出がまわる' },
+        { start: 36, end: 54, title: '夏の想い出がまわる' },
-                { start: 54, end: 72, title: 'こんなとこにあるはずもないのに' },
+        { start: 54, end: 72, title: 'こんなとこにあるはずもないのに' },
-                { start: 72, end: Infinity, title: '终わり' },
+        { start: 72, end: Infinity, title: '终わり' },
-            ]
+      ],
-        }),
+    }),
-    ],
+  ],
-});
+})

docs/assets/example/chromecast.js

@@ -1,15 +1,15 @@
 // npm i artplayer-plugin-chromecast
 // import artplayerPluginChromecast from 'artplayer-plugin-chromecast';
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    fullscreen: true,
+  fullscreen: true,
-    fullscreenWeb: true,
+  fullscreenWeb: true,
-    plugins: [
+  plugins: [
-        artplayerPluginChromecast({
+    artplayerPluginChromecast({
-            // sdk: '', // The URL of the Cast SDK
+      // sdk: '', // The URL of the Cast SDK
-            // mimeType: '', // The MIME type of the media
+      // mimeType: '', // The MIME type of the media
-        }),
+    }),
-    ],
+  ],
-});
+})

docs/assets/example/danmuku.js

@@ -2,53 +2,53 @@
 // import artplayerPluginDanmuku from 'artplayer-plugin-danmuku';
 // 使用文档 https://artplayer.org/document/plugin/danmuku.html
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    autoSize: true,
+  autoSize: true,
-    fullscreen: true,
+  fullscreen: true,
-    fullscreenWeb: true,
+  fullscreenWeb: true,
-    autoOrientation: true,
+  autoOrientation: true,
-    plugins: [
+  plugins: [
-        artplayerPluginDanmuku({
+    artplayerPluginDanmuku({
-            danmuku: '/assets/sample/danmuku.xml',
+      danmuku: '/assets/sample/danmuku.xml',
 
-            // 以下为非必填
+      // 以下为非必填
-            speed: 5, // 弹幕持续时间，范围在[1 ~ 10]
+      speed: 5, // 弹幕持续时间，范围在[1 ~ 10]
-            margin: [10, '25%'], // 弹幕上下边距，支持像素数字和百分比
+      margin: [10, '25%'], // 弹幕上下边距，支持像素数字和百分比
-            opacity: 1, // 弹幕透明度，范围在[0 ~ 1]
+      opacity: 1, // 弹幕透明度，范围在[0 ~ 1]
-            color: '#FFFFFF', // 默认弹幕颜色，可以被单独弹幕项覆盖
+      color: '#FFFFFF', // 默认弹幕颜色，可以被单独弹幕项覆盖
-            mode: 0, // 默认弹幕模式: 0: 滚动，1: 顶部，2: 底部
+      mode: 0, // 默认弹幕模式: 0: 滚动，1: 顶部，2: 底部
-            modes: [0, 1, 2], // 弹幕可见的模式
+      modes: [0, 1, 2], // 弹幕可见的模式
-            fontSize: 25, // 弹幕字体大小，支持像素数字和百分比
+      fontSize: 25, // 弹幕字体大小，支持像素数字和百分比
-            antiOverlap: true, // 弹幕是否防重叠
+      antiOverlap: true, // 弹幕是否防重叠
-            synchronousPlayback: false, // 是否同步播放速度
+      synchronousPlayback: false, // 是否同步播放速度
-            mount: undefined, // 弹幕发射器挂载点, 默认为播放器控制栏中部
+      mount: undefined, // 弹幕发射器挂载点, 默认为播放器控制栏中部
-            heatmap: true, // 是否开启热力图
+      heatmap: true, // 是否开启热力图
-            width: 512, // 当播放器宽度小于此值时，弹幕发射器置于播放器底部
+      width: 512, // 当播放器宽度小于此值时，弹幕发射器置于播放器底部
-            points: [], // 热力图数据
+      points: [], // 热力图数据
-            filter: (danmu) => danmu.text.length <= 100, // 弹幕载入前的过滤器
+      filter: danmu => danmu.text.length <= 100, // 弹幕载入前的过滤器
-            beforeVisible: () => true, // 弹幕显示前的过滤器，返回 true 则可以发送
+      beforeVisible: () => true, // 弹幕显示前的过滤器，返回 true 则可以发送
-            visible: true, // 弹幕层是否可见
+      visible: true, // 弹幕层是否可见
-            emitter: true, // 是否开启弹幕发射器
+      emitter: true, // 是否开启弹幕发射器
-            maxLength: 200, // 弹幕输入框最大长度, 范围在[1 ~ 1000]
+      maxLength: 200, // 弹幕输入框最大长度, 范围在[1 ~ 1000]
-            lockTime: 5, // 输入框锁定时间，范围在[1 ~ 60]
+      lockTime: 5, // 输入框锁定时间，范围在[1 ~ 60]
-            theme: 'dark', // 弹幕主题，支持 dark 和 light，只在自定义挂载时生效
+      theme: 'dark', // 弹幕主题，支持 dark 和 light，只在自定义挂载时生效
-            OPACITY: {}, // 不透明度配置项
+      OPACITY: {}, // 不透明度配置项
-            FONT_SIZE: {}, // 弹幕字号配置项
+      FONT_SIZE: {}, // 弹幕字号配置项
-            MARGIN: {}, // 显示区域配置项
+      MARGIN: {}, // 显示区域配置项
-            SPEED: {}, // 弹幕速度配置项
+      SPEED: {}, // 弹幕速度配置项
-            COLOR: [], // 颜色列表配置项
+      COLOR: [], // 颜色列表配置项
 
-            // 手动发送弹幕前的过滤器，返回 true 则可以发送，可以做存库处理
+      // 手动发送弹幕前的过滤器，返回 true 则可以发送，可以做存库处理
-            beforeEmit(danmu) {
+      beforeEmit(danmu) {
-               return new Promise((resolve) => {
+        return new Promise((resolve) => {
-                    console.log(danmu);
+          console.log(danmu)
-                    setTimeout(() => {
+          setTimeout(() => {
-                        resolve(true);
+            resolve(true)
-                    }, 1000);
+          }, 1000)
-               });
+        })
-            },
+      },
-        }),
+    }),
-    ],
+  ],
-});
+})

docs/assets/example/danmuku.mask.js

@@ -0,0 +1,22 @@
+// npm i artplayer-plugin-danmuku-mask
+// import artplayerPluginDanmukuMask from 'artplayer-plugin-danmuku-mask';
+
+// npm i @mediapipe/selfie_segmentation
+// 把 node_modules/@mediapipe/selfie_segmentation 目录复制到你的项目下
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/steve-jobs.mp4',
+  autoSize: true,
+  fullscreen: true,
+  fullscreenWeb: true,
+  autoOrientation: true,
+  plugins: [
+    artplayerPluginDanmuku({
+      danmuku: '/assets/sample/danmuku.xml',
+    }),
+    artplayerPluginDanmukuMask({
+      solutionPath: '/assets/@mediapipe/selfie_segmentation',
+    }),
+  ],
+})

docs/assets/example/dash.control.js

@@ -0,0 +1,64 @@
+// npm i dashjs
+// npm i artplayer-plugin-dash-control
+
+// import dashjs from 'dashjs';
+// import artplayerPluginDashControl from 'artplayer-plugin-dash-control';
+
+const useDash = dashjs.supportsMediaSource()
+let dash
+
+function destroyDash() {
+  const previous = dash
+  dash = undefined
+  if (previous)
+    previous.destroy()
+}
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: 'https://media.axprod.net/TestVectors/v7-Clear/Manifest_1080p.mpd',
+  setting: true,
+  plugins: useDash
+    ? [
+        artplayerPluginDashControl({
+          quality: {
+            // Show quality choices in the controls
+            control: true,
+            // Show quality choices in settings
+            setting: true,
+            // Get the quality name from level
+            getName: level => `${level.height}P`,
+            // I18n
+            title: 'Quality',
+            auto: 'Auto',
+          },
+          audio: {
+            // Show audios in control
+            control: true,
+            // Show audios in setting
+            setting: true,
+            // Get the audio name from track
+            getName: track => track.lang?.toUpperCase() || String(track.id ?? 'Audio'),
+            // I18n
+            title: 'Audio',
+            auto: 'Auto',
+          },
+        }),
+      ]
+    : [],
+  customType: {
+    mpd: function playMpd(video, url, art) {
+      destroyDash()
+      if (useDash) {
+        dash = dashjs.MediaPlayer().create()
+        art.dash = dash
+        dash.initialize(video, url, art.option.autoplay)
+      }
+      else {
+        art.notice.show = 'Unsupported playback format: mpd'
+      }
+    },
+  },
+})
+
+art.on('destroy', destroyDash)

docs/assets/example/dash.js

@@ -2,26 +2,28 @@
 // import dashjs from 'dashjs';
 
 function playMpd(video, url, art) {
-    if (dashjs.supportsMediaSource()) {
+  if (dashjs.supportsMediaSource()) {
-        if (art.dash) art.dash.destroy();
+    if (art.dash)
-        const dash = dashjs.MediaPlayer().create();
+      art.dash.destroy()
-        dash.initialize(video, url, art.option.autoplay);
+    const dash = dashjs.MediaPlayer().create()
-        art.dash = dash; 
+    dash.initialize(video, url, art.option.autoplay)
-        art.on('destroy', () => dash.destroy());
+    art.dash = dash
-    } else {
+    art.on('destroy', () => dash.destroy())
-        art.notice.show = 'Unsupported playback format: mpd';
+  }
-    }
+  else {
+    art.notice.show = 'Unsupported playback format: mpd'
+  }
 }
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: 'https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd',
+  url: 'https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd',
-    type: 'mpd',
+  type: 'mpd',
-    customType: {
+  customType: {
-        mpd: playMpd
+    mpd: playMpd,
-    },
+  },
-});
+})
 
 art.on('ready', () => {
-    console.info(art.dash);
+  console.info(art.dash)
-});
+})

docs/assets/example/dash.quality.js

@@ -1,40 +0,0 @@
-// npm i dashjs
-// npm i artplayer-plugin-dash-quality
-
-// import dashjs from 'dashjs';
-// import artplayerPluginDashQuality from 'artplayer-plugin-dash-quality';
-
-var art = new Artplayer({
-    container: '.artplayer-app',
-    url: 'https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd',
-    setting: true,
-    plugins: [
-        artplayerPluginDashQuality({
-            // Show quality in control
-            control: true,
-
-            // Show quality in setting
-            setting: true,
-
-            // Get the resolution text from level
-			getResolution: (level) => level.height + 'P',
-
-            // I18n
-            title: 'Quality',
-            auto: 'Auto',
-        }),
-    ],
-    customType: {
-        mpd: function playMpd(video, url, art) {
-            if (dashjs.supportsMediaSource()) {
-                if (art.dash) art.dash.destroy();
-                const dash = dashjs.MediaPlayer().create();
-                dash.initialize(video, url, art.option.autoplay);
-                art.dash = dash; 
-                art.on('destroy', () => dash.destroy());
-            } else {
-                art.notice.show = 'Unsupported playback format: mpd';
-            }
-        }
-    },
-});

docs/assets/example/document.pip.js

@@ -0,0 +1,19 @@
+// npm i artplayer-plugin-document-pip
+// import artplayerPluginDocumentPip from 'artplayer-plugin-document-pip';
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/video.mp4',
+  plugins: [
+    artplayerPluginDocumentPip({
+      width: 480,
+      height: 270,
+      fallbackToVideoPiP: true,
+      placeholder: `Playing in Document Picture-in-Picture`,
+    }),
+  ],
+})
+
+art.on('document-pip', (state) => {
+  console.log('Document Picture-in-Picture', state)
+})

docs/assets/example/flv.js

@@ -2,27 +2,29 @@
 // import flvjs from 'flv.js';
 
 function playFlv(video, url, art) {
-    if (flvjs.isSupported()) {
+  if (flvjs.isSupported()) {
-        if (art.flv) art.flv.destroy();
+    if (art.flv)
-        const flv = flvjs.createPlayer({ type: 'flv', url });
+      art.flv.destroy()
-        flv.attachMediaElement(video);
+    const flv = flvjs.createPlayer({ type: 'flv', url })
-        flv.load();
+    flv.attachMediaElement(video)
-        art.flv = flv; 
+    flv.load()
-        art.on('destroy', () => flv.destroy());
+    art.flv = flv
-    } else {
+    art.on('destroy', () => flv.destroy())
-        art.notice.show = 'Unsupported playback format: flv';
+  }
-    }
+  else {
+    art.notice.show = 'Unsupported playback format: flv'
+  }
 }
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.flv',
+  url: '/assets/sample/video.flv',
-    type: 'flv',
+  type: 'flv',
-    customType: {
+  customType: {
-        flv: playFlv,
+    flv: playFlv,
-    },
+  },
-});
+})
 
 art.on('ready', () => {
-    console.info(art.flv);
+  console.info(art.flv)
-});
+})

docs/assets/example/hls.control.js

@@ -0,0 +1,68 @@
+// npm i hls.js
+// npm i artplayer-plugin-hls-control
+
+// import Hls from 'hls.js';
+// import artplayerPluginHlsControl from 'artplayer-plugin-hls-control';
+
+const useHls = Hls.isSupported()
+let hls
+
+function destroyHls() {
+  const previous = hls
+  hls = undefined
+  if (previous)
+    previous.destroy()
+}
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: 'https://playertest.longtailvideo.com/adaptive/elephants_dream_v4/index.m3u8',
+  setting: true,
+  plugins: useHls
+    ? [
+        artplayerPluginHlsControl({
+          quality: {
+            // Show quality choices in the controls
+            control: true,
+            // Show quality choices in settings
+            setting: true,
+            // Get the quality name from level
+            getName: level => `${level.height}P`,
+            // I18n
+            title: 'Quality',
+            auto: 'Auto',
+          },
+          audio: {
+            // Show audios in control
+            control: true,
+            // Show audios in setting
+            setting: true,
+            // Get the audio name from track
+            getName: track => track.name || track.lang || 'Audio',
+            // I18n
+            title: 'Audio',
+            auto: 'Auto',
+          },
+        }),
+      ]
+    : [],
+  customType: {
+    m3u8: function playM3u8(video, url, art) {
+      destroyHls()
+      if (useHls) {
+        hls = new Hls()
+        art.hls = hls
+        hls.loadSource(url)
+        hls.attachMedia(video)
+      }
+      else if (video.canPlayType('application/vnd.apple.mpegurl')) {
+        video.src = url
+      }
+      else {
+        art.notice.show = 'Unsupported playback format: m3u8'
+      }
+    },
+  },
+})
+
+art.on('destroy', destroyHls)

docs/assets/example/hls.js

@@ -2,29 +2,32 @@
 // import Hls from 'hls.js';
 
 function playM3u8(video, url, art) {
-    if (Hls.isSupported()) {
+  if (Hls.isSupported()) {
-        if (art.hls) art.hls.destroy();
+    if (art.hls)
-        const hls = new Hls();
+      art.hls.destroy()
-        hls.loadSource(url);
+    const hls = new Hls()
-        hls.attachMedia(video);
+    hls.loadSource(url)
-        art.hls = hls;
+    hls.attachMedia(video)
-        art.on('destroy', () => hls.destroy());
+    art.hls = hls
-    } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
+    art.on('destroy', () => hls.destroy())
-        video.src = url;
+  }
-    } else {
+  else if (video.canPlayType('application/vnd.apple.mpegurl')) {
-        art.notice.show = 'Unsupported playback format: m3u8';
+    video.src = url
-    }
+  }
+  else {
+    art.notice.show = 'Unsupported playback format: m3u8'
+  }
 }
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
+  url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
-    type: 'm3u8',
+  type: 'm3u8',
-    customType: {
+  customType: {
-        m3u8: playM3u8,
+    m3u8: playM3u8,
-    },
+  },
-});
+})
 
 art.on('ready', () => {
-    console.info(art.hls);
+  console.info(art.hls)
-});
+})

docs/assets/example/hls.quality.js

@@ -1,43 +0,0 @@
-// npm i hls.js
-// npm i artplayer-plugin-hls-quality
-
-// import Hls from 'hls.js';
-// import artplayerPluginHlsQuality from 'artplayer-plugin-hls-quality';
-
-var art = new Artplayer({
-    container: '.artplayer-app',
-    url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
-    setting: true,
-    plugins: [
-        artplayerPluginHlsQuality({
-            // Show quality in control
-            control: true,
-
-            // Show quality in setting
-            setting: true,
-
-            // Get the resolution text from level
-			getResolution: (level) => level.height + 'P',
-
-            // I18n
-            title: 'Quality',
-            auto: 'Auto',
-        }),
-    ],
-    customType: {
-        m3u8: function playM3u8(video, url, art) {
-            if (Hls.isSupported()) {
-				if (art.hls) art.hls.destroy();
-				const hls = new Hls();
-				hls.loadSource(url);
-				hls.attachMedia(video);
-				art.hls = hls;
-				art.on('destroy', () => hls.destroy());
-            } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
-                video.src = url;
-            } else {
-                art.notice.show = 'Unsupported playback format: m3u8';
-            }
-        }
-    },
-});

docs/assets/example/iframe.js

@@ -1,46 +1,55 @@
-// npm i artplayer-plugin-iframe
+// npm i artplayer-tool-iframe
-// import ArtplayerPluginIframe from 'artplayer-plugin-iframe';
+// import ArtplayerToolIframe from 'artplayer-tool-iframe';
 
-const $iframe = document.createElement('iframe');
+const $iframe = document.createElement('iframe')
-$iframe.allowFullscreen = true;
+$iframe.allowFullscreen = true
-$iframe.width = '100%';
+$iframe.width = '100%'
-$iframe.height = '100%';
+$iframe.height = '100%'
 
-const $container = document.querySelector('.artplayer-app');
+const $container = document.querySelector('.artplayer-app')
-$container.innerHTML = '';
+$container.innerHTML = ''
-$container.appendChild($iframe);
+$container.appendChild($iframe)
 
-const iframe = new ArtplayerPluginIframe({
+const iframe = new ArtplayerToolIframe({
-    iframe: $iframe,
+  iframe: $iframe,
-    url: '/iframe.html',
+  url: '/iframe.html',
-});
+})
+
+window.addEventListener('artplayer:example:cleanup', () => {
+  iframe.destroy()
+  $iframe.remove()
+}, { once: true })
 
 iframe.message(({ type, data }) => {
-    switch (type) {
+  switch (type) {
-        case 'fullscreenWeb':
+    case 'fullscreenWeb':
-            if (data) {
+      if (data) {
-                $iframe.classList.add('fullscreenWeb');
+        $iframe.classList.add('fullscreenWeb')
-            } else {
+      }
-                $iframe.classList.remove('fullscreenWeb');
+      else {
-            }
+        $iframe.classList.remove('fullscreenWeb')
-            break;
+      }
-        default:
+      break
-            break;
+    default:
-    }
+      break
-});
+  }
+})
 
 iframe.commit(() => {
-    var art = new Artplayer({
+  const art = new Artplayer({
-        container: '.artplayer-app',
+    container: '.artplayer-app',
-        url: '/assets/sample/video.mp4',
+    url: '/assets/sample/video.mp4',
-        fullscreen: true,
+    fullscreen: true,
-        fullscreenWeb: true,
+    fullscreenWeb: true,
-    });
+  })
 
-    art.on('fullscreenWeb', (state) => {
+  art.on('fullscreenWeb', (state) => {
-        ArtplayerPluginIframe.postMessage({
+    ArtplayerToolIframe.postMessage({
-            type: 'fullscreenWeb',
+      type: 'fullscreenWeb',
-            data: state,
+      data: state,
-        });
+    })
-    });
+  })
-});
+}).catch((error) => {
+  if (!iframe.destroyed)
+    console.error(error)
+})

docs/assets/example/index.js

@@ -1,181 +1,190 @@
 var art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    poster: '/assets/sample/poster.jpg',
+  poster: '/assets/sample/poster.jpg',
-    volume: 0.5,
+  volume: 0.5,
-    isLive: false,
+  isLive: false,
-    muted: false,
+  muted: false,
-    autoplay: false,
+  autoplay: false,
-    pip: true,
+  pip: true,
-    autoSize: true,
+  autoSize: true,
-    autoMini: true,
+  autoMini: true,
-    screenshot: true,
+  screenshot: true,
-    setting: true,
+  setting: true,
-    loop: true,
+  loop: true,
-    flip: true,
+  flip: true,
-    playbackRate: true,
+  playbackRate: true,
-    aspectRatio: true,
+  aspectRatio: true,
-    fullscreen: true,
+  fullscreen: true,
-    fullscreenWeb: true,
+  fullscreenWeb: true,
-    subtitleOffset: true,
+  subtitleOffset: true,
-    miniProgressBar: true,
+  miniProgressBar: true,
-    mutex: true,
+  mutex: true,
-    backdrop: true,
+  backdrop: true,
-    playsInline: true,
+  playsInline: true,
-    autoPlayback: true,
+  autoPlayback: true,
-    airplay: true,
+  airplay: true,
-    theme: '#23ade5',
+  theme: '#23ade5',
-    lang: navigator.language.toLowerCase(),
+  lang: navigator.language.toLowerCase(),
-    moreVideoAttr: {
+  moreVideoAttr: {
-        crossOrigin: 'anonymous',
+    crossOrigin: 'anonymous',
+  },
+  settings: [
+    {
+      width: 200,
+      html: 'Subtitle',
+      tooltip: 'Bilingual',
+      icon: '<img width="22" height="22" src="/assets/img/subtitle.svg">',
+      selector: [
+        {
+          html: 'Display',
+          tooltip: 'Show',
+          switch: true,
+          onSwitch(item) {
+            item.tooltip = item.switch ? 'Hide' : 'Show'
+            art.subtitle.show = !item.switch
+            return !item.switch
+          },
+        },
+        {
+          default: true,
+          html: 'Bilingual',
+          url: '/assets/sample/subtitle.srt',
+        },
+        {
+          html: 'Chinese',
+          url: '/assets/sample/subtitle.cn.srt',
+        },
+        {
+          html: 'Japanese',
+          url: '/assets/sample/subtitle.jp.srt',
+        },
+      ],
+      onSelect(item) {
+        art.subtitle.switch(item.url, {
+          name: item.html,
+        })
+        return item.html
+      },
     },
-    settings: [
+    {
-        {
+      html: 'Switcher',
-            width: 200,
+      icon: '<img width="22" height="22" src="/assets/img/state.svg">',
-            html: 'Subtitle',
+      tooltip: 'OFF',
-            tooltip: 'Bilingual',
+      switch: false,
-            icon: '<img width="22" heigth="22" src="/assets/img/subtitle.svg">',
+      onSwitch(item) {
-            selector: [
+        item.tooltip = item.switch ? 'OFF' : 'ON'
-                {
+        console.info('You clicked on the custom switch', item.switch)
-                    html: 'Display',
+        return !item.switch
-                    tooltip: 'Show',
+      },
-                    switch: true,
-                    onSwitch: function (item) {
-                        item.tooltip = item.switch ? 'Hide' : 'Show';
-                        art.subtitle.show = !item.switch;
-                        return !item.switch;
-                    },
-                },
-                {
-                    default: true,
-                    html: 'Bilingual',
-                    url: '/assets/sample/subtitle.srt',
-                },
-                {
-                    html: 'Chinese',
-                    url: '/assets/sample/subtitle.cn.srt',
-                },
-                {
-                    html: 'Japanese',
-                    url: '/assets/sample/subtitle.jp.srt',
-                },
-            ],
-            onSelect: function (item) {
-                art.subtitle.switch(item.url, {
-                    name: item.html,
-                });
-                return item.html;
-            },
-        },
-        {
-            html: 'Switcher',
-            icon: '<img width="22" heigth="22" src="/assets/img/state.svg">',
-            tooltip: 'OFF',
-            switch: false,
-            onSwitch: function (item) {
-                item.tooltip = item.switch ? 'OFF' : 'ON';
-                console.info('You clicked on the custom switch', item.switch);
-                return !item.switch;
-            },
-        },
-        {
-            html: 'Slider',
-            icon: '<img width="22" heigth="22" src="/assets/img/state.svg">',
-            tooltip: '5x',
-            range: [5, 1, 10, 0.1],
-            onRange: function (item) {
-                return item.range + 'x';
-            },
-        },
-    ],
-    contextmenu: [
-        {
-            html: 'Custom menu',
-            click: function (contextmenu) {
-                console.info('You clicked on the custom menu');
-                contextmenu.show = false;
-            },
-        },
-    ],
-    layers: [
-        {
-            html: '<img width="100" src="/assets/sample/layer.png">',
-            click: function () {
-                window.open('https://aimu.app');
-                console.info('You clicked on the custom layer');
-            },
-            style: {
-                position: 'absolute',
-                top: '20px',
-                right: '20px',
-                opacity: '.9',
-            },
-        },
-    ],
-    quality: [
-        {
-            default: true,
-            html: 'SD 480P',
-            url: '/assets/sample/video.mp4',
-        },
-        {
-            html: 'HD 720P',
-            url: '/assets/sample/video.mp4',
-        },
-    ],
-    thumbnails: {
-        url: '/assets/sample/thumbnails.png',
-        number: 60,
-        column: 10,
     },
-    subtitle: {
+    {
-        url: '/assets/sample/subtitle.srt',
+      html: 'Slider',
-        type: 'srt',
+      icon: '<img width="22" height="22" src="/assets/img/state.svg">',
-        style: {
+      tooltip: '5x',
-            color: '#fe9200',
+      range: [5, 1, 10, 0.1],
-            fontSize: '20px',
+      onRange(item) {
-        },
+        return `${item.range[0]}x`
-        encoding: 'utf-8',
+      },
     },
-    highlight: [
+    {
-        {
+      html: 'Button',
-            time: 15,
+      icon: '<img width="22" height="22" src="/assets/img/state.svg">',
-            text: 'One more chance',
+      tooltip: 'tooltip',
-        },
+      onClick() {
-        {
+        return 'Button clicked'
-            time: 30,
+      },
-            text: '谁でもいいはずなのに',
-        },
-        {
-            time: 45,
-            text: '夏の想い出がまわる',
-        },
-        {
-            time: 60,
-            text: 'こんなとこにあるはずもないのに',
-        },
-        {
-            time: 75,
-            text: '终わり',
-        },
-    ],
-    controls: [
-        {
-            position: 'right',
-            html: 'Control',
-            index: 1,
-            tooltip: 'Control Tooltip',
-            style: {
-                marginRight: '20px',
-            },
-            click: function () {
-                console.info('You clicked on the custom control');
-            },
-        },
-    ],
-    icons: {
-        loading: '<img src="/assets/img/ploading.gif">',
-        state: '<img width="150" heigth="150" src="/assets/img/state.svg">',
-        indicator: '<img width="16" heigth="16" src="/assets/img/indicator.svg">',
     },
-});
+  ],
+  contextmenu: [
+    {
+      html: 'Custom menu',
+      click(contextmenu) {
+        console.info('You clicked on the custom menu')
+        contextmenu.show = false
+      },
+    },
+  ],
+  layers: [
+    {
+      html: '<img width="100" src="/assets/sample/layer.png">',
+      click() {
+        window.open('https://aimu.app')
+        console.info('You clicked on the custom layer')
+      },
+      style: {
+        position: 'absolute',
+        top: '20px',
+        right: '20px',
+        opacity: '.9',
+      },
+    },
+  ],
+  quality: [
+    {
+      default: true,
+      html: 'SD 480P',
+      url: '/assets/sample/video.mp4?q=480',
+    },
+    {
+      html: 'HD 720P',
+      url: '/assets/sample/video.mp4?q=720',
+    },
+  ],
+  thumbnails: {
+    url: '/assets/sample/thumbnails.png',
+    number: 60,
+    column: 10,
+    scale: 0.85,
+  },
+  subtitle: {
+    url: '/assets/sample/subtitle.srt',
+    type: 'srt',
+    style: {
+      color: '#fe9200',
+      fontSize: '20px',
+    },
+    encoding: 'utf-8',
+  },
+  highlight: [
+    {
+      time: 15,
+      text: 'One more chance',
+    },
+    {
+      time: 30,
+      text: '谁でもいいはずなのに',
+    },
+    {
+      time: 45,
+      text: '夏の想い出がまわる',
+    },
+    {
+      time: 60,
+      text: 'こんなとこにあるはずもないのに',
+    },
+    {
+      time: 75,
+      text: '终わり',
+    },
+  ],
+  controls: [
+    {
+      position: 'right',
+      html: 'Control',
+      index: 1,
+      tooltip: 'Control Tooltip',
+      style: {
+        marginRight: '20px',
+      },
+      click() {
+        console.info('You clicked on the custom control')
+      },
+    },
+  ],
+  icons: {
+    loading: '<img src="/assets/img/ploading.gif">',
+    state: '<img width="150" height="150" src="/assets/img/state.svg">',
+    indicator: '<img width="16" height="16" src="/assets/img/indicator.svg">',
+  },
+})

docs/assets/example/jassub.js

@@ -0,0 +1,28 @@
+// https://github.com/ThaUnknown/jassub
+// npm i artplayer-plugin-jassub
+// import artplayerPluginJassub from 'artplayer-plugin-jassub';
+
+var art = new Artplayer({
+    container: '.artplayer-app',
+    url: '/assets/jassub/FGOBD.mp4',
+    autoSize: true,
+    fullscreen: true,
+    fullscreenWeb: true,
+    plugins: [
+        artplayerPluginJassub({
+            subUrl: '/assets/jassub/FGOBD.ass',
+            workerUrl: '/assets/jassub/jassub-worker.js',
+            wasmUrl: '/assets/jassub/jassub-worker.wasm',
+            modernWasmUrl: '/assets/jassub/jassub-worker-modern.wasm',
+            availableFonts: {
+                'liberation sans': '/assets/jassub/default.woff2'
+            },
+            fonts: [
+                '/assets/jassub/fonts/Averia Sans Libre Light.ttf',
+                '/assets/jassub/fonts/Averia Serif Simple Light.ttf',
+                '/assets/jassub/fonts/Gramond.ttf'
+            ],
+            timeOffset: -0.041
+        }),
+    ],
+});

docs/assets/example/libass.js

@@ -1,44 +0,0 @@
-// npm i artplayer-plugin-libass
-// import artplayerPluginLibass from 'artplayer-plugin-libass';
-
-var art = new Artplayer({
-    container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
-    fullscreenWeb: true,
-    subtitle: {
-        url: '/assets/sample/style-test.ass',
-    },
-    plugins: [
-        artplayerPluginLibass({
-            // debug: true,
-            workerUrl: 'https://unpkg.com/libass-wasm@4.1.0/dist/js/subtitles-octopus-worker.js',
-            // wasmUrl: 'https://unpkg.com/libass-wasm@4.1.0/dist/js/subtitles-octopus-worker.wasm',
-            fallbackFont: '/assets/misc/SourceHanSansCN-Bold.woff2'
-        }),
-    ],
-});
-
-// init
-art.on('artplayerPluginLibass:init', (adapter) => {
-    console.info('artplayerPluginLibass:init', adapter);
-});
-
-// subtitle switch
-art.on('artplayerPluginLibass:switch', (url) => {
-    console.info('artplayerPluginLibass:switch', url);
-})
-
-// subtitle visible
-art.on('artplayerPluginLibass:visible', (visible) => {
-    console.info('artplayerPluginLibass:visible', visible);
-})
-
-// subtitle timeOffset
-art.on('artplayerPluginLibass:timeOffset', (timeOffset) => {
-    console.info('artplayerPluginLibass:timeOffset', timeOffset);
-})
-
-// destroy
-art.on('artplayerPluginLibass:destroy', () => {
-    console.info('artplayerPluginLibass:destroy');
-})

docs/assets/example/mediabunny.js

@@ -0,0 +1,35 @@
+// npm i artplayer-proxy-mediabunny
+// import artplayerProxyMediabunny from 'artplayer-proxy-mediabunny';
+
+const art = new Artplayer({
+  container: '.artplayer-app',
+  url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
+  autoSize: true,
+  setting: true,
+  loop: true,
+  flip: true,
+  playbackRate: true,
+  fullscreen: true,
+  fullscreenWeb: true,
+  miniProgressBar: true,
+  autoPlayback: true,
+  autoOrientation: true,
+  proxy: artplayerProxyMediabunny({
+    m3u8: {
+      quality: {
+        control: true,
+        setting: true,
+        getName: level => level.height ? `${level.height}P` : level.name,
+        title: 'Quality',
+        auto: 'Auto',
+      },
+      audio: {
+        control: true,
+        setting: true,
+        getName: track => track.name || track.language,
+        title: 'Audio',
+        auto: 'Auto',
+      },
+    },
+  }),
+})

docs/assets/example/mobile.js

@@ -1,97 +1,98 @@
 var art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    poster: '/assets/sample/poster.jpg',
+  poster: '/assets/sample/poster.jpg',
-    autoSize: true,
+  autoSize: true,
-    loop: true,
+  loop: true,
-    mutex: true,
+  mutex: true,
-    setting: true,
+  setting: true,
-    flip: true,
+  flip: true,
-    lock: true,
+  lock: true,
-    fastForward: true,
+  fastForward: true,
-    playbackRate: true,
+  playbackRate: true,
-    aspectRatio: true,
+  aspectRatio: true,
-    theme: '#ff0057',
+  theme: '#ff0057',
-    fullscreen: true,
+  fullscreen: true,
-    fullscreenWeb: true,
+  fullscreenWeb: true,
-    miniProgressBar: true,
+  miniProgressBar: true,
-    autoOrientation: true,
+  autoOrientation: true,
-    airplay: true,
+  airplay: true,
-    moreVideoAttr: {
+  moreVideoAttr: {
-        'x5-video-player-type': 'h5',
+    'x5-video-player-type': 'h5',
-        'x5-video-player-fullscreen': false,
+    'x5-video-player-fullscreen': false,
-        'x5-video-orientation': 'portraint',
+    'x5-video-orientation': 'portraint',
-        preload: "metadata"
+    'preload': 'metadata',
+  },
+  thumbnails: {
+    url: '/assets/sample/thumbnails.png',
+    number: 60,
+    column: 10,
+    scale: 0.6,
+  },
+  subtitle: {
+    name: '中日双语',
+    url: '/assets/sample/subtitle.srt',
+    style: {
+      color: '#48aff0',
+      fontSize: '16px',
     },
-    thumbnails: {
+  },
-        url: '/assets/sample/thumbnails.png',
+  layers: [
-        number: 60,
+    {
-        column: 10,
+      html: `<img width="50" src="/assets/sample/layer.png">`,
+      click() {
+        art.notice.show = '你点击了自定义层'
+      },
+      style: {
+        position: 'absolute',
+        top: '10px',
+        right: '10px',
+        opacity: '.9',
+      },
     },
-    subtitle: {
+  ],
-        name: '中日双语',
+  icons: {
-        url: '/assets/sample/subtitle.srt',
+    loading: '<img src="/assets/img/ploading.gif">',
-        style: {
+    state: '<img width="150" height="150" src="/assets/img/state.svg">',
-            color: '#48aff0',
+    indicator: '<img width="16" height="16" src="/assets/img/indicator.svg">',
-            fontSize: '16px',
+  },
-        },
+  settings: [
-    },
+    {
-    layers: [
+      width: 200,
+      html: '切换字幕',
+      tooltip: '双语',
+      icon: '<img width="22" height="22" src="/assets/img/subtitle.svg">',
+      selector: [
         {
-            html: `<img width="50" src="/assets/sample/layer.png">`,
+          html: '开关',
-            click: function () {
+          switch: true,
-                art.notice.show = "你点击了自定义层";
+          tooltip: '显示',
-            },
+          onSwitch(item) {
-            style: {
+            item.tooltip = item.switch ? '隐藏' : '显示'
-                position: 'absolute',
+            art.subtitle.show = !item.switch
-                top: '10px',
+            return !item.switch
-                right: '10px',
+          },
-                opacity: '.9',
-            },
         },
-    ],
-    icons: {
-        loading: '<img src="/assets/img/ploading.gif">',
-        state: '<img width="150" heigth="150" src="/assets/img/state.svg">',
-        indicator: '<img width="16" heigth="16" src="/assets/img/indicator.svg">',
-    },
-    settings: [
         {
-            width: 200,
+          default: true,
-            html: '切换字幕',
+          html: '双语',
-            tooltip: '双语',
+          url: '/assets/sample/subtitle.srt',
-            icon: '<img width="22" heigth="22" src="/assets/img/subtitle.svg">',
-            selector: [
-                {
-                    html: '开关',
-                    switch: true,
-                    tooltip: '显示',
-                    onSwitch: function (item) {
-                        item.tooltip = item.switch ? '隐藏' : '显示';
-                        art.subtitle.show = !item.switch;
-                        return !item.switch;
-                    },
-                },
-                {
-                    default: true,
-                    html: '双语',
-                    url: '/assets/sample/subtitle.srt'
-                },
-                {
-                    html: '中文',
-                    url: '/assets/sample/subtitle.cn.srt'
-                },
-                {
-                    html: '日文',
-                    url: '/assets/sample/subtitle.jp.srt'
-                },
-            ],
-            onSelect: function (item) {
-                art.subtitle.switch(item.url, {
-                    name: item.html
-                });
-                return item.html;
-            },
         },
-    ],
+        {
-});
+          html: '中文',
+          url: '/assets/sample/subtitle.cn.srt',
+        },
+        {
+          html: '日文',
+          url: '/assets/sample/subtitle.jp.srt',
+        },
+      ],
+      onSelect(item) {
+        art.subtitle.switch(item.url, {
+          name: item.html,
+        })
+        return item.html
+      },
+    },
+  ],
+})

docs/assets/example/mpegts.js

@@ -2,33 +2,35 @@
 // import mpegts from 'mpegts';
 
 function playFlv(video, url, art) {
-	if (mpegts.isSupported()) {
+  if (mpegts.isSupported()) {
-		if (art.flv) art.flv.destroy();
+    if (art.flv)
+      art.flv.destroy()
 
-		const flv = mpegts.createPlayer({
+    const flv = mpegts.createPlayer({
-			type: 'flv',
+      type: 'flv',
-			url: url
+      url,
-		});
+    })
-		flv.attachMediaElement(video);
+    flv.attachMediaElement(video)
-		flv.load();
+    flv.load()
-		flv.play();
+    flv.play()
 
-		art.flv = flv;
+    art.flv = flv
-		art.on('destroy', () => flv.destroy());
+    art.on('destroy', () => flv.destroy())
-	} else {
+  }
-		art.notice.show = 'Unsupported playback format: flv';
+  else {
-	}
+    art.notice.show = 'Unsupported playback format: flv'
+  }
 }
 
-var art = new Artplayer({
+const art = new Artplayer({
-	container: '.artplayer-app',
+  container: '.artplayer-app',
-	url: '/assets/sample/video.flv',
+  url: '/assets/sample/video.flv',
-	type: 'flv',
+  type: 'flv',
-	customType: {
+  customType: {
-		flv: playFlv,
+    flv: playFlv,
-	},
+  },
-});
+})
 
 art.on('ready', () => {
-	console.info(art.flv);
+  console.info(art.flv)
-});
+})

docs/assets/example/multiple.subtitles.js

@@ -2,88 +2,89 @@
 // import artplayerPluginMultipleSubtitles from 'artplayer-plugin-multiple-subtitles';
 
 var art = new Artplayer({
-	container: '.artplayer-app',
+  container: '.artplayer-app',
-	url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-	setting: true,
+  setting: true,
-	plugins: [
+  plugins: [
-		artplayerPluginMultipleSubtitles({
+    artplayerPluginMultipleSubtitles({
-			subtitles: [
+      subtitles: [
-				{
-					name: 'chinese',
-					url: '/assets/sample/subtitle.cn.srt',
-				},
-				{
-					name: 'japanese',
-					url: '/assets/sample/subtitle.jp.srt',
-				}
-			],
-		})
-	],
-	settings: [
         {
-            width: 200,
+          name: 'chinese',
-            html: 'Subtitle',
+          url: '/assets/sample/subtitle.cn.srt',
-            tooltip: 'Double',
-            icon: '<img width="22" heigth="22" src="/assets/img/subtitle.svg">',
-            selector: [
-                {
-                    html: 'Display',
-                    tooltip: 'Show',
-                    switch: true,
-                    onSwitch: function (item) {
-                        item.tooltip = item.switch ? 'Hide' : 'Show';
-						// 显示/隐藏字幕
-						// Show/hide subtitles
-						art.subtitle.show = !item.switch;
-                        return !item.switch;
-                    },
-                },
-				{
-                    html: 'Reverse',
-                    tooltip: 'Off',
-                    switch: false,
-                    onSwitch: function (item) {
-                        item.tooltip = item.switch ? 'Off' : 'On';
-						// 修改字幕顺序
-						// Change the order of subtitles
-						if (item.switch) {
-							art.plugins.multipleSubtitles.tracks(['chinese', 'japanese']);
-						} else {
-							art.plugins.multipleSubtitles.tracks(['japanese', 'chinese']);
-
-						}
-                        return !item.switch;
-                    },
-                },
-                {
-                    default: true,
-                    html: 'Double',
-                    name: 'double',
-                },
-                {
-                    html: 'Chinese',
-                    name: 'chinese',
-                },
-                {
-                    html: 'Japanese',
-                    name: 'japanese',
-                },
-            ],
-            onSelect: function (item) {
-				if (item.name === 'double') {
-					// 重置字幕
-					// Reset subtitles
-					art.plugins.multipleSubtitles.reset();
-				} else {
-					// 显示单个字幕
-					// Show single subtitle
-					art.plugins.multipleSubtitles.tracks([item.name]);
-				}
-                return item.html;
-            },
         },
-    ],
+        {
-});
+          name: 'japanese',
+          url: '/assets/sample/subtitle.jp.srt',
+        },
+      ],
+    }),
+  ],
+  settings: [
+    {
+      width: 200,
+      html: 'Subtitle',
+      tooltip: 'Double',
+      icon: '<img width="22" height="22" src="/assets/img/subtitle.svg">',
+      selector: [
+        {
+          html: 'Display',
+          tooltip: 'Show',
+          switch: true,
+          onSwitch(item) {
+            item.tooltip = item.switch ? 'Hide' : 'Show'
+            // 显示/隐藏字幕
+            // Show/hide subtitles
+            art.subtitle.show = !item.switch
+            return !item.switch
+          },
+        },
+        {
+          html: 'Reverse',
+          tooltip: 'Off',
+          switch: false,
+          onSwitch(item) {
+            item.tooltip = item.switch ? 'Off' : 'On'
+            // 修改字幕顺序
+            // Change the order of subtitles
+            if (item.switch) {
+              art.plugins.multipleSubtitles.tracks(['chinese', 'japanese'])
+            }
+            else {
+              art.plugins.multipleSubtitles.tracks(['japanese', 'chinese'])
+            }
+            return !item.switch
+          },
+        },
+        {
+          default: true,
+          html: 'Double',
+          name: 'double',
+        },
+        {
+          html: 'Chinese',
+          name: 'chinese',
+        },
+        {
+          html: 'Japanese',
+          name: 'japanese',
+        },
+      ],
+      onSelect(item) {
+        if (item.name === 'double') {
+          // 重置字幕
+          // Reset subtitles
+          art.plugins.multipleSubtitles.reset()
+        }
+        else {
+          // 显示单个字幕
+          // Show single subtitle
+          art.plugins.multipleSubtitles.tracks([item.name])
+        }
+        return item.html
+      },
+    },
+  ],
+})
 
 // 自定义你自己的样式，请勿复制以下代码
 // Customize your own style, please do not copy the following code
@@ -98,14 +99,15 @@ const style = `
 	color: yellow;
 	font-size: 12px;
 }
-`;
+`
 
-const $style = document.getElementById('artplayer-subtitle-style');
+const $style = document.getElementById('artplayer-subtitle-style')
 if ($style) {
-	$style.textContent = style;
+  $style.textContent = style
-} else {
+}
-	const $style = document.createElement('style');
+else {
-	$style.id = 'artplayer-subtitle-style';
+  const $style = document.createElement('style')
-	$style.textContent = style;
+  $style.id = 'artplayer-subtitle-style'
-	document.head.appendChild($style);
+  $style.textContent = style
-}
+  document.head.appendChild($style)
+}

docs/assets/example/setting.test.js

@@ -0,0 +1,140 @@
+var art = new Artplayer({
+  container: '.artplayer-app',
+  url: '/assets/sample/video.mp4',
+  setting: true,
+  flip: true,
+  playbackRate: true,
+  aspectRatio: true,
+  subtitleOffset: true,
+  settings: [
+    {
+      width: 200,
+      html: 'Subtitle',
+      name: 'subtitle',
+      tooltip: 'Bilingual',
+      icon: '<img width="22" height="22" src="/assets/img/subtitle.svg">',
+      selector: [
+        {
+          html: 'Display',
+          tooltip: 'Show',
+          switch: true,
+          onSwitch(item) {
+            item.tooltip = item.switch ? 'Hide' : 'Show'
+            art.subtitle.show = !item.switch
+            return !item.switch
+          },
+        },
+        {
+          default: true,
+          html: 'Bilingual',
+          url: '/assets/sample/subtitle.srt',
+        },
+        {
+          html: 'Chinese',
+          url: '/assets/sample/subtitle.cn.srt',
+        },
+        {
+          html: 'Japanese',
+          url: '/assets/sample/subtitle.jp.srt',
+        },
+      ],
+      onSelect(item) {
+        art.subtitle.switch(item.url, {
+          name: item.html,
+        })
+        return item.html
+      },
+      mounted(...args) {
+        console.info(args)
+      },
+    },
+    {
+      html: 'Switcher',
+      icon: '<img width="22" height="22" src="/assets/img/state.svg">',
+      tooltip: 'OFF',
+      switch: false,
+      onSwitch(item) {
+        item.tooltip = item.switch ? 'OFF' : 'ON'
+        console.info('You clicked on the custom switch', item.switch)
+        return !item.switch
+      },
+      mounted(...args) {
+        console.info(args)
+      },
+    },
+    {
+      html: 'Slider',
+      icon: '<img width="22" height="22" src="/assets/img/state.svg">',
+      tooltip: '5x',
+      range: [5, 1, 10, 0.1],
+      onRange(item) {
+        return `${item.range[0]}x`
+      },
+      mounted(...args) {
+        console.info(args)
+      },
+    },
+  ],
+}, async () => {
+  const { sleep } = Artplayer.utils
+  art.setting.show = true
+  console.log(art.setting.builtin)
+  console.log(art.setting.find('aspect-ratio'))
+  console.log(art.setting.find('aspect-ratio2'))
+  await sleep(1000)
+  art.setting.resize()
+  await sleep(1000)
+  art.setting.inactivate(art.setting.find('subtitle'))
+  art.setting.remove('aspect-ratio')
+  try {
+    art.setting.remove('aspect-ratio2')
+  }
+  catch (error) {
+    console.log(error.message)
+  }
+  await sleep(1000)
+  art.setting.update({
+    name: 'subtitle-offset',
+    html: 'new offset',
+    range: [5, -11, 11, 1],
+  })
+  await sleep(1000)
+  art.setting.find('subtitle-offset').range = [0, -0, 10, 1]
+  await sleep(1000)
+  art.setting.update({
+    name: 'subtitle-offset2',
+    html: 'new offset 2',
+    range: [5, -11, 11, 1],
+    onChange(item) {
+      return `${item.range[0]}s`
+    },
+  })
+  await sleep(1000)
+  art.setting.update({
+    name: 'flip',
+    html: 'new flip',
+    tooltip: 'OFF',
+    switch: false,
+  })
+  await sleep(1000)
+  art.setting.find('flip').switch = true
+  await sleep(1000)
+  art.setting.update({
+    name: 'flip2',
+    html: 'new flip2',
+    tooltip: 'OFF',
+    switch: true,
+  })
+  await sleep(1000)
+  try {
+    art.setting.add({
+      name: 'flip2',
+      html: 'new flip2',
+      tooltip: 'OFF',
+      switch: true,
+    })
+  }
+  catch (error) {
+    console.log(error.message)
+  }
+})

docs/assets/example/thumbnail.js

@@ -1,69 +1,14 @@
-if (window.lastThumbnail) {
+// npm i artplayer-plugin-thumbnail
-    window.lastThumbnail.destroy();
+// import artplayerPluginThumbnail from 'artplayer-plugin-thumbnail';
-}
 
-var $popups = document.querySelector('.popups');
+const art = new Artplayer({
-var $popinner = document.querySelector('.popinner');
+  container: '.artplayer-app',
-var $artplayer = document.querySelector('.artplayer-app');
+  url: '/assets/sample/video.mp4',
-
+  plugins: [
-$artplayer.innerHTML = 'Drop video file here or click to upload.';
+    artplayerPluginThumbnail({
-var thumbnail = new ArtplayerToolThumbnail({
+      width: 160,
-    fileInput: $artplayer,
+      number: 100,
-    number: 60, // 数量
+      scale: 1,
-    width: 160, // 宽度
+    }),
-    column: 10, // 列数
+  ],
-    begin: 0, // 开始
+})
-    end: NaN, // 结束
-});
-
-window.lastThumbnail = thumbnail;
-
-thumbnail.on('file', function (file) {
-    console.log('Read video successfully: ' + file.name);
-});
-
-thumbnail.on('video', function (video) {
-    console.log('Video size: ' + video.videoWidth + ' x ' + video.videoHeight);
-    console.log('Video duration: ' + video.duration + 's');
-    thumbnail.start();
-});
-
-thumbnail.on('canvas', function (canvas) {
-    console.log('Build canvas successfully');
-    console.log('Canvas size: ' + canvas.width + ' x ' + canvas.height);
-    console.log('Preview density: ' + thumbnail.density + ' p/s');
-});
-
-thumbnail.on('update', function (url, percentage) {
-    console.log('Processing: ' + Math.floor(percentage.toFixed(2) * 100) + '%');
-    $popups.style.display = 'flex';
-    $popinner.style.backgroundImage = 'url(' + url + ')';
-});
-
-thumbnail.on('download', function (name) {
-    console.log('Start download preview: ' + name);
-});
-
-thumbnail.on('done', function () {
-    $popups.style.display = 'none';
-    thumbnail.download();
-    console.log('Build preview image complete');
-
-    [...Artplayer.instances].forEach(function (art) {
-        art.destroy(true);
-    });
-
-    new Artplayer({
-        container: $artplayer,
-        url: thumbnail.videoUrl,
-        autoSize: true,
-        poster: thumbnail.thumbnailUrl,
-        thumbnails: {
-            url: thumbnail.thumbnailUrl,
-            number: thumbnail.option.number,
-            column: thumbnail.option.column,
-        },
-    });
-
-    console.log('Build player complete');
-});

docs/assets/example/tool.thumbnail.js

@@ -0,0 +1,69 @@
+if (window.lastThumbnail) {
+    window.lastThumbnail.destroy();
+}
+
+var $popups = document.querySelector('.popups');
+var $popinner = document.querySelector('.popinner');
+var $artplayer = document.querySelector('.artplayer-app');
+
+$artplayer.innerHTML = 'Drop video file here or click to upload.';
+var thumbnail = new ArtplayerToolThumbnail({
+    fileInput: $artplayer,
+    number: 60, // 数量
+    width: 160, // 宽度
+    column: 10, // 列数
+    begin: 0, // 开始
+    end: NaN, // 结束
+});
+
+window.lastThumbnail = thumbnail;
+
+thumbnail.on('file', function (file) {
+    console.log('Read video successfully: ' + file.name);
+});
+
+thumbnail.on('video', function (video) {
+    console.log('Video size: ' + video.videoWidth + ' x ' + video.videoHeight);
+    console.log('Video duration: ' + video.duration + 's');
+    thumbnail.start();
+});
+
+thumbnail.on('canvas', function (canvas) {
+    console.log('Build canvas successfully');
+    console.log('Canvas size: ' + canvas.width + ' x ' + canvas.height);
+    console.log('Preview density: ' + thumbnail.density + ' p/s');
+});
+
+thumbnail.on('update', function (url, percentage) {
+    console.log('Processing: ' + Math.floor(percentage.toFixed(2) * 100) + '%');
+    $popups.style.display = 'flex';
+    $popinner.style.backgroundImage = 'url(' + url + ')';
+});
+
+thumbnail.on('download', function (name) {
+    console.log('Start download preview: ' + name);
+});
+
+thumbnail.on('done', function () {
+    $popups.style.display = 'none';
+    thumbnail.download();
+    console.log('Build preview image complete');
+
+    [...Artplayer.instances].forEach(function (art) {
+        art.destroy(true);
+    });
+
+    new Artplayer({
+        container: $artplayer,
+        url: thumbnail.videoUrl,
+        autoSize: true,
+        poster: thumbnail.thumbnailUrl,
+        thumbnails: {
+            url: thumbnail.thumbnailUrl,
+            number: thumbnail.option.number,
+            column: thumbnail.option.column,
+        },
+    });
+
+    console.log('Build player complete');
+});

docs/assets/example/vast.js

@@ -1,14 +1,24 @@
+// Depends on:
+// https://glomex.github.io/vast-ima-player/
+// https://developers.google.com/interactive-media-ads/docs/sdks/html5/client-side
+
+// Google's IMA SDK are blocked by your Ad blocker.
+// Please Turn Off Your Ad Blocker.
+
 // npm i artplayer-plugin-vast
-// import ArtplayerPluginVast from 'artplayer-plugin-vast';
+// import artplayerPluginVast from 'artplayer-plugin-vast';
 
 var art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/video.mp4',
+  url: '/assets/sample/video.mp4',
-    fullscreen: true,
+  fullscreen: true,
-    fullscreenWeb: true,
+  fullscreenWeb: true,
-    plugins: [
+  plugins: [
-        ArtplayerPluginVast({
+    artplayerPluginVast(({ playUrl, imaPlayer, ima }) => {
-            url: '/assets/sample/vast.xml',
+      // Play the ad when the video is played
-        }),
+      art.once('play', () => {
-    ],
+        playUrl('https://artplayer.org/assets/vast/linear-ad.xml')
-});
+      })
+    }),
+  ],
+})

docs/assets/example/vtt.thumbnail.js

@@ -1,12 +1,12 @@
 // npm i artplayer-plugin-vtt-thumbnail
 // import artplayerPluginVttThumbnail from 'artplayer-plugin-vtt-thumbnail';
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: '/assets/sample/bbb-video.mp4',
+  url: '/assets/sample/bbb-video.mp4',
-	plugins: [
+  plugins: [
-		artplayerPluginVttThumbnail({
+    artplayerPluginVttThumbnail({
-			vtt: '/assets/sample/bbb-thumbnails.vtt',
+      vtt: '/assets/sample/bbb-thumbnails.vtt',
-		})
+    }),
-	]
+  ],
-});
+})

docs/assets/example/webtorrent.js

@@ -2,35 +2,37 @@
 // import WebTorrent from 'webtorrent';
 
 async function playTorrent(video, url, art) {
-    if (WebTorrent.WEBRTC_SUPPORT) {
+  if (WebTorrent.WEBRTC_SUPPORT) {
-        if (art.torrent) art.torrent.destroy();
+    if (art.torrent)
-        art.torrent = new WebTorrent();
+      art.torrent.destroy()
+    art.torrent = new WebTorrent()
 
-        await navigator.serviceWorker.register('/webtorrent.sw.min.js');
+    await navigator.serviceWorker.register('/webtorrent.sw.min.js')
-        art.torrent.loadWorker(navigator.serviceWorker.controller);
+    art.torrent.loadWorker(navigator.serviceWorker.controller)
 
-        art.torrent.add(url, (torrent) => {
+    art.torrent.add(url, (torrent) => {
-            const file = torrent.files.find((file) => {
+      const file = torrent.files.find((file) => {
-                return file.name.endsWith('.mp4');
+        return file.name.endsWith('.mp4')
-            });
+      })
-            file.streamTo(video);
+      file.streamTo(video)
-        });
+    })
 
-        art.on('destroy', () => art.torrent.destroy());
+    art.on('destroy', () => art.torrent.destroy())
-    } else {
+  }
-        art.notice.show = 'Unsupported playback format: torrent';
+  else {
-    }
+    art.notice.show = 'Unsupported playback format: torrent'
+  }
 }
 
-var art = new Artplayer({
+const art = new Artplayer({
-    container: '.artplayer-app',
+  container: '.artplayer-app',
-    url: 'magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=udp%3A%2F%2Fexplodie.org%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.empire-js.us%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.opentrackr.org%3A1337&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F&xs=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2Fsintel.torrent',
+  url: 'magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=udp%3A%2F%2Fexplodie.org%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.empire-js.us%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.opentrackr.org%3A1337&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F&xs=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2Fsintel.torrent',
-    type: 'torrent',
+  type: 'torrent',
-    customType: {
+  customType: {
-        torrent: playTorrent,
+    torrent: playTorrent,
-    },
+  },
-});
+})
 
 art.on('ready', () => {
-    console.info(art.torrent);
+  console.info(art.torrent)
-});
+})

docs/assets/img/danmu-off.svg

@@ -1,6 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg class="icon" viewBox="0 0 1152 1024" version="1.1" xmlns="http://www.w3.org/2000/svg">
-<path fill="#fff" d="M311.296 661.504c0 4.096-4.096 8.704-8.704 12.8 0 4.096 0 4.096-4.096 8.704h-12.8c-4.096 0-8.704-4.096-16.896-8.704-8.704-8.704-16.896-8.704-25.6-8.704s-12.8 4.096-16.896 12.8c-4.096 12.8-8.704 21.504-4.096 29.696 4.096 8.704 12.8 16.896 25.6 21.504 16.896 8.704 34.304 16.896 47.104 16.896 12.8 0 21.504-4.096 34.304-8.704 8.704-4.096 16.896-16.896 25.6-29.696 8.704-12.8 12.8-34.304 16.896-55.296 4.096-21.504 4.096-51.2 4.096-85.504 0-12.8 0-21.504-4.096-29.696 0-8.704-4.096-12.8-8.704-16.896-4.096-4.096-8.704-8.704-12.8-8.704s-12.8-4.096-21.504-4.096H272.896s-4.096-4.096 0-8.704l4.096-38.4c0-4.096 0-8.704 4.096-8.704h47.104c16.896 0 25.6-4.096 34.304-12.8 8.704-8.704 12.8-21.504 12.8-42.496V324.096c0-16.896-4.096-34.304-8.704-42.496-12.8-12.8-25.6-16.896-42.496-16.896H243.2c-8.704 0-16.896 0-21.504 4.096-4.096 8.704-4.096 12.8-4.096 25.6 0 8.704 0 16.896 4.096 21.504 4.096 4.096 12.8 8.704 21.504 8.704H307.2c4.096 0 8.704 0 8.704 4.096v34.304c0 8.704 0 12.8-4.096 12.8 0 0-4.096 4.096-8.704 4.096h-34.304c-8.704 0-12.8 0-21.504 4.096-4.096 0-8.704 4.096-8.704 4.096-4.096 4.096-8.704 12.8-8.704 16.896 0 8.704-4.096 16.896-4.096 25.6l-8.704 72.704v29.696c0 8.704 4.096 12.8 8.704 16.896s8.704 4.096 16.896 8.704h68.096c4.096 0 8.704 0 8.704 4.096s4.096 8.704 4.096 16.896c0 21.504 0 42.496-4.096 55.296 0.512 9.216-3.584 22.016-8.192 26.624zM896 486.4c-93.696 0-175.104 51.2-217.6 123.904h-106.496v-34.304H640c21.504 0 34.304-4.096 42.496-12.8 8.704-8.704 12.8-21.504 12.8-42.496V358.4c0-21.504-4.096-34.304-12.8-42.496-8.704-8.704-21.504-12.8-42.496-12.8 0-4.096 4.096-4.096 4.096-8.704-4.096 0-4.096-4.096-4.096-4.096 4.096-12.8 8.704-21.504 4.096-25.6 0-8.704-4.096-12.8-12.8-21.504-8.704-4.096-16.896-4.096-21.504-4.096-8.704 4.096-12.8 8.704-21.504 21.504-4.096 8.704-8.704 12.8-12.8 21.504-4.096 8.704-8.704 12.8-12.8 21.504h-51.2c-4.096-8.704-8.704-16.896-8.704-21.504-4.096-8.704-8.704-12.8-12.8-21.504-4.096-12.8-12.8-16.896-21.504-16.896s-16.896 0-25.6 8.704C434.176 261.12 430.08 265.216 430.08 273.92c0 8.704 0 16.896 8.704 25.6l4.096 4.096 4.096 4.096c-16.896 0-29.696 4.096-38.4 12.8-8.704 4.096-12.8 21.504-12.8 38.4v157.696c0 21.504 4.096 34.304 12.8 42.496 8.704 8.704 21.504 12.8 42.496 12.8H512v34.304H413.696c-12.8 0-21.504 0-25.6 4.096-4.096 4.096-8.704 8.704-8.704 21.504v16.896c0 4.096 4.096 8.704 4.096 8.704 4.096 0 4.096 4.096 8.704 4.096H512V716.8c0 12.8 4.096 21.504 8.704 25.6 4.096 4.096 12.8 8.704 21.504 8.704 12.8 0 21.504-4.096 25.6-8.704 4.096-4.096 4.096-12.8 4.096-25.6v-55.296h80.896c-8.704 25.6-12.8 51.2-12.8 76.8 0 140.8 115.2 256 256 256s256-115.2 256-256S1036.8 486.4 896 486.4z m-328.704-128h55.296c4.096 0 4.096 0 4.096 4.096V409.6h-59.904V358.4z m0 102.4h59.904v51.2h-55.296V460.8h-4.608zM512 516.096H456.704v-51.2H512v51.2z m0-102.4H452.096v-51.2H512v51.2z m384 499.2c-93.696 0-170.496-76.8-170.496-170.496s76.8-170.496 170.496-170.496 170.496 76.8 170.496 170.496-76.8 170.496-170.496 170.496z"  />
-<path fill="#fff" d="M580.096 879.104H213.504c-72.704 0-128-55.296-128-119.296V230.4c0-64 55.296-119.296 128-119.296h512c72.704 0 128 55.296 128 119.296v140.8c0 25.6 16.896 42.496 42.496 42.496s42.496-16.896 42.496-42.496V230.4c0-115.2-93.696-204.8-213.504-204.8h-512C93.696 25.6 0 119.296 0 230.4v528.896c0 115.2 93.696 204.8 213.504 204.8h367.104c25.6 0 42.496-16.896 42.496-42.496 0-25.6-21.504-42.496-43.008-42.496z m171.52 10.752c-15.36-15.36-15.36-40.96 0-56.32l237.568-237.568c15.36-15.36 40.96-15.36 56.32 0s15.36 40.96 0 56.32l-237.568 237.568c-15.36 15.36-40.448 15.36-56.32 0z"  />
-</svg>

docs/assets/img/danmu-on.svg

@@ -1,6 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg class="icon" viewBox="0 0 1152 1024" version="1.1" xmlns="http://www.w3.org/2000/svg">
-<path fill="#fff" d="M311.466667 661.333333c0 4.266667-4.266667 8.533333-8.533334 12.8 0 4.266667 0 4.266667-4.266666 8.533334h-12.8c-4.266667 0-8.533333-4.266667-17.066667-8.533334-8.533333-8.533333-17.066667-8.533333-25.6-8.533333-8.533333 0-12.8 4.266667-17.066667 12.8-4.266667 12.8-8.533333 21.333333-4.266666 29.866667 4.266667 8.533333 12.8 17.066667 25.6 21.333333 17.066667 8.533333 34.133333 17.066667 46.933333 17.066667 12.8 0 21.333333-4.266667 34.133333-8.533334 8.533333-4.266667 17.066667-17.066667 25.6-29.866666 8.533333-12.8 12.8-34.133333 17.066667-55.466667 4.266667-21.333333 4.266667-51.2 4.266667-85.333333 0-12.8 0-21.333333-4.266667-29.866667 0-8.533333-4.266667-12.8-8.533333-17.066667-4.266667-4.266667-8.533333-8.533333-12.8-8.533333-4.266667 0-12.8-4.266667-21.333334-4.266667H273.066667s-4.266667-4.266667 0-8.533333l4.266666-38.4c0-4.266667 0-8.533333 4.266667-8.533333h46.933333c17.066667 0 25.6-4.266667 34.133334-12.8 8.533333-8.533333 12.8-21.333333 12.8-42.666667V324.266667c0-17.066667-4.266667-34.133333-8.533334-42.666667-12.8-12.8-25.6-17.066667-42.666666-17.066667H243.2c-8.533333 0-17.066667 0-21.333333 4.266667-4.266667 8.533333-4.266667 12.8-4.266667 25.6 0 8.533333 0 17.066667 4.266667 21.333333 4.266667 4.266667 12.8 8.533333 21.333333 8.533334h64c4.266667 0 8.533333 0 8.533333 4.266666v34.133334c0 8.533333 0 12.8-4.266666 12.8 0 0-4.266667 4.266667-8.533334 4.266666h-34.133333c-8.533333 0-12.8 0-21.333333 4.266667-4.266667 0-8.533333 4.266667-8.533334 4.266667-4.266667 4.266667-8.533333 12.8-8.533333 17.066666 0 8.533333-4.266667 17.066667-4.266667 25.6l-8.533333 72.533334v29.866666c0 8.533333 4.266667 12.8 8.533333 17.066667 4.266667 4.266667 8.533333 4.266667 17.066667 8.533333h68.266667c4.266667 0 8.533333 0 8.533333 4.266667s4.266667 8.533333 4.266667 17.066667c0 21.333333 0 42.666667-4.266667 55.466666 0 8.533333-4.266667 21.333333-8.533333 25.6zM896 486.4c-93.866667 0-174.933333 51.2-217.6 123.733333h-106.666667v-34.133333H640c21.333333 0 34.133333-4.266667 42.666667-12.8 8.533333-8.533333 12.8-21.333333 12.8-42.666667V358.4c0-21.333333-4.266667-34.133333-12.8-42.666667-8.533333-8.533333-21.333333-12.8-42.666667-12.8 0-4.266667 4.266667-4.266667 4.266667-8.533333-4.266667 0-4.266667-4.266667-4.266667-4.266667 4.266667-12.8 8.533333-21.333333 4.266667-25.6 0-8.533333-4.266667-12.8-12.8-21.333333-8.533333-4.266667-17.066667-4.266667-21.333334-4.266667-8.533333 4.266667-12.8 8.533333-21.333333 21.333334-4.266667 8.533333-8.533333 12.8-12.8 21.333333-4.266667 8.533333-8.533333 12.8-12.8 21.333333H512c-4.266667-8.533333-8.533333-17.066667-8.533333-21.333333-4.266667-8.533333-8.533333-12.8-12.8-21.333333-4.266667-12.8-12.8-17.066667-21.333334-17.066667s-17.066667 0-25.6 8.533333c-8.533333 8.533333-12.8 12.8-12.8 21.333334s0 17.066667 8.533334 25.6l4.266666 4.266666 4.266667 4.266667c-17.066667 0-29.866667 4.266667-38.4 12.8-8.533333 4.266667-12.8 21.333333-12.8 38.4v157.866667c0 21.333333 4.266667 34.133333 12.8 42.666666 8.533333 8.533333 21.333333 12.8 42.666667 12.8H512v34.133334H413.866667c-12.8 0-21.333333 0-25.6 4.266666-4.266667 4.266667-8.533333 8.533333-8.533334 21.333334v17.066666c0 4.266667 4.266667 8.533333 4.266667 8.533334 4.266667 0 4.266667 4.266667 8.533333 4.266666H512v55.466667c0 12.8 4.266667 21.333333 8.533333 25.6 4.266667 4.266667 12.8 8.533333 21.333334 8.533333 12.8 0 21.333333-4.266667 25.6-8.533333 4.266667-4.266667 4.266667-12.8 4.266666-25.6v-55.466667h81.066667c-8.533333 25.6-12.8 51.2-12.8 76.8 0 140.8 115.2 256 256 256s256-115.2 256-256-115.2-251.733333-256-251.733333z m-328.533333-128h55.466666c4.266667 0 4.266667 0 4.266667 4.266667v46.933333h-59.733333V358.4z m0 102.4h59.733333V512h-55.466667v-51.2zM512 516.266667h-55.466667V465.066667H512v51.2z m0-102.4h-59.733333V366.933333v-4.266666H512v51.2z m384 499.2c-93.866667 0-170.666667-76.8-170.666667-170.666667s76.8-170.666667 170.666667-170.666667 170.666667 76.8 170.666667 170.666667-76.8 170.666667-170.666667 170.666667z"  />
-<path fill="#fff" d="M951.466667 669.866667l-72.533334 72.533333-29.866666-25.6c-17.066667-17.066667-42.666667-12.8-59.733334 4.266667-17.066667 17.066667-12.8 42.666667 4.266667 59.733333l59.733333 51.2c8.533333 8.533333 17.066667 8.533333 29.866667 8.533333 12.8 0 21.333333-4.266667 29.866667-12.8l102.4-102.4c17.066667-17.066667 17.066667-42.666667 0-59.733333-21.333333-12.8-46.933333-12.8-64 4.266667zM580.266667 878.933333H213.333333c-72.533333 0-128-55.466667-128-119.466666V230.4c0-64 55.466667-119.466667 128-119.466667h512c72.533333 0 128 55.466667 128 119.466667v140.8c0 25.6 17.066667 42.666667 42.666667 42.666667s42.666667-17.066667 42.666667-42.666667V230.4c0-115.2-93.866667-204.8-213.333334-204.8H213.333333C93.866667 25.6 0 119.466667 0 230.4v529.066667c0 115.2 93.866667 204.8 213.333333 204.8h366.933334c25.6 0 42.666667-17.066667 42.666666-42.666667s-21.333333-42.666667-42.666666-42.666667z"  />
-</svg>

docs/assets/img/paypal.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 74" height="54"><g fill="none" fill-rule="evenodd"><rect width="199" height="73" x="0.5" y="0.5" fill="#FFF" fill-opacity="0.889" stroke="#979797" stroke-opacity="0.207" rx="8"></rect><path fill="#003087" fill-rule="nonzero" d="M77.5599861,42.672 C82.5421299,42.6678941 86.7787401,39.0351801 87.5429861,34.112 C88.3229861,29.145 84.4419861,24.8089419 78.9429861,24.8089419 L70.0799861,24.8089419 C69.7362553,24.8045668 69.4418457,25.054175 69.3899861,25.394 L65.4399861,50.466 C65.411103,50.6513547 65.4646051,50.8400802 65.5864664,50.9827001 C65.7083276,51.1253201 65.8863949,51.2076112 66.0739861,51.2080349 L70.7639861,51.2080349 C71.1069609,51.2114294 71.4002308,50.9620648 71.4519861,50.623 L72.6139861,43.258 C72.665345,42.9181575 72.9593063,42.6681411 73.3029861,42.672 L77.5599861,42.672 Z M81.4849861,33.886 C81.1949861,35.722 79.7759861,37.075 77.0599861,37.075 L73.5859861,37.075 L74.6389861,30.395 L78.0499861,30.395 C80.8599861,30.401 81.7729861,32.058 81.4849861,33.891 L81.4849861,33.886 Z M107.862986,32.706 L103.409986,32.706 C103.066412,32.702002 102.772249,32.9514007 102.719986,33.291 L102.575986,34.215 C102.575986,34.215 99.1189861,30.44 93.0009861,32.99 C89.4909861,34.451 87.8069861,37.47 87.0909861,39.68 C87.0909861,39.68 84.8139861,46.398 89.9609861,50.097 C89.9609861,50.097 94.7319861,53.653 100.105986,49.877 L100.012986,50.466 C99.9837482,50.6514164 100.037121,50.8403412 100.159058,50.9830492 C100.280994,51.1257572 100.459279,51.207952 100.646986,51.208 L105.097986,51.208 C105.441717,51.2124332 105.736126,50.962825 105.787986,50.623 L108.495986,33.448 C108.524869,33.2626453 108.471367,33.0739198 108.349506,32.9312999 C108.227645,32.7886799 108.049577,32.7063888 107.861986,32.706 L107.862986,32.706 Z M101.315986,42.198 C100.955689,44.6729154 98.8208538,46.5000884 96.3199861,46.474 C95.8464479,46.4793866 95.3750127,46.4102067 94.9229861,46.269 C93.0029861,45.653 91.9079861,43.807 92.2229861,41.807 C92.5837159,39.3248218 94.7289785,37.494888 97.2369861,37.53 C97.7109861,37.525 98.1829861,37.595 98.6349861,37.736 C100.547986,38.35 101.635986,40.196 101.320986,42.198 L101.315986,42.198 L101.315986,42.198 Z"></path><path fill="#0070E0" fill-rule="nonzero" d="M141.671986,42.672 C146.656916,42.6706404 150.897643,39.037672 151.663986,34.112 C152.442986,29.145 148.562986,24.8089637 143.061986,24.8089637 L134.201986,24.8089637 C133.85879,24.805503 133.565196,25.0547804 133.512986,25.394 L129.550986,50.473 C129.504409,50.756977 129.654011,51.0369155 129.915986,51.156 C130.000231,51.1952988 130.092026,51.2160348 130.184986,51.2160348 L134.875986,51.2160348 C135.219509,51.2194242 135.513223,50.9696175 135.564986,50.63 L136.727986,43.265 C136.778939,42.9249317 137.073149,42.6747042 137.416986,42.679 L141.671986,42.672 L141.671986,42.672 Z M145.596986,33.886 C145.306986,35.722 143.887986,37.075 141.170986,37.075 L137.697986,37.075 L138.751986,30.395 L142.162986,30.395 C144.970986,30.401 145.885986,32.058 145.596986,33.891 L145.596986,33.886 Z M171.973986,32.706 L167.525986,32.706 C167.18279,32.702503 166.889196,32.9517804 166.836986,33.291 L166.690986,34.215 C166.690986,34.215 163.234986,30.44 157.116986,32.99 C153.607986,34.451 151.922986,37.47 151.205986,39.68 C151.205986,39.68 148.929986,46.398 154.075986,50.097 C154.075986,50.097 158.847986,53.653 164.221986,49.877 L164.128986,50.466 C164.082409,50.749977 164.232011,51.0299155 164.493986,51.149 C164.577986,51.189 164.669986,51.209 164.762986,51.209 L169.213986,51.209 C169.55814,51.2141761 169.852851,50.9635224 169.902986,50.623 L172.611986,33.448 C172.638967,33.2621157 172.585098,33.073572 172.463986,32.93 C172.342253,32.7859662 172.162559,32.7038202 171.973986,32.706 L171.973986,32.706 Z M165.427986,42.198 C165.071797,44.6751772 162.934454,46.5044962 160.431986,46.474 C159.957778,46.4795969 159.485652,46.4104146 159.032986,46.269 C157.111986,45.653 156.015986,43.807 156.330986,41.807 C156.69083,39.3316868 158.825789,37.5039809 161.326986,37.53 C161.801986,37.525 162.273986,37.594 162.725986,37.736 C164.658986,38.35 165.749986,40.196 165.432986,42.198 L165.427986,42.198 L165.427986,42.198 Z"></path><path fill="#003087" fill-rule="nonzero" d="M124.204986,33.131 L118.837986,42.19 L116.114986,33.198 C116.0272,32.9049326 115.756916,32.7046623 115.450986,32.7059048 L110.608986,32.7059048 C110.439552,32.7027489 110.279321,32.782901 110.180312,32.9204358 C110.081303,33.0579706 110.056138,33.2353538 110.112986,33.395 L114.992986,48.541 L110.579986,55.679 C110.47841,55.8390534 110.472572,56.0418621 110.564775,56.2074929 C110.656977,56.3731236 110.832432,56.4750118 111.021986,56.4730293 L116.238986,56.4730293 C116.542538,56.474558 116.82432,56.3156042 116.979986,56.055 L130.611986,33.503 C130.711981,33.342671 130.716344,33.140509 130.62336,32.9760149 C130.530376,32.8115209 130.354918,32.7110068 130.165986,32.714 L124.950986,32.714 C124.645859,32.7104527 124.361807,32.8692321 124.204986,33.131 L124.204986,33.131 ZLine truncated

docs/assets/jassub/jassub-worker.js

@@ -0,0 +1,11 @@
+"use strict";async function Module(i={}){var g,v=i,y=(...t)=>console.log(...t),h=(...t)=>console.error(...t);function T(){j?.(v)}G=(t=>()=>{t(),self.wasmMemory=B,self.HEAPU8C=new Uint8ClampedArray(B.buffer),self.HEAPU8=new Uint8Array(B.buffer)})(G);function P(t){throw t}var j,w,C,A,M,E,O,ie,oe,le=!1;function G(){var t=B.buffer;w=new Int8Array(t),A=new Int16Array(t),C=new Uint8Array(t),M=new Uint16Array(t),E=new Int32Array(t),O=new Uint32Array(t),ie=new Float32Array(t),oe=new Float64Array(t)}function $e(){{var t=62914560;B=new WebAssembly.Memory({initial:t/65536,maximum:32768})}G()}$e();var X=t=>Xe(t),Q=()=>Qe(),B,fe=new TextDecoder,Z=(t,r,n,s)=>{var o=r+n;if(s)return o;for(;t[r]&&!(r>=o);)++r;return r},q=(t,r,n)=>{if(!t)return"";var s=Z(C,t,r,n);return fe.decode(C.subarray(t,s))},Ce=(t,r,n,s)=>P(`Assertion failed: ${q(t)}, at: `+[r?q(r):"unknown filename",n,s?q(s):"unknown function"]);function _e(t,r,n){return 0}var we=(t,r,n)=>{};function tr(t,r,n){return 0}function nr(t,r,n,s){}var ar=()=>P(""),sr=(t,r,n,s,o)=>{},U=t=>{for(var r="";;){var n=C[t++];if(!n)return r;r+=String.fromCharCode(n)}},J={},K={},ue={},N=class extends Error{constructor(r){super(r),this.name="BindingError"}},$=t=>{throw new N(t)};function ir(t,r,n={}){var s=r.name;if(t||$(`type "${s}" must have a positive integer typeid pointer`),K.hasOwnProperty(t)){if(n.ignoreDuplicateRegistrations)return;$(`Cannot register type '${s}' twice`)}if(K[t]=r,delete ue[t],J.hasOwnProperty(t)){var o=J[t];delete J[t],o.forEach(l=>l())}}function L(t,r,n={}){return ir(t,r,n)}var or=(t,r,n,s)=>{r=U(r),L(t,{name:r,fromWireType:function(o){return!!o},toWireType:function(o,l){return l?n:s},readValueFromPointer:function(o){return this.fromWireType(C[o])},destructorFunction:null})},lr=t=>({count:t.count,deleteScheduled:t.deleteScheduled,preservePointerOnDelete:t.preservePointerOnDelete,ptr:t.ptr,ptrType:t.ptrType,smartPtr:t.smartPtr,smartPtrType:t.smartPtrType}),Te=t=>{function r(n){return n.$$.ptrType.registeredClass.name}$(r(t)+" instance already deleted")},Pe=!1,Me=t=>{},fr=t=>{t.smartPtr?t.smartPtrType.rawDestructor(t.smartPtr):t.ptrType.registeredClass.rawDestructor(t.ptr)},Re=t=>{t.count.value-=1;var r=t.count.value===0;r&&fr(t)},ee=t=>globalThis.FinalizationRegistry?(Pe=new FinalizationRegistry(r=>{Re(r.$$)}),ee=r=>{var n=r.$$,s=!!n.smartPtr;if(s){var o={$$:n};Pe.register(r,o,r)}return r},Me=r=>Pe.unregister(r),ee(t)):(ee=r=>r,t),ce=[],ur=()=>{for(;ce.length;){var t=ce.pop();t.$$.deleteScheduled=!1,t.delete()}},Ee,cr=()=>{let t=de.prototype;Object.assign(t,{isAliasOf(n){if(!(this instanceof de)||!(n instanceof de))return!1;var s=this.$$.ptrType.registeredClass,o=this.$$.ptr;n.$$=n.$$;for(var l=n.$$.ptrType.registeredClass,u=n.$$.ptr;s.baseClass;)o=s.upcast(o),s=s.baseClass;for(;l.baseClass;)u=l.upcast(u),l=l.baseClass;return s===l&&o===u},clone(){if(this.$$.ptr||Te(this),this.$$.preservePointerOnDelete)return this.$$.count.value+=1,this;var n=ee(Object.create(Object.getPrototypeOf(this),{$$:{value:lr(this.$$)}}));return n.$$.count.value+=1,n.$$.deleteScheduled=!1,n},delete(){this.$$.ptr||Te(this),this.$$.deleteScheduled&&!this.$$.preservePointerOnDelete&&$("Object already scheduled for deletion"),Me(this),Re(this.$$),this.$$.preservePointerOnDelete||(this.$$.smartPtr=void 0,this.$$.ptr=void 0)},isDeleted(){return!this.$$.ptr},deleteLater(){return this.$$.ptr||Te(this),this.$$.deleteScheduled&&!this.$$.preservePointerOnDelete&&$("Object already scheduled for deletion"),ce.push(this),ce.length===1&&Ee&&Ee(ur),this.$$.deleteScheduled=!0,this}});const r=Symbol.dispose;r&&(t[r]=t.delete)};function de(){}var ke=(t,r)=>Object.defineProperty(r,"name",{value:t}),We={},Ue=(t,r,n)=>{if(t[r].overloadTable===void 0){var s=t[r];t[r]=function(...o){return t[r].overloadTable.hasOwnProperty(o.length)||$(`Function '${n}' called with an invalid number of arguments (${o.length}) - expects one of (${t[r].overloadTable})!`),t[r].overloadTable[o.length].apply(this,o)},t[r].overloadTable=[],t[r].overloadTable[s.argCount]=s}},dr=(t,r,n)=>{v.hasOwnProperty(t)?((n===void 0||v[t].overloadTable!==void 0&&v[t].overloadTable[n]!==void 0)&&$(`Cannot register public name '${t}' twice`),Ue(v,t,t),v[t].overloadTable.hasOwnProperty(n)&&$(`Cannot register multiple overloads of a function with the same number of arguments (${n})!`),v[t].overloadTable[n]=r):(v[t]=r,v[t].argCount=n)},vr=48,pr=57,gr=t=>{t=t.replace(/[^a-zA-Z0-9_]/g,"$");var r=t.charCodeAt(0);return r>=vr&&r<=pr?`_${t}`:t};function br(t,r,n,s,o,l,u,f){this.name=t,this.constructor=r,this.instancePrototype=n,this.rawDestructor=s,this.baseClass=o,this.getActualType=l,this.upcast=u,this.downcast=f,this.pureVirtualFunctions=[]}var ve=(t,r,n)=>{for(;r!==n;)r.upcast||$(`Expected null or instance of ${n.name}, got an instance of ${r.name}`),t=r.upcast(t),r=r.baseClass;return t},je=t=>{if(t===null)return"null";var r=typeof t;return r==="object"||r==="array"||r==="function"?t.toString():""+t};function hr(t,r){if(r===null)return this.isReferencLine truncated
+`;o&&(m+=`var destructors = [];
+`);var _=o?"destructors":"null",S=["humanName","throwBindingError","invoker","fn","runDestructors","fromRetWire","toClassParamWire"];r&&(m+=`var thisWired = toClassParamWire(${_}, this);
+`);for(var p=0;p<l;++p){var R=`toArg${p}Wire`;m+=`var arg${p}Wired = ${R}(${_}, arg${p});
+`,S.push(R)}if(m+=(n||s?"var rv = ":"")+`invoker(${f});
+`,o)m+=`runDestructors(destructors);
+`;else for(var p=r?1:2;p<t.length;++p){var F=p===1?"thisWired":"arg"+(p-2)+"Wired";t[p].destructorFunction!==null&&(m+=`${F}_dtor(${F});
+`,S.push(`${F}_dtor`))}return n&&(m+=`var ret = fromRetWire(rv);
+return ret;
+`),m+=`}
+`,new Function(S,m)}function He(t,r,n,s,o,l){var u=r.length;u<2&&$("argTypes array size mismatch! Must at least get return value and 'this' types!");for(var f=r[1]!==null&&n!==null,p=xe(r),m=!r[0].isVoid,_=r[0],S=r[1],R=[t,$,s,o,Le,_.fromWireType.bind(_),S?.toWireType.bind(S)],F=2;F<u;++F){var k=r[F];R.push(k.toWireType.bind(k))}if(!p)for(var F=f?1:2;F<r.length;++F)r[F].destructorFunction!==null&&R.push(r[F].destructorFunction);var x=Er(r,f,m,l)(...R);return ke(t,x)}var kr=(t,r,n,s,o,l)=>{var u=Be(r,n);o=H(s,o),z([],[t],f=>{f=f[0];var p=`constructor ${f.name}`;if(f.registeredClass.constructor_body===void 0&&(f.registeredClass.constructor_body=[]),f.registeredClass.constructor_body[r-1]!==void 0)throw new N(`Cannot register multiple constructors with identical number of parameters (${r-1}) for class '${f.name}'! Overload resolution is currently only performed using the parameter count, not actual type info!`);return f.registeredClass.constructor_body[r-1]=()=>{te(`Cannot construct ${f.name} due to unbound types`,u)},z([],u,m=>(m.splice(1,0,null),f.registeredClass.constructor_body[r-1]=He(p,m,null,o,l),[])),[]})},Wr=t=>{t=t.trim();const r=t.indexOf("(");return r===-1?t:t.slice(0,r)},Ur=(t,r,n,s,o,l,u,f,p,m)=>{var _=Be(n,s);r=U(r),r=Wr(r),l=H(o,l,p),z([],[t],S=>{S=S[0];var R=`${S.name}.${r}`;r.startsWith("@@")&&(r=Symbol[r.substring(2)]),f&&S.registeredClass.pureVirtualFunctions.push(r);function F(){te(`Cannot call ${R} due to unbound types`,_)}var k=S.registeredClass.instancePrototype,D=k[r];return D===void 0||D.overloadTable===void 0&&D.className!==S.name&&D.argCount===n-2?(F.argCount=n-2,F.className=S.name,k[r]=F):(Ue(k,r,R),k[r].overloadTable[n-2]=F),z([],_,x=>{var I=He(R,x,S,l,u,p);return k[r].overloadTable===void 0?(I.argCount=n-2,k[r]=I):k[r].overloadTable[n-2]=I,[]}),[]})},Ve=(t,r,n)=>(t instanceof Object||$(`${n} with invalid "this": ${t}`),t instanceof r.registeredClass.constructor||$(`${n} incompatible with "this" of type ${t.constructor.name}`),t.$$.ptr||$(`cannot call emscripten binding method ${n} on deleted object`),ve(t.$$.ptr,t.$$.ptrType.registeredClass,r.registeredClass)),Dr=(t,r,n,s,o,l,u,f,p,m)=>{r=U(r),o=H(s,o),z([],[t],_=>{_=_[0];var S=`${_.name}.${r}`,R={get(){te(`Cannot access ${S} due to unbound types`,[n,u])},enumerable:!0,configurable:!0};return p?R.set=()=>te(`Cannot access ${S} due to unbound types`,[n,u]):R.set=F=>$(S+" is a read-only property"),Object.defineProperty(_.registeredClass.instancePrototype,r,R),z([],p?[n,u]:[n],F=>{var k=F[0],D={get(){var I=Ve(this,_,S+" getter");return k.fromWireType(o(l,I))},enumerable:!0};if(p){p=H(f,p);var x=F[1];D.set=function(I){var se=Ve(this,_,S+" setter"),W=[];p(m,se,x.toWireType(W,I)),Le(W)}}return Object.defineProperty(_.registeredClass.instancePrototype,r,D),[]}),[]})},ze=[],Y=[0,1,,1,null,1,!0,1,!1,1],Ir=t=>{t>9&&--Y[t+1]===0&&(Y[t]=void 0,ze.push(t))},Fe={toValue:t=>(t||$(`Cannot use deleted val. handle = ${t}`),Y[t]),toHandle:t=>{switch(t){case void 0:return 2;case null:return 4;case!0:return 6;case!1:return 8;default:{const r=ze.pop()||Y.length;return Y[r]=t,Y[r+1]=1,r}}}},Br={name:"emscripten::val",fromWireType:t=>{var r=Fe.toValue(t);return Ir(t),r},toWireType:(t,r)=>Fe.toHandle(r),readValueFromPointer:pe,destructorFunction:null},Lr=t=>L(t,Br),xr=(t,r)=>{switch(r){case 4:return function(n){return this.fromWireType(ie[n>>2])};case 8:return function(n){return this.fromWireType(oe[n>>3])};default:throw new TypeError(`invalid float width (${r}): ${t}`)}},Hr=(t,r,n)=>{r=U(r),L(t,{name:r,fromWireType:s=>s,toWireType:(s,o)=>o,readValueFromPointer:xr(r,n),destructorFunction:null})},Vr=(t,r,n)=>{switch(r){case 1:return n?s=>w[s]:s=>C[s];case 2:return n?s=>A[s>>1]:s=>M[s>>1];case 4:return n?s=>E[s>>2]:s=>O[s>>2];default:throw new TypeError(`invalid integer width (${r}): ${t}`)}},zr=(t,r,n,s,o)=>{r=U(r);const l=s===0;let u=p=>p;if(l){var f=32-8*n;u=p=>p<<f>>>f,o=u(o)}L(t,{name:r,fromWireType:u,toWireType:(p,m)=>m,readValueFromPointer:Vr(r,n,s!==0),destructorFunction:null})},Gr=(t,r,n)=>{var s=[Int8Array,Uint8Array,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array],o=s[r];function l(u){var f=O[u>>2],p=O[u+4>>2];return new o(w.buffer,p,f)}n=U(n),L(t,{name:n,fromWireType:l,readValueFromPointer:l},{ignoreDuplicateRegistrations:!0})},qr=(t,r,n,s)=>{if(!(s>0))return 0;for(var o=n,l=n+s-1,u=0;u<t.length;++u){var f=t.codePointAt(u);if(f<=127){if(n>=l)break;r[n++]=f}else if(f<=2047){if(n+1>=l)break;r[n++]=192|f>>6,r[n++]=128|f&63}else if(f<=65535){if(n+2>=l)break;r[n++]=224|f>>12,r[n++]=128|f>>6&63,r[n++]=128|f&63}else{if(n+3>=l)break;r[n++]=240|f>>18,r[n++]=128|f>>12&63,r[n++]=128|f>>6&63,r[n++]=128|f&63,u++}}return r[n]=0,n-o},Ge=(t,r,n)=>qr(t,C,r,n),qe=t=>{for(var r=0,n=0;n<t.length;++n){var s=t.charCodeAt(n);s<=127?r++:s<=2047?r+=2:s>=55296&&s<=57343?(r+=4,++n):r+=3}return r},Jr=(t,r)=>{r=U(r),L(t,{name:r,fromWireType(n){var s=O[n>>2],o=n+4,l;return l=q(o,s,!0),V(n),l},toWireType(n,s){s instanceof ArrayBuffer&&(s=new Uint8Arr
Line truncated

docs/assets/js/JavascriptSubtitlesOctopus/subtitles-octopus.js

@@ -1,589 +0,0 @@
-var SubtitlesOctopus = function (options) {
-    var supportsWebAssembly = false;
-    try {
-        if (typeof WebAssembly === "object"
-            && typeof WebAssembly.instantiate === "function") {
-            const module = new WebAssembly.Module(Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00));
-            if (module instanceof WebAssembly.Module)
-                supportsWebAssembly = (new WebAssembly.Instance(module) instanceof WebAssembly.Instance);
-        }
-    } catch (e) {
-    }
-    console.log("WebAssembly support detected: " + (supportsWebAssembly ? "yes" : "no"));
-
-    var self = this;
-    self.canvas = options.canvas; // HTML canvas element (optional if video specified)
-    self.lossyRender = options.lossyRender; // Speedup render for heavy subs
-    self.isOurCanvas = false; // (internal) we created canvas and manage it
-    self.video = options.video; // HTML video element (optional if canvas specified)
-    self.canvasParent = null; // (internal) HTML canvas parent element
-    self.fonts = options.fonts || []; // Array with links to fonts used in sub (optional)
-    self.availableFonts = options.availableFonts || []; // Object with all available fonts (optional). Key is font name in lower case, value is link: {"arial": "/font1.ttf"}
-    self.onReadyEvent = options.onReady; // Function called when SubtitlesOctopus is ready (optional)
-    if (supportsWebAssembly) {
-        self.workerUrl = options.workerUrl || 'subtitles-octopus-worker.js'; // Link to WebAssembly worker
-    } else {
-        self.workerUrl = options.legacyWorkerUrl || 'subtitles-octopus-worker-legacy.js'; // Link to legacy worker
-    }
-    self.subUrl = options.subUrl; // Link to sub file (optional if subContent specified)
-    self.subContent = options.subContent || null; // Sub content (optional if subUrl specified)
-    self.onErrorEvent = options.onError; // Function called in case of critical error meaning sub wouldn't be shown and you should use alternative method (for instance it occurs if browser doesn't support web workers).
-    self.debug = options.debug || false; // When debug enabled, some performance info printed in console.
-    self.lastRenderTime = 0; // (internal) Last time we got some frame from worker
-    self.pixelRatio = window.devicePixelRatio || 1; // (internal) Device pixel ratio (for high dpi devices)
-
-    self.timeOffset = options.timeOffset || 0; // Time offset would be applied to currentTime from video (option)
-
-    self.hasAlphaBug = false;
-
-    (function() {
-        if (typeof ImageData.prototype.constructor === 'function') {
-            try {
-                // try actually calling ImageData, as on some browsers it's reported
-                // as existing but calling it errors out as "TypeError: Illegal constructor"
-                new window.ImageData(new Uint8ClampedArray([0, 0, 0, 0]), 1, 1);
-                return;
-            } catch (e) {
-                console.log("detected that ImageData is not constructable despite browser saying so");
-            }
-        }
-
-        var canvas = document.createElement('canvas');
-        var ctx = canvas.getContext('2d');
-
-        window.ImageData = function () {
-            var i = 0;
-            if (arguments[0] instanceof Uint8ClampedArray) {
-                var data = arguments[i++];
-            }
-            var width = arguments[i++];
-            var height = arguments[i];
-
-            var imageData = ctx.createImageData(width, height);
-            if (data) imageData.data.set(data);
-            return imageData;
-        }
-    })();
-
-    self.workerError = function (error) {
-        console.error('Worker error: ', error);
-        if (self.onErrorEvent) {
-            self.onErrorEvent(error);
-        }
-        if (!self.debug) {
-            self.dispose();
-            throw new Error('Worker error: ' + error);
-        }
-    };
-
-    // Not tested for repeated usage yet
-    self.init = function () {
-        if (!window.Worker) {
-            self.workerError('worker not supported');
-            return;
-        }
-        // Worker
-        if (!self.worker) {
-            self.worker = new Worker(self.workerUrl);
-            self.worker.onmessage = self.onWorkerMessage;
-            self.worker.onerror = self.workerError;
-        }
-        self.workerActive = false;
-        self.createCanvas();
-        self.setVideo(options.video);
-        self.setSubUrl(options.subUrl);
-        self.worker.postMessage({
-            target: 'worker-init',
-            width: self.canvas.width,
-            height: self.canvas.height,
-            URL: document.URL,
-            currentScript: self.workerUrl,
-            preMain: true,
-            fastRender: self.lossyRender,
-            subUrl: self.subUrl,
-            subContent: self.subContent,
-            fonts: self.fonts,
-            availableFonts: self.availableFonts,
-            debug: self.debug
-        });
-    };
-
-    self.createCanvas = function () {
-        if (!self.canvas) {
-            if (self.video) {
-                self.isOurCanvas = true;
-                self.canvas = document.createElement('canvas');
-                self.canvas.className = 'libassjs-canvas';
-                self.canvas.style.display = 'none';
-
-                self.canvasParent = document.createElement('div');
-                self.canvasParent.className = 'libassjs-canvas-parent';
-                self.canvasParent.appendChild(self.canvas);
-
-                if (self.video.nextSibling) {
-                    self.video.parentNode.insertBefore(self.canvasParent, self.video.nextSibling);
-                }
-                else {
-                    self.video.parentNode.appendChild(self.canvasParent);
-                }
-            }
-            else {
-                if (!self.canvas) {
-                    self.workerError('Don\'t know where to render: you should give video or canvas in options.');
-                }
-            }
-        }
-        self.ctx = self.canvas.getContext('2d');
-        self.bufferCanvas = document.createElement('canvas');
-        self.bufferCanvasCtx = self.bufferCanvas.getContext('2d');
-
-        // test for alpha bug, where e.g. WebKit can render a transparent pixel
-        // (with alpha == 0) as non-black which then leads to visual artifacts
-        self.bufferCanvas.width = 1;
-        self.bufferCanvas.height = 1;
-        var testBuf = new Uint8ClampedArray([0, 255, 0, 0]);
-        var testImage = new ImageData(testBuf, 1, 1);
-        self.bufferCanvasCtx.clearRect(0, 0, 1, 1);
-        self.ctx.clearRect(0, 0, 1, 1);
-        var prePut = self.ctx.getImageData(0, 0, 1, 1).data;
-        self.bufferCanvasCtx.putImageData(testImage, 0, 0);
-        self.ctx.drawImage(self.bufferCanvas, 0, 0);
-        var postPut = self.ctx.getImageData(0, 0, 1, 1).data;
-        self.hasAlphaBug = prePut[1] != postPut[1];
-        if (self.hasAlphaBug) {
-            console.log("Detected a browser having issue with transparent pixels, applying workaround");
-        }
-    };
-
-    self.setVideo = function (video) {
-        self.video = video;
-        if (self.video) {
-            var timeupdate = function () {
-                self.setCurrentTime(video.currentTime + self.timeOffset);
-            }
-            self.video.addEventListener("timeupdate", timeupdate, false);
-            self.video.addEventListener("playing", function () {
-                self.setIsPaused(false, video.currentTime + self.timeOffset);
-            }, false);
-            self.video.addEventListener("pause", function () {
-                self.setIsPaused(true, video.currentTime + self.timeOffset);
-            }, false);
-            self.video.addEventListener("seeking", function () {
-                self.video.removeEventListener("timeupdate", timeupdate);
-            }, false);
-            self.video.addEventListener("seeked", function () {
-                self.video.addEventListener("timeupdate", timeupdate, false);
-                self.setCurrentTime(video.currentTime + self.timeOffset);
-            }, false);
-            self.video.addEventListener("ratechange", function () {
-                self.setRate(video.playbackRate);
-            }, false);
-            self.video.addEventListener("timeupdate", function () {
-                self.setCurrentTime(video.currentTime + self.timeOffset);
-            }, false);
-            self.video.addEventListener("waiting", function () {
-                self.setIsPaused(true, video.currentTime + self.timeOffset);
-            }, false);
-
-            document.addEventListener("fullscreenchange", self.resizeWithTimeout, false);
-            document.addEventListener("mozfullscreenchange", self.resizeWithTimeout, false);
-            document.addEventListener("webkitfullscreenchange", self.resizeWithTimeout, false);
-            document.addEventListener("msfullscreenchange", self.resizeWithTimeout, false);
-            window.addEventListener("resize", self.resizeWithTimeout, false);
-
-            // Support Element Resize Observer
-            if (typeof ResizeObserver !== "undefined") {
-                self.ro = new ResizeObserver(self.resizeWithTimeout);
-                self.ro.observe(self.video);
-            }
-
-            if (self.video.videoWidth > 0) {
-                self.resize();
-            }
-            else {
-                self.video.addEventListener("loadedmetadata", function (e) {
-                    e.target.removeEventListener(e.type, arguments.callee);
-                    self.resize();
-                }, false);
-            }
-        }
-    };
-
-    self.getVideoPosition = function () {
-        var videoRatio = self.video.videoWidth / self.video.videoHeight;
-        var width = self.video.offsetWidth, height = self.video.offsetHeight;
-        var elementRatio = width / height;
-        var realWidth = width, realHeight = height;
-        if (elementRatio > videoRatio) realWidth = Math.floor(height * videoRatio);
-        else realHeight = Math.floor(width / videoRatio);
-
-        var x = (width - realWidth) / 2;
-        var y = (height - realHeight) / 2;
-
-        return {
-            width: realWidth,
-            height: realHeight,
-            x: x,
-            y: y
-        };
-    };
-
-    self.setSubUrl = function (subUrl) {
-        self.subUrl = subUrl;
-    };
-
-    self.renderFrameData = null;
-    function renderFrames() {
-        var data = self.renderFramesData;
-        var beforeDrawTime = performance.now();
-        self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height);
-        for (var i = 0; i < data.canvases.length; i++) {
-            var image = data.canvases[i];
-            self.bufferCanvas.width = image.w;
-            self.bufferCanvas.height = image.h;
-            var imageBuffer = new Uint8ClampedArray(image.buffer);
-            if (self.hasAlphaBug) {
-                for (var j = 3; j < imageBuffer.length; j = j + 4) {
-                    imageBuffer[j] = (imageBuffer[j] >= 1) ? imageBuffer[j] : 1;
-                }
-            }
-            var imageData = new ImageData(imageBuffer, image.w, image.h);
-            self.bufferCanvasCtx.putImageData(imageData, 0, 0);
-            self.ctx.drawImage(self.bufferCanvas, image.x, image.y);
-        }
-        if (self.debug) {
-            var drawTime = Math.round(performance.now() - beforeDrawTime);
-            console.log(Math.round(data.spentTime) + ' ms (+ ' + drawTime + ' ms draw)');
-            self.renderStart = performance.now();
-        }
-    }
-
-    /**
-     * Lossy Render Mode
-     *
-     */
-    function renderFastFrames() {
-        var data = self.renderFramesData;
-        var beforeDrawTime = performance.now();
-        self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height);
-        for (var i = 0; i < data.bitmaps.length; i++) {
-            var image = data.bitmaps[i];
-            self.ctx.drawImage(image.bitmap, image.x, image.y);
-        }
-        if (self.debug) {
-            var drawTime = Math.round(performance.now() - beforeDrawTime);
-            console.log(data.bitmaps.length + ' bitmaps, libass: ' + Math.round(data.libassTime) + 'ms, decode: ' + Math.round(data.decodeTime) + 'ms, draw: ' + drawTime + 'ms');
-            self.renderStart = performance.now();
-        }
-    }
-
-    self.workerActive = false;
-    self.frameId = 0;
-    self.onWorkerMessage = function (event) {
-        //dump('\nclient got ' + JSON.stringify(event.data).substr(0, 150) + '\n');
-        if (!self.workerActive) {
-            self.workerActive = true;
-            if (self.onReadyEvent) {
-                self.onReadyEvent();
-            }
-        }
-        var data = event.data;
-        switch (data.target) {
-            case 'stdout': {
-                console.log(data.content);
-                break;
-            }
-            case 'console-log': {
-                console.log.apply(console, JSON.parse(data.content));
-                break;
-            }
-            case 'console-debug': {
-                console.debug.apply(console, JSON.parse(data.content));
-                break;
-            }
-            case 'console-info': {
-                console.info.apply(console, JSON.parse(data.content));
-                break;
-            }
-            case 'console-warn': {
-                console.warn.apply(console, JSON.parse(data.content));
-                break;
-            }
-            case 'console-error': {
-                console.error.apply(console, JSON.parse(data.content));
-                break;
-            }
-            case 'stderr': {
-                console.error(data.content);
-                break;
-            }
-            case 'window': {
-                window[data.method]();
-                break;
-            }
-            case 'canvas': {
-                switch (data.op) {
-                    case 'getContext': {
-                        self.ctx = self.canvas.getContext(data.type, data.attributes);
-                        break;
-                    }
-                    case 'resize': {
-                        self.resize(data.width, data.height);
-                        break;
-                    }
-                    case 'renderCanvas': {
-                        if (self.lastRenderTime < data.time) {
-                            self.lastRenderTime = data.time;
-                            self.renderFramesData = data;
-                            window.requestAnimationFrame(renderFrames);
-                        }
-                        break;
-                    }
-                    case 'renderFastCanvas': {
-                        if (self.lastRenderTime < data.time) {
-                            self.lastRenderTime = data.time;
-                            self.renderFramesData = data;
-                            window.requestAnimationFrame(renderFastFrames);
-                        }
-                        break;
-                    }
-                    case 'setObjectProperty': {
-                        self.canvas[data.object][data.property] = data.value;
-                        break;
-                    }
-                    default:
-                        throw 'eh?';
-                }
-                break;
-            }
-            case 'tick': {
-                self.frameId = data.id;
-                self.worker.postMessage({
-                    target: 'tock',
-                    id: self.frameId
-                });
-                break;
-            }
-            case 'custom': {
-                if (self['onCustomMessage']) {
-                    self['onCustomMessage'](event);
-                } else {
-                    throw 'Custom message received but client onCustomMessage not implemented.';
-                }
-                break;
-            }
-            case 'setimmediate': {
-                self.worker.postMessage({
-                    target: 'setimmediate'
-                });
-                break;
-            }
-            case 'get-events': {
-                console.log(data.target);
-                console.log(data.events);
-                break;
-            }
-            case 'get-styles': {
-                console.log(data.target);
-                console.log(data.styles);
-                break;
-            }
-            default:
-                throw 'what? ' + data.target;
-        }
-    };
-
-    self.resize = function (width, height, top, left) {
-        var videoSize = null;
-        top = top || 0;
-        left = left || 0;
-        if ((!width || !height) && self.video) {
-            videoSize = self.getVideoPosition();
-            width = videoSize.width * self.pixelRatio;
-            height = videoSize.height * self.pixelRatio;
-            var offset = self.canvasParent.getBoundingClientRect().top - self.video.getBoundingClientRect().top;
-            top = videoSize.y - offset;
-            left = videoSize.x;
-        }
-        if (!width || !height) {
-            if (!self.video) {
-                console.error('width or height is 0. You should specify width & height for resize.');
-            }
-            return;
-        }
-
-
-        if (
-          self.canvas.width != width ||
-          self.canvas.height != height ||
-          self.canvas.style.top != top ||
-          self.canvas.style.left != left
-        ) {
-            self.canvas.width = width;
-            self.canvas.height = height;
-
-            if (videoSize != null) {
-                self.canvasParent.style.position = 'relative';
-                self.canvas.style.display = 'block';
-                self.canvas.style.position = 'absolute';
-                self.canvas.style.width = videoSize.width + 'px';
-                self.canvas.style.height = videoSize.height + 'px';
-                self.canvas.style.top = top + 'px';
-                self.canvas.style.left = left + 'px';
-                self.canvas.style.pointerEvents = 'none';
-            }
-
-            self.worker.postMessage({
-                target: 'canvas',
-                width: self.canvas.width,
-                height: self.canvas.height
-            });
-        }
-    };
-
-    self.resizeWithTimeout = function () {
-        self.resize();
-        setTimeout(self.resize, 100);
-    };
-
-    self.runBenchmark = function () {
-        self.worker.postMessage({
-            target: 'runBenchmark'
-        });
-    };
-
-    self.customMessage = function (data, options) {
-        options = options || {};
-        self.worker.postMessage({
-            target: 'custom',
-            userData: data,
-            preMain: options.preMain
-        });
-    };
-
-    self.setCurrentTime = function (currentTime) {
-        self.worker.postMessage({
-            target: 'video',
-            currentTime: currentTime
-        });
-    };
-
-    self.setTrackByUrl = function (url) {
-        self.worker.postMessage({
-            target: 'set-track-by-url',
-            url: url
-        });
-    };
-
-    self.setTrack = function (content) {
-        self.worker.postMessage({
-            target: 'set-track',
-            content: content
-        });
-    };
-
-    self.freeTrack = function (content) {
-        self.worker.postMessage({
-            target: 'free-track'
-        });
-    };
-
-
-    self.render = self.setCurrentTime;
-
-    self.setIsPaused = function (isPaused, currentTime) {
-        self.worker.postMessage({
-            target: 'video',
-            isPaused: isPaused,
-            currentTime: currentTime
-        });
-    };
-
-    self.setRate = function (rate) {
-        self.worker.postMessage({
-            target: 'video',
-            rate: rate
-        });
-    };
-
-    self.dispose = function () {
-        self.worker.postMessage({
-            target: 'destroy'
-        });
-
-        self.worker.terminate();
-        self.workerActive = false;
-        // Remove the canvas element to remove residual subtitles rendered on player
-        if (self.video) {
-            self.video.parentNode.removeChild(self.canvasParent);
-        }
-    };
-
-    self.createEvent = function (event) {
-        self.worker.postMessage({
-            target: 'create-event',
-            event: event
-        });
-    };
-
-    self.getEvents = function () {
-        self.worker.postMessage({
-            target: 'get-events'
-        });
-    };
-
-    self.setEvent = function (event, index) {
-        self.worker.postMessage({
-            target: 'set-event',
-            event: event,
-            index: index
-        });
-    };
-
-    self.removeEvent = function (index) {
-        self.worker.postMessage({
-            target: 'remove-event',
-            index: index
-        });
-    };
-
-    self.createStyle = function (style) {
-        self.worker.postMessage({
-            target: 'create-style',
-            style: style
-        });
-    };
-
-    self.getStyles = function () {
-        self.worker.postMessage({
-            target: 'get-styles'
-        });
-    };
-
-    self.setStyle = function (style, index) {
-        self.worker.postMessage({
-            target: 'set-style',
-            style: style,
-            index: index
-        });
-    };
-
-    self.removeStyle = function (index) {
-        self.worker.postMessage({
-            target: 'remove-style',
-            index: index
-        });
-    };
-
-    self.init();
-};
-
-if (typeof SubtitlesOctopusOnLoad == 'function') {
-    SubtitlesOctopusOnLoad();
-}
-
-if (typeof exports !== 'undefined') {
-    if (typeof module !== 'undefined' && module.exports) {
-        exports = module.exports = SubtitlesOctopus
-    }
-}

docs/assets/js/JavascriptSubtitlesOctopus/test.ass

@@ -1,56 +0,0 @@
-[Script Info]
-Title:
-ScriptType: v4.00+
-WrapStyle: 0
-PlayResX: 640
-PlayResY: 480
-ScaledBorderAndShadow: yes
-
-[V4+ Styles]
-Format: Name, Fontname, Fontsize, PrimaryColour, SecondaryColour, OutlineColour, BackColour, Bold, Italic, Underline, StrikeOut, ScaleX, ScaleY, Spacing, Angle, BorderStyle, Outline, Shadow, Alignment, MarginL, MarginR, MarginV, Encoding
-Style: Default,Arial,20,&H00FFFFFF,&H000000FF,&H00000000,&H00000000,0,0,0,0,100,100,0,0,1,2,2,2,10,10,10,0
-Style: Alt,Times New Roman,40,&H00FFFFFF,&H000000FF,&H00000000,&H00000000,0,0,0,0,100,100,0,0,1,2,2,8,10,10,10,0
-
-[Events]
-Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
-Comment: 0,0:00:00.00,0:00:05.00,Default,,0000,0000,0000,,This line is a comment and should not display on rendered output. This file is intended to be rendered on a 640x480 video, preferably a single solid colour, or maybe a checkerboard pattern.
-Dialogue: 0,0:00:00.00,0:00:05.00,Default,,0000,0000,0000,,This is a test of the ASS format and some basic features in it.
-Dialogue: 0,0:00:05.00,0:00:07.00,Default,,0000,0000,0000,,This and the previous line should both show at the bottom of the video in 20 pixel high white Arial with a 2 pixel black outline and 2 pixel offset shadow. This line is long so it should automatically be broken into several lines that are approximately even length, with upper lines being longer.
-Dialogue: 0,0:00:07.00,0:00:09.00,Default,,0000,0000,0000,,Now going to test conflict resolution. {By the way, this is a common abuse, "inline-comments" in override tag groups. They should not be rendered and not generate errors, just be ignored.}
-Dialogue: 0,0:00:07.50,0:00:09.00,Default,,0000,0000,0000,,This line should be above the previous.
-Dialogue: 0,0:00:09.00,0:00:11.00,Default,,0000,0000,0000,,{\an1}This line should be lower-left aligned using the \an1 override.
-Dialogue: 0,0:00:11.00,0:00:13.00,Default,,0000,0000,0000,,{\an9}Upper right
-Dialogue: 0,0:00:12.00,0:00:14.00,Alt,,0000,0000,0000,,This one should be below the "Upper right" line and be centered on screen. It should also be in 40 pixel high Times New Roman.
-Dialogue: 0,0:00:14.00,0:00:16.00,Alt,,0000,0000,0000,,{\fs10}This should also be a toptitle in Times New Roman, but much smaller. Using an override tag to change size.
-Dialogue: 0,0:00:16.00,0:00:18.00,Alt,,0000,0000,0000,,{\a5}Top-left using the legacy \a5 tag
-Dialogue: 0,0:00:18.00,0:00:20.00,Default,,0000,0000,0000,,{\an5}This line is centered on screen.\NAt the bottom of the screen should be two lines in different layers, they are rendered on top of each other because conflict resolution only considers lines in the same layer.
-Dialogue: 0,0:00:18.00,0:00:20.00,Default,,0000,0000,0000,,This is in layer 0
-Dialogue: 1,0:00:18.00,0:00:20.00,Default,,0000,0000,0000,,And this line is in layer 1
-Dialogue: 0,0:00:20.00,0:00:22.00,Default,,0000,0000,0000,,Another line in layer 0
-Dialogue: 1,0:00:20.00,0:00:22.00,Default,,0050,0000,0020,,And this line is in layer 1, but has changed its margins so it isn't exactly centered, and it's raised above the other line.
-Dialogue: 0,0:00:22.00,0:00:24.00,Default,,0000,0000,0000,,Switching {\fnTimes New Roman}font inline, {\r}and resetting styles
-Dialogue: 0,0:00:24.00,0:00:26.00,Default,,0000,0000,0000,,Also {\rAlt}switching to a different style {\r}inline
-Dialogue: 0,0:00:26.00,0:00:28.00,Default,,0000,0000,0000,,{\an5\pos(258,131)}Positioning... this line should be in an odd place
-Dialogue: 0,0:00:26.00,0:00:28.00,Default,,0000,0000,0000,,{\an5\pos(222,338)\frz29.559}So should this one, and be rotated
-Dialogue: 0,0:00:28.00,0:00:30.00,Default,,0000,0000,0000,,{\pos(371,314)\frz338.403\frx42\fry30\org(187,165)}Some more rotation tricks, this time in 3D and with a different origin
-Dialogue: 0,0:00:30.00,0:00:32.00,Default,,0000,0000,0000,,{\an5\t(\frz360)}This line is animated and rotates 360 degrees over its duration
-Dialogue: 0,0:00:32.00,0:00:34.00,Default,,0000,0000,0000,,{\an5\move(182,157,414,311)}This line moves
-Dialogue: 0,0:00:34.00,0:00:36.00,Default,,0000,0000,0000,,{\an5\clip(126,192,487,241)}This line is only partially visible\Nso if you can see this, \clip is handled incorrectly
-Dialogue: 0,0:00:36.00,0:00:38.00,Default,,0000,0000,0000,,{\an5\clip(m 178 212 l 163 249 212 302 257 232 309 249 366 241 392 285 473 267 487 210 421 241 353 219 207 258)}And this line has a funnily-shaped clip area
-Dialogue: 0,0:00:38.00,0:00:40.00,Default,,0000,0000,0000,,{\an5\pos(321,193)}Here should be a pretty feather with a thin border and no shadow:
-Dialogue: 0,0:00:38.00,0:00:40.00,Default,,0000,0000,0000,,{\an5\bord1\shad0\p1\fscx300\fscy300\pos(316,312)}m 0 0 b 33 -3 48 -7 61 -19 b 53 -7 31 -1 1 2 m 9 0 b 9 -5 10 -6 14 -12 b 9 -5 10 -3 10 0 m 10 -1 b 10 -5 11 -8 16 -12 b 17 -12 18 -13 22 -14 b 18 -10 16 -6 15 -1 b 17 -6 19 -10 23 -14 l 26 -15 b 22 -11 20 -6 19 -2 b 24 -11 27 -14 28 -15 b 31 -16 35 -16 39 -16 b 37 -14 36 -10 36 -5 b 36 -9 38 -14 39 -16 b 41 -16 43 -16 45 -15 b 44 -13 43 -10 43 -7 l 29 -3 m 43 -7 b 44 -11 45 -13 47 -15 b 46 -13 46 -11 46 -9 b 46 -11 47 -13 49 -15 b 51 -15 48 -13 48 -9 b 49 -11 49 -14 52 -16 b 55 -16 53 -17 51 -11 l 48 -8 m 54 -13 b 53 -14 54 -15 54 -16 b 54 -15 54 -14 55 -13 b 57 -13 60 -12 62 -14 b 61 -12 55 -12 53 -12 b 55 -11 56 -10 61 -10 b 61 -7 53 -9 52 -11 b 53 -8 55 -7 58 -6 b 57 -5 56 -4 54 -3 b 49 -5 48 -6 47 -9 b 47 -6 50 -4 53 -2 b 49 -3 47 -6 45 -8 b 46 -6 49 -3 52 -1 b 46 2 45 3 43 3 b 40 0 39 -3 40 -6 b 39 -3 39 1 42 3 b 40 6 36 1 34 -4 b 35 -1 36 2 38 5 b 32 7 26 9 22 8 b 19 5 17 2 16 -1 b 17 3 19 5 20 7 b 17 4 16 2 15 0 b 15 2 17 5 19 8 b 15 9 13 3 12 0 l 25 -2 l 42 -7 m 12 0 b 13 3 13 7 17 9 b 12 7 10 1 10 0
-Dialogue: 0,0:00:40.00,0:00:42.00,Default,,0000,0000,0000,,Some other basic font style tests:\NNormal, {\b1}Boldface{\r}, {\i1}Italics{\r}, {\u1}Underline{\r}, {\s1}Strikethrough
-Dialogue: 0,0:00:42.00,0:00:44.00,Default,,0000,0000,0000,,There should be no linebreak here,\nbut there should be one here\Nso this is on a separate line.
-Dialogue: 0,0:00:44.00,0:00:46.00,Default,,0000,0000,0000,,This line is pushed left by adding some hard spaces to the right\h\h\h\h\h\h\h\h\h\h\h\h\h\h\h\h\h\h\h\h
-Dialogue: 0,0:00:44.00,0:00:46.00,Default,,0000,0000,0000,,                          Regular spaces at line start/end are ignored, so this line is centered
-Dialogue: 0,0:00:46.00,0:00:48.00,Default,,0000,0000,0000,,{\an8\q2}This is a long line but it is not broken into several because it's using the \q override tag which changes the line-wrapping mode for a single line. The tag can take several values, 0 is the default which is "smart wrapping" with top lines longer, 1 is regular wrapping, 2 is no wrapping and 3 is smart-wrapping with bottom lines longer.
-Dialogue: 0,0:00:46.00,0:00:48.00,Default,,0000,0000,0000,,{\an5\q1}This is a long line using the \q1 override tag to get "dumb" wrapping, make as long lines as possible and first wrap when it'd go off screen. This is mostly visible when the last line generated is short.
-Dialogue: 0,0:00:46.00,0:00:48.00,Default,,0000,0000,0000,,{\q3}And this line uses the \q3 wrapping style, which is similar to the \q0 default smart-wrap style, but has lower lines longer than the upper ones.
-Dialogue: 0,0:00:48.00,0:00:50.00,Default,,0000,0000,0000,,{\an5}{\bord0\t(\bord10)}This text has a growing border\N{\r\shad0\t(\shad10)}This text has an increasing shadow\N{\r\t(\fry360)}This text is rotating around the Y axis\N{\r\t(\frz720)}This text rotates {\t(\frx360)}and this one even more
-Dialogue: 0,0:00:50.00,0:00:52.00,Default,,0000,0000,0000,,{\an5\bord0\shad0}All of this has no border or shadow...\N{\1c&H0000FF&}This is bright red, {\1c&H00FF00&}green, {\1c&HFF0000}blue{\1c&HFFFFFF&}\N{\1a&H80&}50% transparent
-Dialogue: 0,0:00:52.00,0:00:54.00,Default,,0000,0000,0000,,{\fsp10}Large inter-letter spacing
-Dialogue: 0,0:00:54.00,0:00:56.00,Default,,0000,0000,0000,,{\shad0}No shadow here, just regular border, {\be1}but this is \be1 blurred edges!
-Dialogue: 0,0:00:56.00,0:00:58.00,Default,,0000,0000,0000,,{\t(1000,2000,\alpha&HFF&)}Fading out after 1 sec on screen, using \alpha. Everything should fade.
-Dialogue: 0,0:00:58.00,0:01:00.00,Default,,0000,0000,0000,,{\fad(1000,1000)}Fading in and out using \fad
-Dialogue: 0,0:01:00.00,0:01:02.00,Default,,0000,0000,0000,,{\k10}And {\k5}now {\k20}for {\kf50}ka{\kf20}ra{\K70}o{\K10}ke{\k0}!
-Dialogue: 0,0:01:02.00,0:01:04.00,Default,,0000,0000,0000,,{\an5\t()\clip(69,215,573,267)\t(1000,2000,3,\clip(573,267,573,267))}And the last thing on the programme, an animated rectangular \clip, delayed by 1 second. And it even uses acceleration...!

docs/assets/js/JavascriptSubtitlesOctopus/test2.ass

@@ -1,49 +0,0 @@
-[Script Info]
-; // 此字幕由爱幕生成
-Synch Point:1
-ScriptType:v4.00+
-Collisions:Normal
-
-[V4+ Styles]
-Format: Name, Fontname, Fontsize, PrimaryColour, SecondaryColour, OutlineColour, BackColour, Bold, Italic, Underline, StrikeOut, ScaleX, ScaleY, Spacing, Angle, BorderStyle, Outline, Shadow, Alignment, MarginL, MarginR, MarginV, Encoding
-Style: Default, Microsoft YaHei, 20, &H00FFFFFF, &H000092FE, &H00000000, &H82000000, 0, 0, 0, 0, 100, 100, 0, 0, 1, 1, 2, 2, 10, 10, 30, 134
-Style: Style1, Microsoft YaHei, 20, &H0000DCFC, &H0000DCFC, &H00000000, &H82000000, 0, 0, 0, 0, 100, 100, 1, 0, 1, 1, 2, 2, 10, 10, 30, 134
-Style: Style2, ZCOOL KuaiLe, 20, &H0000DDA4, &H0000DDA4, &H00334D19, &H82000000, 0, 0, 0, 0, 100, 100, 1, 0, 4, 1, 3, 2, 10, 10, 50, 134
-Style: Style3, Source Han Sans CN Medium, 28, &H009E14AB, &H009E14AB, &H00009EFB, &H82000000, 0, 0, 0, 0, 100, 100, 1, 0, 1, 1, 2, 2, 10, 10, 100, 134
-
-[Events]
-Format: Layer, Start, End, Style, Actor, MarginL, MarginR, MarginV, Effect, Text
-Dialogue: 0,0:00:00.31,0:00:00.84,Style1,NTP,0000,0000,0000,,那一天\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}あの日
-Dialogue: 0,0:00:01.28,0:00:02.22,Style2,NTP,0000,0000,0000,,星星降落的日子\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}星が降った日
-Dialogue: 0,0:00:03.15,0:00:04.41,Style3,NTP,0000,0000,0000,,那简直是\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}それはまるで
-Dialogue: 0,0:00:04.45,0:00:04.97,Default,NTP,0000,0000,0000,,简直\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}まるで
-Dialogue: 0,0:00:05.12,0:00:06.30,Default,NTP,0000,0000,0000,,像梦中的景色一样\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}夢の景色のように
-Dialogue: 0,0:00:07.44,0:00:08.98,Default,NTP,0000,0000,0000,,美丽的景色\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}美しい眺めだった
-Dialogue: 0,0:00:24.60,0:00:25.09,Default,NTP,0000,0000,0000,,放学后\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}放課後
-Dialogue: 0,0:00:25.70,0:00:26.26,Default,NTP,0000,0000,0000,,不好\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}悪い
-Dialogue: 0,0:00:26.48,0:00:27.68,Default,NTP,0000,0000,0000,,我今天开始打工\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}おれ今日これからバイト
-Dialogue: 0,0:00:29.34,0:00:31.69,Default,NTP,0000,0000,0000,,已经讨厌这样的乡下了\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}もうこんな田舎嫌だよー
-Dialogue: 0,0:00:31.97,0:00:33.53,Default,NTP,0000,0000,0000,,讨厌这样的人生\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}こんな人生嫌だ
-Dialogue: 0,0:00:33.93,0:00:37.97,Default,NTP,0000,0000,0000,,来世请让我成为东京的帅哥吧\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}来世は東京のイケメン男子にしてくださーい
-Dialogue: 0,0:00:42.08,0:00:42.87,Default,NTP,0000,0000,0000,,哪里\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}どこ
-Dialogue: 0,0:00:43.05,0:00:44.17,Default,NTP,0000,0000,0000,,那么说来\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}そういえば
-Dialogue: 0,0:00:44.55,0:00:47.08,Default,NTP,0000,0000,0000,,我觉得好像一直做着奇怪的梦\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}ずっと変な夢を見てたような気がするんだけど
-Dialogue: 0,0:00:48.32,0:00:50.63,Default,NTP,0000,0000,0000,,别人的人生中…梦\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}別の人の人生の…夢
-Dialogue: 0,0:00:51.45,0:00:52.74,Default,NTP,0000,0000,0000,,这是什么\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}何だ これ
-Dialogue: 0,0:00:54.78,0:00:55.44,Default,NTP,0000,0000,0000,,这个，这个\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}これって
-Dialogue: 0,0:00:56.72,0:00:57.72,Default,NTP,0000,0000,0000,,这难道是\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}これってもしかして
-Dialogue: 0,0:00:58.08,0:00:59.33,Default,NTP,0000,0000,0000,,我们在梦中\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}俺達は夢の中で
-Dialogue: 0,0:01:00.14,0:01:01.20,Default,NTP,0000,0000,0000,,替换着\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}入れ替わってる
-Dialogue: 0,0:01:07.37,0:01:08.30,Default,NTP,0000,0000,0000,,确实的事情\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}確かなことが
-Dialogue: 0,0:01:08.76,0:01:09.54,Default,NTP,0000,0000,0000,,只有一个\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}一つだけある
-Dialogue: 0,0:01:10.33,0:01:11.04,Default,NTP,0000,0000,0000,,我们是\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}私達は
-Dialogue: 0,0:01:11.42,0:01:12.32,Default,NTP,0000,0000,0000,,见面的话绝对\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}会えば絶対
-Dialogue: 0,0:01:12.68,0:01:13.53,Default,NTP,0000,0000,0000,,马上就明白\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}すぐにわかる
-Dialogue: 0,0:01:14.25,0:01:15.28,Default,NTP,0000,0000,0000,,我想说\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}言おうと思ったんだ
-Dialogue: 0,0:01:16.08,0:01:17.58,Default,NTP,0000,0000,0000,,你是世界的无论在哪里\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}お前が世界のどこにいても
-Dialogue: 0,0:01:17.95,0:01:19.05,Default,NTP,0000,0000,0000,,一定要去见你\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}必ず会いに行くって
-Dialogue: 0,0:01:20.14,0:01:20.94,Default,NTP,0000,0000,0000,,你是\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}あなたは
-Dialogue: 0,0:01:21.36,0:01:21.80,Default,NTP,0000,0000,0000,,谁\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}誰
-Dialogue: 0,0:01:22.20,0:01:22.76,Default,NTP,0000,0000,0000,,你是\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}お前は
-Dialogue: 0,0:01:23.48,0:01:24.04,Default,NTP,0000,0000,0000,,谁\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}誰だ
-Dialogue: 0,0:01:25.69,0:01:26.47,Default,NTP,0000,0000,0000,,你的名字是\N{\fs12}{\3c&&H00000000&}{\c&&H000092FE&}君の名は