!feat(categories): add 3 categories for artists

- albums: album found
- artists: found the artist, not the album
- notfound: not found on bandcamp (or limited by api)

API on refresh changes.
Use a extern script instead of write it in html page.
This commit is contained in:
rick 2021-09-01 16:00:07 +02:00
commit 5e7e5051be
Signed by: Rick
GPG key ID: 2B593F087240EE99
5 changed files with 187 additions and 69 deletions

View file

@ -1,5 +1,5 @@
h1 {
color: red;
color: green;
}
td, th {
@ -14,3 +14,7 @@ footer {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.only-artist {
color: red;
}

View file

@ -16,7 +16,8 @@
</div>
<div>
<table id="my-list">
<h2>Albums trouvés</h2>
<table id="found">
<tr>
<th>Artiste</th>
<th>Album</th>
@ -24,6 +25,25 @@
<th>Bandcamp</th>
</tr>
</table>
<h2>Artistes trouvés</h2>
<table id="artist-found">
<tr>
<th>Artiste</th>
<th>Album</th>
<th>Spotify</th>
<th>Bandcamp</th>
</tr>
</table>
<h2>Artistes non trouvés</h2>
<table id="notfound">
<tr>
<th>Artiste</th>
<th>Album</th>
<th>Spotify</th>
</tr>
</table>
</div>
<hr />
<footer>
@ -31,60 +51,5 @@
<p>Ce site est en aucun cas affilié avec Bandcamp ou Spotify.</p>
</footer>
</body>
<script>
const spotifyText = document.createTextNode("Spotify");
const bandcampText = document.createTextNode("Bandcamp");
const tab = document.getElementById("my-list");
async function test() {
const data = await fetch('/refresh').then(response => response.json());
if (data != null) {
if (data.urls != null) {
var newRow, artist, album, tmpLink;
for (const elem of data.urls) {
artist = document.createTextNode(elem.artist);
album = document.createTextNode(elem.album);
tmpLink = document.createElement("a");
tmpLink.appendChild(spotifyText.cloneNode());
tmpLink.title = "Lien Spotify";
tmpLink.href = elem.spotifyurl;
/*
let tmp = document.createTextNode(elem);
let newP = document.createElement("p");
newP.appendChild(tmp);
document.getElementById("my-list").appendChild(newP);
*/
newRow = tab.insertRow(-1);
newRow.insertCell(0).appendChild(artist);
newRow.insertCell(1).appendChild(album);
newRow.insertCell(2).appendChild(tmpLink);
tmpLink = document.createElement("a");
tmpLink.appendChild(bandcampText.cloneNode());
tmpLink.title = "Lien Bandcamp";
tmpLink.href = elem.bandcampurl;
newRow.insertCell(3).appendChild(tmpLink);
}
}
document.getElementById("nb-fait").textContent = data.done;
document.getElementById("nb-total").textContent = data.todo;
if (data.done === data.todo) {
document.getElementById("inf-loader").remove();
clearInterval(refreshList);
}
}
}
window.onbeforeunload = function() {
return "Vous perdrez tous les artistes trouvés en rafraichissant la page."
}
const refreshList = setInterval(test, 3000);
</script>
<script src="/script.js"></script>
<html>

98
static/script.js Normal file
View file

@ -0,0 +1,98 @@
const spotifyText = document.createTextNode("Spotify");
const bandcampText = document.createTextNode("Bandcamp");
//const tab = document.getElementById("my-list");
async function addCell(id, elem) {
let tab = document.getElementById(id), tmpLink, artist, album, newRow;
artist = document.createTextNode(elem.artist);
album = document.createTextNode(elem.album);
tmpLink = document.createElement("a");
tmpLink.appendChild(spotifyText.cloneNode());
tmpLink.title = "Lien Spotify";
tmpLink.href = elem.spotifyurl;
newRow = tab.insertRow(-1);
newRow.insertCell(0).appendChild(artist);
newRow.insertCell(1).appendChild(album);
newRow.insertCell(2).appendChild(tmpLink);
tmpLink = document.createElement("a");
switch (id) {
case "artist-found":
tmpLink.classList.add("only-artist")
case "found":
tmpLink.appendChild(bandcampText.cloneNode());
tmpLink.title = "Lien Bandcamp";
tmpLink.href = elem.bandcampurl;
newRow.insertCell(3).appendChild(tmpLink);
break;
}
}
async function test() {
const data = await fetch('/refresh').then(response => response.json());
if (data != null) {
document.getElementById("nb-fait").textContent = data.done;
document.getElementById("nb-total").textContent = data.todo;
if (data.albums != null) {
for (const elem of data.albums) {
addCell("found", elem);
}
}
if (data.artists != null) {
for (const elem of data.artists) {
addCell("artist-found", elem);
}
}
if (data.notfound != null) {
for (const elem of data.notfound) {
addCell("notfound", elem);
}
}
/*
if (data.urls != null) {
var newRow, artist, album, tmpLink;
for (const elem of data.urls) {
artist = document.createTextNode(elem.artist);
album = document.createTextNode(elem.album);
tmpLink = document.createElement("a");
tmpLink.appendChild(spotifyText.cloneNode());
tmpLink.title = "Lien Spotify";
tmpLink.href = elem.spotifyurl;
/*
let tmp = document.createTextNode(elem);
let newP = document.createElement("p");
newP.appendChild(tmp);
document.getElementById("my-list").appendChild(newP);
newRow = tab.insertRow(-1);
newRow.insertCell(0).appendChild(artist);
newRow.insertCell(1).appendChild(album);
newRow.insertCell(2).appendChild(tmpLink);
tmpLink = document.createElement("a");
tmpLink.appendChild(bandcampText.cloneNode());
tmpLink.title = "Lien Bandcamp";
tmpLink.href = elem.bandcampurl;
newRow.insertCell(3).appendChild(tmpLink);
}
}
*/
if (data.done === data.todo) {
document.getElementById("inf-loader").remove();
clearInterval(refreshList);
}
}
}
window.onbeforeunload = function() {
return "Vous perdrez tous les artistes trouvés en rafraichissant la page."
}
const refreshList = setInterval(test, 5000);