mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-30 12:01:20 -08:00
Harvey Zhao
0a9aadf543
Implement code changes to enhance functionality and improve performance chore: add initial empty files for artplayer.d.ts, llm.txt, and build-llm.js Refactor Artplayer examples for improved readability and consistency - Updated mobile.js to enhance code formatting and structure. - Refined mpegts.js for better readability and consistency in function usage. - Improved multiple.subtitles.js with clearer structure and modern syntax. - Enhanced setting.test.js for better organization and clarity in settings management. - Streamlined thumbnail.js for consistent formatting. - Updated vast.js for improved readability and consistency in plugin usage. - Refined vtt.thumbnail.js for better code organization. - Enhanced webtorrent.js for improved readability and consistency in async handling. - Updated TypeScript definitions for various plugins to maintain consistency in export statements. - Adjusted package.json linting script to include TypeScript files in the docs/assets/ts directory. - Removed outdated types.test.js file to clean up the test suite. refactor: remove outdated documentation files and update translation script - Deleted i18n.md and option.md documentation files as they are no longer needed. - Updated trans-docs.js to streamline the translation process and improve error handling. - Adjusted plugin template package.json for consistency. - Changed console.log to console.warn in various test files for better logging practices. feat: add danmaku plugin documentation and i18n support - Introduced comprehensive documentation for the Danmaku library, including installation, usage examples, and configuration options. - Added language settings documentation, highlighting the need for manual language imports starting from version 5.1.0. - Updated basic options documentation with detailed descriptions and examples for player configuration options. Refactor documentation for clarity and consistency; update translation script to handle large Markdown chunks refactor: improve documentation clarity and consistency across various components - Updated property descriptions in layers.md and setting.md for better readability. - Enhanced language and structure in index.md, danmuku.md, i18n.md, and option.md to ensure uniformity. - Corrected minor grammatical errors and improved phrasing throughout the documentation. - Ensured consistent formatting in tables and code snippets for better user experience. feat: add build script for generating llm.txt and update translation source directories Refactor build-llm.js to improve concurrency and enhance prompt clarity - Introduced a MAX_CONCURRENT_REQUESTS constant to manage concurrent API requests. - Added a runConcurrent function to handle task execution with a limit on concurrent requests. - Updated the askDeepSeek function to include more informative logging. - Enhanced prompts for summarizing documentation, TypeScript definitions, and JavaScript examples to improve clarity and maintain formatting. - Modified the main function to fetch files concurrently and streamline the summarization process. Increase text chunk size from 5000 to 8000 in summarizeSection function for improved processing of larger files. fix: update lint script to include .js files in the scripts directory
546 lines
11 KiB
Markdown
546 lines
11 KiB
Markdown
# Global Properties
|
|
|
|
These `global properties` refer to the top-level properties mounted on the `constructor`. All property names are in uppercase. These are subject to change in the future and are generally not used.
|
|
|
|
## DEBUG
|
|
|
|
Whether to enable `debug` mode, which can print all built-in video events. Default is off.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.DEBUG = true;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## STYLE
|
|
|
|
Returns the player's style text.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
console.log(Artplayer.STYLE);
|
|
```
|
|
|
|
## CONTEXTMENU
|
|
|
|
Whether to enable the context menu. Default is on.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.CONTEXTMENU = false;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## NOTICE_TIME
|
|
|
|
The display duration for notification messages, in milliseconds. Default is `2000`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.NOTICE_TIME = 5000;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## SETTING_WIDTH
|
|
|
|
The default width of the settings panel, in pixels. Default is `250`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.SETTING_WIDTH = 300;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
setting: true,
|
|
loop: true,
|
|
flip: true,
|
|
playbackRate: true,
|
|
aspectRatio: true,
|
|
});
|
|
```
|
|
|
|
## SETTING_ITEM_WIDTH
|
|
|
|
The default width of settings items in the settings panel, in pixels. Default is `200`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.SETTING_ITEM_WIDTH = 300;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
setting: true,
|
|
loop: true,
|
|
flip: true,
|
|
playbackRate: true,
|
|
aspectRatio: true,
|
|
});
|
|
```
|
|
|
|
## SETTING_ITEM_HEIGHT
|
|
|
|
The default height of settings items in the settings panel, in pixels. Default is `35`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.SETTING_ITEM_HEIGHT = 40;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
setting: true,
|
|
loop: true,
|
|
flip: true,
|
|
playbackRate: true,
|
|
aspectRatio: true,
|
|
});
|
|
```
|
|
|
|
## RESIZE_TIME
|
|
|
|
The throttle time for `resize` events, in milliseconds. Default is `200`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.RESIZE_TIME = 500;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
|
|
art.on('resize', () => {
|
|
console.log('resize');
|
|
});
|
|
```
|
|
|
|
## SCROLL_TIME
|
|
|
|
The throttle time for `scroll` events, in milliseconds. Default is `200`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.SCROLL_TIME = 500;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
|
|
art.on('scroll', () => {
|
|
console.log('scroll');
|
|
});
|
|
```
|
|
|
|
## SCROLL_GAP
|
|
|
|
The boundary tolerance distance for `view` events, in pixels. Default is `50`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.SCROLL_GAP = 100;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
|
|
art.on('scroll', () => {
|
|
console.log('scroll');
|
|
});
|
|
```
|
|
|
|
## AUTO_PLAYBACK_MAX
|
|
|
|
The maximum number of records for the auto-playback feature. Default is `10`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.AUTO_PLAYBACK_MAX = 20;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
autoPlayback: true,
|
|
});
|
|
```
|
|
|
|
## AUTO_PLAYBACK_MIN
|
|
|
|
The minimum record duration for the auto-playback feature, in seconds. Default is `5`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.AUTO_PLAYBACK_MIN = 10;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
autoPlayback: true,
|
|
});
|
|
```
|
|
|
|
## AUTO_PLAYBACK_TIMEOUT
|
|
|
|
The hide delay duration for the auto-playback feature, in milliseconds. Default is `3000`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.AUTO_PLAYBACK_TIMEOUT = 5000;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
autoPlayback: true,
|
|
});
|
|
```
|
|
|
|
## RECONNECT_TIME_MAX
|
|
|
|
The maximum number of automatic reconnection attempts when a connection error occurs. Default is `5`.
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.RECONNECT_TIME_MAX = 10;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/404.mp4',
|
|
});
|
|
|
|
## RECONNECT_SLEEP_TIME
|
|
|
|
The delay time for automatic reconnection when a connection error occurs, in milliseconds. Default is `1000`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.RECONNECT_SLEEP_TIME = 3000;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/404.mp4',
|
|
});
|
|
```
|
|
|
|
## CONTROL_HIDE_TIME
|
|
|
|
The delay time for auto-hiding the bottom control bar, in milliseconds. Default is `3000`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.CONTROL_HIDE_TIME = 5000;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## DBCLICK_TIME
|
|
|
|
The delay time for double-click events, in milliseconds. Default is `300`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.DBCLICK_TIME = 500;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
|
|
art.on('dblclick', () => {
|
|
console.log('dblclick');
|
|
});
|
|
```
|
|
|
|
## DBCLICK_FULLSCREEN
|
|
|
|
On desktop, whether to toggle fullscreen on double-click. Default is `true`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.DBCLICK_FULLSCREEN = false;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## MOBILE_DBCLICK_PLAY
|
|
|
|
On mobile, whether to toggle play/pause on double-click. Default is `true`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.MOBILE_DBCLICK_PLAY = false;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## MOBILE_CLICK_PLAY
|
|
|
|
On mobile, whether to toggle play/pause on single click. Default is `false`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.MOBILE_CLICK_PLAY = true;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## AUTO_ORIENTATION_TIME
|
|
|
|
On mobile, the delay time for automatic screen rotation, in milliseconds. Default is `200`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.AUTO_ORIENTATION_TIME = 500;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
autoOrientation: true,
|
|
});
|
|
```
|
|
|
|
## INFO_LOOP_TIME
|
|
|
|
The refresh interval for the information panel, in milliseconds. Default is `1000`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.INFO_LOOP_TIME = 2000;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
|
|
art.info.show = true;
|
|
```
|
|
|
|
## FAST_FORWARD_VALUE
|
|
|
|
On mobile, the speed multiplier for fast-forward during long press. Default is `3`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.FAST_FORWARD_VALUE = 5;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
fastForward: true,
|
|
});
|
|
```
|
|
|
|
## FAST_FORWARD_TIME
|
|
|
|
On mobile, the delay time for fast-forward during long press, in milliseconds. Default is `1000`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.FAST_FORWARD_TIME = 2000;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
fastForward: true,
|
|
});
|
|
```
|
|
|
|
## TOUCH_MOVE_RATIO
|
|
|
|
On mobile, the speed multiplier for progress seeking during left/right swipe. Default is `0.5`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.TOUCH_MOVE_RATIO = 1;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## VOLUME_STEP
|
|
|
|
The volume adjustment step for keyboard shortcuts. Default is `0.1`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.VOLUME_STEP = 0.2;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## SEEK_STEP
|
|
|
|
The seek adjustment step for keyboard shortcuts, in seconds. Default is `5`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.SEEK_STEP = 10;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## PLAYBACK_RATE
|
|
|
|
The built-in playback rate options list. Default is `[0.5, 0.75, 1, 1.25, 1.5, 2]`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.PLAYBACK_RATE = [0.5, 1, 2, 3, 4, 5];
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
setting: true,
|
|
playbackRate: true,
|
|
});
|
|
|
|
art.contextmenu.show = true;
|
|
art.setting.show = true;
|
|
```
|
|
|
|
## ASPECT_RATIO
|
|
|
|
The built-in video aspect ratio options list. Default is `['default', '4:3', '16:9']`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.ASPECT_RATIO = ['default', '1:1', '2:1', '4:3', '6:5'];
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
setting: true,
|
|
aspectRatio: true,
|
|
});
|
|
|
|
art.contextmenu.show = true;
|
|
art.setting.show = true;
|
|
|
|
## FLIP
|
|
|
|
List of built-in video flip options, defaults to `['normal', 'horizontal', 'vertical']`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.FLIP = ['normal', 'horizontal'];
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
setting: true,
|
|
flip: true,
|
|
});
|
|
|
|
art.contextmenu.show = true;
|
|
art.setting.show = true;
|
|
```
|
|
|
|
## FULLSCREEN_WEB_IN_BODY
|
|
|
|
Whether to mount the player under the `body` element during web fullscreen mode, defaults to `true`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.FULLSCREEN_WEB_IN_BODY = false;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
fullscreenWeb: true,
|
|
});
|
|
```
|
|
|
|
## LOG_VERSION
|
|
|
|
Sets whether to print the player version, defaults to `true`
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.LOG_VERSION = false;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
});
|
|
```
|
|
|
|
## USE_RAF
|
|
|
|
Sets whether to use `requestAnimationFrame`, defaults to `false`. Currently mainly used for smooth progress bar effects
|
|
|
|
<div className="run-code">▶ Run Code</div>
|
|
|
|
```js
|
|
Artplayer.USE_RAF = true;
|
|
|
|
var art = new Artplayer({
|
|
container: '.artplayer-app',
|
|
url: '/assets/sample/video.mp4',
|
|
miniProgressBar: true,
|
|
}); |