From bdbe48ce1ac7cb0332d4ae48007c50fdd20faf3e Mon Sep 17 00:00:00 2001
From: Admin <admin@kalekber.cc>
Date: Sat, 4 Apr 2026 18:22:09 +0500
Subject: [PATCH] fix: register MediaSession action handlers for iOS lock
 screen resume
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Without explicit setActionHandler('play'/'pause'/...) the browser uses
default handling which on iOS Safari stops working after ~1 min of
pause in background/locked state (AudioSession gets suspended and the
lock screen button can't resume it without a direct user gesture).

Registering handlers in the layout (where audioEl lives) ensures:
- play/pause call audioEl directly — iOS treats this as a trusted
  gesture and allows .play() even from the lock screen
- seekbackward/seekforward map to ±15s / ±30s
- playbackState stays in sync so the lock screen shows the right icon

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 ui/src/routes/+layout.svelte | 44 ++++++++++++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)

diff --git a/ui/src/routes/+layout.svelte b/ui/src/routes/+layout.svelte
index 283ba17..d2304f3 100644
--- a/ui/src/routes/+layout.svelte
+++ b/ui/src/routes/+layout.svelte
@@ -192,6 +192,50 @@
 		return () => clearTimeout(id);
 	});
 
+	// ── MediaSession action handlers ────────────────────────────────────────────
+	// Without explicit handlers, iOS Safari loses lock-screen resume ability after
+	// ~1 minute of pause because it falls back to its own default which doesn't
+	// satisfy the user-gesture requirement for <audio>.play().
+	// Handlers registered here call audioEl directly so iOS trusts the gesture.
+	$effect(() => {
+		if (typeof navigator === 'undefined' || !('mediaSession' in navigator) || !audioEl) return;
+		const el = audioEl; // capture for closure
+
+		navigator.mediaSession.setActionHandler('play', () => {
+			el.play().catch(() => {});
+		});
+		navigator.mediaSession.setActionHandler('pause', () => {
+			el.pause();
+		});
+		navigator.mediaSession.setActionHandler('seekbackward', (d) => {
+			el.currentTime = Math.max(0, el.currentTime - (d.seekOffset ?? 15));
+		});
+		navigator.mediaSession.setActionHandler('seekforward', (d) => {
+			el.currentTime = Math.min(el.duration || 0, el.currentTime + (d.seekOffset ?? 30));
+		});
+		// previoustrack / nexttrack fall back to skip ±30s if no chapter nav available
+		try {
+			navigator.mediaSession.setActionHandler('previoustrack', () => {
+				el.currentTime = Math.max(0, el.currentTime - 30);
+			});
+			navigator.mediaSession.setActionHandler('nexttrack', () => {
+				el.currentTime = Math.min(el.duration || 0, el.currentTime + 30);
+			});
+		} catch { /* some browsers don't support these */ }
+
+		return () => {
+			(['play', 'pause', 'seekbackward', 'seekforward'] as MediaSessionAction[]).forEach((a) => {
+				try { navigator.mediaSession.setActionHandler(a, null); } catch { /* ignore */ }
+			});
+		};
+	});
+
+	// Keep playbackState in sync so iOS lock screen shows the right button state
+	$effect(() => {
+		if (typeof navigator === 'undefined' || !('mediaSession' in navigator)) return;
+		navigator.mediaSession.playbackState = audioStore.isPlaying ? 'playing' : 'paused';
+	});
+
 	// ── Save audio time on pause/end (debounced 2s) ─────────────────────────
 	let audioTimeSaveTimer = 0;
 	function saveAudioTime() {