From 811e530329b38f944fc4bc9d9003051b3da723f7 Mon Sep 17 00:00:00 2001
From: Jikkai Xiao <sonne@asaki.me>
Date: Fri, 6 Mar 2020 16:03:51 +0800
Subject: [PATCH] feat: support custom playback speed

---
 docs/guide.md           |  1 +
 docs/zh/guide.md        |  1 +
 src/css/controller.scss |  1 -
 src/js/options.js       |  1 +
 src/template/player.art | 23 +++++------------------
 5 files changed, 8 insertions(+), 19 deletions(-)

diff --git a/docs/guide.md b/docs/guide.md
index be625e5..d55985d 100644
--- a/docs/guide.md
+++ b/docs/guide.md
@@ -119,6 +119,7 @@ You can custom your player instance by those options
 | hotkey               | true                               | enable hotkey, support FF, FR, volume control, play & pause                                                                                                |
 | 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                               |
+| playbackSpeed        | [0.5, 0.75, 1, 1.25, 1.5, 2]       | default playback speed, or or you can set a custom one                                                                                                     |
 | 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 [#live](#live)                                                                                                |
 | video                | -                                  | video info                                                                                                                                                 |
diff --git a/docs/zh/guide.md b/docs/zh/guide.md
index 391ceb6..88ae552 100644
--- a/docs/zh/guide.md
+++ b/docs/zh/guide.md
@@ -111,6 +111,7 @@ DPlayer 有丰富的参数可以自定义你的播放器实例
 | hotkey               | true                               | 开启热键，支持快进、快退、音量控制、播放暂停                                                            |
 | preload              | 'auto'                             | 视频预加载，可选值: 'none', 'metadata', 'auto'                                                          |
 | volume               | 0.7                                | 默认音量，请注意播放器会记忆用户设置，用户手动设置音量后默认音量即失效                                  |
+| playbackSpeed        | [0.5, 0.75, 1, 1.25, 1.5, 2]       | 默认播放速率，可以设置成自定义的数组                                                                    |
 | logo                 | -                                  | 在左上角展示一个 logo，你可以通过 CSS 调整它的大小和位置                                                |
 | apiBackend           | -                                  | 自定义获取和发送弹幕行为，见[#直播](#直播)                                                              |
 | video                | -                                  | 视频信息                                                                                                |
diff --git a/src/css/controller.scss b/src/css/controller.scss
index 88cf7c6..0076b65 100644
--- a/src/css/controller.scss
+++ b/src/css/controller.scss
@@ -434,7 +434,6 @@
                 }
                 &.dplayer-setting-box-narrow {
                     width: 70px;
-                    height: 180px;
                     text-align: center;
                 }
                 &.dplayer-setting-box-speed {
diff --git a/src/js/options.js b/src/js/options.js
index 10c237b..3ca1b2f 100644
--- a/src/js/options.js
+++ b/src/js/options.js
@@ -14,6 +14,7 @@ export default (options) => {
         hotkey: true,
         preload: 'metadata',
         volume: 0.7,
+        playbackSpeed: [0.5, 0.75, 1, 1.25, 1.5, 2],
         apiBackend: defaultApiBackend,
         video: {},
         contextmenu: [],
diff --git a/src/template/player.art b/src/template/player.art
index 252a7d9..a602f37 100644
--- a/src/template/player.art
+++ b/src/template/player.art
@@ -170,24 +170,11 @@
                     </div>
                 </div>
                 <div class="dplayer-setting-speed-panel">
-                    <div class="dplayer-setting-speed-item" data-speed="0.5">
-                        <span class="dplayer-label">0.5</span>
-                    </div>
-                    <div class="dplayer-setting-speed-item" data-speed="0.75">
-                        <span class="dplayer-label">0.75</span>
-                    </div>
-                    <div class="dplayer-setting-speed-item" data-speed="1">
-                        <span class="dplayer-label">{{ tran('Normal') }}</span>
-                    </div>
-                    <div class="dplayer-setting-speed-item" data-speed="1.25">
-                        <span class="dplayer-label">1.25</span>
-                    </div>
-                    <div class="dplayer-setting-speed-item" data-speed="1.5">
-                        <span class="dplayer-label">1.5</span>
-                    </div>
-                    <div class="dplayer-setting-speed-item" data-speed="2">
-                        <span class="dplayer-label">2</span>
-                    </div>
+                    {{ each options.playbackSpeed }}
+                        <div class="dplayer-setting-speed-item" data-speed="{{ $value }}">
+                            <span class="dplayer-label">{{ $value === 1 ? tran('Normal') : $value }}</span>
+                        </div>
+                    {{ /each }}
                 </div>
             </div>
         </div>