Removed the second music player design in favor of the first design (after the IS 403 results)
This commit is contained in:
gballan1
parent
a37ae70622
commit
c2382ecac1
@ -1,31 +1,16 @@
|
|||||||
<?php
|
<?php
|
||||||
|
|
||||||
// music design #1
|
// music page
|
||||||
$app->get('/music1', function() use($app) {
|
$app->get('/music', function() use($app) {
|
||||||
|
|
||||||
$albums = $app->album->all()->sortByDesc('release_date')->values()->all();
|
$albums = $app->album->all()->sortByDesc('release_date')->values()->all();
|
||||||
$songs = $albums[0]->songs;
|
$songs = $albums[0]->songs;
|
||||||
$links = $albums[0]->links;
|
$links = $albums[0]->links;
|
||||||
|
|
||||||
$app->render('pages/music1.twig', [
|
$app->render('pages/music.twig', [
|
||||||
'albums' => $albums,
|
'albums' => $albums,
|
||||||
'songs' => $songs,
|
'songs' => $songs,
|
||||||
'links' => $links,
|
'links' => $links,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
})->name('music1');
|
})->name('music');
|
||||||
|
|
||||||
# music design #2
|
|
||||||
$app->get('/music2', function() use($app) {
|
|
||||||
|
|
||||||
$albums = $app->album->all()->sortByDesc('release_date')->values()->all();
|
|
||||||
$songs = $albums[0]->songs;
|
|
||||||
$links = $albums[0]->links;
|
|
||||||
|
|
||||||
$app->render('pages/music2.twig', [
|
|
||||||
'albums' => $albums,
|
|
||||||
'songs' => $songs,
|
|
||||||
'links' => $links,
|
|
||||||
]);
|
|
||||||
|
|
||||||
})->name('music2');
|
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
<script type="text/javascript" src="/js/music.js"></script>
|
<script type="text/javascript" src="/js/music.js"></script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block title %}Music Design #1{% endblock %}
|
{% block title %}Music{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
@ -1,86 +0,0 @@
|
|||||||
{% extends 'templates/default.twig' %}
|
|
||||||
|
|
||||||
{% block javascripts %}
|
|
||||||
<script type="text/javascript" src="/js/music.js"></script>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block title %}Music Design #2{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
|
|
||||||
<header id="music-header" class="row">
|
|
||||||
<h1>Music</h1>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- music player -->
|
|
||||||
<section class="row">
|
|
||||||
<!-- no javascript warning -->
|
|
||||||
<noscript class="card">Woah there, lassy! You will need to enable Javascript to use this page!</noscript>
|
|
||||||
|
|
||||||
<!-- left stuff -->
|
|
||||||
<div class="col-sm-5 col-xs-12">
|
|
||||||
<!-- now playing -->
|
|
||||||
<div class="thumbnail shadow-1">
|
|
||||||
<img id="album-artwork" class="image-responsive album-art" src="{{ albums[0].album_art }}" alt="{{ albums[0].title }}">
|
|
||||||
<div class="caption">
|
|
||||||
<h3 id="album-title">{{ albums[0].title }}</h3>
|
|
||||||
<h5 id="album-release">Released on <span>{{ albums[0].releaseDate }}</span></h5>
|
|
||||||
{% if albums[0].description %}
|
|
||||||
<hr />
|
|
||||||
<p id="album-description">{{ albums[0].description }}</p>
|
|
||||||
{% endif %}
|
|
||||||
{% if links %}
|
|
||||||
<hr />
|
|
||||||
<ul style="padding-left:20px">
|
|
||||||
{% for link in links %}
|
|
||||||
<li>Buy on <a href="{{ link.link_ref }}">{{ link.link_name }}</a></li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- music player -->
|
|
||||||
<article id="music-player-card" class="card">
|
|
||||||
<h4 id="track-title">{{ songs[0].title }}</h4>
|
|
||||||
<audio id="music-player" controls>
|
|
||||||
<source src="{{ songs[0].audio_file }}.ogg" type="audio/ogg" />
|
|
||||||
<source src="{{ songs[0].audio_file }}.mp3" type="audio/mpeg" />
|
|
||||||
</audio>
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<!-- available songs -->
|
|
||||||
<article class="card">
|
|
||||||
<ul class="now-playing-list">
|
|
||||||
{% for song in songs %}
|
|
||||||
<li class="music-track {% if loop.index0 == 0 %}selected{% endif %}" data-trackid="{{ song.id }}" 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 %}
|
|
||||||
</ul>
|
|
||||||
</article>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- right stuff -->
|
|
||||||
<div class="col-sm-7 col-xs-12">
|
|
||||||
<div class="row">
|
|
||||||
{% for album in albums %}
|
|
||||||
<!-- album details -->
|
|
||||||
<div class="music-album {% if loop.index0 == 0 %}selected{% endif %} col-xs-6" data-albumid="{{ album.id }}">
|
|
||||||
<div class="thumbnail shadow-1">
|
|
||||||
<img class="album-art" src="{{ album.album_art }}" alt="{{ album.title }}">
|
|
||||||
<div class="caption">
|
|
||||||
<h5>{{ album.title }} ({{ album.releaseYear }})</h5>
|
|
||||||
{% if album.description %}
|
|
||||||
<hr />
|
|
||||||
<p id="album-description">{{ album.description|length > 50 ? album.description[:50] ~ '...' : album.description }}</p>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{% endblock %}
|
|
||||||
@ -29,10 +29,7 @@
|
|||||||
<a href="{{ urlFor('shows') }}">Shows</a>
|
<a href="{{ urlFor('shows') }}">Shows</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav_item">
|
<li class="nav_item">
|
||||||
<a href="{{ urlFor('music1') }}">Music #1</a>
|
<a href="{{ urlFor('music') }}">Music</a>
|
||||||
</li>
|
|
||||||
<li class="nav_item">
|
|
||||||
<a href="{{ urlFor('music2') }}">Music #2</a>
|
|
||||||
</li>
|
</li>
|
||||||
<li class="nav_item">
|
<li class="nav_item">
|
||||||
<a href="{{ urlFor('contact') }}">Contact</a>
|
<a href="{{ urlFor('contact') }}">Contact</a>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user