fix nonexistent filenames for song entry component
This commit is contained in:
@@ -14,6 +14,7 @@
|
||||
removeTrack,
|
||||
} from "$lib/player/player.svelte";
|
||||
import { type SongType, trackFromSongRow } from "$lib/player/types";
|
||||
import { Button } from "./ui/button";
|
||||
|
||||
type SongEntryProps = {
|
||||
annSongId: number;
|
||||
@@ -69,15 +70,22 @@
|
||||
</script>
|
||||
|
||||
<div class="rounded border flex flex-wrap items-center gap-2 px-3 py-2">
|
||||
<a
|
||||
type="button"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn-icon"
|
||||
href={`https://nawdist.animemusicquiz.com/${fileName}`}
|
||||
>
|
||||
<ExternalLink class="icon-btn" />
|
||||
</a>
|
||||
{#if !fileName}
|
||||
<button disabled class="btn-icon opacity-50">
|
||||
<ExternalLink class="icon-btn bg-muted" />
|
||||
</button>
|
||||
{:else}
|
||||
<a
|
||||
aria-disabled={!fileName}
|
||||
type="button"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn-icon"
|
||||
href={`https://nawdist.animemusicquiz.com/${fileName}`}
|
||||
>
|
||||
<ExternalLink class="icon-btn" />
|
||||
</a>
|
||||
{/if}
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-wrap w-fit items-baseline gap-x-2 gap-y-1">
|
||||
{animeName}
|
||||
@@ -92,65 +100,64 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-2 flex items-center ml-auto gap-2">
|
||||
{#if isQueued}
|
||||
<span class="text-xs text-muted-foreground">Queued</span>
|
||||
{#if !track}
|
||||
<span class="text-xs text-muted-foreground ml-auto">No audio file</span>
|
||||
{:else}<div class="mt-2 flex items-center ml-auto gap-2">
|
||||
{#if isQueued}
|
||||
<span class="text-xs text-muted-foreground">Queued</span>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
title="Remove from queue"
|
||||
aria-label="Remove from queue"
|
||||
onclick={() => removeTrack(annSongId)}
|
||||
>
|
||||
<Trash2 class="icon-btn" />
|
||||
</button>
|
||||
{/if}
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
title="Remove from queue"
|
||||
aria-label="Remove from queue"
|
||||
onclick={() => removeTrack(annSongId)}
|
||||
disabled={!track}
|
||||
title="Play"
|
||||
aria-label="Play"
|
||||
onclick={() => {
|
||||
if (!track) return;
|
||||
play(track);
|
||||
requestGlobalAutoplay();
|
||||
}}
|
||||
>
|
||||
<Trash2 class="icon-btn" />
|
||||
<PlayIcon class="icon-btn" />
|
||||
</button>
|
||||
{/if}
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
disabled={!track}
|
||||
title="Play"
|
||||
aria-label="Play"
|
||||
onclick={() => {
|
||||
if (!track) return;
|
||||
play(track);
|
||||
requestGlobalAutoplay();
|
||||
}}
|
||||
>
|
||||
<PlayIcon class="icon-btn" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
disabled={!track}
|
||||
title="Play next"
|
||||
aria-label="Play next"
|
||||
onclick={() => {
|
||||
if (!track) return;
|
||||
playNext(track);
|
||||
requestGlobalAutoplay();
|
||||
}}
|
||||
>
|
||||
<SkipForward class="icon-btn" />
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
disabled={!track}
|
||||
title="Play next"
|
||||
aria-label="Play next"
|
||||
onclick={() => {
|
||||
if (!track) return;
|
||||
playNext(track);
|
||||
requestGlobalAutoplay();
|
||||
}}
|
||||
>
|
||||
<SkipForward class="icon-btn" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
disabled={!track}
|
||||
title="Add to queue"
|
||||
aria-label="Add to queue"
|
||||
onclick={() => {
|
||||
if (!track) return;
|
||||
addToQueue(track);
|
||||
}}
|
||||
>
|
||||
<ListPlus class="icon-btn" />
|
||||
</button>
|
||||
|
||||
{#if !track}
|
||||
<span class="text-xs text-muted-foreground">No audio file</span>
|
||||
{/if}
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon"
|
||||
disabled={!track}
|
||||
title="Add to queue"
|
||||
aria-label="Add to queue"
|
||||
onclick={() => {
|
||||
if (!track) return;
|
||||
addToQueue(track);
|
||||
}}
|
||||
>
|
||||
<ListPlus class="icon-btn" />
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user