hax/moodist
1
0
Fork 0
mirror of https://github.com/remvze/moodist.git synced 2025-12-18 09:24:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: allow audio to play in background on iOS (#58)

Browse source
This commit is contained in:
anish 2025-08-22 08:13:44 +01:00
parent a071ba04c7
commit 2df0848fc8
2 changed files with 19 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/sounds/sound/sound.tsx
View file

@ -14,6 +14,7 @@ import styles from './sound.module.css';
import type { Sound as SoundType } from '@/data/types'; import type { Sound as SoundType } from '@/data/types';
import { useKeyboardButton } from '@/hooks/use-keyboard-button'; import { useKeyboardButton } from '@/hooks/use-keyboard-button';
import { BrowserDetect } from '@/helpers/browser-detect';
interface SoundProps extends SoundType { interface SoundProps extends SoundType {
functional: boolean; functional: boolean;
@ -43,7 +44,12 @@ export const Sound = forwardRef<HTMLDivElement, SoundProps>(function Sound(
const isLoading = useLoadingStore(state => state.loaders[src]); const isLoading = useLoadingStore(state => state.loaders[src]);
const sound = useSound(src, { loop: true, volume: adjustedVolume }); const sound = useSound(
src,
{ loop: true, volume: adjustedVolume },
BrowserDetect.isIOS()
);
useEffect(() => { useEffect(() => {
if (locked) return; if (locked) return;

13
src/helpers/browser-detect.ts
View file

@ -1,11 +1,12 @@
export class BrowserDetect { export class BrowserDetect {
private static _isSafari: boolean | undefined; private static _isSafari: boolean | undefined;
private static _isIOS: boolean | undefined;
public static isSafari(): boolean { public static isSafari(): boolean {
if (typeof BrowserDetect._isSafari !== 'undefined') { if (typeof BrowserDetect._isSafari !== 'undefined') {
return BrowserDetect._isSafari; return BrowserDetect._isSafari;
} }
// Source: https://github.com/goldfire/howler.js/blob/v2.2.4/src/howler.core.js#L270 // Source: https://github.com/goldfire/howler.js/blob/v2.2.4/src/howler.core.js#L270
BrowserDetect._isSafari = BrowserDetect._isSafari =
navigator.userAgent.indexOf('Safari') !== -1 && navigator.userAgent.indexOf('Safari') !== -1 &&
@ -13,4 +14,14 @@ export class BrowserDetect {
return BrowserDetect._isSafari; return BrowserDetect._isSafari;
} }
/** True on iPhone/iPad/iPod (covers iPadOS-on-Mac UA quirk). */
public static isIOS(): boolean {
if (typeof BrowserDetect._isIOS !== 'undefined') return BrowserDetect._isIOS;
if (typeof navigator === 'undefined') return false;
const ua = navigator.userAgent || '';
const touchMac = /\bMacintosh\b/.test(ua) && 'ontouchend' in (window as any);
BrowserDetect._isIOS = /\b(iPad|iPhone|iPod)\b/i.test(ua) || touchMac;
return BrowserDetect._isIOS;
}
} }