Chinese docs

docs/README.md

@@ -81,7 +81,7 @@ const dp = new DPlayer(options);
 
 ## Options
 
-Name|Default|Note
+Name | Default | Description
 ----|-------|----
 container | document.querySelector('.dplayer') | player container
 live | false | enable live mode, [see more details](http://dplayer.js.org/#/home?id=live)
@@ -105,9 +105,9 @@ video.type | 'auto' | values: 'auto', 'hls', 'flv', 'dash', 'webtorrent' or cust
 video.customType | - | custom video type, [see more details](http://dplayer.js.org/#/home?id=mse-support)
 subtitle | - | external subtitle
 subtitle.url | `required` | subtitle url
-subtitle.type | 'webvtt' | values: 'webvtt', 'ass', but only webvtt is supported for now
+subtitle.type | 'webvtt' | subtitle type, values: 'webvtt', 'ass', but only webvtt is supported for now
 subtitle.fontSize | '20px' | subtitle font size
-subtitle.bottom | '40px' | values like: '10px' '10%', the distance between the subtitle and player bottom
+subtitle.bottom | '40px' | the distance between the subtitle and player bottom, values like: '10px' '10%'
 subtitle.color | '#fff' | subtitle color
 danmaku | - | showing danmaku
 danmaku.id | `required` | danamku pool id, it must be unique
@@ -117,9 +117,9 @@ danmaku.maximum | - | danmaku maximum quantity
 danmaku.addition | - | additional danmaku, [see more details](http://dplayer.js.org/#/home?id=bilibili-danmaku)
 danmaku.user | 'DIYgod' | danmaku user name
 danmaku.bottom | - | values like: '10px' '10%', the distance between the danmaku bottom and player bottom, in order to prevent warding off subtitle
-danmaku.unlimited | false | allow danmaku overlap, notice that player will remember user setting, default setting will not work after user set it themselves
+danmaku.unlimited | false | display all danmaku even though danmaku overlap, notice that player will remember user setting, default setting will not work after user set it themselves
 contextmenu | [] | custom contextmenu
-mutex | true | pause other players when this player start play
+mutex | true | prevent to play multiple player at the same time, pause other players when this player start play
 
 For example:
 
@@ -194,7 +194,7 @@ const dp = new DPlayer({
 
 + `dp.on(event: string, handler: function)`: bind video and player events, [see more details](http://dplayer.js.org/#/home?id=event-binding)
 
-+ `dp.switchVideo(video, danmaku)`: switch to a new video, the parameters in `video` and `danmaku` is the same as option
++ `dp.switchVideo(video, danmaku)`: switch to a new video
 
   ```js
   dp.switchVideo({
@@ -340,7 +340,7 @@ Player events
 
 ## Quality switching
 
-Set video url and video type in video.quality, set default quality by video.defaultQuality.
+Set video url and video type in `video.quality`, set default quality by `video.defaultQuality`.
 
 <div class="dplayer-wrap">
     <div id="dplayer4"><button class="docute-button load">Click to load player</div>
@@ -370,6 +370,8 @@ const dp = new DPlayer({
 
 ### Danmaku API
 
+`danmaku.api`
+
 **Ready-made API**
 
 url: https://api.prprpr.me/dplayer/
@@ -380,7 +382,9 @@ Daily backup data: [DPlayer-data](https://github.com/DIYgod/DPlayer-data)
 
 [DPlayer-node](https://github.com/MoePlayer/DPlayer-node)
 
-### Bilibili danmaku
+### bilibili danmaku
+
+`danmaku.addition`
 
 API: [https://api.prprpr.me/dplayer/v2/bilibili?aid=[aid]](https://api.prprpr.me/dplayer/v2/bilibili?aid=[aid]) or [https://api.prprpr.me/dplayer/v2/bilibili?cid=[cid]](https://api.prprpr.me/dplayer/v2/bilibili?cid=[cid])
 
@@ -582,9 +586,9 @@ const dp = new DPlayer({
     <div id="dplayer9"><button class="docute-button load">Click to load player</div>
 </div>
 
-You can also regard DPlayer as a live player, at first, you should prepare a WebSocket backend yourself.
+You can use DPlayer in live, but if you want live danmaku, you should prepare a WebSocket backend yourself.
 
-Init DPlayer:
+Init player:
 
 ```js
 const dp = new DPlayer({
@@ -608,7 +612,7 @@ const dp = new DPlayer({
 });
 ```
 
-After getting a danmaku via WebSocket:
+Draw danmaku after getting a danmaku via WebSocket:
 
 ```js
 const danmaku = {
@@ -627,9 +631,9 @@ dp.danmaku.draw(danmaku);
 
 ## FAQ
 
-### Why can't some videos be full screen?
+### Why can't player be full screen?
 
-If player is contained in a iframe, try adding the allowfullscreen attribute to the iframe.
+If player is contained in a iframe, try adding the `allowfullscreen` attribute to the iframe.
 
 For full browser support it should look like this:
 

docs/config.js

@@ -1,243 +1,244 @@
 const langs = [
-  { title: 'English', path: '/home', matchPath: /^\/(home|ecosystem)/ },
-  { title: '简体中文', path: '/zh-Hans/', matchPath: /^\/zh-Hans/ },
-]
+    { title: 'English', path: '/home', matchPath: /^\/(home|ecosystem)/ },
+    { title: '简体中文', path: '/zh-Hans/', matchPath: /^\/zh-Hans/ },
+];
 
 docute.init({
-  landing: 'landing.html',
-  title: 'DPlayer',
-  repo: 'DIYgod/DPlayer',
-  twitter: 'DIYgod',
-  'edit-link': 'https://github.com/MoePlayer/DPlayer/tree/master/docs',
-  nav: {
-    default: [
-      {
-        title: 'Home', path: '/home'
-      },
-      {
-        title: 'Ecosystem', path: '/ecosystem'
-      },
-      {
-        title: 'Languages', type: 'dropdown', items: langs
-      }
-    ],
-    'zh-Hans': [
-      {
-        title: '首页', path: '/zh-Hans/'
-      },
-      {
-        title: '生态系统', path: '/zh-Hans/ecosystem'
-      },
-      {
-        title: '选择语言', type: 'dropdown', items: langs
-      }
-    ],
-  },
-  plugins: [
-    docsearch({
-      apiKey: '46a8ba306e368972c1d75feb581fb430',
-      indexName: 'dplayer',
-      url: 'http://dplayer.js.org'
-    }),
-    evanyou(),
-    player()
-  ]
-})
+    landing: 'landing.html',
+    title: 'DPlayer',
+    repo: 'DIYgod/DPlayer',
+    twitter: 'DIYgod',
+    'edit-link': 'https://github.com/MoePlayer/DPlayer/tree/master/docs',
+    nav: {
+        default: [
+            {
+                title: 'Home', path: '/home'
+            },
+            {
+                title: 'Ecosystem', path: '/ecosystem'
+            },
+            {
+                title: 'Languages', type: 'dropdown', items: langs
+            }
+        ],
+        'zh-Hans': [
+            {
+                title: '首页', path: '/zh-Hans/'
+            },
+            {
+                title: '生态', path: '/zh-Hans/ecosystem'
+            },
+            {
+                title: '选择语言', type: 'dropdown', items: langs
+            }
+        ],
+    },
+    plugins: [
+        docsearch({
+            apiKey: '46a8ba306e368972c1d75feb581fb430',
+            indexName: 'dplayer',
+            tags: ['english', 'zh-Hans'],
+            url: 'http://dplayer.js.org'
+        }),
+        evanyou(),
+        player()
+    ]
+});
 
-function player (options) {
-  return function (context) {
-    context.event.on('landing:updated', function () {
-      console.log('landing:updated');
-      clearPlayer();
-      dplayer1();
-    });
-    context.event.on('content:updated', function () {
-      console.log('content:updated');
-      clearPlayer();
-      for (var i = 0; i < document.querySelectorAll('.load').length; i++) {
-        document.querySelectorAll('.load')[i].addEventListener('click', function () {
-          window[this.parentElement.id] && window[this.parentElement.id]();
+function player () {
+    return function (context) {
+        context.event.on('landing:updated', function () {
+            console.log('landing:updated');
+            clearPlayer();
+            dplayer1();
         });
-      }
-    })
-  }
+        context.event.on('content:updated', function () {
+            console.log('content:updated');
+            clearPlayer();
+            for (let i = 0; i < document.querySelectorAll('.load').length; i++) {
+                document.querySelectorAll('.load')[i].addEventListener('click', function () {
+                    window[this.parentElement.id] && window[this.parentElement.id]();
+                });
+            }
+        });
+    };
 }
 
 function clearPlayer () {
-  for (var i = 1; i < 10; i++) {
-    if (window['dp' + (i + 1)]) {
-      window['dp' + (i + 1)].destroy();
+    for (let i = 1; i < 10; i++) {
+        if (window['dp' + (i + 1)]) {
+            window['dp' + (i + 1)].destroy();
+        }
     }
-  }
 }
 
 function dplayer1 () {
-  window.dp1 = new DPlayer({
-    container: document.getElementById('dplayer1'),
-    screenshot: true,
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-      pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-      thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
-    },
-    subtitle: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt'
-    },
-    danmaku: {
-      id: '9E2E3368B56CDBB4',
-      api: 'https://api.prprpr.me/dplayer/'
-    }
-  });
+    window.dp1 = new DPlayer({
+        container: document.getElementById('dplayer1'),
+        screenshot: true,
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
+            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
+            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
+        },
+        subtitle: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt'
+        },
+        danmaku: {
+            id: '9E2E3368B56CDBB4',
+            api: 'https://api.prprpr.me/dplayer/'
+        }
+    });
 }
 
 function dplayer2 () {
-  window.dp2 = new DPlayer({
-    container: document.getElementById('dplayer2'),
-    screenshot: true,
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-      pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-      thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
-    },
-    subtitle: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt'
-    },
-    danmaku: {
-      id: '9E2E3368B56CDBB4',
-      api: 'https://api.prprpr.me/dplayer/'
-    }
-  });
+    window.dp2 = new DPlayer({
+        container: document.getElementById('dplayer2'),
+        screenshot: true,
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
+            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
+            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
+        },
+        subtitle: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt'
+        },
+        danmaku: {
+            id: '9E2E3368B56CDBB4',
+            api: 'https://api.prprpr.me/dplayer/'
+        }
+    });
 }
 
 function dplayer3 () {
-  window.dp3 = new DPlayer({
-    container: document.getElementById('dplayer3'),
-    autoplay: false,
-    theme: '#FADFA3',
-    loop: true,
-    lang: 'zh-cn',
-    screenshot: true,
-    hotkey: true,
-    preload: 'auto',
-    logo: 'https://moeplayer.b0.upaiyun.com/dplayer/DPlayer.png',
-    volume: 0.7,
-    mutex: true,
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-      pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-      thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg',
-      type: 'auto'
-    },
-    subtitle: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt',
-      type: 'webvtt',
-      fontSize: '25px',
-      bottom: '10%',
-      color: '#b7daff'
-    },
-    danmaku: {
-      id: '9E2E3368B56CDBB4',
-      api: 'https://api.prprpr.me/dplayer/',
-      token: 'tokendemo',
-      maximum: 1000,
-      addition: ['https://api.prprpr.me/dplayer/bilibili?aid=4157142'],
-      user: 'DIYgod',
-      bottom: '15%',
-      unlimited: true
-    },
-    contextmenu: [
-      {
-        text: 'custom1',
-        link: 'https://github.com/DIYgod/DPlayer'
-      },
-      {
-        text: 'custom2',
-        click: (player) => {
-          console.log(player);
-        }
-      }
-    ]
-  });
+    window.dp3 = new DPlayer({
+        container: document.getElementById('dplayer3'),
+        autoplay: false,
+        theme: '#FADFA3',
+        loop: true,
+        lang: 'zh-cn',
+        screenshot: true,
+        hotkey: true,
+        preload: 'auto',
+        logo: 'https://moeplayer.b0.upaiyun.com/dplayer/DPlayer.png',
+        volume: 0.7,
+        mutex: true,
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
+            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
+            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg',
+            type: 'auto'
+        },
+        subtitle: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt',
+            type: 'webvtt',
+            fontSize: '25px',
+            bottom: '10%',
+            color: '#b7daff'
+        },
+        danmaku: {
+            id: '9E2E3368B56CDBB4',
+            api: 'https://api.prprpr.me/dplayer/',
+            token: 'tokendemo',
+            maximum: 1000,
+            addition: ['https://api.prprpr.me/dplayer/bilibili?aid=4157142'],
+            user: 'DIYgod',
+            bottom: '15%',
+            unlimited: true
+        },
+        contextmenu: [
+            {
+                text: 'custom1',
+                link: 'https://github.com/DIYgod/DPlayer'
+            },
+            {
+                text: 'custom2',
+                click: (player) => {
+                    console.log(player);
+                }
+            }
+        ]
+    });
 }
 
 function dplayer4 () {
-  window.dp4 = new DPlayer({
-    container: document.getElementById('dplayer4'),
-    video: {
-      quality: [{
-        name: 'HD',
-        url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
-        type: 'hls'
-      }, {
-        name: 'SD',
-        url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-        type: 'normal'
-      }],
-      defaultQuality: 0,
-      pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-      thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
-    }
-  });
+    window.dp4 = new DPlayer({
+        container: document.getElementById('dplayer4'),
+        video: {
+            quality: [{
+                name: 'HD',
+                url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
+                type: 'hls'
+            }, {
+                name: 'SD',
+                url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
+                type: 'normal'
+            }],
+            defaultQuality: 0,
+            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
+            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
+        }
+    });
 }
 
 function dplayer5 () {
-  window.dp5 = new DPlayer({
-    container: document.getElementById('dplayer5'),
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
-      type: 'hls'
-    }
-  });
+    window.dp5 = new DPlayer({
+        container: document.getElementById('dplayer5'),
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
+            type: 'hls'
+        }
+    });
 }
 
 function dplayer6 () {
-  window.dp6 = new DPlayer({
-    container: document.getElementById('dplayer6'),
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/dash/hikarunara.mpd',
-      type: 'dash'
-    }
-  });
+    window.dp6 = new DPlayer({
+        container: document.getElementById('dplayer6'),
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/dash/hikarunara.mpd',
+            type: 'dash'
+        }
+    });
 }
 
 function dplayer7 () {
-  window.dp7 = new DPlayer({
-    container: document.getElementById('dplayer7'),
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.flv',
-      type: 'flv'
-    }
-  });
+    window.dp7 = new DPlayer({
+        container: document.getElementById('dplayer7'),
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.flv',
+            type: 'flv'
+        }
+    });
 }
 
 function dplayer8 () {
-  window.dp8 = new DPlayer({
-    container: document.getElementById('dplayer8'),
-    video: {
-      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: 'webtorrent'
-    }
-  });
+    window.dp8 = new DPlayer({
+        container: document.getElementById('dplayer8'),
+        video: {
+            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: 'webtorrent'
+        }
+    });
 }
 
 function dplayer9 () {
-  window.dp9 = new DPlayer({
-    container: document.getElementById('dplayer9'),
-    live: true,
-    danmaku: true,
-    apiBackend: {
-      read: function (endpoint, callback) {
-        console.log('Pretend to connect WebSocket');
-        callback();
-      },
-      send: function (endpoint, danmakuData, callback) {
-        console.log('Pretend to send danamku via WebSocket', danmakuData);
-        callback();
-      }
-    },
-    video: {
-      url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
-      type: 'hls'
-    }
-  });
+    window.dp9 = new DPlayer({
+        container: document.getElementById('dplayer9'),
+        live: true,
+        danmaku: true,
+        apiBackend: {
+            read: function (endpoint, callback) {
+                console.log('Pretend to connect WebSocket');
+                callback();
+            },
+            send: function (endpoint, danmakuData, callback) {
+                console.log('Pretend to send danamku via WebSocket', danmakuData);
+                callback();
+            }
+        },
+        video: {
+            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
+            type: 'hls'
+        }
+    });
 }

