diff options
| author | gammelalf <gammelalf@hopfen.space> | 2022-12-27 17:52:00 +0100 |
|---|---|---|
| committer | Florian Fischer <florian.fischer@muhq.space> | 2023-02-24 12:47:40 +0100 |
| commit | 1904fdcdbc6bbff4d931737ebcb6ca289c10879b (patch) | |
| tree | 1816be1737d8b4f434d1f91e705b1c090a19b13d | |
| parent | 1ca647ffd4f5170a3d8e732d515f6c1d2ec47c3a (diff) | |
| download | WRMS-1904fdcdbc6bbff4d931737ebcb6ca289c10879b.tar.gz WRMS-1904fdcdbc6bbff4d931737ebcb6ca289c10879b.zip | |
Fixed IDE warnings
Including:
- implicit type coersions in ==
- undeclared variables
- let which could be const
| -rw-r--r-- | web/client.html | 76 |
1 files changed, 33 insertions, 43 deletions
diff --git a/web/client.html b/web/client.html index 87ca51a..34a5b54 100644 --- a/web/client.html +++ b/web/client.html @@ -1,29 +1,16 @@ <!DOCTYPE html> -<html> +<html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>WRMS</title> <style> - .vote { - display: inline-block; - cursor: pointer; - color: #687074 - } - - .vote.on { - color: #f48024 - } - - .searchResult:hover { - background-color: #999; - } </style> <script> /* - @licstart The following is the entire license notice for the + @licstart The following is the entire license notice for the JavaScript code in this page. Copyright (C) 2022 Florian Fischer @@ -40,7 +27,7 @@ may distribute non-source (e.g., minimized or compacted) forms of that code without the copy of the GNU GPL normally required by section 4, provided you include this license notice and a URL - through which recipients can access the Corresponding Source. + through which recipients can access the Corresponding Source. @licend The above is the entire license notice @@ -49,25 +36,25 @@ </script> <script> - let HttpClient = function() { + const HttpClient = function() { function newRequest(callback) { - let request = new XMLHttpRequest(); - request.onreadystatechange = function() { - if (request.readyState == 4 && request.status == 200) + const request = new XMLHttpRequest(); + request.onreadystatechange = function() { + if (request.readyState === 4 && request.status === 200) callback(request.responseText); } return request; } this.get = function(url, callback) { - let request = newRequest(callback); - request.open("GET", url, true); + const request = newRequest(callback); + request.open("GET", url, true); request.send(null); } this.post = function(url, data, callback) { - let request = newRequest(callback); - request.open("POST", url, true); + const request = newRequest(callback); + request.open("POST", url, true); request.send(data); } } @@ -83,24 +70,24 @@ } function renderPlaylist() { - playlist = document.getElementById("playlist"); + const playlist = document.getElementById("playlist"); playlist.innerHTML = ""; songs.sort(function(a, b) {return b.weight - a.weight}); for (const song of songs) { - let listItem = document.createElement("li"); + const listItem = document.createElement("li"); const btnHTML = "<svg width='36' height='36'><path d='M2 10h32L18 26 2 10z' fill='currentColor'></path></svg>"; - let upvoteBtn = document.createElement("span"); - let downvoteBtn = document.createElement("span"); + const upvoteBtn = document.createElement("span"); + const downvoteBtn = document.createElement("span"); upvoteBtn.innerHTML = downvoteBtn.innerHTML = btnHTML; upvoteBtn.className = downvoteBtn.className = "vote"; upvoteBtn.style.transform = 'rotate(180deg)'; if (votes.has(song.uri)) { - if (votes.get(song.uri) == "up") + if (votes.get(song.uri) === "up") upvoteBtn.classList.toggle("on"); else downvoteBtn.classList.toggle("on"); @@ -109,10 +96,10 @@ function onVote(event) { const btn = event.currentTarget; btn.classList.toggle("on"); - const isUpvoteBtn = btn == upvoteBtn; + const isUpvoteBtn = btn === upvoteBtn; const isVote = btn.classList.contains("on"); - let url = ""; - + + let url; if (isVote) { if (isUpvoteBtn) { downvoteBtn.classList.remove("on") @@ -159,7 +146,7 @@ function handleUpdate(updated) { for (const updated_song of updated) { - songs[songs.findIndex(function(s) {return s.uri == updated_song.uri})] = updated_song; + songs[songs.findIndex(function(s) {return s.uri === updated_song.uri})] = updated_song; } renderPlaylist(); } @@ -176,9 +163,12 @@ function handlePlay(currentSong) { document.getElementById("ppbutton").innerHTML = 'Pause'; - idx = -1; - songs.forEach(function(s, i, a) { if (s.uri == currentSong.uri) idx = i; }); - if (idx != -1) { + let idx = -1; + songs.forEach(function(song, index) { + if (song.uri === currentSong.uri) + idx = index; + }); + if (idx !== -1) { songs.splice(idx, 1); renderPlaylist(); } @@ -190,13 +180,13 @@ playing.appendChild(songLabel); } - let socket = new WebSocket("ws://localhost:8080/ws"); + const socket = new WebSocket("ws://localhost:8080/ws"); console.log("Attempting Connection..."); socket.onopen = () => { console.log("Successfully Connected"); }; - + socket.onclose = event => { console.log("Socket Closed Connection: ", event); }; @@ -242,17 +232,17 @@ } function showSearchResults(responseText) { - response = JSON.parse(responseText) + const response = JSON.parse(responseText) if (!response) return - let searchResultsOverlay = document.getElementById("searchResultsOverlay"); + const searchResultsOverlay = document.getElementById("searchResultsOverlay"); - let searchResults = document.getElementById("searchResults"); + const searchResults = document.getElementById("searchResults"); // Clear search Results searchResults.innerHTML = ""; for (const song of response.songs) { - let listItem = document.createElement("li"); + const listItem = document.createElement("li"); listItem.addEventListener("click", function() { addSong(song); searchResultsOverlay.style.display = "none"; @@ -279,7 +269,7 @@ <h2>Add your song</h2> <div id="add"> <form id="searchForm" onsubmit="return submitSearch()"> - <input id="searchInput" name="pattern" type="text" value="Title/Artist/Album/..."> + <label><input id="searchInput" name="pattern" type="text" value="Title/Artist/Album/..."></label> <button id="searchButton">Search</button> </form> </div> |
