diff --git a/demo/audio/src/index.ts b/demo/audio/src/index.ts index dc549c1..e02c86c 100644 --- a/demo/audio/src/index.ts +++ b/demo/audio/src/index.ts @@ -9,8 +9,9 @@ const buttonPause = document.getElementById('bt-pause'); const buttonStop = document.getElementById('bt-stop'); const audio: AudioType = Audio({ file: song, - loop: false, + loop: true, volume: getVolume(range), + preload: true, }); audio.on('end', () => { diff --git a/src/audio/Audio.ts b/src/audio/Audio.ts index 601fcff..b4ea46c 100644 --- a/src/audio/Audio.ts +++ b/src/audio/Audio.ts @@ -5,7 +5,7 @@ import EventHandler from '../EventHandler'; import initializeSource from './initializeSource'; import decodeAudioData from './decodeAudioData'; import { AudioPropType, AudioEventType, AudioType } from './types'; -import { getBuffer } from '../utils'; +import { getBuffer, preloadFiles } from '../utils'; // if audiocontext is initialized before a user gesture on the page, its // state become `suspended` by default. once audiocontext.state is `suspended` @@ -20,6 +20,7 @@ const Audio = ({ volume = 1, autoPlay = false, loop = false, + preload = false, }: AudioPropType): AudioType => { const audioCtx = AudioCtx(); const states = { ...globalStates }; @@ -43,6 +44,10 @@ const Audio = ({ .catch(console.error); }; + if (preload) { + preloadFiles([file], 1); + } + return { play() { if (states.hasStarted) { diff --git a/src/audio/types.ts b/src/audio/types.ts index 58b3acd..cb89c65 100644 --- a/src/audio/types.ts +++ b/src/audio/types.ts @@ -3,6 +3,7 @@ export type AudioPropType = { volume?: number; autoPlay?: boolean; loop?: boolean; + preload?: boolean; }; export type AudioEventType = 'ready' | 'start' | 'state' | 'end';