From d26826401af7c366303b8f05fdef6fe1aee12169 Mon Sep 17 00:00:00 2001 From: Harvey Zack Date: Wed, 14 Nov 2018 16:51:40 +0800 Subject: [PATCH] docs update --- README.html | 863 ---------------------------------------------------- README.md | 23 ++ 2 files changed, 23 insertions(+), 863 deletions(-) delete mode 100644 README.html diff --git a/README.html b/README.html deleted file mode 100644 index d67322a7b..000000000 --- a/README.html +++ /dev/null @@ -1,863 +0,0 @@ - - README - - - - - - - - - - - - - - - - - -
-

ArtPlayer

- -

version
-license
-size

-
-

ArtPlayer is a modern HTML5 video player

-
-

Status

- -

⚠️ This project is WIP and not ready for production use yet!

-

Demo

- -

Checkout the demo

-

Introduction

- -

Install

- -
$ npm install --save artplayer
-
import Artplayer from 'artplayer';
-import 'artplayer/dist/artplayer.css';
-

OR umd builds are also available

-
<link rel="stylesheet" href="path/to/artplayer.css" />
-<script src="path/to/artplayer.js"></script>
-

Will expose the global variable to window.Artplayer.

-

Usage

- -
<div class="artplayer-app"></div>
-
var art = new Artplayer({
-  container: '.artplayer-app',
-  url: 'path/to/video.mp4'
-});
-

Configuration

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
parameterdescriptionExample
container - Type: string, element
- Default: .artplayer
- Required: true

- DOM container of the player, you need to initialize a size for the container element - 		- Demo -
url - Type: string
- Default: ''
- Required: true

- Video source url, Three video file formats are supported: mp4, ogg, webm - 		- Demo -
poster - Type: string
- Default: ''

- Video poster image url - 		- Demo -
title - Type: string
- Default: ''

- Video title, will be shown in screenshot file name and pip mode - 		- Demo -
volume - Type: number
- Default: 0.7

- Default volume, player will cache the last volume, which may be overwritten - 		- Demo -
autoplay - Type: boolean
- Default: false

- Whether to play automatically, sometimes it doesn't necessarily succeed
- More info: autoplay-policy-changes - 		- Demo -
autoSize - Type: boolean
- Default: false

- Keep the original video aspect ratio and automatically zoom - 		- Demo -
loop - Type: boolean
- Default: false

- Automatic loop playback - 		- Demo -
playbackRate - Type: boolean
- Default: false

- Whether to show playback rate controller in the contextmenu - 		- Demo -
aspectRatio - Type: boolean
- Default: false

- Whether to show aspect ratio controller in the contextmenu - 		- Demo -
screenshot - Type: boolean
- Default: false

- Whether to show screenshot controller in the bottom - 		- Demo -
setting - Type: boolean
- Default: false

- Whether to show setting controller in the bottom - 		- Demo -
pip - Type: boolean
- Default: false

- Whether to show pip controller in the bottom - 		- Demo -
fullscreen - Type: boolean
- Default: false

- Whether to show window fullscreen controller in the bottom - 		- Demo -
fullscreenWeb - Type: boolean
- Default: false

- Whether to show web page fullscreen controller in the bottom - 		- Demo -
hotkey - Type: boolean
- Default: true

- Whether to use hotkey
- - - - - - - - - - - - - - - - - - - - - -
↑Increase volume
↓Decrease volume
←Seek backward
→Seek forward
spaceToggle playback
- 		- Demo -
mutex - Type: boolean
- Default: true

- Player mutually exclusive, only one player can play at a time - 		- Demo -
lang - Type: string
- Default: navigator.language.toLowerCase()

- Default display language: en, zh-cn, zh-tw - 		- Demo -
theme - Type: string
- Default: #f00

- Default theme color - 		- Demo -
subtitle - Type: object
- Default: {}

- Custom subtitle
- - - - - - - - - -
url - Type: string
- Default: ''

- Subtitle url, support vtt and srt format -
style - Type: object
- Default: {}

- Subtitle style -
- 		- Demo -
thumbnails - Type: object
- Default: {}

