diff --git a/packages/euterpe-web-test/src/db.ts b/packages/euterpe-web-test/src/db.ts index 7dcf606..05a44f7 100644 --- a/packages/euterpe-web-test/src/db.ts +++ b/packages/euterpe-web-test/src/db.ts @@ -37,26 +37,26 @@ db.add([ duration: 252, name: "Star", remix_artists: [new Ref(RefTo.Artists, 5)], - url: new URL("http://127.0.0.1:4200/Machinedrum, Tanerelle & Mono Poly - Star (IMANU Remix) final.mp3") + url: new URL("http://" + window.location.host + "/Machinedrum, Tanerelle & Mono Poly - Star (IMANU Remix) final.mp3") }), new Song({ //If you don't like guessing the IDs, then this is also a way to do it artists: [new Ref(RefTo.Artists, db.artists.find((a) => a.name == "Jamie xx")!.id!)], duration: 331, name: "Sleep Sound", - url: new URL("http://127.0.0.1:4200/Jamie xx - Sleep Sound.mp3") + url: new URL("http://" + window.location.host + "/Jamie xx - Sleep Sound.mp3") }), new Song({ artists: [new Ref(RefTo.Artists, 1)], duration: 75, name: "wish", - url: new URL("http://127.0.0.1:4200/janz - wish.mp3") + url: new URL("http://" + window.location.host + "/janz - wish.mp3") }), new Song({ artists: [new Ref(RefTo.Artists, 10)], duration: 4 * 60 + 5, name: "サニーボーイ・ラプソディ", - url: new URL("http://127.0.0.1:4200/16.サニーボーイ・ラプソディ.ogg") + url: new URL("http://" + window.location.host + "/16.サニーボーイ・ラプソディ.ogg") }) ]) diff --git a/packages/euterpe-web-test/src/main.ts b/packages/euterpe-web-test/src/main.ts index 634432d..60e8f3f 100644 --- a/packages/euterpe-web-test/src/main.ts +++ b/packages/euterpe-web-test/src/main.ts @@ -1,85 +1,69 @@ import { db } from "./db"; -import { EuterpeBuilder, Euterpe } from "@euterpe.js/euterpe"; +import { EuterpeBuilder } from "@euterpe.js/euterpe"; let is_seeking = false // document.addEventListener("click", start, { once: true }) -let euterpe: Euterpe -maybe_start() -function maybe_start() { - if (euterpe) return +const euterpe = new EuterpeBuilder(document.querySelector("#audio")!, db) + .build() +add_library_to_dom() - euterpe = new EuterpeBuilder(document.querySelector("#audio")!, db) - .build() - add_library_to_dom() - euterpe.preload_song_async(0).then(() => { - document.querySelector("#text-playing")!.innerHTML = euterpe.format_current_song() - }, (e) => console.log(e + " Failed to preload")) +euterpe.preload_song_async(0).then(() => { + document.querySelector("#text-playing")!.innerHTML = euterpe.format_current_song() +}, (e) => console.log(e + " Failed to preload")) - document.querySelector("#seek")?.addEventListener("mouseup", (e) => { - euterpe.try_seek_async(e.target?.valueAsNumber).then(() => { console.log("seeked to " + e.target?.valueAsNumber) }, () => { - alert("Failed seeking! " + e) - }) - is_seeking = false +document.querySelector("#seek")?.addEventListener("mouseup", (e) => { + euterpe.try_seek_async(e.target?.valueAsNumber).then(() => { console.log("seeked to " + e.target?.valueAsNumber) }, () => { + alert("Failed seeking! " + e) }) + is_seeking = false +}) - // Subscriptions to AudioContext changes, eg. time.. - euterpe.on_duration_formatted((time) => { - document.querySelector("#duration")!.innerHTML = time - document.querySelector("#seek")!.max = "" + euterpe.current_song_duration - }) +// Subscriptions to AudioContext changes, eg. time.. +euterpe.on_duration_formatted((time) => { + document.querySelector("#duration")!.innerHTML = time + document.querySelector("#seek")!.max = "" + euterpe.current_song_duration +}) - euterpe.on_time_tick_formatted((time) => { - document.querySelector("#current")!.innerHTML = time - }) - euterpe.on_time_tick((time) => { - if (is_seeking) return - document.querySelector("#seek")!.value = "" + time - dev_queue_update() - dev_history_update() - }) - - -} +euterpe.on_time_tick_formatted((time) => { + document.querySelector("#current")!.innerHTML = time +}) +euterpe.on_time_tick((time) => { + if (is_seeking) return + document.querySelector("#seek")!.value = "" + time + dev_queue_update() + dev_history_update() +}) document.querySelector("#previous")?.addEventListener("click", () => { - maybe_start() euterpe.previous_song_async().then(() => { document.querySelector("#text-playing")!.innerHTML = euterpe.format_current_song() }, (e) => alert(e + "Failed to change song")) }) document.querySelector("#next")?.addEventListener("click", () => { - maybe_start() euterpe.next_song_async().then(() => { document.querySelector("#text-playing")!.innerHTML = euterpe.format_current_song() }, (e) => alert(e + "Failed to change song")) }) document.querySelector("#play")?.addEventListener("click", () => { - maybe_start() euterpe.play_async().catch((e) => alert("Failed to play, " + e)) }) document.querySelector("#pause")?.addEventListener("click", () => { - maybe_start() euterpe.pause() }) document.querySelector("#mute")?.addEventListener("click", () => { - maybe_start() euterpe.mute() }) document.querySelector("#unmute")?.addEventListener("click", () => { - maybe_start() euterpe.unmute() }) document.querySelector("#toggle-mute")?.addEventListener("click", () => { - maybe_start() euterpe.mute_toggle() }) document.querySelector("#toggle-play")?.addEventListener("click", () => { - maybe_start() euterpe.play_toggle_async().catch((e) => alert("failed to toggle pause/play!" + e)) }) document.querySelector("#volume")?.addEventListener("input", (e) => { - maybe_start() euterpe.change_volume(e.target?.valueAsNumber) }) //disables time updates so the time slider doesn't slip away from user