mirror of
https://github.com/remvze/moodist.git
synced 2025-12-18 09:24:14 +00:00
fix: allow audio to play in background on iOS (#58)
This commit is contained in:
parent
a071ba04c7
commit
2df0848fc8
2 changed files with 19 additions and 2 deletions
|
|
@ -14,6 +14,7 @@ import styles from './sound.module.css';
|
|||
import type { Sound as SoundType } from '@/data/types';
|
||||
|
||||
import { useKeyboardButton } from '@/hooks/use-keyboard-button';
|
||||
import { BrowserDetect } from '@/helpers/browser-detect';
|
||||
|
||||
interface SoundProps extends SoundType {
|
||||
functional: boolean;
|
||||
|
|
@ -43,7 +44,12 @@ export const Sound = forwardRef<HTMLDivElement, SoundProps>(function Sound(
|
|||
|
||||
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(() => {
|
||||
if (locked) return;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
export class BrowserDetect {
|
||||
private static _isSafari: boolean | undefined;
|
||||
private static _isIOS: boolean | undefined;
|
||||
|
||||
public static isSafari(): boolean {
|
||||
if (typeof BrowserDetect._isSafari !== 'undefined') {
|
||||
return BrowserDetect._isSafari;
|
||||
}
|
||||
|
||||
|
||||
// Source: https://github.com/goldfire/howler.js/blob/v2.2.4/src/howler.core.js#L270
|
||||
BrowserDetect._isSafari =
|
||||
navigator.userAgent.indexOf('Safari') !== -1 &&
|
||||
|
|
@ -13,4 +14,14 @@ export class BrowserDetect {
|
|||
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue