58 lines
2.7 KiB
Plaintext
58 lines
2.7 KiB
Plaintext
<section class="hero">
|
|
<h1>Listen to the library</h1>
|
|
<p class="muted">Browse playlists and songs, or dive into the full catalog.</p>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>Featured playlists <a href="/playlists" class="muted small" style="font-weight:normal">(show all)</a></h2>
|
|
<% if (featured.length === 0) { %>
|
|
<p class="muted">No playlists yet.</p>
|
|
<% } else { %>
|
|
<div class="grid">
|
|
<% featured.forEach((p) => { %>
|
|
<a class="card" href="/playlists/<%= p.slug %>" data-playlist-id="<%= p.id %>">
|
|
<% if (p.coverPath) { %>
|
|
<img src="/media/<%= p.coverPath %>" alt="" />
|
|
<% } else { %>
|
|
<div class="cover-fallback">🎧</div>
|
|
<% } %>
|
|
<div class="card-body">
|
|
<div class="card-title"><%= p.title %>
|
|
<% if (p.visibility === 'logged_in') { %><span class="badge badge-logged-in">Members</span><% } %>
|
|
<% if (p.visibility === 'vip') { %><span class="badge badge-vip">VIP</span><% } %>
|
|
<% if (p.visibility === 'private') { %><span class="badge badge-private">Private</span><% } %>
|
|
</div>
|
|
<% if (p.description) { %><div class="muted small"><%= p.description %></div><% } %>
|
|
<div class="card-footer">
|
|
<% if (p.createdByName) { %><div class="card-creator">Created by:<br><%= p.createdByName %></div><% } %>
|
|
<div class="card-social">
|
|
<button type="button"
|
|
class="btn-social<%= p.userLiked ? ' active' : '' %>"
|
|
data-social-action="like" data-social-type="playlist" data-social-id="<%= p.id %>"
|
|
<% if (!user) { %>data-require-login<% } %>
|
|
aria-pressed="<%= p.userLiked ? 'true' : 'false' %>"
|
|
>👍 <span class="social-count"><%= p.likeCount || 0 %></span></button>
|
|
<button type="button"
|
|
class="btn-social<%= p.userFavorited ? ' active' : '' %>"
|
|
data-social-action="favorite" data-social-type="playlist" data-social-id="<%= p.id %>"
|
|
<% if (!user) { %>data-require-login<% } %>
|
|
aria-pressed="<%= p.userFavorited ? 'true' : 'false' %>"
|
|
>⭐ <span class="social-count"><%= p.favoriteCount || 0 %></span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
<% }) %>
|
|
</div>
|
|
<% } %>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>Recently added <a href="/songs" class="muted small" style="font-weight:normal">(show all)</a></h2>
|
|
<% if (recent.length === 0) { %>
|
|
<p class="muted">No songs yet. <% if (user && user.role === 'admin') { %><a href="/mymusic/songs/new">Upload the first one →</a><% } %></p>
|
|
<% } else { %>
|
|
<%- include('../partials/song_list', { songs: recent }) %>
|
|
<% } %>
|
|
</section>
|