Updated music view some more - added track listing and fixed the music player
This commit is contained in:
parent
967f716694
commit
6338aa4554
@ -3,9 +3,11 @@
|
|||||||
$app->get('/music', function() use($app) {
|
$app->get('/music', function() use($app) {
|
||||||
|
|
||||||
$albums = $app->album->all();
|
$albums = $app->album->all();
|
||||||
|
$songs = $albums[0]->songs;
|
||||||
|
|
||||||
$app->render('music.twig', [
|
$app->render('music.twig', [
|
||||||
'albums' => $albums,
|
'albums' => $albums,
|
||||||
|
'songs' => $songs,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
})->name('music');
|
})->name('music');
|
||||||
|
@ -36,15 +36,17 @@
|
|||||||
<div class="col-sm-7 col-xs-12">
|
<div class="col-sm-7 col-xs-12">
|
||||||
<article id="music-player-card" class="card">
|
<article id="music-player-card" class="card">
|
||||||
<audio id="music-player" controls>
|
<audio id="music-player" controls>
|
||||||
<source src="{{ albums[0].songs[0].audio_file }}.ogg" type="audio/ogg" />
|
<source src="{{ songs[0].audio_file }}.ogg" type="audio/ogg" />
|
||||||
<source src="{{ albums[0].songs[0].audio_file }}.mp3" type="audio/mpeg" />
|
<source src="{{ songs[0].audio_file }}.mp3" type="audio/mpeg" />
|
||||||
</audio>
|
</audio>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="card">
|
<article class="card">
|
||||||
<ul>
|
<ul class="now-playing-list">
|
||||||
{% for song in album.songs %}
|
{% for song in songs %}
|
||||||
<li>{{ song.title }}</li>
|
<li class="music-track" data-title="{{ song.title }}" data-album="{{ song.album_id }}" data-order="{{ song.track_order }}" data-path="{{ song.audio_file }}">
|
||||||
|
<span>{{ song.track_order }}. {{ song.title }}</span>
|
||||||
|
</li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
</article>
|
</article>
|
||||||
@ -55,7 +57,7 @@
|
|||||||
<section class="row">
|
<section class="row">
|
||||||
{% for album in albums %}
|
{% for album in albums %}
|
||||||
<!-- album details -->
|
<!-- album details -->
|
||||||
<div class="col-sm-3 col-xs-6">
|
<div class="music-album col-sm-3 col-xs-6">
|
||||||
<div class="thumbnail shadow-1">
|
<div class="thumbnail shadow-1">
|
||||||
<img src="{{ album.album_art }}" alt="{{ album.title }}">
|
<img src="{{ album.album_art }}" alt="{{ album.title }}">
|
||||||
<div class="caption">
|
<div class="caption">
|
||||||
|
Loading…
Reference in New Issue
Block a user