85 lines
3.3 KiB
HTML
85 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<head>
|
|
<link rel="stylesheet" href="/css/style.css">
|
|
<link rel="stylesheet" href="/css/loader.css">
|
|
</head>
|
|
<html>
|
|
<body>
|
|
<h1>Spotify To Bandcamp</h1>
|
|
<p>Recherche dans une playlist les artistes se trouvant aussi sur Bandcamp !</p>
|
|
<hr />
|
|
|
|
<div id="inf-loader">
|
|
<div id="loader"></div>
|
|
<p>La playlist est en cours de traitement [<span id="nb-fait">0</span>/<span id="nb-total">0</span>]…</p>
|
|
<p><a href="https://codepen.io/brunjo/pen/bNEWjV">Code Source du loader</a> sous <a href="https://blog.codepen.io/documentation/licensing/">licence MIT</a>.</p>
|
|
</div>
|
|
|
|
<div>
|
|
<table id="my-list">
|
|
<tr>
|
|
<th>Artiste</th>
|
|
<th>Album</th>
|
|
<th>Spotify</th>
|
|
<th>Bandcamp</th>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</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>
|
|
<html>
|