matt/cdr
1
0
Fork 0
mirror of https://github.com/thebaer/cdr.git synced 2024-11-15 01:31:01 +00:00
Code Issues Releases Wiki Activity

Use consistent indentation in templates

Browse Source
This commit is contained in:
Matt Baer 2022-03-31 12:31:38 -04:00
parent 11db38aa36
commit e64dae9c2d
2 changed files with 88 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
mixtape.tmpl
View File

@ -51,25 +51,25 @@
<body> <body>
<div id="wrapper"> <div id="wrapper">
<h1>Mixtape</h1> <h1>Mixtape</h1>
{{template "player" .Tracks}} {{template "player" .Tracks}}
<div id="controls"> <div id="controls">
<a id="prev" href="#prev">&#x23EE; Previous</a> <a id="prev" href="#prev">&#x23EE; Previous</a>
<a id="next" href="#next">Next &#x23ED;</a> <a id="next" href="#next">Next &#x23ED;</a>
</div> </div>
{{template "playlist" .Tracks}} {{template "playlist" .Tracks}}
{{template "playlist-js"}} {{template "playlist-js"}}
</div> </div>
</body> </body>
</html> </html>
{{end}} {{end}}
{{define "track-info"}} {{define "track-info"}}
{{if eq .Num 1}} {{if eq .Num 1}}
<p>[Here I might introduce this mix.]</p> <p>[Here I might introduce this mix.]</p>
<p>[Some notes about track 1.]</p> <p>[Some notes about track 1.]</p>
{{else if eq .Num 2}} {{else if eq .Num 2}}
<p>[Some notes about track 2.]</p> <p>[Some notes about track 2.]</p>
{{else if eq .Num 5}} {{else if eq .Num 5}}
<p>[Some notes about track 5.]</p> <p>[Some notes about track 5.]</p>
{{end}} {{end}}
{{end}} {{end}}

162
templates/parts.tmpl
View File

@ -1,102 +1,102 @@
{{define "player"}} {{define "player"}}
{{with $x := index . 0}} {{with $x := index . 0}}
<audio id="player" preload="auto" tabindex="0" controls> <audio id="player" preload="auto" tabindex="0" controls>
<source src="{{$x.Filename}}"> <source src="{{$x.Filename}}">
</audio> </audio>
{{end}} {{end}}
{{end}} {{end}}
{{define "playlist"}} {{define "playlist"}}
<ol id="playlist"> <ol id="playlist">
{{range $i, $el := .}} {{range $i, $el := .}}
<li{{if eq $i 0}} class="active"{{end}}> <li{{if eq $i 0}} class="active"{{end}}>
<a class="track" href="{{$el.Filename}}" data-artist="{{$el.Artist}}" data-title="{{$el.Title}}">{{$el.Artist}} - {{$el.Title}}</a> <a class="track" href="{{$el.Filename}}" data-artist="{{$el.Artist}}" data-title="{{$el.Title}}">{{$el.Artist}} - {{$el.Title}}</a>
{{template "track-info" $el}} {{template "track-info" $el}}
</li> </li>
{{end}} {{end}}
</ol> </ol>
{{end}} {{end}}
{{define "track-info"}}{{end}} {{define "track-info"}}{{end}}
{{define "full-player"}} {{define "full-player"}}
{{template "player" .}} {{template "player" .}}
{{template "playlist" .}} {{template "playlist" .}}
{{template "playlist-js"}} {{template "playlist-js"}}
{{end}} {{end}}
{{define "playlist-js"}} {{define "playlist-js"}}
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function () {
var current = 0; var current = 0;
var $audio = $('#player'); var $audio = $('#player');
var $playlist = $('#playlist'); var $playlist = $('#playlist');
var $tracks = $playlist.find('li a.track'); var $tracks = $playlist.find('li a.track');
var len = $tracks.length; var len = $tracks.length;
$playlist.on('click', 'a.track', function (e) { $playlist.on('click', 'a.track', function (e) {
e.preventDefault(); e.preventDefault();
link = $(this); link = $(this);
current = link.parent().index(); current = link.parent().index();
play(link, $audio[0]); play(link, $audio[0]);
}); });
$audio[0].addEventListener('play', function (e) { $audio[0].addEventListener('play', function (e) {
var $link = $('li.active > a'); var $link = $('li.active > a');
setTrackMetadata($link); setTrackMetadata($link);
}); });
$audio[0].addEventListener('ended', function (e) { $audio[0].addEventListener('ended', function (e) {
playNext(); playNext();
}); });
$('a#next').on('click', function (e) { $('a#next').on('click', function (e) {
e.preventDefault(); e.preventDefault();
playNext(); playNext();
}); });
$('a#prev').on('click', function (e) { $('a#prev').on('click', function (e) {
e.preventDefault(); e.preventDefault();
playPrev(); playPrev();
}); });
function playPrev() { function playPrev() {
current--; current--;
if (current < 0) { if (current < 0) {
current = len - 1; current = len - 1;
} }
link = $playlist.find('a.track')[current]; link = $playlist.find('a.track')[current];
play($(link), $audio[0]); play($(link), $audio[0]);
} }
function playNext() { function playNext() {
current++; current++;
if (current == len) { if (current == len) {
current = 0; current = 0;
} }
link = $playlist.find('a.track')[current]; link = $playlist.find('a.track')[current];
play($(link), $audio[0]); play($(link), $audio[0]);
} }
function setTrackMetadata($link) { function setTrackMetadata($link) {
if ('mediaSession' in navigator) { if ('mediaSession' in navigator) {
// Set track metadata // Set track metadata
navigator.mediaSession.metadata = new MediaMetadata({ navigator.mediaSession.metadata = new MediaMetadata({
title: $link.data('title'), title: $link.data('title'),
artist: $link.data('artist'), artist: $link.data('artist'),
}); });
} }
} }
function play($link, $player) { function play($link, $player) {
$player.src = $link.attr('href'); $player.src = $link.attr('href');
par = $link.parent(); par = $link.parent();
par.addClass('active').siblings().removeClass('active'); par.addClass('active').siblings().removeClass('active');
$player.load(); $player.load();
$player.play(); $player.play();
} }
if ('mediaSession' in navigator) { if ('mediaSession' in navigator) {
// Listen for MediaSession events // Listen for MediaSession events
navigator.mediaSession.setActionHandler('nexttrack', playNext); navigator.mediaSession.setActionHandler('nexttrack', playNext);
navigator.mediaSession.setActionHandler('previoustrack', playPrev); navigator.mediaSession.setActionHandler('previoustrack', playPrev);
} }
}); });
</script> </script>
{{end}} {{end}}