### Artplayer Quick Start Examples (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/start/i18n.html
Provides links to essential Artplayer documentation for getting started, including installation, options, and language settings.
```html
Install
Option
Language
```
--------------------------------
### ArtPlayer Quick Start (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/start/option.html
English documentation for getting started with ArtPlayer, covering installation, basic options, and internationalization (i18n).
```APIDOC
Quick Start (English):
Installation:
Link: /en/
Options:
Description: Configuration options for ArtPlayer.
Link: /en/start/option
Language (i18n):
Description: How to set up different languages for the player.
Link: /en/start/i18n
```
--------------------------------
### Artplayer Documentation - Quick Start
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/advanced/built-in.html
Guides for getting started with Artplayer, including installation, options, and language settings.
```APIDOC
Install:
Link to installation guide.
Option:
Link to Artplayer options documentation.
Language:
Link to Artplayer internationalization (i18n) settings.
```
--------------------------------
### Artplayer Quick Start (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/advanced/event.html
Provides essential information for getting started with Artplayer, including installation and basic configuration.
```APIDOC
Quick Start:
Install:
Link: /en/
Option:
Description: Configuration options for Artplayer.
Link: /en/start/option
Language:
Description: Internationalization settings for Artplayer.
Link: /en/start/i18n
```
--------------------------------
### Artplayer Quick Start (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/component/contextmenu.html
Provides guidance for getting started with Artplayer in English, covering installation, basic options, and language settings.
```APIDOC
Quick Start (en):
Install: /en/
Option: /en/start/option
Language: /en/start/i18n
```
--------------------------------
### Artplayer Quick Start (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/advanced/plugin.html
This section provides a quick start guide for Artplayer in English, covering installation, options, and language settings.
```APIDOC
Quick Start (en):
Install: /en/
Option: /en/start/option
Language: /en/start/i18n
```
--------------------------------
### Artplayer Quick Start and Configuration
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/advanced/plugin.html
Provides guidance on getting started with Artplayer, including installation, option configuration, and language settings (i18n). This section is crucial for new users to set up and customize the player.
```APIDOC
Install:
Link to installation guide or package manager commands.
Option:
/en/start/option - Details on player configuration options.
Language:
/en/start/i18n - Information on setting up language and internationalization.
```
--------------------------------
### Artplayer English Documentation - Quick Start
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/advanced/class.html
This section provides quick start information for Artplayer in English, covering installation, options, and language settings.
```APIDOC
Install:
Link: /en/
Option:
Link: /en/start/option
Language:
Link: /en/start/i18n
```
--------------------------------
### Basic HTML Usage
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/index.md
Example of integrating Artplayer into an HTML page, including basic styling and video playback setup.
```html
ArtPlayer Demo
```
--------------------------------
### Artplayer Options and Initialization
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/en/index.md
Provides an example of defining Artplayer options, including the container and video URL, and then initializing a new Artplayer instance with these options.
```javascript
/**
* @type {import("artplayer/types/option").Option}
*/
const option = {
container: '.artplayer-app',
url: './assets/sample/video.mp4',
};
option.volume = 0.5;
const art8 = new Artplayer(option);
```
--------------------------------
### Building for Production with npm
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/react.js/README.md
Compiles the application for production deployment. It bundles, minifies, and optimizes all necessary files into the 'build' directory, preparing the app for static hosting. Requires Node.js, npm, and the build toolchain provided by Create React App.
```Shell
npm run build
```
--------------------------------
### Artplayer Quick Start (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/advanced/class.html
This section provides quick start information for Artplayer in English, covering installation, options, and language settings.
```APIDOC
Quick start (English):
Install:
link: /en/
Option:
link: /en/start/option
Language:
link: /en/start/i18n
```
--------------------------------
### Create React App Scripts
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/react.js/README.md
Provides an overview of the essential npm scripts for managing a Create React App project. These scripts cover development, testing, building, and configuration customization.
```bash
npm start
# Runs the app in the development mode.
# Open http://localhost:3000 to view it in your browser.
npm test
# Launches the test runner in the interactive watch mode.
npm run build
# Builds the app for production to the `build` folder.
# Optimizes the build for the best performance.
npm run eject
# Note: this is a one-way operation. Once `eject`, you can't go back!
# Removes the single build dependency from your project and copies all configuration files.
```
--------------------------------
### Artplayer Initialization with Options (JavaScript)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
Provides an example of initializing Artplayer using a configuration object in JavaScript, including type hinting for the options object.
```js
/**
* @type {import("artplayer/types/option").Option}
*/
const option = {
container: '.artplayer-app',
url: './assets/sample/video.mp4',
};
option.volume = 0.5;
const art8 = new Artplayer(option);
```
--------------------------------
### Running Tests with npm
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/react.js/README.md
Launches the interactive test runner included with Create React App. This command allows you to run project tests in a watch mode, automatically rerunning tests affected by file changes. Requires Node.js, npm, and the project's testing setup (like Jest).
```Shell
npm test
```
--------------------------------
### Artplayer Option Configuration and Initialization
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/index.md
Provides an example of configuring Artplayer with an options object, including the container and video URL, and then initializing a new Artplayer instance. It also shows setting a volume property.
```javascript
/**
* @type {import("artplayer/types/option").Option}
*/
const option = {
container: '.artplayer-app',
url: './assets/sample/video.mp4',
};
option.volume = 0.5;
const art8 = new Artplayer(option);
```
--------------------------------
### Basic Artplayer.js Usage Example
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
Demonstrates a basic implementation of Artplayer.js within an HTML file, including player container styling and initialization with a video URL.
```html
ArtPlayer Demo
```
--------------------------------
### Start Development Server
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/nuxt.js/README.md
Starts the Nuxt 3 development server on http://localhost:3000.
```bash
npm run dev
```
--------------------------------
### Install Artplayer
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/index.md
Instructions for installing Artplayer using different package managers.
```bash
npm install artplayer
```
```bash
yarn add artplayer
```
```bash
pnpm add artplayer
```
--------------------------------
### Artplayer Canvas Example Configuration
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
This configuration snippet shows how to set up an Artplayer instance to use the Canvas renderer. It specifies the path to the Canvas renderer JavaScript file and provides a link to a live example.
```javascript
{
"items": [
{
"text": "Canvas",
"link": "https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas"
}
]
}
```
--------------------------------
### Install Dependencies
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/nuxt.js/README.md
Installs project dependencies using yarn, npm, or pnpm.
```bash
# yarn
yarn install
# npm
npm install
# pnpm
pnpm install --shamefully-hoist
```
--------------------------------
### Basic Artplayer HTML Usage
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/en/index.md
A fundamental example of how to embed and initialize Artplayer in an HTML file. It includes setting up the player container, specifying the video URL, and basic styling.
```html
ArtPlayer Demo
```
--------------------------------
### Install Artplayer
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/vue3.js/index.html
Instructions for installing Artplayer using npm or yarn.
```bash
npm install artplayer
# or
yarn add artplayer
```
--------------------------------
### Install Project Dependencies
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/vue3.js/README.md
Installs all the necessary packages for the Vue.js project using npm.
```sh
npm install
```
--------------------------------
### Install ArtPlayer.js
Source: https://github.com/zhw2590582/artplayer/blob/master/README.md
Instructions for installing ArtPlayer.js using npm or yarn package managers.
```bash
npm install artplayer
```
```bash
yarn add artplayer
```
--------------------------------
### Install Project Dependencies
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/vue2.js/README.md
Installs all necessary dependencies for the Artplayer project using npm.
```bash
npm install
```
--------------------------------
### Install Dependencies
Source: https://github.com/zhw2590582/artplayer/blob/master/CONTRIBUTING.md
Installs project dependencies using either npm or yarn.
```bash
npm install
```
```bash
yarn
```
--------------------------------
### Install Artplayer with npm, yarn, or pnpm
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/en/index.md
Instructions for installing the Artplayer library using different package managers. This is the first step to using Artplayer in your project.
```bash
npm install artplayer
```
```bash
yarn add artplayer
```
```bash
pnpm add artplayer
```
--------------------------------
### Run Development Server
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/vue3.js/README.md
Starts the Vite development server, enabling hot-reloading for rapid development of Vue.js applications.
```sh
npm run dev
```
--------------------------------
### Artplayer Plugins Examples
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/start/i18n.html
Demonstrates the usage of various Artplayer plugins by loading them with specific examples. Each link points to a page where the plugin can be tested.
```html
Danmuku Mask
Video Ads
Iframe Control
Hls Control
Dash Control
Vtt Thumbnail
Multiple Subtitles
Ass Subtitle
Chromecast
Vast Ads
Video Chapters
Video Backlight
```
--------------------------------
### Install Artplayer with pnpm
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/index.html
Instructions for installing the Artplayer.js library using the pnpm package manager.
```bash
pnpm add artplayer
```
--------------------------------
### Install Artplayer with npm
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/index.html
Instructions for installing the Artplayer.js library using the npm package manager.
```bash
npm install artplayer
```
--------------------------------
### Installation
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/plugin/danmuku.md
Install the artplayer-plugin-danmuku package using npm, yarn, or pnpm.
```bash
npm install artplayer-plugin-danmuku
```
```bash
yarn add artplayer-plugin-danmuku
```
```bash
pnpm add artplayer-plugin-danmuku
```
--------------------------------
### Artplayer.js Configuration and Initialization
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
This snippet demonstrates how to initialize Artplayer.js with various configuration options, including setting the video source, enabling controls, and customizing the UI. It covers basic setup and common customization parameters.
```javascript
const art = new Artplayer({
container: '.artplayer-app',
url: '/path/to/your/video.mp4',
poster: '/path/to/your/poster.jpg',
volume: 0.5,
isLive: false,
autoplay: false,
muted: false,
loop: false,
flip: true,
playsInline: true,
controls: [
{ position: 'right', html: 'Custom Button', click: () => console.log('Clicked!') },
],
settings: true,
contextmenu: [
{ html: 'Artplayer.org', url: 'https://artplayer.org' },
],
subtitle: {
url: '/path/to/your/subtitle.srt',
type: 'srt',
style: {
color: '#fff',
fontSize: '20px',
},
},
moreVideoAttr: {
crossOrigin: 'anonymous',
},
});
```
--------------------------------
### Canvas Example Link
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/component/setting.html
Provides a link to an example demonstrating the Canvas functionality of Artplayer. This link includes parameters for specifying the JavaScript library and the example to load.
```javascript
{
"items": [
{
"text": "Canvas",
"link": "https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas"
}
]
}
```
--------------------------------
### Artplayer Plugins Examples (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/start/i18n.html
Lists Artplayer plugins with links to their respective examples, covering advertising, iframe control, HLS, DASH, subtitles, and more.
```html
Advertise
Iframe Control
Hls Control
Dash Control
Vtt Thumbnail
Multiple Subtitles
Ass Subtitle
```
--------------------------------
### Install Artplayer with yarn
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/index.html
Instructions for installing the Artplayer.js library using the yarn package manager.
```bash
yarn add artplayer
```
--------------------------------
### Canvas Example Link
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/component/layers.html
Provides a link to an example demonstrating the Canvas functionality of Artplayer. This link includes parameters for specifying the JavaScript library and the example to load.
```javascript
{
"items": [
{
"text": "Canvas",
"link": "https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas"
}
]
}
```
--------------------------------
### Canvas Example Link
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/component/layers.html
Provides a link to an example demonstrating the Canvas functionality of Artplayer. This link includes parameters for specifying the JavaScript library and the example to load.
```javascript
{
"items": [
{
"text": "Canvas",
"link": "https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas"
}
]
}
```
--------------------------------
### Artplayer Plugins Examples
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/en/index.html
Demonstrates the usage of various Artplayer plugins for enhanced media playback. Each example links to a specific plugin's integration with Artplayer.
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe
```
```javascript
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
```
```javascript
https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-libass/index.js&example=libass
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas
```
--------------------------------
### Artplayer Plugins Examples
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/advanced/global.html
Demonstrates how to integrate various Artplayer plugins for enhanced video playback features. Each link points to an example showcasing a specific plugin's functionality.
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe
https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js
./uncompiled/artplayer-plugin-hls-control/index.js&example=hls.control
https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js
./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-libass/index.js&example=libass
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight
```
--------------------------------
### Build for Production
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/nuxt.js/README.md
Builds the Nuxt 3 application for production deployment.
```bash
npm run build
```
--------------------------------
### Set and Get Video Poster
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/en/advanced/property.md
Set and get the video poster image. The poster is displayed before the video starts playing.
```js
var art = new Artplayer({
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
poster: '/assets/sample/poster.jpg',
});
art.on('ready', () => {
console.info(art.poster);
art.poster = '/assets/sample/poster.jpg?t=0';
console.info(art.poster);
});
```
--------------------------------
### Mocha Test Setup
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/test/index.html
Initializes the Mocha testing framework and sets up the expect assertion library from Chai. This is a standard setup for running BDD-style tests.
```javascript
window.mocha.setup('bdd');
window.expect = window.chai.expect;
mocha.run();
```
--------------------------------
### Preview Production Build
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/nuxt.js/README.md
Locally previews the production build of the Nuxt 3 application.
```bash
npm run preview
```
--------------------------------
### Ejecting Create React App Configuration with npm
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-template/react.js/README.md
A one-way operation to remove the Create React App build dependency and expose the underlying configuration files (like Webpack and Babel). This gives developers full control over the build setup but makes future updates from CRA more difficult. Requires Node.js and npm.
```Shell
npm run eject
```
--------------------------------
### React.js Usage Example with Artplayer Component
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
This example shows how to use the custom Artplayer React component. It defines the player options and styles, passes them to the component, and logs the Artplayer instance when it's initialized.
```jsx
import React from 'react';
import Artplayer from './ArtPlayer.jsx';
function App() {
return (
);
}
export default App;
```
--------------------------------
### Vue.js Usage Example with Artplayer Component
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
This example demonstrates how to use the custom Artplayer Vue component. It defines player options and styles, passes them to the component, and logs the Artplayer instance when it's ready.
```vue
```
--------------------------------
### Set and Get Poster
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/advanced/property.md
Sets and retrieves the video's poster image. The poster is visible only before the video starts playing.
```js
var art = new Artplayer({
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
poster: '/assets/sample/poster.jpg',
});
art.on('ready', () => {
console.info(art.poster);
art.poster = '/assets/sample/poster.jpg?t=0';
console.info(art.poster);
});
```
--------------------------------
### Develop Project and Open Demo
Source: https://github.com/zhw2590582/artplayer/blob/master/CONTRIBUTING.md
Starts the development server and opens the demo page. This command is typically used during development to preview changes.
```base
npm run dev
```
```bash
yarn dev
```
--------------------------------
### Artplayer Poster Setter/Getter
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/advanced/property.html
Allows setting and getting the video poster image. The poster is visible before the video starts playing.
```js
var art = new Artplayer({
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
poster: '/assets/sample/poster.jpg'
});
art.on('ready', () => {
console.info(art.poster);
art.poster = '/assets/sample/poster.jpg?t=0';
console.info(art.poster);
});
```
--------------------------------
### Initialize Artplayer with onReady Callback
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/en/start/option.md
Demonstrates using the `onReady` option to execute a function once the player is initialized and ready to play. The callback receives the player instance.
```js
var art = new Artplayer(
{
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
muted: true,
},
function onReady(art) {
this.play()
},
);
```
--------------------------------
### TypeScript Integration with Artplayer
Source: https://github.com/zhw2590582/artplayer/blob/master/packages/artplayer-vitepress/docs/index.md
Examples of using Artplayer with TypeScript in Vue.js and React.js projects, including type definitions for the player and options.
```vue
```
```jsx
import Artplayer from 'artplayer';
const art = useRef(null);
art.current = new Artplayer();
```
```ts
import Artplayer from 'artplayer';
const option: Artplayer['Option'] = {
container: '.artplayer-app',
url: './assets/sample/video.mp4',
};
option.volume = 0.5;
const art = new Artplayer(option);
```
--------------------------------
### Package Project
Source: https://github.com/zhw2590582/artplayer/blob/master/CONTRIBUTING.md
Builds the project for production deployment. This command bundles and optimizes the project's assets.
```bash
npm run build
```
```bash
yarn build
```
--------------------------------
### TypeScript Integration with Artplayer in Vue.js
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/index.html
This snippet demonstrates how to use Artplayer with TypeScript in a Vue.js setup. It shows the declaration of an Artplayer instance using `ref` and its initialization.
```typescript
```
--------------------------------
### Artplayer Documentation Navigation (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/plugin/danmuku.html
Provides an overview of the Artplayer documentation structure in English, covering quick start guides, component details, advanced features, and plugin development.
```APIDOC
Quick start:
Install: /en/
Option: /en/start/option
Language: /en/start/i18n
Component:
Layers: /en/component/layers
Controls: /en/component/controls
Contextmenu: /en/component/contextmenu
Setting: /en/component/setting
Advanced:
Instance Property: /en/advanced/property
Advanced Property: /en/advanced/built-in
Static Property: /en/advanced/class
Global Property: /en/advanced/global
Instance Event: /en/advanced/event
Writing Plugin: /en/advanced/plugin
Plugins:
Advertise: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads
Iframe Control: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe
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
Dash Control: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control
Vtt Thumbnail: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail
Multiple Subtitles: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles
Ass Subtitle: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-libass/index.js&example=libass
Chromecast: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast
Vast: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast
Video Chapters: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter
Video Ambilight: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight
Libraries:
hls.js: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls
flv.js: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv
dash.js: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash
mpegts.js: https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts
webtorrent.js: https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent
Proxys:
Canvas: https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas
```
--------------------------------
### Artplayer Plugins Examples
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/404.html
Demonstrates how to use various Artplayer plugins, including Ads, Iframe Control, HLS Control, Dash Control, VTT Thumbnail, Multiple Subtitles, Ass Subtitle, Chromecast, Vast Ads, Video Chapters, and Video Ambilight. Each example links to a specific plugin's usage page.
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe
```
```javascript
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
```
```javascript
https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-libass/index.js&example=libass
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter
```
```javascript
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight
```
--------------------------------
### Artplayer Documentation Navigation (English)
Source: https://github.com/zhw2590582/artplayer/blob/master/docs/document/advanced/property.html
Provides an overview of the Artplayer documentation structure in English, covering quick start guides, component details, advanced features, and plugin development.
```APIDOC
Quick start:
Install: /en/
Option: /en/start/option
Language: /en/start/i18n
Component:
Layers: /en/component/layers
Controls: /en/component/controls
Contextmenu: /en/component/contextmenu
Setting: /en/component/setting
Advanced:
Instance Property: /en/advanced/property
Advanced Property: /en/advanced/built-in
Static Property: /en/advanced/class
Global Property: /en/advanced/global
Instance Event: /en/advanced/event
Writing Plugin: /en/advanced/plugin
Plugins:
Advertise: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=ads
Iframe Control: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-iframe/index.js&example=iframe
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
Dash Control: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js%0A./uncompiled/artplayer-plugin-dash-control/index.js&example=dash.control
Vtt Thumbnail: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnail
Multiple Subtitles: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-multiple-subtitles/index.js&example=multiple.subtitles
Ass Subtitle: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-libass/index.js&example=libass
Chromecast: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chromecast/index.js&example=chromecast
Vast: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vast/index.js&example=vast
Video Chapters: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapter
Video Ambilight: https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ambilight/index.js&example=ambilight
Libraries:
hls.js: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.17/hls.min.js&example=hls
flv.js: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.6.2/flv.min.js&example=flv
dash.js: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash
mpegts.js: https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/mpegts.js@1.7.3/dist/mpegts.min.js&example=mpegts
webtorrent.js: https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent
Proxys:
Canvas: https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas
```