docs

docs/README.md

@@ -91,7 +91,7 @@ video.defaultQuality | - | [see more details](http://dplayer.js.org/#/home?id=qu
 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.type | 'auto' | values: 'auto', 'hls', 'flv', 'dash', 'webtorrent', 'normal' or other 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
@@ -174,10 +174,10 @@ const dp = new DPlayer({
 
 + `dp.pause()`: pause video
 
-+ `dp.seek(time: number)`: seek to specified millisecond time
++ `dp.seek(time: number)`: seek to specified time
 
   ```js
-  dp.seek(1000);
+  dp.seek(100);
   ```
 
 + `dp.toggle()`: toggle between play and pause
@@ -199,7 +199,11 @@ const dp = new DPlayer({
   });
   ```
 
-+ `dp.notice(text: string, time: number)`: show message
++ `dp.notice(text: string, time: number, opacity: number)`: show message, the unit of time is millisecond, the default of time is 2000, the default of opacity is 0.8
+
+  ```js
+  dp.notice('Amazing player', 2000, 0.8);
+  ```
 
 + `dp.switchQuality(index: number)`: switch quality
 
@@ -207,11 +211,17 @@ const dp = new DPlayer({
 
 + `dp.speed(rate: number)`: set video speed
 
++ `dp.volume(percentage: number, nostorage: boolean, nonotice: boolean)`: set video volume
+
+  ```js
+  dp.volume(0.1, true, false);
+  ```
+
 + `dp.video`: native video
 
  + `dp.video.currentTime`: returns the current playback position
 
- + `dp.video.loop`: returns whether the video should start over again when finished
+ + `dp.video.duration`: returns video total time
 
  + `dp.video.paused`: returns whether the video paused
 
@@ -570,6 +580,39 @@ const dp = new DPlayer({
 });
 ```
 
+### Work with other HLS library
+
+DPlayer can work with any HLS library via `customType` option.
+
+<div class="dplayer-wrap">
+    <div id="dplayer10"><button class="docute-button load">Click to load player</div>
+</div>
+
+```html
+<link rel="stylesheet" href="DPlayer.min.css">
+<div id="dplayer"></div>
+<script src="pearplayer.js"></script>
+<script src="DPlayer.min.js"></script>
+```
+
+```js
+const dp = new DPlayer({
+    container: document.getElementById('dplayer'),
+    video: {
+        url: 'https://qq.webrtc.win/tv/Pear-Demo-Yosemite_National_Park.mp4',
+        type: 'pearplayer',
+        customType: {
+            'pearplayer': function (video, player) {
+                new PearPlayer(video, {
+                    src: video.src,
+                    autoplay: player.options.autoplay
+                });
+            }
+        }
+    }
+});
+```
+
 ## Live
 
 <div class="dplayer-wrap">

docs/config.js

@@ -71,7 +71,7 @@ function player () {
 }
 
 function clearPlayer () {
-    for (let i = 1; i < 10; i++) {
+    for (let i = 0; i < 10; i++) {
         if (window['dp' + (i + 1)]) {
             window['dp' + (i + 1)].destroy();
         }
@@ -247,4 +247,22 @@ function dplayer9 () {
             type: 'hls'
         }
     });
+}
+
+function dplayer10 () {
+    window.dp9 = new DPlayer({
+        container: document.getElementById('dplayer10'),
+        video: {
+            url: 'https://qq.webrtc.win/tv/Pear-Demo-Yosemite_National_Park.mp4',
+            type: 'pearplayer',
+            customType: {
+                'pearplayer': function (video, player) {
+                    new PearPlayer(video, {
+                        src: video.src,
+                        autoplay: player.options.autoplay
+                    });
+                }
+            }
+        }
+    });
 }

docs/zh-Hans/README.md

@@ -82,7 +82,7 @@ loop | false | 视频循环播放
 lang | navigator.language.toLowerCase() | 可选值: 'en', 'zh-cn', 'zh-tw'
 screenshot | false | 开启截图，如果开启，视频和视频封面需要开启跨域
 hotkey | true | 开启热键
-preload | 'auto' | 可选值: 'none', 'metadata', 'auto'
+preload | 'auto' | 预加载，可选值: 'none', 'metadata', 'auto'
 volume | 0.7 | 默认音量，请注意播放器会记忆用户设置，用户手动设置音量后默认音量即失效
 logo | - | 在左上角展示一个 logo，你可以通过 CSS 调整它的大小和位置
 apiBackend | - | 自定义获取和发送弹幕行为，[详情](http://dplayer.js.org/#/home?id=live)
@@ -92,7 +92,7 @@ video.defaultQuality | - | [详情](http://dplayer.js.org/#/home?id=quality-swit
 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.type | 'auto' | 可选值: 'auto', 'hls', 'flv', 'dash', 'webtorrent', 'normal' 或其他自定义类型, [详情](http://dplayer.js.org/#/home?id=mse-support)
 video.customType | - | 自定义类型, [详情](http://dplayer.js.org/#/home?id=mse-support)
 subtitle | - | 外挂字幕
 subtitle.url | `required` | 字幕链接
@@ -178,7 +178,7 @@ const dp = new DPlayer({
 + `dp.seek(time: number)`: 跳转到特定时间
 
   ```js
-  dp.seek(1000);
+  dp.seek(100);
   ```
 
 + `dp.toggle()`: 切换播放和暂停
@@ -200,7 +200,7 @@ const dp = new DPlayer({
   });
   ```
 
-+ `dp.notice(text: string, time: number)`: 显示消息
++ `dp.notice(text: string, time: number)`: 显示通知，时间的单位为毫秒，默认时间2000毫秒，默认透明度0.8
 
 + `dp.switchQuality(index: number)`: 切换清晰度
 
@@ -208,11 +208,17 @@ const dp = new DPlayer({
 
 + `dp.speed(rate: number)`: 设置视频速度
 
++ `dp.volume(percentage: number, nostorage: boolean, nonotice: boolean)`: 设置视频音量
+
+  ```js
+  dp.volume(0.1, true, false);
+  ```
+
 + `dp.video`: 原生 video
 
  + `dp.video.currentTime`: 返回视频当前播放时间
 
- + `dp.video.loop`: 返回视频是否循环播放
+ + `dp.video.duration`: 返回视频总时间
 
  + `dp.video.paused`: 返回视频是否暂停
 
@@ -571,6 +577,38 @@ const dp = new DPlayer({
 });
 ```
 
+### Work with other HLS library
+
+DPlayer 可以与任何 HLS 库一起使用
+
+<div class="dplayer-wrap">
+    <div id="dplayer10"><button class="docute-button load">点击加载播放器</div>
+</div>
+
+```html
+<link rel="stylesheet" href="DPlayer.min.css">
+<div id="dplayer"></div>
+<script src="pearplayer.js"></script>
+<script src="DPlayer.min.js"></script>
+```
+
+```js
+const dp = new DPlayer({
+    container: document.getElementById('dplayer'),
+    video: {
+        url: 'https://qq.webrtc.win/tv/Pear-Demo-Yosemite_National_Park.mp4',
+        type: 'pearplayer',
+        customType: {
+            'pearplayer': function (video, player) {
+                new PearPlayer(video, {
+                    src: video.src,
+                    autoplay: player.options.autoplay
+                });
+            }
+        }
+    }
+});
+
 ## 直播
 
 <div class="dplayer-wrap">