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