Update vd.js

js/vd.js

@@ -135,6 +135,23 @@ const vd = (function() {
         }
     }
 
+    function setupSpeed(menuButton, player) {
+        let speeds = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
+        menuButton.updateLabel('x1');
+        menuButton.menu.items = [];
+        menuButton.menu.addAndRecordItem = function(item) {
+            this.addItem(item);
+            this.items.push(item);
+        }
+
+        for (let speed of speeds) {
+            menuButton.menu.addAndRecordItem(new SpeedItem(player, {
+                label: "x" + speed,
+                speed,
+            }));
+        }
+    }
+
     let vjs = {};
 
     vjs.Component = videojs.getComponent('Component');
@@ -216,6 +233,18 @@ const vd = (function() {
         }
     }
 
+    class SpeedItem extends vjs.MenuItem {
+        constructor() {
+            super(...arguments);
+            this.label = arguments[1].label;
+            this.speed = arguments[1].speed;
+        }
+
+        handleClick() {
+            this.player().playbackRate(this.speed);
+        }
+    }
+
     class Thumbnail extends vjs.Component {
         constructor() {
             super(...arguments);
@@ -431,10 +460,14 @@ const vd = (function() {
         let fullscreenButton = controlBar.children()[controlBar.children().length - 1];
         controlBar.removeChild(fullscreenButton);
         let menuButton = new MenuButton(player);
+        let speedButton = new MenuButton(player);
+        controlBar.addChild(speedButton, {});
         controlBar.addChild(menuButton, {});
         controlBar.addChild(fullscreenButton, {});
 
+        setupSpeed(speedButton, player);
         setupRepresentations(menuButton, player);
+
         // videojs.Html5DashJS.hook('beforeinitialize', (p, mp) => setupRepresentations(menuButton, p, mp));
         window.player = player;