- Custom thumbnails in the progress bar with lazy load
- - - - - - - - - - - - - - - - - - - - - -
url - Type: string
- Default: ''

- Thumbnails image url -
number - Type: number
- Default: 60

- Thumbnails number -
width - Type: number
- Default: 160

- Thumbnails width -
height - Type: number
- Default: 90

- Thumbnails height -
column - Type: number
- Default: 10

- Thumbnails column -
- 		- Demo -
moreVideoAttr - Type: object
- Default: {'controls': false,'preload': 'auto'}

- More video Attributes, these properties will be written directly to the video element
- 		- Demo -
quality - Type: array
- Default: []

- Custom quality, The type of quality is an object
- - - - - - - - - - - - - -
default - Type: boolean
- Default: false

- Whether the default quality, if not specified, the first quality will be taken -
name - Type: string
- Default: ''

- Quality name -
url - Type: string
- Default: ''

- Quality url -
- 		- Demo -
highlight - Type: array
- Default: []

- Custom highlight, The type of highlight is an object
- - - - - - - - - -
time - Type: number
- Default: 0

- highlight seconds -
text - Type: string
- Default: ''

- highlight text -
- 		- Demo -
layers - Type: array
- Default: []

- Custom layer, The type of layer is an object or function
- - - - - - - - - - - - - - - - - - - - - - - - - -
disable - Type: boolean
- Default: undefined

- Whether to disable the layer -
name - Type: string
- Default: layer${id}

- The unique name of the layer, used for the class name -
index - Type: number
- Default: ${id}

- The unique index of the layer, used for the priority level -
html - Type: string, element
- Default: ''

- The dom element of the layer -
style - Type: object
- Default: {}

- The style object of the layer -
click - Type: function
- Default: undefined

- Click event of the layer -
- 		- Demo -
contextmenu - Type: array
- Default: []

- Custom contextmenu, The type of layer is an object or function
- - - - - - - - - - - - - - - - - - - - - - - - - -
disable - Type: boolean
- Default: undefined

- Whether to disable the contextmenu -
name - Type: string
- Default: contextmenu${id}

- The unique name of the contextmenu, used for the class name -
index - Type: number
- Default: ${id}

- The unique index of the contextmenu, used for the priority level -
html - Type: string, element
- Default: ''

- The dom element of the contextmenu -
style - Type: object
- Default: {}

- The style object of the contextmenu -
click - Type: function
- Default: undefined

- Click event of the contextmenu -
- 		- Demo -
controls - Type: array
- Default: []

- Custom controls, The type of controls is an object
- - - - - -
option - Type: object
- Default: undefined

- Instantiated an object property
- - - - - - - - - - - - - - - - - -
disable - Type: boolean
- Default: undefined

- Whether to disable the controller -
name - Type: string
- Default: control${id}

- The unique name of the controller, used for the class name -
position - Type: string
- Default: undefined

- The position where the controller appears: top, left, right -
index - Type: number
- Default: undefined

- The unique index of the controller, used for the priority level -
-
- 		- Demo -
-

API

- -

Ecosystem

- - - - - - - - - - - - - - -
ProjectDescription
artplayer-plugin-danmuDanmu plugin for ArtPlayer
-

Issue

- -

Contributors

- -

License

- -

MIT © Harvey Zack

- -
- - - - - - - - - - - - \ No newline at end of file diff --git a/README.md b/README.md index 0fcdd9816..e9204359d 100644 --- a/README.md +++ b/README.md @@ -631,6 +631,29 @@ var art = new Artplayer({ ## API +#### Example + +```js +var art = new Artplayer({ + container: '.artplayer-app', + url: 'path/to/video.mp4' +}); +``` + +#### Class static properties + +| Parameter | Description | +| ------------------- | ------------------------- | +| Artplayer.version | Version Information | +| Artplayer.config | Configuration information | +| Artplayer.utils | Common utils | +| Artplayer.DEFAULTS | Default configuration | +| Artplayer.instances | Instance collection | + +#### Instance method + +#### Listening event + ## Ecosystem | Project | Description |