From f0130d735eeee5b57325f112f0c217909ed609c8 Mon Sep 17 00:00:00 2001 From: Savanni D'Gerinel Date: Fri, 24 Feb 2023 08:13:41 -0500 Subject: [PATCH] Render a track list sent from the server --- music-player/client/index.html | 4 +- music-player/client/src/main.ts | 55 ++++++++++++++++++++------- music-player/client/tsconfig.json | 3 +- music-player/server/src/bin/server.rs | 42 ++++++++++++-------- 4 files changed, 73 insertions(+), 31 deletions(-) diff --git a/music-player/client/index.html b/music-player/client/index.html index da2fa05..0068341 100644 --- a/music-player/client/index.html +++ b/music-player/client/index.html @@ -33,6 +33,7 @@ + - + diff --git a/music-player/client/src/main.ts b/music-player/client/src/main.ts index 663f8df..faf4d1c 100644 --- a/music-player/client/src/main.ts +++ b/music-player/client/src/main.ts @@ -1,5 +1,13 @@ import * as _ from "lodash"; +interface TrackInfo { + id: string; + track_number?: number; + name?: string; + album?: string; + artist?: string; +} + const replaceTitle = () => { const title = document.querySelector(".js-title"); if (title && title.innerHTML) { @@ -7,21 +15,42 @@ const replaceTitle = () => { } }; -/* -const checkWeatherService = () => { - fetch("https://api.weather.gov/") - .then((r) => r.json()) - .then((js) => { - const weather = document.querySelector('.js-weather'); - weather.innerHTML = js.status; - }); -} -*/ +const getTracks = () => fetch("/api/v1/tracks").then((r) => r.json()); + +const formatTrack = (track: TrackInfo) => { + let row = document.createElement("tr"); + + let track_number = document.createElement("td"); + track_number.appendChild( + document.createTextNode(track.track_number.toString()) + ); + + let name = document.createElement("td"); + name.appendChild(document.createTextNode(track.name)); + + let album = document.createElement("td"); + album.appendChild(document.createTextNode(track.album)); + + let artist = document.createElement("td"); + artist.appendChild(document.createTextNode(track.artist)); + + row.appendChild(track_number); + row.appendChild(name); + row.appendChild(artist); + row.appendChild(album); + return row; +}; + +const updateTrackList = (tracks: TrackInfo[]) => { + const track_list = document.querySelector(".track-list__tracks tbody"); + if (track_list) { + let track_formats = _.map(tracks, formatTrack); + _.map(track_formats, (trackinfo) => track_list.appendChild(trackinfo)); + } +}; const run = () => { - replaceTitle(); - console.log(_.map([4, 8], (x) => x * x)); - // checkWeatherService(); + getTracks().then((tracks) => updateTrackList(tracks)); }; run(); diff --git a/music-player/client/tsconfig.json b/music-player/client/tsconfig.json index da7569b..7246d52 100644 --- a/music-player/client/tsconfig.json +++ b/music-player/client/tsconfig.json @@ -6,6 +6,7 @@ "rootDir": "src", "outDir": "./dist", "lib": ["es2016", "DOM"], - "sourceMap": true + "sourceMap": true, + "strict": true } } diff --git a/music-player/server/src/bin/server.rs b/music-player/server/src/bin/server.rs index 0a14919..17e43d7 100644 --- a/music-player/server/src/bin/server.rs +++ b/music-player/server/src/bin/server.rs @@ -9,51 +9,59 @@ use std::{ }; use warp::{Filter, Reply}; -use music_player::{core::Core, database::MemoryIndex}; +use music_player::{ + audio::{TrackId, TrackInfo}, + core::Core, + database::MemoryIndex, +}; -/* -fn tracks() -> Vec { +fn tracks() -> Vec { vec![ - Track { + TrackInfo { track_number: Some(1), name: Some("Underground".to_owned()), album: Some("Artemis".to_owned()), artist: Some("Lindsey Stirling".to_owned()), - path: PathBuf::from("/mnt/music/Lindsey Stirling/Artemis/01 - Underground.ogg"), + id: TrackId::from( + "/mnt/music/Lindsey Stirling/Artemis/01 - Underground.ogg".to_owned(), + ), }, - Track { + TrackInfo { track_number: Some(2), name: Some("Artemis".to_owned()), album: Some("Artemis".to_owned()), artist: Some("Lindsey Stirling".to_owned()), - path: PathBuf::from("/mnt/music/Lindsey Stirling/Artemis/02 - Artemis.ogg"), + id: TrackId::from("/mnt/music/Lindsey Stirling/Artemis/02 - Artemis.ogg".to_owned()), }, - Track { + TrackInfo { track_number: Some(3), name: Some("Til the Light Goes Out".to_owned()), album: Some("Artemis".to_owned()), artist: Some("Lindsey Stirling".to_owned()), - path: PathBuf::from( - "/mnt/music/Lindsey Stirling/Artemis/03 - Til the Light Goes Out.ogg", + id: TrackId::from( + "/mnt/music/Lindsey Stirling/Artemis/03 - Til the Light Goes Out.ogg".to_owned(), ), }, - Track { + TrackInfo { track_number: Some(4), name: Some("Between Twilight".to_owned()), album: Some("Artemis".to_owned()), artist: Some("Lindsey Stirling".to_owned()), - path: PathBuf::from("/mnt/music/Lindsey Stirling/Artemis/04 - Between Twilight.ogg"), + id: TrackId::from( + "/mnt/music/Lindsey Stirling/Artemis/04 - Between Twilight.ogg".to_owned(), + ), }, - Track { + TrackInfo { track_number: Some(5), name: Some("Foreverglow".to_owned()), album: Some("Artemis".to_owned()), artist: Some("Lindsey Stirling".to_owned()), - path: PathBuf::from("/mnt/music/Lindsey Stirling/Artemis/05 - Foreverglow.ogg"), + id: TrackId::from( + "/mnt/music/Lindsey Stirling/Artemis/05 - Foreverglow.ogg".to_owned(), + ), }, ] } -*/ enum Bundle { Index, @@ -118,10 +126,12 @@ pub async fn main() { let conn = Connection::new_session().expect("to connect to dbus"); warp::reply::json(&list_devices(conn)) }); + */ let track_list = warp::path!("api" / "v1" / "tracks") .and(warp::get()) .map(|| warp::reply::json(&tracks())); + /* let tracks_for_artist = warp::path!("api" / "v1" / "artist" / String) .and(warp::get()) .map(|_artist: String| warp::reply::json(&tracks())); @@ -147,7 +157,7 @@ pub async fn main() { .or(queue) .or(playing_status); */ - let routes = index.or(app).or(styles); + let routes = index.or(app).or(styles).or(track_list); let server = warp::serve(routes); server .run(SocketAddr::new(