Browse Source

Use consistent indentation in templates

main
Matt Baer 2 years ago
parent
commit
e64dae9c2d
2 changed files with 88 additions and 88 deletions
  1. +7
    -7
      mixtape.tmpl
  2. +81
    -81
      templates/parts.tmpl

+ 7
- 7
mixtape.tmpl View File

@@ -51,25 +51,25 @@
<body>
<div id="wrapper">
<h1>Mixtape</h1>
{{template "player" .Tracks}}
{{template "player" .Tracks}}
<div id="controls">
<a id="prev" href="#prev">&#x23EE; Previous</a>
<a id="next" href="#next">Next &#x23ED;</a>
</div>
{{template "playlist" .Tracks}}
{{template "playlist-js"}}
{{template "playlist" .Tracks}}
{{template "playlist-js"}}
</div>
</body>
</html>
{{end}}

{{define "track-info"}}
{{if eq .Num 1}}
{{if eq .Num 1}}
<p>[Here I might introduce this mix.]</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>
{{else if eq .Num 5}}
{{else if eq .Num 5}}
<p>[Some notes about track 5.]</p>
{{end}}
{{end}}
{{end}}

+ 81
- 81
templates/parts.tmpl View File

@@ -1,102 +1,102 @@
{{define "player"}}
{{with $x := index . 0}}
<audio id="player" preload="auto" tabindex="0" controls>
<source src="{{$x.Filename}}">
</audio>
{{end}}
{{with $x := index . 0}}
<audio id="player" preload="auto" tabindex="0" controls>
<source src="{{$x.Filename}}">
</audio>
{{end}}
{{end}}
{{define "playlist"}}
<ol id="playlist">
{{range $i, $el := .}}
<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>
{{template "track-info" $el}}
</li>
{{end}}
</ol>
<ol id="playlist">
{{range $i, $el := .}}
<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>
{{template "track-info" $el}}
</li>
{{end}}
</ol>
{{end}}

{{define "track-info"}}{{end}}

{{define "full-player"}}
{{template "player" .}}
{{template "playlist" .}}
{{template "playlist-js"}}
{{template "player" .}}
{{template "playlist" .}}
{{template "playlist-js"}}
{{end}}

{{define "playlist-js"}}
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function() {
var current = 0;
var $audio = $('#player');
var $playlist = $('#playlist');
var $tracks = $playlist.find('li a.track');
var len = $tracks.length;
$(document).ready(function () {
var current = 0;
var $audio = $('#player');
var $playlist = $('#playlist');
var $tracks = $playlist.find('li a.track');
var len = $tracks.length;

$playlist.on('click', 'a.track', function (e) {
e.preventDefault();
link = $(this);
current = link.parent().index();
play(link, $audio[0]);
});
$audio[0].addEventListener('play', function (e) {
var $link = $('li.active > a');
setTrackMetadata($link);
});
$audio[0].addEventListener('ended', function (e) {
playNext();
});
$('a#next').on('click', function (e) {
e.preventDefault();
playNext();
});
$('a#prev').on('click', function (e) {
e.preventDefault();
playPrev();
});
$playlist.on('click', 'a.track', function (e) {
e.preventDefault();
link = $(this);
current = link.parent().index();
play(link, $audio[0]);
});
$audio[0].addEventListener('play', function (e) {
var $link = $('li.active > a');
setTrackMetadata($link);
});
$audio[0].addEventListener('ended', function (e) {
playNext();
});
$('a#next').on('click', function (e) {
e.preventDefault();
playNext();
});
$('a#prev').on('click', function (e) {
e.preventDefault();
playPrev();
});

function playPrev() {
current--;
if (current < 0) {
current = len - 1;
}
link = $playlist.find('a.track')[current];
play($(link), $audio[0]);
}
function playPrev() {
current--;
if (current < 0) {
current = len - 1;
}
link = $playlist.find('a.track')[current];
play($(link), $audio[0]);
}

function playNext() {
current++;
if (current == len) {
current = 0;
}
link = $playlist.find('a.track')[current];
play($(link), $audio[0]);
}
function playNext() {
current++;
if (current == len) {
current = 0;
}
link = $playlist.find('a.track')[current];
play($(link), $audio[0]);
}

function setTrackMetadata($link) {
if ('mediaSession' in navigator) {
// Set track metadata
navigator.mediaSession.metadata = new MediaMetadata({
title: $link.data('title'),
artist: $link.data('artist'),
});
}
}
function setTrackMetadata($link) {
if ('mediaSession' in navigator) {
// Set track metadata
navigator.mediaSession.metadata = new MediaMetadata({
title: $link.data('title'),
artist: $link.data('artist'),
});
}
}

function play($link, $player) {
$player.src = $link.attr('href');
par = $link.parent();
par.addClass('active').siblings().removeClass('active');
$player.load();
$player.play();
}
function play($link, $player) {
$player.src = $link.attr('href');
par = $link.parent();
par.addClass('active').siblings().removeClass('active');
$player.load();
$player.play();
}

if ('mediaSession' in navigator) {
// Listen for MediaSession events
navigator.mediaSession.setActionHandler('nexttrack', playNext);
navigator.mediaSession.setActionHandler('previoustrack', playPrev);
}
});
if ('mediaSession' in navigator) {
// Listen for MediaSession events
navigator.mediaSession.setActionHandler('nexttrack', playNext);
navigator.mediaSession.setActionHandler('previoustrack', playPrev);
}
});
</script>
{{end}}

Loading…
Cancel
Save