website/app/views/music.twig

56 lines
1.4 KiB
Twig
Raw Normal View History

2015-08-30 12:34:43 -04:00
{% extends 'templates/default.php' %}
2015-10-06 12:08:25 -04:00
{% block javascripts %}
<script type="text/javascript" src="/js/modules/music-player.js"></script>
<script type="text/javascript" src="/js/music.js"></script>
{% endblock %}
2015-08-30 12:34:43 -04:00
{% block title %}Music{% endblock %}
{% block content %}
2015-10-02 00:25:57 -04:00
2015-10-06 11:09:46 -04:00
<header id="music-header" class="row">
<h1>Music</h1>
2015-10-02 00:25:57 -04:00
</header>
2016-04-20 23:11:33 -04:00
<!-- music player -->
<section class="row">
2015-10-02 01:09:43 -04:00
<!-- no javascript warning -->
<noscript class="card">Woah there, lassy! You will need to enable Javascript to use this page!</noscript>
2016-04-20 23:11:33 -04:00
<!-- current album details -->
<section class="col-sm-5 col-xs-12">
<div class="thumbnail shadow-1">
2016-04-20 23:49:25 -04:00
<img class="image-responsive" src="{{ albums[0].album_art }}" alt="{{ albums[0].title }}">
2016-04-20 23:11:33 -04:00
<div class="caption">
2016-04-20 23:49:25 -04:00
<h3>{{ albums[0].title }}</h3>
{% if albums[0].description %}
2016-04-20 23:11:33 -04:00
<hr />
2016-04-20 23:49:25 -04:00
<p>{{ albums[0].description }}</p>
2016-04-20 23:11:33 -04:00
{% endif %}
</div>
2015-10-02 01:25:46 -04:00
</div>
2016-04-20 23:11:33 -04:00
</section>
<!-- current playlist -->
<section class="card col-sm-7 col-xs-12">
</section>
</section>
<!-- available albums -->
<section class="row">
{% for album in albums %}
<!-- album details -->
2016-04-20 23:49:25 -04:00
<div class="col-sm-3 col-xs-6">
2016-04-20 23:11:33 -04:00
<div class="thumbnail shadow-1">
2016-04-20 23:49:25 -04:00
<img src="{{ album.album_art }}" alt="{{ album.title }}">
2016-04-20 23:11:33 -04:00
<div class="caption">
2016-04-20 23:49:25 -04:00
<h5>{{ album.title }}</h5>
2016-04-20 23:11:33 -04:00
</div>
</div>
2015-10-02 01:25:46 -04:00
</div>
2016-04-20 23:11:33 -04:00
{% endfor %}
2015-10-02 00:25:57 -04:00
</section>
2015-10-06 11:09:46 -04:00
{% endblock %}