Add option to disable audio in bg

materialious/src/lib/Player.svelte

@@ -25,6 +25,7 @@
 		instanceStore,
 		miniPlayerSrcStore,
 		playerAlwaysLoopStore,
+		playerAndroidBgPlayer,
 		playerAutoPlayStore,
 		playerProxyVideosStore,
 		playerSavePlaybackPositionStore,
@@ -340,7 +341,7 @@
 				await loadPlayerPos();
 			});
 
-			if (Capacitor.getPlatform() === 'android') {
+			if (Capacitor.getPlatform() === 'android' && get(playerAndroidBgPlayer)) {
 				const highestBitrateAudio = data.video.adaptiveFormats
 					.filter((format) => format.type.startsWith('audio/'))
 					.reduce((prev, current) => {
@@ -368,11 +369,13 @@
 				});
 
 				AudioPlayer.onAppLosesFocus(audioId, async () => {
-					await AudioPlayer.play(audioId);
-					await AudioPlayer.seek({
-						...audioId,
-						timeInSeconds: Math.round(player.currentTime)
-					});
+					if (!player.paused) {
+						await AudioPlayer.play(audioId);
+						await AudioPlayer.seek({
+							...audioId,
+							timeInSeconds: Math.round(player.currentTime)
+						});
+					}
 				});
 
 				await AudioPlayer.initialize(audioId);

materialious/src/lib/Settings.svelte

@@ -22,6 +22,7 @@
 		interfaceRegionStore,
 		interfaceSearchSuggestionsStore,
 		playerAlwaysLoopStore,
+		playerAndroidBgPlayer,
 		playerAutoPlayStore,
 		playerAutoplayNextByDefaultStore,
 		playerListenByDefaultStore,
@@ -259,40 +260,6 @@
 	<div class="settings">
 		<h6>{$_('layout.player.title')}</h6>
 
-		{#if Capacitor.isNativePlatform()}
-			<div class="field no-margin">
-				<nav class="no-padding">
-					<div class="max">
-						<div>{$_('layout.player.youtubeJsAlways')}</div>
-					</div>
-					<label class="switch">
-						<input
-							type="checkbox"
-							bind:checked={$playerYouTubeJsAlways}
-							on:click={() => playerYouTubeJsAlways.set(!$playerYouTubeJsAlways)}
-						/>
-						<span></span>
-					</label>
-				</nav>
-			</div>
-
-			<div class="field no-margin">
-				<nav class="no-padding">
-					<div class="max">
-						<div>{$_('layout.player.youtubeJsFallback')}</div>
-					</div>
-					<label class="switch">
-						<input
-							type="checkbox"
-							bind:checked={$playerYouTubeJsFallback}
-							on:click={() => playerYouTubeJsFallback.set(!$playerYouTubeJsFallback)}
-						/>
-						<span></span>
-					</label>
-				</nav>
-			</div>
-		{/if}
-
 		<div class="field no-margin">
 			<nav class="no-padding">
 				<div class="max">
@@ -341,6 +308,24 @@
 			</nav>
 		</div>
 
+		{#if Capacitor.getPlatform() === 'android'}
+			<div class="field no-margin">
+				<nav class="no-padding">
+					<div class="max">
+						<div>{$_('layout.player.backgroundPlay')}</div>
+					</div>
+					<label class="switch">
+						<input
+							type="checkbox"
+							bind:checked={$playerAndroidBgPlayer}
+							on:click={() => playerAndroidBgPlayer.set(!$playerAndroidBgPlayer)}
+						/>
+						<span></span>
+					</label>
+				</nav>
+			</div>
+		{/if}
+
 		{#if Capacitor.isNativePlatform()}
 			<div class="field no-margin">
 				<nav class="no-padding">
@@ -439,6 +424,40 @@
 				</label>
 			</nav>
 		</div>
+
+		{#if Capacitor.isNativePlatform()}
+			<div class="field no-margin">
+				<nav class="no-padding">
+					<div class="max">
+						<div>{$_('layout.player.youtubeJsAlways')}</div>
+					</div>
+					<label class="switch">
+						<input
+							type="checkbox"
+							bind:checked={$playerYouTubeJsAlways}
+							on:click={() => playerYouTubeJsAlways.set(!$playerYouTubeJsAlways)}
+						/>
+						<span></span>
+					</label>
+				</nav>
+			</div>
+
+			<div class="field no-margin">
+				<nav class="no-padding">
+					<div class="max">
+						<div>{$_('layout.player.youtubeJsFallback')}</div>
+					</div>
+					<label class="switch">
+						<input
+							type="checkbox"
+							bind:checked={$playerYouTubeJsFallback}
+							on:click={() => playerYouTubeJsFallback.set(!$playerYouTubeJsFallback)}
+						/>
+						<span></span>
+					</label>
+				</nav>
+			</div>
+		{/if}
 	</div>
 
 	<div class="settings">

materialious/src/lib/store.ts

@@ -40,6 +40,7 @@ export const playerAutoplayNextByDefaultStore = persisted('autoplayNextByDefault
 export const playerMiniPlayerStore = persisted('miniPlayer', true);
 export const playerYouTubeJsFallback = persisted('youTubeJsFallback', true);
 export const playerYouTubeJsAlways = persisted('youTubeJsAlways', false);
+export const playerAndroidBgPlayer = persisted('androidBgPlayer', true);
 
 export const returnYtDislikesStore = persisted('returnYtDislikes', false);
 export const returnYTDislikesInstanceStore: Writable<string | null | undefined> = persisted(