terminal based website playing music now

This commit is contained in:
Priec
2026-05-19 17:13:23 +02:00
parent cbd642c62c
commit e9439382cc
8 changed files with 580 additions and 360 deletions

View File

@@ -1,66 +1,88 @@
{% extends "admin/base.html" %}
{% block title %}Audio Albums{% endblock title %}
{% block title %}Albums{% endblock title %}
{% block crumb %}audio/albums{% endblock crumb %}
{% block content %}
<div class="space-y-2">
<div class="flex flex-wrap items-center justify-between gap-3">
<div>
<h1 class="text-2xl font-bold">Audio Albums</h1>
<p class="text-sm opacity-70">Create albums and upload audio tracks.</p>
</div>
<div class="flex flex-wrap gap-2">
<a href="/admin/audio/tracks" class="btn btn-ghost btn-sm">Songs</a>
<a href="/admin/audio/albums/create" class="btn btn-neutral btn-sm">New album</a>
</div>
<header class="term-cmd">
<div>
<p class="term-cmd-line">
<span class="t-red">root@universal-web</span><span class="t-dim">:</span><span class="t-yellow">/admin/audio</span><span class="t-dim">#</span>
ls albums/
</p>
<h1 class="term-title">albums</h1>
<p class="term-sub">// step 2 — group songs into a release with a cover.</p>
</div>
<div class="term-cmd-actions">
<a href="/admin/audio/albums/create" class="btn btn-primary btn-sm">[ + new album ]</a>
<a href="/admin/audio/tracks" class="btn btn-outline btn-sm">[ songs ]</a>
</div>
</header>
<div class="card border border-base-300 bg-base-100 shadow-sm">
<div class="card-body">
{% if albums | length > 0 %}
<div class="overflow-x-auto">
<table class="table">
<thead>
<tr>
<th>Album</th>
<th>Status</th>
<th>Tracks</th>
<th class="text-right">Actions</th>
</tr>
</thead>
<tbody>
{% for row in albums %}
<tr>
<td class="font-medium">{{ row.album.title }}</td>
<td>
{% if row.album.published %}
<span class="badge">Published</span>
{% else %}
<span class="badge opacity-70">Draft</span>
{% endif %}
</td>
<td>{{ row.track_count }}</td>
<td>
<div class="flex gap-2">
<a href="/admin/audio/albums/{{ row.album.id }}/tracks" class="btn btn-ghost btn-sm">Tracks</a>
<a href="/audio/albums/{{ row.album.slug }}" class="btn btn-ghost btn-sm">View</a>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
<div class="term-note">
<p class="term-note-title"># before you make an album</p>
<div class="term-step">
<span class="term-step-n">[1]</span>
<span><a href="/admin/audio/tracks" class="t-blue">upload your songs</a> first &mdash; an album is built from songs that already exist.</span>
</div>
<div class="term-step">
<span class="term-step-n">[2]</span>
<span>create the album here, then tick the songs that belong to it (or upload more into it later).</span>
</div>
</div>
<div class="card">
<div class="term-head">
<span class="term-dots" aria-hidden="true">
<span class="term-dot r"></span><span class="term-dot y"></span><span class="term-dot g"></span>
</span>
<span class="term-head-name">~/audio/albums/</span>
<span class="term-head-meta term-tag is-purple">{{ albums | length }} albums</span>
</div>
<div class="card-body">
{% if albums | length > 0 %}
<div class="overflow-x-auto">
<table class="table">
<thead>
<tr>
<th>album</th>
<th>status</th>
<th>songs</th>
<th class="text-right">actions</th>
</tr>
</thead>
<tbody>
{% for row in albums %}
<tr>
<td class="font-medium">{{ row.album.title }}</td>
<td>
{% if row.album.published %}
<span class="term-tag is-green">published</span>
{% else %}
<span class="term-tag">draft</span>
{% endif %}
</td>
<td>{{ row.track_count }}</td>
<td>
<div class="flex flex-wrap gap-2">
<a href="/admin/audio/albums/{{ row.album.id }}/tracks" class="btn btn-primary btn-sm">open &amp; edit</a>
<a href="/audio/albums/{{ row.album.slug }}" class="btn btn-ghost btn-sm">view</a>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<div class="term-empty">
<p class="font-medium">no albums yet</p>
<p class="term-empty-cmd">$ create an album to group your songs into a release</p>
<div class="pt-2">
<a href="/admin/audio/albums/create" class="btn btn-primary btn-sm">[ + new album ]</a>
</div>
{% else %}
<div class="text-center">
<p class="font-medium">No albums yet.</p>
<p class="text-sm opacity-70">Create an album before uploading tracks.</p>
<div class="pt-2">
<a href="/admin/audio/albums/create" class="btn btn-neutral btn-sm">New album</a>
</div>
</div>
{% endif %}
</div>
</div>
{% endif %}
</div>
</div>
{% endblock content %}