let queue = document.getElementById("queue-items");
let current_name = document.getElementById("current-name");
let current_artist = document.getElementById("current-artist");
let current_cover = document.getElementById("current-cover");

function refresh() {
	httpGetAsync("/api/current-queue", (response, status) => {
		if(status !== 200)
			return alert("Anfrage fehlgeschlagen!");
		queue.innerHTML = "";

		current_name.innerText = String(response.current.name);
		current_artist.innerText = String(response.current.artist);
		current_cover.src = response.current.cover;

		let i = 1;
		for( let e of response.next )
		{
			let tr = document.createElement("tr");
			let nr = document.createElement("td");
			nr.innerText = String(i);

			let cover = document.createElement("td");
			let cover_img = document.createElement("img");
			cover_img.src = e.cover;
			cover_img.classList.add("cover");
			cover_img.style.width = "50px";
			cover_img.style.height = "50px";
			cover.append(cover_img);

			let artist = document.createElement("td");
			artist.innerText = e.artist;

			let name = document.createElement("td");
			name.innerText = e.name;

			tr.append(nr,cover,artist, name);

			queue.append(tr);
			if( i === 9 )
				return;
			i++;
		}


	});
}

refresh();
setInterval(refresh, 1000*10);