- Overview
- Name meaning
- Features
- download and install
- User Guide
- Basic Usage
- Vue framework usage
- Parameter Configuration
- method
- event
- Detailed explanation of source address URL parameters
- Logo settings
- Chapter annotation settings
- Progress bar preview image settings
- Subtitle Settings
- Bullet Chat Settings
- Description of Barrage Server
- Play RTSP stream
- autoplay
- shortcut key
- demo
- Basic Usage
- logoSettings
- Chapter annotation settings
- Progress bar preview image settings
- Subtitle Settings
- bullet chat
- Support protocol format
- comprehensive
method
1. Playback Control
1.1 play
play(url, isLive, useOldFlv);
Description: Start playback. Calling this method will begin a new playback session.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| url | string/object | Optional | Media stream URL address/local file object, see url parameter description |
| isLive | boolean | Optional | Specify whether the media stream is a live stream |
| useOldFlv | boolean | Optional | Whether to use the legacy Flv playback interface |
Return Value: None
Detailed Description:
If the player is currently in playing state, calling this method will reopen the media and start playback from the beginning
If the player is currently playing a live stream, calling this method will close the current playback and establish a new connection
All parameters can be omitted. If called without any parameters,
zwplayerwill start playback using the existing original parameters internallyIf the url parameter was not passed when calling the constructor and a play method with url parameter has never been called, the play call will fail
1.2 pause
pause();
Description: Pause the current playback.
Parameters: None
Return Value: None
Detailed Description: The pause operation will not clear any internal data in the player.
1.3 stop
stop();
Description: Stop the ongoing playback.
Parameters: None
Return Value: None
Detailed Description:
Stopping playback is different from pausing playback. Stopping playback will clear all internal data in the player and reset the player to its initial state
This player object can still call play subsequently to start a new playback session
1.4 resume
resume();
Description: Resume playback.
Parameters: None
Return Value: None
Detailed Description:
If the player is in pause state, continue playback from the current position
If the player is in stop state, start a new playback session
1.5 setplaystate
setplaystate(bPlaying);
Description: Set the playback state.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| bPlaying | boolean | Required | true: Set to playing, false: Set to paused |
Return Value: None
Playback Progress
2.1 getDuration
getDuration();
Description: Get the duration of the current media in the player.
Parameters: None
Return Value:
Type: number (float)
Description: Duration in seconds
Special cases:
If the player currently has no media open, returns undefined
If the duration of the playing media cannot be obtained, returns Infinity
2.2 getCurrentTime
getCurrentTime();
Description: Get the current playback position of the media in the player.
Parameters: None
Return Value:
Type: number (float)
Description: Playback position in seconds
2.3 seekTime
seekTime(time);
Description: Seek to a specific time.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| time | number | Required | The time to seek to, in seconds (float) |
Return Value: None
Limitation: Only valid for on-demand programs
3. Danmaku Function
3.1 setEnableDanmu
setEnableDanmu(bEnable);
Description: Turn danmaku (bullet comments) function on or off.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| bEnable | boolean | Required | true: Enable danmaku, false: Disable danmaku |
Return Value: None
3.2 appendDanmu
appendDanmu(danmuObj, setting);
Description: Add danmaku.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| danmuObj | object | Required | Danmaku data object, containing danmaku content and display attributes |
| setting | object | Optional | Danmaku settings |
Return Value: None
Detailed Description:
zwplayerhas an internal danmaku renderer. After obtaining a danmaku, call this method to display the danmaku on the video screen.Danmaku is usually forwarded by a network danmaku server.
zwplayeris not bound to any danmaku forwarding server, nor does it specify which danmaku transmission protocol to use. Users obtain danmaku through their own methods and then call this function to display it on the player.For the format of the danmaku object
danmuObj, see Danmaku Object Format
3.3 buildDanmuControlbar
buildDanmuControlbar(parentId, className);
Description: Create a danmaku input control bar.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| parentId | string | Optional | Parent element ID that contains the control bar, DIV element |
| className | string | Optional | CSS class added to the top-level DIV element of the danmaku control bar |
Return Value: NoneFeature Highlights:
Provides a complete danmaku interaction interface, including input danmaku, emoticons, danmaku settings and on/off switches. Reusing this UI can save time from "reinventing the wheel", highly recommended.
Adopts independent UI component design, can be flexibly deployed at any position on the page
Avoids display issues caused by insufficient player container space
Supports style customization, convenient for integration with different page styles
Detailed Description:
If parentId is omitted or does not exist, the danmaku control bar will be created inside the player main control toolbar. If the player main control bar space is too small, the danmaku input control bar will not be displayed.
The danmaku control bar already has the
zwp_danmu-controlbarclass, and styles can be further controlled through the className parameterThis function must be called for
zwplayerto be able to input danmaku in fullscreen modeFor detailed information about danmaku, please see Danmaku Settings.
4. Subtitles
4.1 addSubtitle
addSubtitle(subtitleUrl, pos, title);
Description: Add subtitles.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| subtitleUrl | string/object | Required | Subtitle file URL/local file object |
| pos | string | Required | Subtitle position ('1' or '2') |
| title | string | Optional | Readable name of the subtitle, convenient for user selection |
Return Value: None
Detailed Description:
Supported subtitle formats: srt, vtt, json, bcc
Subtitle positions only support '1' (primary subtitle) and '2' (secondary subtitle). Other values cannot be loaded
zwplayersupports displaying two subtitles simultaneously (dual subtitles)For detailed subtitle settings, please see Subtitle Settings.
4.2 removeSubtitle
removeSubtitle();
Description: Remove all subtitles.
Parameters: None
Return Value: None
Detailed Description: Calling this function removes all loaded subtitles from the player.
5. Chapters
5.1 setChapters
setChapters(chapters);
Description: Set chapter information.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| chapters | string/array/object/null | Required | Chapter file url, chapter content text string, or chapter list object, or chapter local file object |
Return Value: None
Detailed Description:
If the
chaptersparameter is null, the current chapter information will be removedSupports multiple formats: chapter file url, chapter content text string (js string), or already parsed chapter list object (js array)
For detailed chapter information loading, please see Chapter Markers Settings
6. State Management
6.1 notifyResize
notifyResize(width, height);
Description: Notify the player when player dimensions change.
| Parameter Name | Type | Optional | Description |
|---|---|---|---|
| width | string | Required | New width (pixels or percentage) |
| height | string | Required | New height (pixels or percentage) |
Return Value: None
Recommended Practice: Set the style of the DIV element associated with the player's playerElm parameter to "width:100%;height:100%", so the player can automatically change with the parent element dimensions without calling this method.
6.2 destroy
destroy();
Description: Destroy the player.
Parameters: None
Return Value: None
Detailed Description:
After calling, the player will stop playing the current stream and completely clear all content from memory
The player object cannot be used to call any methods subsequently