From 2d2b938a48f24c08ebd141bfe93222fbe94fd816 Mon Sep 17 00:00:00 2001
From: Gelaechter <30231932+gelaechter@users.noreply.github.com>
Date: Sun, 3 Apr 2022 05:08:08 +0200
Subject: [PATCH] Make volume scaling logarithmic

---
 src/components/debug/DebugWindow.tsx |  1 +
 src/components/player/Player.tsx     | 16 ++++++++--------
 src/components/player/PlayerBar.tsx  |  4 ++--
 src/hooks/usePlayerControls.ts       |  4 ++--
 4 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/src/components/debug/DebugWindow.tsx b/src/components/debug/DebugWindow.tsx
index 93743ab..b00b210 100644
--- a/src/components/debug/DebugWindow.tsx
+++ b/src/components/debug/DebugWindow.tsx
@@ -132,6 +132,7 @@ const DebugWindow = ({ ...rest }) => {
             </span>
           </li>
           <li>volume (global): {playQueue.volume.toFixed(2)}</li>
+          <li>actual volume: {(playQueue.volume ** 2).toFixed(2)}</li>
           <li>volumeFade: {playQueue.volumeFade ? 'true' : 'false'}</li>
           <li>shuffle: {playQueue.shuffle ? 'true' : 'false'}</li>
           <li>repeat: {playQueue.repeat}</li>
diff --git a/src/components/player/Player.tsx b/src/components/player/Player.tsx
index e6b1056..47c6354 100644
--- a/src/components/player/Player.tsx
+++ b/src/components/player/Player.tsx
@@ -50,7 +50,7 @@ const gaplessListenHandler = (
       return;
     }
 
-    nextPlayerRef.current.audioEl.current.volume = playQueue.volume;
+    nextPlayerRef.current.audioEl.current.volume = playQueue.volume ** 2;
     nextPlayerRef.current.audioEl.current.play();
   }
 
@@ -175,8 +175,8 @@ const listenHandler = (
             : playQueue.volume;
 
         if (player === 1) {
-          currentPlayerRef.current.audioEl.current.volume = currentPlayerVolume;
-          nextPlayerRef.current.audioEl.current.volume = nextPlayerVolume;
+          currentPlayerRef.current.audioEl.current.volume = currentPlayerVolume ** 2;
+          nextPlayerRef.current.audioEl.current.volume = nextPlayerVolume ** 2;
           if (debug) {
             dispatch(
               setFadeData({
@@ -194,8 +194,8 @@ const listenHandler = (
             );
           }
         } else {
-          currentPlayerRef.current.audioEl.current.volume = currentPlayerVolume;
-          nextPlayerRef.current.audioEl.current.volume = nextPlayerVolume;
+          currentPlayerRef.current.audioEl.current.volume = currentPlayerVolume ** 2;
+          nextPlayerRef.current.audioEl.current.volume = nextPlayerVolume ** 2;
           if (debug) {
             dispatch(
               setFadeData({
@@ -214,7 +214,7 @@ const listenHandler = (
           }
         }
       } else {
-        nextPlayerRef.current.audioEl.current.volume = playQueue.volume;
+        nextPlayerRef.current.audioEl.current.volume = playQueue.volume ** 2;
       }
     }
   }
@@ -719,10 +719,10 @@ const Player = ({ currentEntryList, muted, children }: any, ref: any) => {
   useEffect(() => {
     if (!playQueue.isFading || !(playQueue.fadeDuration === 0)) {
       if (playQueue.currentPlayer === 1) {
-        player1Ref.current.audioEl.current.volume = playQueue.volume;
+        player1Ref.current.audioEl.current.volume = playQueue.volume ** 2;
         player2Ref.current.audioEl.current.volume = 0;
       } else {
-        player2Ref.current.audioEl.current.volume = playQueue.volume;
+        player2Ref.current.audioEl.current.volume = playQueue.volume ** 2;
         player1Ref.current.audioEl.current.volume = 0;
       }
     }
diff --git a/src/components/player/PlayerBar.tsx b/src/components/player/PlayerBar.tsx
index 337b964..2b36e36 100644
--- a/src/components/player/PlayerBar.tsx
+++ b/src/components/player/PlayerBar.tsx
@@ -242,9 +242,9 @@ const PlayerBar = () => {
       if (isDraggingVolume) {
         dispatch(setVolume(localVolume));
         if (playQueue.currentPlayer === 1) {
-          playersRef.current.player1.audioEl.current.volume = localVolume;
+          playersRef.current.player1.audioEl.current.volume = localVolume ** 2;
         } else {
-          playersRef.current.player2.audioEl.current.volume = localVolume;
+          playersRef.current.player2.audioEl.current.volume = localVolume ** 2;
         }
 
         settings.setSync('volume', localVolume);
diff --git a/src/hooks/usePlayerControls.ts b/src/hooks/usePlayerControls.ts
index a67a17d..26b4e11 100644
--- a/src/hooks/usePlayerControls.ts
+++ b/src/hooks/usePlayerControls.ts
@@ -63,7 +63,7 @@ const usePlayerControls = (
         dispatch(fixPlayer2Index());
       } else if (currentPlayer === 1) {
         playersRef.current.player1.audioEl.current.currentTime = 0;
-        playersRef.current.player1.audioEl.current.volume = playQueue.volume;
+        playersRef.current.player1.audioEl.current.volume = playQueue.volume ** 2;
 
         // Reset the alt player if reset during fade
         playersRef.current.player2.audioEl.current.currentTime = 0;
@@ -86,7 +86,7 @@ const usePlayerControls = (
         }
       } else {
         playersRef.current.player2.audioEl.current.currentTime = 0;
-        playersRef.current.player2.audioEl.current.volume = playQueue.volume;
+        playersRef.current.player2.audioEl.current.volume = playQueue.volume ** 2;
 
         // Reset the alt player if reset during fade
         playersRef.current.player1.audioEl.current.currentTime = 0;