edi/buzzer_2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

File upload. Yeah

Browse Source
This commit is contained in:
Eduard Iten
2026-03-17 15:02:34 +01:00
parent 6ec66cd9da
commit 574ab9fa30
19 changed files with 1479 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
webpage/src/components/FileListItem.svelte
View File

@@ -1,16 +1,13 @@
<script lang="ts">
import type { BuzzerFile } from "../lib/types";
import { type BuzzerFile, SyncState } from "../lib/types";
import {
MusicNotesIcon,
DotsThreeVerticalIcon,
PlayIcon,
TrashIcon,
InfoIcon,
PencilIcon,
CircleIcon,
QuestionIcon,
UserCircleCheckIcon,
WarningCircleIcon,
PersonIcon,
TagIcon,
UserIcon,
} from "phosphor-svelte";
@@ -20,6 +17,7 @@
transferDetails,
buzzerAudioFiles,
localAudioFiles,
syncStateMap,
} from "../lib/store";
import { SETTINGS } from "../lib/settings";
@@ -43,6 +41,8 @@
return "default";
})();
$: syncStatus = $syncStateMap[type][file.name] || { state: SyncState.UNKNOWN, linkedFiles: [] };
function toggleSelection() {
if ($isFetchingRemote) return;
@@ -102,39 +102,34 @@
</div>
<div class="flex items-center gap-0 text-xs text-text-muted mt-0.5 min-w-0">
{#if file.sysTags?.crc32}
{#if syncStatus.state === SyncState.UNKNOWN}
<span
use:tooltip={{
text:
"crc32: <span class='font-mono'>0x" +
file.sysTags.crc32.toString(16).toUpperCase() +
"</span>",
pos: "right",
"Dieser Datei fehlt der CRC32-Tag. Bitte aktualisiere über das Menu die Metadaten.",
pos: "right",
variant: "warning",
}}
>
<CircleIcon weight="fill" class="mr-1 shrink-0 text-emerald-600 w-3.5 h-3.5" />
</span>
{:else}
<span
use:tooltip={{
text: "Keine Prüfsumme in den Tags verfügbar. Bitte aktualisiere über das Menü die CRC32-Tags.",
pos: "right",
variant: "warning",
}}
>
<QuestionIcon weight="fill" class="mr-1 shrink-0 text-amber-500 w-3.5 h-3.5" />
</span>
{/if}
<span class="font-light shrink-0">
{parseFloat((file.size / 1024).toFixed(1))}&thinsp;kB
</span>
{#if file.metaTags?.a}
<UserIcon weight="fill" class="ml-1 pl-1 mr-0.5 shrink-0 text-slate-500 w-4.5 h-3.5 border-l border-l-text-muted" />
<UserIcon
weight="fill"
class="ml-1 pl-1 mr-0.5 shrink-0 text-slate-500 w-4.5 h-3.5 border-l border-l-text-muted"
/>
<span class="truncate min-w-0">{file.metaTags.a}</span>
{/if}
{#if file.metaTags?.c}
<TagIcon weight="fill" class="ml-1 pl-1 mr-0.5 shrink-0 text-slate-500 w-4.5 h-3.5 border-l border-l-text-muted" />
<TagIcon
weight="fill"
class="ml-1 pl-1 mr-0.5 shrink-0 text-slate-500 w-4.5 h-3.5 border-l border-l-text-muted"
/>
<span class="truncate min-w-0">{file.metaTags.c}</span>
{/if}
</div>
@@ -156,7 +151,7 @@
menuOpen = false;
}}
>
<TrashIcon class="w-5 h-5" />
<TrashIcon class="list-menu-icon" />
</button>
<button
class="menu-btn"
@@ -166,18 +161,17 @@
menuOpen = false;
}}
>
<PlayIcon class="w-5 h-5" />
<PlayIcon class="list-menu-icon" />
</button>
<button
class="menu-btn"
title="Datei-Info"
on:click|stopPropagation={() => {
console.log("Info", file.name);
tagEditorState.set({ show: true, type, fileName: file.name });
menuOpen = false;
}}
>
<InfoIcon class="w-5 h-5" />
<PencilIcon class="list-menu-icon" />
</button>
</div>
@@ -185,7 +179,7 @@
class="menu-btn !border-r-transparent"
on:click|stopPropagation={() => (menuOpen = !menuOpen)}
>
<DotsThreeVerticalIcon class="w-5 h-5" />
<DotsThreeVerticalIcon class="list-menu-icon" />
</button>
</div>
</div>
@@ -196,17 +190,17 @@
.menu-btn-grp {
@apply absolute right-2 top-1/2 -translate-y-1/2 z-20 overflow-hidden
p-0 flex items-center backdrop-blur-sm
border border-transparent rounded-full transition-all;
rounded-full transition-all;
}
/* Kombiniert Hover von Mausnutzern und aktiven Touch-Zustand */
.menu-btn-grp:hover,
.menu-btn-grp.is-open {
@apply border-border-card bg-white shadow-sm;
@apply bg-white shadow-sm;
}
.menu-btn {
@apply p-1.5 border-r border-r-border-card
@apply border-r border-r-border-card
flex items-center justify-center shrink-0 transition-colors;
&:not(:disabled):not(.danger) {