docs/zh-Hans/README.md

@@ -1,5 +1,6 @@
 ---
-search: english
+nav: zh-Hans
+search: zh-Hans
 ---
 
 # DPlayer
@@ -25,24 +26,24 @@ search: english
   </tbody>
 </table>
 
-## Installation
+## 安装
 
-Using npm:
+使用 npm:
 
 ```
 npm install dplayer --save
 ```
 
-Using Yarn:
+使用 Yarn:
 
 ```
 yarn add dplayer
 ```
 
-## Quick Start
+## 入门
 
 <div class="dplayer-wrap">
-    <div id="dplayer2"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer2"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```html
@@ -70,7 +71,7 @@ const dp = new DPlayer({
 });
 ```
 
-Work with module bundler:
+使用模块管理器:
 
 ```js
 import 'DPlayer/dist/DPlayer.min.css';
@@ -79,52 +80,52 @@ import DPlayer from 'DPlayer';
 const dp = new DPlayer(options);
 ```
 
-## Options
+## 参数
 
-Name|Default|Note
+名称 | 默认值 | 描述
 ----|-------|----
-container | document.querySelector('.dplayer') | player container
-live | false | enable live mode, [see more details](http://dplayer.js.org/#/home?id=live)
-autoplay | false | video autoplay
-theme | '#b7daff' | main color
-loop | false | video loop
-lang | navigator.language.toLowerCase() | values: 'en', 'zh-cn', 'zh-tw'
-screenshot | false | enable screenshot, if true, video and video poster must enable Cross-Origin
-hotkey | true | enable hotkey
-preload | 'auto' | values: 'none', 'metadata', 'auto'
-volume | 0.7 | default volume, notice that player will remember user setting, default volume will not work after user set volume themselves
-logo | - | showing logo in the top left corner, you can adjust its size and position by CSS
-apiBackend | - | getting and sending danmaku in your way, [see more details](http://dplayer.js.org/#/home?id=live)
-video | - | video info
-video.quality | - | [see more details](http://dplayer.js.org/#/home?id=quality-switching)
-video.defaultQuality | - | [see more details](http://dplayer.js.org/#/home?id=quality-switching)
-video.url | - | video url
-video.pic | - | video poster
-video.thumbnails | - | video thumbnails, generated by [DPlayer-thumbnails](https://github.com/MoePlayer/DPlayer-thumbnails)
-video.type | 'auto' | values: 'auto', 'hls', 'flv', 'dash', 'webtorrent' or custom type, [see more details](http://dplayer.js.org/#/home?id=mse-support)
-video.customType | - | custom video type, [see more details](http://dplayer.js.org/#/home?id=mse-support)
-subtitle | - | external subtitle
-subtitle.url | `required` | subtitle url
-subtitle.type | 'webvtt' | values: 'webvtt', 'ass', but only webvtt is supported for now
-subtitle.fontSize | '20px' | subtitle font size
-subtitle.bottom | '40px' | values like: '10px' '10%', the distance between the subtitle and player bottom
-subtitle.color | '#fff' | subtitle color
-danmaku | - | showing danmaku
-danmaku.id | `required` | danamku pool id, it must be unique
-danmaku.api | `required` | [see more details](http://dplayer.js.org/#/home?id=danmaku-api)
-danmaku.token | - | back end verification token
-danmaku.maximum | - | danmaku maximum quantity
-danmaku.addition | - | additional danmaku, [see more details](http://dplayer.js.org/#/home?id=bilibili-danmaku)
-danmaku.user | 'DIYgod' | danmaku user name
-danmaku.bottom | - | values like: '10px' '10%', the distance between the danmaku bottom and player bottom, in order to prevent warding off subtitle
-danmaku.unlimited | false | allow danmaku overlap, notice that player will remember user setting, default setting will not work after user set it themselves
-contextmenu | [] | custom contextmenu
-mutex | true | pause other players when this player start play
-
-For example:
+container | document.querySelector('.dplayer') | 播放器容器元素
+live | false | 开启直播模式, [详情](http://dplayer.js.org/#/home?id=live)
+autoplay | false | 视频自动播放
+theme | '#b7daff' | 主题色
+loop | false | 视频循环播放
+lang | navigator.language.toLowerCase() | 可选值: 'en', 'zh-cn', 'zh-tw'
+screenshot | false | 开启截图，如果开启，视频和视频封面需要开启跨域
+hotkey | true | 开启热键
+preload | 'auto' | 可选值: 'none', 'metadata', 'auto'
+volume | 0.7 | 默认音量，请注意播放器会记忆用户设置，用户手动设置音量后默认音量即失效
+logo | - | 在左上角展示一个 logo，你可以通过 CSS 调整它的大小和位置
+apiBackend | - | 自定义获取和发送弹幕行为，[详情](http://dplayer.js.org/#/home?id=live)
+video | - | 视频信息
+video.quality | - | [详情](http://dplayer.js.org/#/home?id=quality-switching)
+video.defaultQuality | - | [详情](http://dplayer.js.org/#/home?id=quality-switching)
+video.url | - | 视频链接
+video.pic | - | 视频封面
+video.thumbnails | - | 视频缩略图，可以使用 [DPlayer-thumbnails](https://github.com/MoePlayer/DPlayer-thumbnails) 生成
+video.type | 'auto' | 可选值: 'auto', 'hls', 'flv', 'dash', 'webtorrent' 或其他自定义类型, [详情](http://dplayer.js.org/#/home?id=mse-support)
+video.customType | - | 自定义类型, [详情](http://dplayer.js.org/#/home?id=mse-support)
+subtitle | - | 外挂字幕
+subtitle.url | `required` | 字幕链接
+subtitle.type | 'webvtt' | 字幕类型，可选值: 'webvtt', 'ass'，目前只支持 webvtt
+subtitle.fontSize | '20px' | 字幕字号
+subtitle.bottom | '40px' | 字幕距离播放器底部的距离，取值形如: '10px' '10%'
+subtitle.color | '#fff' | 字幕颜色
+danmaku | - | 显示弹幕
+danmaku.id | `required` | 弹幕池id，必须唯一
+danmaku.api | `required` | [详情](http://dplayer.js.org/#/home?id=danmaku-api)
+danmaku.token | - | 弹幕后端验证 token
+danmaku.maximum | - | 弹幕最大数量
+danmaku.addition | - | 额外外挂弹幕，[详情](http://dplayer.js.org/#/home?id=bilibili-danmaku)
+danmaku.user | 'DIYgod' | 弹幕用户名
+danmaku.bottom | - | 弹幕距离播放器底部的距离，防止遮挡字幕，取值形如: '10px' '10%'
+danmaku.unlimited | false | 海量弹幕模式，即使重叠也展示全部弹幕，请注意播放器会记忆用户设置，用户手动设置后即失效
+contextmenu | [] | 自定义右键菜单
+mutex | true | 互斥，阻止多个播放器同时播放，当前播放器播放时暂停其他播放器
+
+例如:
 
 <div class="dplayer-wrap">
-    <div id="dplayer3"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer3"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```js
@@ -180,21 +181,21 @@ const dp = new DPlayer({
 
 ## API
 
-+ `dp.play()`: play video
++ `dp.play()`: 播放视频
 
-+ `dp.pause()`: pause video
++ `dp.pause()`: 暂停视频
 
-+ `dp.seek(time: number)`: seek to specified millisecond time
++ `dp.seek(time: number)`: 跳转到特定事件
 
   ```js
   dp.seek(1000);
   ```
 
-+ `dp.toggle()`: toggle between play and pause
++ `dp.toggle()`: 切换播放和暂停
 
-+ `dp.on(event: string, handler: function)`: bind video and player events, [see more details](http://dplayer.js.org/#/home?id=event-binding)
++ `dp.on(event: string, handler: function)`: 绑定视频和播放器事件，[详情](http://dplayer.js.org/#/home?id=event-binding)
 
-+ `dp.switchVideo(video, danmaku)`: switch to a new video, the parameters in `video` and `danmaku` is the same as option
++ `dp.switchVideo(video, danmaku)`: 切换到其他视频
 
   ```js
   dp.switchVideo({
@@ -209,27 +210,27 @@ const dp = new DPlayer({
   });
   ```
 
-+ `dp.notice(text: string, time: number)`: show message
++ `dp.notice(text: string, time: number)`: 显示消息
 
-+ `dp.switchQuality(index: number)`: switch quality
++ `dp.switchQuality(index: number)`: 切换清晰度
 
-+ `dp.destroy()`: destroy player
++ `dp.destroy()`: 销毁播放器
 
-+ `dp.speed(rate: number)`: set video speed
++ `dp.speed(rate: number)`: 设置视频速度
 
-+ `dp.video`: native video
++ `dp.video`: 原生 video
 
- + `dp.video.currentTime`: returns the current playback position
+ + `dp.video.currentTime`: 返回视频当前播放时间
 
- + `dp.video.loop`: returns whether the video should start over again when finished
+ + `dp.video.loop`: 返回视频是否循环播放
 
- + `dp.video.paused`: returns whether the video paused
+ + `dp.video.paused`: 返回视频是否暂停
 
- + most [native api](http://www.w3schools.com/tags/ref_av_dom.asp) are supported
+ + 支持大多数[原生video接口](http://www.w3schools.com/tags/ref_av_dom.asp)
 
 + `dp.danmaku`
 
- + `dp.danmaku.send(danmaku, callback: function)`: submit a new danmaku to back end
+ + `dp.danmaku.send(danmaku, callback: function)`: 提交一个新弹幕
 
    ```js
    dp.danmaku.send({
@@ -241,7 +242,7 @@ const dp = new DPlayer({
    });
    ```
 
- + `dp.danmaku.draw(danmaku)`: draw a new danmaku to player in real time
+ + `dp.danmaku.draw(danmaku)`: 实时绘制一个新弹幕
 
    ```js
    dp.danmaku.draw({
@@ -251,33 +252,33 @@ const dp = new DPlayer({
    });
    ```
 
- + `dp.danmaku.opacity(percentage: number)`: set danmaku opacity, opacity should between 0 and 1
+ + `dp.danmaku.opacity(percentage: number)`: 设置弹幕透明度，透明度值在 0 到 1 之间
 
    ```js
    dp.danmaku.opacity(0.5);
    ```
 
- + `dp.danmaku.clear()`: clear all danmakus
+ + `dp.danmaku.clear()`: 清除所有弹幕
 
- + `dp.danmaku.hide()`: hide danmaku
+ + `dp.danmaku.hide()`: 隐藏弹幕
 
- + `dp.danmaku.show()`: show danmaku
+ + `dp.danmaku.show()`: 显示弹幕
 
-+ `dp.fullScreen`: two type: `web` or `browser`, the default one is `browser`
++ `dp.fullScreen`: 两个类型：`web` 和 `browser`，默认类型是 `browser`
 
- + `dp.fullScreen.request(type: string)`: request fullscreen
+ + `dp.fullScreen.request(type: string)`: 进入全屏
 
    ```js
    dp.fullScreen.request('web');
    ```
 
- + `dp.fullScreen.cancel(type: string)`: cancel fullscreen
+ + `dp.fullScreen.cancel(type: string)`: 退出全屏
 
    ```js
    dp.fullScreen.cancel('web');
    ```
 
-## Event binding
+## 事件绑定
 
 `dp.on(event, handler)`
 
@@ -287,7 +288,7 @@ dp.on('ended', function () {
 });
 ```
 
-Video events
+视频事件
 
 - abort
 - canplay
@@ -313,7 +314,7 @@ Video events
 - volumechange
 - waiting
 
-Player events
+播放器事件
 
 - screenshot
 - thumbnails_show
@@ -338,12 +339,12 @@ Player events
 - subtitle_hide
 - subtitle_change
 
-## Quality switching
+## 清晰度切换
 
-Set video url and video type in video.quality, set default quality by video.defaultQuality.
+在 `video.quality` 里设置不同清晰度的视频链接和类型，`video.defaultQuality` 设置默认清晰度
 
 <div class="dplayer-wrap">
-    <div id="dplayer4"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer4"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```js
@@ -366,21 +367,25 @@ const dp = new DPlayer({
 });
 ```
 
-## Danmaku
+## 弹幕
 
-### Danmaku API
+### 弹幕接口
 
-**Ready-made API**
+`danmaku.api`
 
-url: https://api.prprpr.me/dplayer/
+**现成的接口**
 
-Daily backup data: [DPlayer-data](https://github.com/DIYgod/DPlayer-data)
+链接: https://api.prprpr.me/dplayer/
 
-**Setting up yourself**
+每日备份: [DPlayer-data](https://github.com/DIYgod/DPlayer-data)
+
+**自己搭建**
 
 [DPlayer-node](https://github.com/MoePlayer/DPlayer-node)
 
-### Bilibili danmaku
+### bilibili 弹幕
+
+`danmaku.addition`
 
 API: [https://api.prprpr.me/dplayer/v2/bilibili?aid=[aid]](https://api.prprpr.me/dplayer/v2/bilibili?aid=[aid]) or [https://api.prprpr.me/dplayer/v2/bilibili?cid=[cid]](https://api.prprpr.me/dplayer/v2/bilibili?cid=[cid])
 
@@ -393,14 +398,14 @@ const option = {
 }
 ```
 
-## MSE support
+## MSE 支持
 
 ### HLS
 
-It requires the library [hls.js](https://github.com/video-dev/hls.js) and it should be loaded before `DPlayer.min.js`.
+需要在 `DPlayer.min.js` 前面加载 [hls.js](https://github.com/video-dev/hls.js)。
 
 <div class="dplayer-wrap">
-    <div id="dplayer5"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer5"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```html
@@ -421,7 +426,7 @@ const dp = new DPlayer({
 ```
 
 ```js
-// another way, use customType
+// 另一种方式，使用 customType
 const dp = new DPlayer({
     container: document.getElementById('dplayer'),
     video: {
@@ -440,10 +445,10 @@ const dp = new DPlayer({
 
 ### MPEG DASH
 
-It requires the library [dash.js](https://github.com/Dash-Industry-Forum/dash.js) and it should be loaded before `DPlayer.min.js`.
+需要在 `DPlayer.min.js` 前面加载 [dash.js](https://github.com/Dash-Industry-Forum/dash.js)。
 
 <div class="dplayer-wrap">
-    <div id="dplayer6"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer6"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```html
@@ -464,7 +469,7 @@ const dp = new DPlayer({
 ```
 
 ```js
-// another way, use customType
+// 另一种方式，使用 customType
 const dp = new DPlayer({
     container: document.getElementById('dplayer'),
     video: {
@@ -481,10 +486,10 @@ const dp = new DPlayer({
 
 ### FLV
 
-It requires the library [flv.js](https://github.com/Bilibili/flv.js) and it should be loaded before `DPlayer.min.js`.
+需要在 `DPlayer.min.js` 前面加载 [flv.js](https://github.com/Bilibili/flv.js)。
 
 <div class="dplayer-wrap">
-    <div id="dplayer7"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer7"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```html
@@ -505,7 +510,7 @@ const dp = new DPlayer({
 ```
 
 ```js
-// another way, use customType
+// 另一种方式，使用 customType
 const dp = new DPlayer({
     container: document.getElementById('dplayer'),
     video: {
@@ -527,10 +532,10 @@ const dp = new DPlayer({
 
 ### WebTorrent
 
-It requires the library [webtorrent](https://github.com/webtorrent/webtorrent) and it should be loaded before `DPlayer.min.js`.
+需要在 `DPlayer.min.js` 前面加载 [webtorrent](https://github.com/webtorrent/webtorrent)。
 
 <div class="dplayer-wrap">
-    <div id="dplayer8"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer8"><button class="docute-button load">点击加载播放器</div>
 </div>
 
 ```html
@@ -551,7 +556,7 @@ const dp = new DPlayer({
 ```
 
 ```js
-// another way, use customType
+// 另一种方式，使用 customType
 const dp = new DPlayer({
     container: document.getElementById('dplayer'),
     video: {
@@ -576,15 +581,15 @@ const dp = new DPlayer({
 });
 ```
 
-## Live
+## 直播
 
 <div class="dplayer-wrap">
-    <div id="dplayer9"><button class="docute-button load">Click to load player</div>
+    <div id="dplayer9"><button class="docute-button load">点击加载播放器</div>
 </div>
 
-You can also regard DPlayer as a live player, at first, you should prepare a WebSocket backend yourself.
+你可以把 DPlayer 用在直播当中，但如果你想要直播弹幕，你需要自己准备一个 WebSocket 后端。
 
-Init DPlayer:
+初始化播放器:
 
 ```js
 const dp = new DPlayer({
@@ -608,7 +613,7 @@ const dp = new DPlayer({
 });
 ```
 
-After getting a danmaku via WebSocket:
+通过 WebSocket 获取到弹幕之后，通过 `dp.danmaku.draw` 绘制弹幕:
 
 ```js
 const danmaku = {
@@ -625,13 +630,13 @@ dp.danmaku.draw(danmaku);
 - [cdnjs](https://cdnjs.com/libraries/dplayer)
 - [unpkg](https://unpkg.com/dplayer/)
 
-## FAQ
+## 常见问题
 
-### Why can't some videos be full screen?
+### 为什么播放器不能全屏？
 
-If player is contained in a iframe, try adding the allowfullscreen attribute to the iframe.
+如果播放器被包含在 iframe 里，尝试在 iframe 上添加 `allowfullscreen` 属性。
 
-For full browser support it should look like this:
+为了完善的浏览器兼容性，它应该是这样：
 
 ```html
 <iframe src="example.com"
@@ -642,6 +647,6 @@ For full browser support it should look like this:
         webkitallowfullscreen="webkitallowfullscreen"></iframe> 
 ```
 
-### Why can't player autoplay in some mobile browsers?
+### 为什么播放器不能在手机上自动播放？
 
-Most mobile browsers forbid video autoplay, you wont be able to achieve it without hacks.
+大多数移动端浏览器禁止了视频自动播放。

docs/zh-Hans/ecosystem.md

@@ -3,35 +3,35 @@ nav: zh-Hans
 search: zh-Hans
 ---
 
-# 生态系统
+# 生态
 
-Let's make DPlayer better, feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31)
+让 DPlayer 变得更好，请随意在 [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31) 提交你的项目和产品
 
-## Help
+## 帮助
 
-### Joining the Discussion
+### 参与讨论
 
-- [Telegram Group](https://t.me/adplayer)
-- [QQ Group](https://shang.qq.com/wpa/qunwpa?idkey=bf22213ae0028a82e5adf3f286dfd4f01e0997dc9f1dcd8e831a0a85e799be17): 415835947
+- [Telegram 群](https://t.me/adplayer)
+- [QQ 群](https://shang.qq.com/wpa/qunwpa?idkey=bf22213ae0028a82e5adf3f286dfd4f01e0997dc9f1dcd8e831a0a85e799be17): 415835947
 
-### Creating issue
+### 提交 issue
 
 - [MoePlayer/DPlayer/issues](https://github.com/MoePlayer/DPlayer/issues)
 
-## Related Projects
+## 相关项目
 
-### Tooling
+### 工具
 
 - [DPlayer-thumbnails](https://github.com/MoePlayer/DPlayer-thumbnails): generate video thumbnails
 
-### Danamku api
+### 弹幕接口
 
 - [DPlayer-node](https://github.com/MoePlayer/DPlayer-node): Node.js
 - [laravel-danmaku](https://github.com/MoePlayer/laravel-danmaku): PHP
 - [dplayer-live-backend](https://github.com/Izumi-kun/dplayer-live-backend): Node.js, WebSocket live backend
 - [RailsGun](https://github.com/MoePlayer/RailsGun): Ruby
 
-### Plugins
+### 插件
 
 - [DPlayer-for-typecho](https://github.com/volio/DPlayer-for-typecho): Typecho
 - [Hexo-tag-dplayer](https://github.com/NextMoe/hexo-tag-dplayer): Hexo
@@ -42,19 +42,19 @@ Let's make DPlayer better, feel free to submit yours in [`Let me know!`](https:/
 - [Vue-DPlayer](https://github.com/sinchang/vue-dplayer): Vue
 - [react-dplayer](https://github.com/hnsylitao/react-dplayer): React
 
-### Other
+### 其他
 
 - [DPlayer-Lite](https://github.com/kn007/DPlayer-Lite): lite version
 
-## Who use DPlayer?
+## 谁在用 DPlayer?
 
 - [嘀哩嘀哩](http://www.dilidili.wang/)
 - [银弹字幕组](https://www.sbsub.com/)
 - [纸飞机南航青年网络社区](http://my.nuaa.edu.cn/video-video.html)
 - [otomads](https://otomads.com/)
 
-## Contributors
+## 贡献者
 
-This project exists thanks to all the people who contribute.
+感谢所有贡献者。
 
 <a href="https://github.com/MoePlayer/DPlayer/graphs/contributors"><img src="https://opencollective.com/DPlayer/contributors.svg?width=890" /></a>