68 lines
2.2 KiB
HTML
68 lines
2.2 KiB
HTML
{{ define "main" }}
|
|
<div id="main">
|
|
<div class="container">
|
|
{{ partial "content.html" . }}
|
|
|
|
{{ $user := default .Site.Data.social.accounts.spotify.username .Params.user }}
|
|
|
|
{{ $playlist := getJSON "https://spotify-public-proxy.d.theorangeone.net/v1/users/" $user "/playlists/" .Params.playlist }}
|
|
|
|
<div class="playlist">
|
|
<h3>
|
|
<i class="fab fa-spotify"></i>
|
|
<a href="{{ $playlist.external_urls.spotify }}">
|
|
{{ $playlist.name }}
|
|
</a>
|
|
</h3>
|
|
{{ if $playlist.tracks.next }}
|
|
<p>Only showing first {{ $playlist.tracks.limit }}. <a href="{{ $playlist.external_urls.spotify }}">See all {{ $playlist.tracks.total }}</a></p>
|
|
{{ end }}
|
|
<table class="table table-hover table-striped table-dark">
|
|
<thead>
|
|
<tr>
|
|
<th scope="row"></th>
|
|
<th scope="row"></th>
|
|
<th scope="row">Track</th>
|
|
<th scope="row">Artist</th>
|
|
<th scope="row">Album</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{{ range sort $playlist.tracks.items "track.name" }}
|
|
{{ with .track }}
|
|
{{ $spotify_url := .external_urls.spotify }}
|
|
<tr>
|
|
{{ with index .album.images 0 }}
|
|
<td>
|
|
<a href="{{ $spotify_url }}"><img src="{{ .url }}" decoding="async" loading="lazy" referrerpolicy="no-referrer"/></a>
|
|
</td>
|
|
{{ end }}
|
|
<td class="text-center">
|
|
{{ if .preview_url }}
|
|
<a href="{{ .preview_url }}"><i class="fas fa-play"></i></a>
|
|
{{ end }}
|
|
</td>
|
|
<td><a href="{{ $spotify_url }}">{{ .name }}</a></td>
|
|
<td>
|
|
{{ range $i, $e := .artists }}{{ if $i }}, {{ end }}{{ .name }}{{ end }}
|
|
</td>
|
|
<td>{{ .album.name }}</td>
|
|
</tr>
|
|
{{ end }}
|
|
{{ end }}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{{ partial "share.html" . }}
|
|
{{ partial "related-content.html" . }}
|
|
</div>
|
|
{{ end }}
|
|
|
|
{{ define "style_extra" }}
|
|
{{ partial "style.html" "css/shareon.css" }}
|
|
{{ end }}
|
|
|
|
{{ define "scripts_extra" }}
|
|
{{ partial "script_async.html" "js/shareon.js" }}
|
|
{{ end }}
|