From ac03d7f8176daaf655dcabf768f2e7753cf78cea Mon Sep 17 00:00:00 2001
From: Huang Xin <chrox.huang@gmail.com>
Date: Thu, 23 Jan 2025 02:20:59 +0100
Subject: [PATCH] Loop silent audio to unblock iOS web audio in silent mode
 (#223)

---
 .../src/app/reader/components/tts/TTSControl.tsx           | 7 +++++--
 apps/readest-app/src/utils/misc.ts                         | 4 ++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/apps/readest-app/src/app/reader/components/tts/TTSControl.tsx b/apps/readest-app/src/app/reader/components/tts/TTSControl.tsx
index 27fe2b56..ff267284 100644
--- a/apps/readest-app/src/app/reader/components/tts/TTSControl.tsx
+++ b/apps/readest-app/src/app/reader/components/tts/TTSControl.tsx
@@ -8,6 +8,7 @@ import { TTSController, SILENCE_DATA } from '@/services/tts';
 import { getPopupPosition, Position } from '@/utils/sel';
 import { eventDispatcher } from '@/utils/event';
 import { parseSSMLLang } from '@/utils/ssml';
+import { getOSPlatform } from '@/utils/misc';
 import { throttle } from '@/utils/ui';
 import { isPWA } from '@/services/environment';
 import Popup from '@/components/Popup';
@@ -43,7 +44,7 @@ const TTSControl = () => {
     const audio = document.createElement('audio');
     audio.setAttribute('x-webkit-airplay', 'deny');
     audio.preload = 'auto';
-    audio.loop = false;
+    audio.loop = true;
     audio.src = SILENCE_DATA;
     audio.play();
   };
@@ -92,7 +93,9 @@ const TTSControl = () => {
     setShowIndicator(true);
 
     try {
-      unblockAudio();
+      if (getOSPlatform() === 'ios') {
+        unblockAudio();
+      }
       const ttsController = new TTSController(view);
       await ttsController.init();
       await ttsController.initViewTTS();
diff --git a/apps/readest-app/src/utils/misc.ts b/apps/readest-app/src/utils/misc.ts
index b3801a97..60b83cdc 100644
--- a/apps/readest-app/src/utils/misc.ts
+++ b/apps/readest-app/src/utils/misc.ts
@@ -40,11 +40,11 @@ export const getUserLocale = (lang: string): string | undefined => {
 export const getOSPlatform = () => {
   const userAgent = navigator.userAgent.toLowerCase();
 
+  if (/iphone|ipad|ipod/.test(userAgent)) return 'ios';
+  if (userAgent.includes('android')) return 'android';
   if (userAgent.includes('macintosh') || userAgent.includes('mac os x')) return 'macos';
   if (userAgent.includes('windows nt')) return 'windows';
   if (userAgent.includes('linux')) return 'linux';
-  if (/iphone|ipad|ipod/.test(userAgent)) return 'ios';
-  if (userAgent.includes('android')) return 'android';
 
   return '';
 };