Render a track list sent from the server
This commit is contained in:
parent
99ba020b7c
commit
f0130d735e
|
@ -33,6 +33,7 @@
|
||||||
</thead>
|
</thead>
|
||||||
|
|
||||||
<tbody>
|
<tbody>
|
||||||
|
<!--
|
||||||
<tr class="track-list__track-row">
|
<tr class="track-list__track-row">
|
||||||
<td> 1 </td>
|
<td> 1 </td>
|
||||||
<td> Underground </td>
|
<td> Underground </td>
|
||||||
|
@ -68,12 +69,13 @@
|
||||||
<td> Artemis </td>
|
<td> Artemis </td>
|
||||||
<td> 3:58 </td>
|
<td> 3:58 </td>
|
||||||
</tr>
|
</tr>
|
||||||
|
-->
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="./main.js" type="module"></script>
|
<script src="./bundle.js" type="module"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,5 +1,13 @@
|
||||||
import * as _ from "lodash";
|
import * as _ from "lodash";
|
||||||
|
|
||||||
|
interface TrackInfo {
|
||||||
|
id: string;
|
||||||
|
track_number?: number;
|
||||||
|
name?: string;
|
||||||
|
album?: string;
|
||||||
|
artist?: string;
|
||||||
|
}
|
||||||
|
|
||||||
const replaceTitle = () => {
|
const replaceTitle = () => {
|
||||||
const title = document.querySelector(".js-title");
|
const title = document.querySelector(".js-title");
|
||||||
if (title && title.innerHTML) {
|
if (title && title.innerHTML) {
|
||||||
|
@ -7,21 +15,42 @@ const replaceTitle = () => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/*
|
const getTracks = () => fetch("/api/v1/tracks").then((r) => r.json());
|
||||||
const checkWeatherService = () => {
|
|
||||||
fetch("https://api.weather.gov/")
|
const formatTrack = (track: TrackInfo) => {
|
||||||
.then((r) => r.json())
|
let row = document.createElement("tr");
|
||||||
.then((js) => {
|
|
||||||
const weather = document.querySelector('.js-weather');
|
let track_number = document.createElement("td");
|
||||||
weather.innerHTML = js.status;
|
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 = () => {
|
const run = () => {
|
||||||
replaceTitle();
|
getTracks().then((tracks) => updateTrackList(tracks));
|
||||||
console.log(_.map([4, 8], (x) => x * x));
|
|
||||||
// checkWeatherService();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
run();
|
run();
|
||||||
|
|
|
@ -6,6 +6,7 @@
|
||||||
"rootDir": "src",
|
"rootDir": "src",
|
||||||
"outDir": "./dist",
|
"outDir": "./dist",
|
||||||
"lib": ["es2016", "DOM"],
|
"lib": ["es2016", "DOM"],
|
||||||
"sourceMap": true
|
"sourceMap": true,
|
||||||
|
"strict": true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,51 +9,59 @@ use std::{
|
||||||
};
|
};
|
||||||
use warp::{Filter, Reply};
|
use warp::{Filter, Reply};
|
||||||
|
|
||||||
use music_player::{core::Core, database::MemoryIndex};
|
use music_player::{
|
||||||
|
audio::{TrackId, TrackInfo},
|
||||||
|
core::Core,
|
||||||
|
database::MemoryIndex,
|
||||||
|
};
|
||||||
|
|
||||||
/*
|
fn tracks() -> Vec<TrackInfo> {
|
||||||
fn tracks() -> Vec<Track> {
|
|
||||||
vec![
|
vec![
|
||||||
Track {
|
TrackInfo {
|
||||||
track_number: Some(1),
|
track_number: Some(1),
|
||||||
name: Some("Underground".to_owned()),
|
name: Some("Underground".to_owned()),
|
||||||
album: Some("Artemis".to_owned()),
|
album: Some("Artemis".to_owned()),
|
||||||
artist: Some("Lindsey Stirling".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),
|
track_number: Some(2),
|
||||||
name: Some("Artemis".to_owned()),
|
name: Some("Artemis".to_owned()),
|
||||||
album: Some("Artemis".to_owned()),
|
album: Some("Artemis".to_owned()),
|
||||||
artist: Some("Lindsey Stirling".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),
|
track_number: Some(3),
|
||||||
name: Some("Til the Light Goes Out".to_owned()),
|
name: Some("Til the Light Goes Out".to_owned()),
|
||||||
album: Some("Artemis".to_owned()),
|
album: Some("Artemis".to_owned()),
|
||||||
artist: Some("Lindsey Stirling".to_owned()),
|
artist: Some("Lindsey Stirling".to_owned()),
|
||||||
path: PathBuf::from(
|
id: TrackId::from(
|
||||||
"/mnt/music/Lindsey Stirling/Artemis/03 - Til the Light Goes Out.ogg",
|
"/mnt/music/Lindsey Stirling/Artemis/03 - Til the Light Goes Out.ogg".to_owned(),
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
Track {
|
TrackInfo {
|
||||||
track_number: Some(4),
|
track_number: Some(4),
|
||||||
name: Some("Between Twilight".to_owned()),
|
name: Some("Between Twilight".to_owned()),
|
||||||
album: Some("Artemis".to_owned()),
|
album: Some("Artemis".to_owned()),
|
||||||
artist: Some("Lindsey Stirling".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),
|
track_number: Some(5),
|
||||||
name: Some("Foreverglow".to_owned()),
|
name: Some("Foreverglow".to_owned()),
|
||||||
album: Some("Artemis".to_owned()),
|
album: Some("Artemis".to_owned()),
|
||||||
artist: Some("Lindsey Stirling".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 {
|
enum Bundle {
|
||||||
Index,
|
Index,
|
||||||
|
@ -118,10 +126,12 @@ pub async fn main() {
|
||||||
let conn = Connection::new_session().expect("to connect to dbus");
|
let conn = Connection::new_session().expect("to connect to dbus");
|
||||||
warp::reply::json(&list_devices(conn))
|
warp::reply::json(&list_devices(conn))
|
||||||
});
|
});
|
||||||
|
*/
|
||||||
|
|
||||||
let track_list = warp::path!("api" / "v1" / "tracks")
|
let track_list = warp::path!("api" / "v1" / "tracks")
|
||||||
.and(warp::get())
|
.and(warp::get())
|
||||||
.map(|| warp::reply::json(&tracks()));
|
.map(|| warp::reply::json(&tracks()));
|
||||||
|
/*
|
||||||
let tracks_for_artist = warp::path!("api" / "v1" / "artist" / String)
|
let tracks_for_artist = warp::path!("api" / "v1" / "artist" / String)
|
||||||
.and(warp::get())
|
.and(warp::get())
|
||||||
.map(|_artist: String| warp::reply::json(&tracks()));
|
.map(|_artist: String| warp::reply::json(&tracks()));
|
||||||
|
@ -147,7 +157,7 @@ pub async fn main() {
|
||||||
.or(queue)
|
.or(queue)
|
||||||
.or(playing_status);
|
.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);
|
let server = warp::serve(routes);
|
||||||
server
|
server
|
||||||
.run(SocketAddr::new(
|
.run(SocketAddr::new(
|
||||||
|
|
Loading…
Reference in New Issue