website/app/views/music.twig

58 lines
2.7 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>
<section id="music-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>
2015-10-02 00:25:57 -04:00
<!-- music player -->
2015-10-06 12:08:25 -04:00
<article id="music-player-card" class="card col-md-6 col-sm-12">
<audio id="music-player" controls>
2015-10-02 01:09:43 -04:00
<source src="/audio/opting_out_ep/01 Opting Out.ogg" type="audio/ogg">
<source src="/audio/opting_out_ep/01 Opting Out.mp3" type="audio/mpeg">
</audio>
<h4>Now Playing</h4>
2015-10-02 01:17:55 -04:00
<ol class="now-playing-list">
2015-10-06 11:09:46 -04:00
<li class="selected" data-title="Opting Out" data-album="Opting Out EP" data-sequence="1" data-path="/audio/opting_out_ep/01 Opting Out"><a href="">Opting Out</a></li>
2015-10-02 01:09:43 -04:00
<li data-title="Elsewhere" data-album="Opting Out EP" data-sequence="2" data-path="/audio/opting_out_ep/02 Elsewhere"><a href="">Elsewhere</a></li>
<li data-title="What Happened to Forever?" data-album="Opting Out EP" data-sequence="3" data-path="/audio/opting_out_ep/03 What Happened to Forever"><a href="">What Happened to Forever?</a></li>
<li data-title="Lady" data-album="Opting Out EP" data-sequence="4" data-path="/audio/opting_out_ep/04 Lady"><a href="">Lady</a></li>
</ol>
2015-10-02 00:25:57 -04:00
</article>
<!-- music playlist section -->
2015-10-06 11:09:46 -04:00
<article id="music-list-section" class="col-md-6 col-sm-12">
2015-10-02 00:25:57 -04:00
<!-- music playlists -->
2015-10-02 01:33:10 -04:00
<div class="music-list card shadow-1">
2015-10-02 01:09:43 -04:00
<h3 class="music-list-header selected">Opting Out EP</h3>
<ol>
<li data-title="Opting Out" data-album="Opting Out EP" data-sequence="1" data-path="/audio/opting_out_ep/01 Opting Out">Opting Out</li>
<li data-title="Elsewhere" data-album="Opting Out EP" data-sequence="2" data-path="/audio/opting_out_ep/02 Elsewhere">Elsewhere</li>
<li data-title="What Happened to Forever?" data-album="Opting Out EP" data-sequence="3" data-path="/audio/opting_out_ep/03 What Happened to Forever">What Happened to Forever?</li>
<li data-title="Lady" data-album="Opting Out EP" data-sequence="4" data-path="/audio/opting_out_ep/04 Lady">Lady</li>
2015-10-02 01:09:43 -04:00
</ol>
2015-10-02 01:25:46 -04:00
</div>
2015-10-02 01:33:10 -04:00
<div class="music-list card shadow-1">
2015-10-02 00:25:57 -04:00
<h3 class="music-list-header">Brain Scrub - Single</h3>
2015-10-02 01:09:43 -04:00
<ol>
<li data-title="Brain Scrub" data-album="Brain Scrub - Single" data-sequence="1" data-path="/audio/opting_out_ep/01 Brain Scrub">Brain Scrub</li>
2015-10-02 01:09:43 -04:00
</ol>
2015-10-02 01:25:46 -04:00
</div>
2015-10-02 00:25:57 -04:00
</article>
</section>
2015-10-06 11:09:46 -04:00
{% endblock %}