{{define "head"}}
<title>Admin - ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/admin/static/index.css">
{{end}}

{{define "content"}}
<main class="dashboard">
    <h1>Dashboard</h1>

    <div class="cards">
        <div class="card" id="releases">
            <div class="card-header">
                <h2><a href="/admin/releases/">Releases</a> <small>({{.ReleaseCount}} total)</small></h2>
                <a class="button new" id="create-release">Create New</a>
            </div>
            {{range .Releases}}
            {{block "release" .}}{{end}}
            {{end}}
            {{if not .Releases}}
            <p>There are no releases.</p>
            {{end}}
        </div>

        <div class="card" id="artists">
            <div class="card-header">
                <h2><a href="/admin/artists/">Artists</a></h2>
                <a class="button new" id="create-artist">Create New</a>
            </div>
            {{if .Artists}}
            <div class="artists-group">
                {{range $Artist := .Artists}}
                <div class="artist">
                    <img src="{{$Artist.GetAvatar}}" alt="" width="64" loading="lazy" class="artist-avatar">
                    <a href="/admin/artists/{{$Artist.ID}}" class="artist-name">{{$Artist.Name}}</a>
                </div>       
                {{end}}
            </div>
            {{else}}
            <p>There are no artists.</p>
            {{end}}
        </div>

        <div class="card" id="tracks">
            <div class="card-header">
                <h2><a href="/admin/tracks/">Tracks</a></h2>
                <a class="button new" id="create-track">Create New</a>
            </div>
            <p><em>"Orphaned" tracks that have not yet been bound to a release.</em></p>
            <br>
            {{range $Track := .Tracks}}
            <div class="track">
                <h2 class="track-title">
                    <a href="/admin/tracks/{{$Track.ID}}">{{$Track.Title}}</a>
                </h2>
                {{if $Track.Description}}
                <p class="track-description">{{$Track.GetDescriptionHTML}}</p>
                {{else}}
                <p class="track-description empty">No description provided.</p>
                {{end}}
                {{if $Track.Lyrics}}
                <p class="track-lyrics">{{$Track.GetLyricsHTML}}</p>
                {{else}}
                <p class="track-lyrics empty">There are no lyrics.</p>
                {{end}}
            </div>       
            {{end}}
            {{if not .Artists}}
            <p>There are no artists.</p>
            {{end}}
        </div>
    </div>

</main>

<script type="module" src="/admin/static/admin.js"></script>
<script type="module" src="/admin/static/index.js"></script>
{{end}}