aboutsummaryrefslogtreecommitdiff
path: root/player.js
diff options
context:
space:
mode:
authorIndrajith K L2022-11-26 04:19:24 +0530
committerIndrajith K L2022-11-26 04:19:24 +0530
commit832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4 (patch)
treed5a4f7cbb472b622019341a353a2a0fbbaeb3c5b /player.js
parentd6987de7b8947d5df5fe7896797bdec8ea337d70 (diff)
downloadretrowave-player-832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4.tar.gz
retrowave-player-832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4.tar.bz2
retrowave-player-832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4.zip
Cosmetic Changes
History Upload implementation
Diffstat (limited to 'player.js')
-rw-r--r--player.js57
1 files changed, 44 insertions, 13 deletions
diff --git a/player.js b/player.js
index 8cf2151..53cdefe 100644
--- a/player.js
+++ b/player.js
@@ -1,28 +1,60 @@
(function () {
- openDialog();
let isPlaying = false;
let currentTracks = [];
let cursor = 0;
- let howerInstance;
+ let howlerInstance;
const retroWaveRu = "https://retrowave.ru";
- getMusic();
-
let titleEl = document.getElementById("track-name");
let coverArtEl = document.getElementsByClassName("music-player")[0];
+ const modalEl = document.getElementById("intro-modal");
+ const uploadInfoEl = document.getElementById("upload-info");
+ const fileUploadEl = document.getElementById("file-upload");
+ openDialog();
+ getMusic();
+ listenUploadFileChange();
- coverArtEl.addEventListener("click", () => {
- if (howerInstance) {
+ coverArtEl.addEventListener("click", (event) => {
+ const isNoPause = event.target.classList.contains("no-pause");
+ if (howlerInstance && !isNoPause) {
isPlaying = !isPlaying;
if (isPlaying) {
- howerInstance.play();
+ howlerInstance.play();
} else {
- howerInstance.pause();
+ howlerInstance.pause();
}
}
});
- document.getElementById("initButton").addEventListener("click", () => {
+ uploadInfoEl.addEventListener("click", () => {
+ const confirmText = `Do you really want to change your playlist?\nThis will replace all your retrowave music history.\nIf you are sure about this, make sure to upload a valid json file probably downloaded using history link.`;
+
+ if (confirm(confirmText)) {
+ fileUploadEl.click();
+ }
+ });
+
+ function listenUploadFileChange() {
+ fileUploadEl.onchange = function () {
+ const selectedFile = fileUploadEl.files[0];
+ console.log(selectedFile);
+ const reader = new FileReader();
+ reader.readAsText(selectedFile, "UTF-8");
+ reader.onload = function (event) {
+ console.log(event.target.result);
+ try {
+ const uploadedPlaylist = JSON.parse(event.target.result);
+ localStorage.setItem("retrowave-history", event.target.result);
+
+ } catch (error) {
+ alert("malformed/invalid json file");
+ }
+ };
+ };
+ }
+
+ document.getElementById("initButton")?.addEventListener("click", () => {
+ modalEl.classList.remove("open");
playMusic();
});
@@ -66,8 +98,7 @@
}
function openDialog() {
- const dialog = document.getElementById("dialog");
- dialog.showModal();
+ modalEl.classList.add("open");
}
function getMusic() {
@@ -88,7 +119,7 @@
const currentTrack = currentTracks[0];
const singleTrack = currentTrack.streamUrl;
const fullTrack = `${retroWaveRu}${singleTrack}`;
- howerInstance = new Howl({
+ howlerInstance = new Howl({
src: [fullTrack],
html5: true,
onend: function () {
@@ -104,7 +135,7 @@
updateInfo(currentTrack);
addToHistory(currentTrack);
- howerInstance.play();
+ howlerInstance.play();
}
function updateInfo(trackDetails) {