updated to return promise on first click

This commit is contained in:
Jade (Rose) Rowland 2024-05-30 18:52:28 -04:00
parent c0c54c21e3
commit af3d32a493
2 changed files with 16 additions and 14 deletions

View File

@ -64,15 +64,18 @@ export async function initAudio(options = {}) {
} }
} }
} }
let audioReady = false;
export async function initAudioOnFirstClick(options) { export async function initAudioOnFirstClick(options) {
return new Promise((resolve) => { if (!audioReady) {
document.addEventListener('click', async function listener() { audioReady = new Promise((resolve) => {
await initAudio(options); document.addEventListener('click', async function listener() {
resolve(); await initAudio(options);
document.removeEventListener('click', listener); resolve();
document.removeEventListener('click', listener);
});
}); });
}); }
return audioReady;
} }
let delays = {}; let delays = {};

View File

@ -15,6 +15,7 @@ import {
resetGlobalEffects, resetGlobalEffects,
resetLoadedSounds, resetLoadedSounds,
isAudioInitialized, isAudioInitialized,
initAudioOnFirstClick,
} from '@strudel/webaudio'; } from '@strudel/webaudio';
import { defaultAudioDeviceName } from '../settings.mjs'; import { defaultAudioDeviceName } from '../settings.mjs';
import { getAudioDevices, setAudioDevice } from './util.mjs'; import { getAudioDevices, setAudioDevice } from './util.mjs';
@ -43,8 +44,10 @@ import { getMetadata } from '../metadata_parser';
const { latestCode } = settingsMap.get(); const { latestCode } = settingsMap.get();
let modulesLoading, presets, drawContext, clearCanvas, isIframe; let modulesLoading, presets, drawContext, clearCanvas, isIframe, audioReady;
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
audioReady = initAudioOnFirstClick();
modulesLoading = loadModules(); modulesLoading = loadModules();
presets = prebake(); presets = prebake();
drawContext = getDrawContext(); drawContext = getDrawContext();
@ -83,16 +86,12 @@ export function Repl({ embedded = false }) {
onUpdateState: (state) => { onUpdateState: (state) => {
setReplState({ ...state }); setReplState({ ...state });
}, },
onToggle: async (playing) => { onToggle: (playing) => {
if (!playing) { if (!playing) {
clearHydra(); clearHydra();
} }
}, },
beforeEval: async () => { beforeEval: () => audioReady,
if (!isAudioInitialized()) {
await initAudio();
}
},
afterEval: (all) => { afterEval: (all) => {
const { code } = all; const { code } = all;
setLatestCode(code); setLatestCode(code);