diff --git a/packages/core/examples/vite-vanilla-repl-cm6/strudel.js b/packages/core/examples/vite-vanilla-repl-cm6/strudel.js index a1e999ee..efd899ea 100644 --- a/packages/core/examples/vite-vanilla-repl-cm6/strudel.js +++ b/packages/core/examples/vite-vanilla-repl-cm6/strudel.js @@ -1,38 +1,29 @@ -import { controls, repl, evalScope } from "@strudel.cycles/core"; -import { transpiler } from "@strudel.cycles/transpiler"; -import { - getAudioContext, - webaudioOutput, - initAudioOnFirstClick, - registerSynthSounds -} from "@strudel.cycles/webaudio"; -import { registerSoundfonts } from "@strudel.cycles/soundfonts"; +import { getAudioContext, webaudioOutput, initAudioOnFirstClick, registerSynthSounds } from '@strudel.cycles/webaudio'; const initAudio = initAudioOnFirstClick(); const ctx = getAudioContext(); -const loadModules = (scope = {}) => - evalScope( +export async function initStrudel(options = {}) { + const [{ controls, repl, evalScope }, { registerSoundfonts }, { transpiler }] = await Promise.all([ + import('@strudel.cycles/core'), + import('@strudel.cycles/soundfonts'), + import('@strudel.cycles/transpiler'), + ]); + + const loadModules = evalScope( controls, - import("@strudel.cycles/core"), - import("@strudel.cycles/mini"), - import("@strudel.cycles/tonal"), - import("@strudel.cycles/webaudio"), - scope + import('@strudel.cycles/core'), + import('@strudel.cycles/mini'), + import('@strudel.cycles/tonal'), + import('@strudel.cycles/webaudio'), ); -export async function initStrudel(options = {}) { - await Promise.all([ - initAudio, - loadModules(), - registerSynthSounds(), - registerSoundfonts() - ]); + await Promise.all([initAudio, loadModules, registerSynthSounds(), registerSoundfonts()]); return repl({ defaultOutput: webaudioOutput, getTime: () => ctx.currentTime, transpiler, - ...options + ...options, }); } diff --git a/packages/core/examples/vite-vanilla-repl-cm6/style.css b/packages/core/examples/vite-vanilla-repl-cm6/style.css index fed3f86a..21f011a0 100644 --- a/packages/core/examples/vite-vanilla-repl-cm6/style.css +++ b/packages/core/examples/vite-vanilla-repl-cm6/style.css @@ -4,15 +4,6 @@ html { height: 100%; } -#editor { - overflow: auto; - height: 100%; -} - -.cm-editor { - height: 100%; -} - main { height: 100%; display: flex; @@ -21,6 +12,16 @@ main { .container { flex-grow: 1; + max-height: 100%; + position: relative; +} + +#editor { + overflow: auto; +} + +.cm-editor { + height: 100%; } #roll {