From 3512a3fe2bb0db6662f3858bd6c2d6e9a3881495 Mon Sep 17 00:00:00 2001
From: Daniil <hikkamorii@localhost.localdomain>
Date: Wed, 22 Nov 2023 11:20:21 +0200
Subject: [PATCH] Control speed of playback using mousewheel

Allow user to control playback speed by hovering over "playback rate"
button and scrolling on mouse. Clicking on the button will still increment
speed in pre-defined steps, unless the speed is custom.
---
 assets/js/player.js | 55 ++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 50 insertions(+), 5 deletions(-)

diff --git a/assets/js/player.js b/assets/js/player.js
index 16bb2752..6b4f864e 100644
--- a/assets/js/player.js
+++ b/assets/js/player.js
@@ -580,11 +580,29 @@ function toggle_fullscreen() {
 }
 
 function increase_playback_rate(steps) {
-    const maxIndex = options.playbackRates.length - 1;
-    const curIndex = options.playbackRates.indexOf(player.playbackRate());
-    let newIndex = curIndex + steps;
-    newIndex = helpers.clamp(newIndex, 0, maxIndex);
-    player.playbackRate(options.playbackRates[newIndex]);
+    let speed = player.playbackRate();
+
+    // Considering 1/-1 as step against pre-defined speeds, 
+    // otherwise treat as absolute change
+    if (steps == 1 || steps == -1) {
+        // If current speed is not pre-defined, reset it to 1
+        if (!options.playbackRates.includes(speed)) {
+            speed = 1;
+        }
+        else {
+            const maxIndex = options.playbackRates.length - 1;
+            const curIndex = options.playbackRates.indexOf(player.playbackRate());
+            let newIndex = curIndex + steps;
+            newIndex = helpers.clamp(newIndex, 0, maxIndex);
+            speed = options.playbackRates[newIndex]
+        }
+    }
+    else {
+        speed += steps;
+        speed = parseFloat(speed.toFixed(2));
+    }
+
+    player.playbackRate(speed);
 }
 
 addEventListener('keydown', function (e) {
@@ -721,6 +739,33 @@ addEventListener('keydown', function (e) {
     player.on('DOMMouseScroll', mouseScroll);
 }());
 
+(function () {
+    const pEl = document.getElementById('player');
+
+    var speedHover = false;
+    var speedSelector = pEl.querySelector('.vjs-playback-rate');
+    if (speedSelector !== null) {
+        speedSelector.onmouseover = function () { speedHover = true; };
+        speedSelector.onmouseout = function () { speedHover = false; };
+        // Increase speed by a single step when pre-defined, or reset
+        speedSelector.onclick = function() { increase_playback_rate(1); };
+    }
+
+    function mouseScroll(event) {
+        // When controls are disabled, hotkeys will be disabled as well
+        if (!player.controls() || !speedHover) return;
+
+        event.preventDefault();
+        var wheelMove = event.wheelDelta || -event.detail;
+        var speedSign = Math.sign(wheelMove);
+
+        increase_playback_rate(speedSign * 0.10); // increase speed by .10
+    }
+
+    player.on('mousewheel', mouseScroll);
+    player.on('DOMMouseScroll', mouseScroll);
+}());
+
 // Since videojs-share can sometimes be blocked, we defer it until last
 if (player.share) player.share(shareOptions);