summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorLeah (ctucx) <leah@ctu.cx>2021-03-07 13:36:43 +0100
committerLeah (ctucx) <leah@ctu.cx>2021-03-07 13:36:43 +0100
commit65cbe3ee925861738d403c4ed6d5c866983137ff (patch)
tree24347b45bed3766e2b9e33dfcd6a1d4376b9b5eb
parent7b9c1e733b607af2e089421d929a3cbf3f1deaab (diff)
downloadwebmusic-nginx-65cbe3ee925861738d403c4ed6d5c866983137ff.tar.gz
webmusic-nginx-65cbe3ee925861738d403c4ed6d5c866983137ff.tar.bz2
webmusic-nginx-65cbe3ee925861738d403c4ed6d5c866983137ff.zip
webmusic.js: replace howler with the native Audio() element
-rw-r--r--webmusic.js73
1 files changed, 34 insertions, 39 deletions
diff --git a/webmusic.js b/webmusic.js
index 6f9e166..242c8a4 100644
--- a/webmusic.js
+++ b/webmusic.js
@@ -4,15 +4,7 @@ let continuelist = true;
let total = 0;
let index = 0;
-let sound = new Howl({
- src: [''],
- format: "mp3",
- html5: true
-});
-
-setInterval(function () {
- updateState();
-}, 1000);
+let sound = new Audio();
window.onload = function () {
initState();
@@ -51,15 +43,15 @@ window.onkeyup = function (event) {
break;
case "ArrowLeft":
- if (sound.seek() < 10) {
- sound.seek(0);
+ if (sound.currentTime < 10) {
+ sound.currentTime = 0;
} else {
- sound.seek(sound.seek()-10);
+ sound.currentTime = sound.currentTime-10;
}
break;
case "ArrowRight":
- sound.seek(sound.seek()+10);
+ sound.currentTime = sound.currentTime+10;
break;
case "Escape":
@@ -93,10 +85,10 @@ function initState() {
}
function togglePlayback() {
- if (sound.playing()) {
- sound.pause();
- } else {
+ if (sound.paused) {
sound.play();
+ } else {
+ sound.pause();
}
}
@@ -120,44 +112,46 @@ function playSong(id) {
index = element.id;
- sound.stop();
- sound.unload();
- sound = null;
- delete sound;
-
- sound = new Howl({
- src: [element.href],
- html5: true
- });
+ sound.pause()
+ sound.src = element.href;
setState("loading");
- sound.play();
- sound.loop(repeat);
+ sound.load();
+
+ sound.loop = repeat;
element.classList.add("playing");
- sound.on("play", function () {
+ sound.addEventListener("canplay", function () {
+ sound.play();
+ });
+
+ sound.addEventListener("play", function () {
setState("playing");
});
- sound.on("loaderror", function () {
- setState("error loading track")
+
+ sound.addEventListener("pause", function () {
+ setState("paused");
});
- sound.on("playerror", function () {
- setState("error opening audio device")
+
+ sound.addEventListener("error", function () {
+ setState("error loading track");
});
- sound.on("end", function () {
+
+ sound.addEventListener("ended", function () {
setState("idle");
- nextTrack()
+ nextTrack();
});
- sound.on("pause", function () {
- setState("paused")
+
+ sound.addEventListener("timeupdate", function () {
+ updateState();
});
}
function toggleRepeat() {
repeat = !repeat;
continuelist = !repeat;
- sound.loop(repeat);
+ sound.loop = repeat;
updateState();
}
@@ -169,8 +163,9 @@ function toggleContinue() {
function updateState() {
let statestr = "[";
statestr += gstate;
- if (sound.playing()) {
- statestr += " " + formatTime(Math.round(sound.seek())) + "/" + formatTime(Math.round(sound.duration()));
+
+ if (!sound.paused) {
+ statestr += " " + formatTime(Math.round(sound.currentTime)) + "/" + formatTime(Math.round(sound.duration));
}
statestr += "]";