Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/y2k. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
50 lines
1.7 KiB
Plaintext
50 lines
1.7 KiB
Plaintext
package main
|
|
|
|
// waveformPlayerComponent renders a Soundcloud-style horizontal player. The
|
|
// canvas waveform is filled client-side from the audio source using WebAudio
|
|
// peak decode (v0.1 strategy noted in the spec's open questions).
|
|
templ waveformPlayerComponent(data WaveformPlayerData) {
|
|
<figure
|
|
class="y2k-bevel y2k-chrome-bg rounded-xl overflow-hidden flex items-stretch gap-4 p-3 my-4"
|
|
data-block-key="y2k:waveform_player"
|
|
>
|
|
<div class="w-20 h-20 shrink-0 y2k-image-frame overflow-hidden bg-muted">
|
|
if data.CoverImage != "" {
|
|
<img src={ data.CoverImage } alt={ data.TrackTitle } class="w-full h-full object-cover"/>
|
|
} else {
|
|
<svg viewBox="0 0 24 24" class="w-full h-full text-muted-foreground p-4" fill="currentColor" aria-hidden="true">
|
|
<path d="M9 19V6l11-3v13"/>
|
|
</svg>
|
|
}
|
|
</div>
|
|
<div class="flex-1 min-w-0 flex flex-col justify-between gap-2">
|
|
<figcaption class="flex items-baseline justify-between gap-3 min-w-0">
|
|
<span class="y2k-heading text-base truncate text-foreground">{ trackTitleOr(data.TrackTitle) }</span>
|
|
if data.Artist != "" {
|
|
<span class="text-xs uppercase tracking-wider text-muted-foreground shrink-0">{ data.Artist }</span>
|
|
}
|
|
</figcaption>
|
|
<canvas
|
|
class="w-full h-12 bg-muted/40 rounded"
|
|
data-y2k-waveform
|
|
data-audio-url={ data.AudioURL }
|
|
aria-label="audio waveform"
|
|
></canvas>
|
|
if data.AudioURL != "" {
|
|
<audio controls preload="none" class="w-full" src={ data.AudioURL }>
|
|
Your browser does not support the audio element.
|
|
</audio>
|
|
} else {
|
|
<p class="text-xs text-muted-foreground">No audio source configured.</p>
|
|
}
|
|
</div>
|
|
</figure>
|
|
}
|
|
|
|
func trackTitleOr(s string) string {
|
|
if s == "" {
|
|
return "untitled track"
|
|
}
|
|
return s
|
|
}
|