changing the playlist updates the artist list

pyrite.py

@@ -51,6 +51,13 @@ async def get_tracks(request: Request, albumartist: str, album: str, date: str,
 	return tracks
 
 
+@app.get("/artists/")
+async def get_artists(request: Request, playlist: str = ''):
+	"""Select all artists in the database."""
+	artists = await db.get_artists(request, playlist)
+	return artists
+
+
 @app.on_event("startup")
 async def startup():
 	app.state.db_pool = await asyncpg.create_pool(**config.db)

static/pyrite.js

@@ -116,6 +116,21 @@ function populate_albums(data) {
 	}
 }
 
+function populate_artists(data) {
+	clear_artists();
+	clear_albums();
+	clear_tracks();
+	for (let i = 0; i < data.length; i++) {
+		let artist = document.importNode(document.querySelector('#artist_template').content, true);
+		artist.querySelector('label').setAttribute('for', 'artist_' + i);
+		artist.querySelector('input').setAttribute('id', 'artist_' + i);
+		artist.querySelector('input').setAttribute('value', data[i]);
+		artist.querySelector('.artist_name').textContent = data[i];
+
+		document.querySelector('#artist_list').appendChild(artist);
+	}
+}
+
 function select_track(event) {
 	let track = {}
 	track['artist'] = document.querySelector('input[name=artist]:checked').value;
@@ -134,9 +149,16 @@ function select_track(event) {
 	playTrack();
 }
 
-function select_playlist(event) {
-	let playlist = document.querySelector('#playlist').value;
-	document.cookie = "playlist=" + playlist;
+async function select_playlist(event) {
+	let playlist = document.querySelector('#playlist-select').value;
+	document.cookie = "playlist=" + playlist + ";max-age=" + 60*60*24*365;
+
+	let q = new URLSearchParams();
+	q.set('playlist', playlist);
+	let res = await fetch("./artists/?" + q.toString());
+	let data = await res.json();
+
+	populate_artists(data);
 }
 
 function clear_tracks() {