From 93055b3bf1679e03a7213e0686783a5fbbf5da94 Mon Sep 17 00:00:00 2001
From: Kendall Garner <17521368+kgarner7@users.noreply.github.com>
Date: Thu, 29 Aug 2024 19:44:24 -0700
Subject: [PATCH] allow disabling web audio

---
 src/i18n/locales/en.json                      |  2 ++
 .../components/audio-player/index.tsx         |  3 ++-
 .../components/playback/audio-settings.tsx    | 23 ++++++++++++++++++-
 .../components/playback/playback-tab.tsx      | 12 ++++++++--
 src/renderer/store/settings.store.ts          |  2 ++
 5 files changed, 38 insertions(+), 4 deletions(-)

diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index f2f9858a..949de67b 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -638,6 +638,8 @@
         "volumeWheelStep_description": "the amount of volume to change when scrolling the mouse wheel on the volume slider",
         "volumeWidth": "volume slider width",
         "volumeWidth_description": "the width of the volume slider",
+        "webAudio": "use web audio",
+        "webAudio_description": "use web audio. this enables advanced features like replaygain. disable if you experience otherwise",
         "windowBarStyle": "window bar style",
         "windowBarStyle_description": "select the style of the window bar",
         "zoom": "zoom percentage",
diff --git a/src/renderer/components/audio-player/index.tsx b/src/renderer/components/audio-player/index.tsx
index 56949f95..3db25a41 100644
--- a/src/renderer/components/audio-player/index.tsx
+++ b/src/renderer/components/audio-player/index.tsx
@@ -69,6 +69,7 @@ export const AudioPlayer = forwardRef(
         const [isTransitioning, setIsTransitioning] = useState(false);
         const audioDeviceId = useSettingsStore((state) => state.playback.audioDeviceId);
         const playback = useSettingsStore((state) => state.playback.mpvProperties);
+        const useWebAudio = useSettingsStore((state) => state.playback.webAudio);
         const { resetSampleRate } = useSettingsStoreActions();
         const playbackSpeed = useSpeed();
 
@@ -129,7 +130,7 @@ export const AudioPlayer = forwardRef(
         );
 
         useEffect(() => {
-            if ('AudioContext' in window) {
+            if (useWebAudio && 'AudioContext' in window) {
                 let context: AudioContext;
 
                 try {
diff --git a/src/renderer/features/settings/components/playback/audio-settings.tsx b/src/renderer/features/settings/components/playback/audio-settings.tsx
index 84cb6364..d1d7e79b 100644
--- a/src/renderer/features/settings/components/playback/audio-settings.tsx
+++ b/src/renderer/features/settings/components/playback/audio-settings.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import { SelectItem } from '@mantine/core';
+import { SelectItem, Switch } from '@mantine/core';
 import isElectron from 'is-electron';
 import { Select, Slider, toast } from '/@/renderer/components';
 import {
@@ -132,6 +132,27 @@ export const AudioSettings = ({ hasFancyAudio }: { hasFancyAudio: boolean }) =>
                 postProcess: 'sentenceCase',
             }),
         },
+        {
+            control: (
+                <Switch
+                    defaultChecked={settings.webAudio}
+                    onChange={(e) => {
+                        setSettings({
+                            playback: { ...settings, webAudio: e.currentTarget.checked },
+                        });
+                    }}
+                />
+            ),
+            description: t('setting.webAudio', {
+                context: 'description',
+                postProcess: 'sentenceCase',
+            }),
+            isHidden: settings.type !== PlaybackType.WEB,
+            note: t('common.restartRequired', { postProcess: 'sentenceCase' }),
+            title: t('setting.webAudio', {
+                postProcess: 'sentenceCase',
+            }),
+        },
         {
             control: (
                 <Slider
diff --git a/src/renderer/features/settings/components/playback/playback-tab.tsx b/src/renderer/features/settings/components/playback/playback-tab.tsx
index c809dc6e..404c9c51 100644
--- a/src/renderer/features/settings/components/playback/playback-tab.tsx
+++ b/src/renderer/features/settings/components/playback/playback-tab.tsx
@@ -4,6 +4,8 @@ import { AudioSettings } from '/@/renderer/features/settings/components/playback
 import { ScrobbleSettings } from '/@/renderer/features/settings/components/playback/scrobble-settings';
 import isElectron from 'is-electron';
 import { LyricSettings } from '/@/renderer/features/settings/components/playback/lyric-settings';
+import { useSettingsStore } from '/@/renderer/store';
+import { PlaybackType } from '/@/renderer/types';
 
 const MpvSettings = lazy(() =>
     import('/@/renderer/features/settings/components/playback/mpv-settings').then((module) => {
@@ -12,9 +14,15 @@ const MpvSettings = lazy(() =>
 );
 
 export const PlaybackTab = () => {
+    const audioType = useSettingsStore((state) => state.playback.type);
+    const useWebAudio = useSettingsStore((state) => state.playback.webAudio);
+
     const hasFancyAudio = useMemo(() => {
-        return isElectron() || 'AudioContext' in window;
-    }, []);
+        return (
+            (isElectron() && audioType === PlaybackType.LOCAL) ||
+            (useWebAudio && 'AudioContext' in window)
+        );
+    }, [audioType, useWebAudio]);
 
     return (
         <Stack spacing="md">
diff --git a/src/renderer/store/settings.store.ts b/src/renderer/store/settings.store.ts
index ff05f918..9c5180e1 100644
--- a/src/renderer/store/settings.store.ts
+++ b/src/renderer/store/settings.store.ts
@@ -265,6 +265,7 @@ export interface SettingsState {
         };
         style: PlaybackStyle;
         type: PlaybackType;
+        webAudio: boolean;
     };
     remote: {
         enabled: boolean;
@@ -439,6 +440,7 @@ const initialState: SettingsState = {
         },
         style: PlaybackStyle.GAPLESS,
         type: PlaybackType.WEB,
+        webAudio: true,
     },
     remote: {
         enabled: false,