Files
qbz/crates/qbz-slint/ui/discover/QobuzMixesRow.slint
T
vicrodh 82129cff35 feat(slint): LocalLibrary ephemeral folders + Folders tree 1:1 port
Ephemeral folders: open / browse / play a folder without indexing it —
album-grouped pane, CUE seek fast-path (no full re-decode per virtual track),
folder-path persistence + rehydrate, "already playing" add-vs-replace choice
dialog (ephemeral-only), and now-playing / queue / menu gating so an ephemeral
track exposes no persistence actions.

Folders tree brought 1:1 with Tauri:
- Rail header: select-mode, collapse-all, open-ephemeral, tree search.
- Resizable rail (default ~20% narrower; drag handle, min 50% default /
  max 50% of the content area).
- Subfolder cover grid + grid/list toggle, recursive track count, name search;
  compact icon bulk bar (folder-check / play-next / queue / playlist / clear).
- Tree is the default mode; circular checkboxes homologated with TrackRow;
  compact rows (smaller type + icon, no ambiguous trailing count).
- Flat/Tree icon toggle (disc-album / folder-tree), floated right.

Per-source TrackRow context menu (logic, not a blanket trim): Qobuz/offline =
full; local = play/next/queue + add-to-playlist; plex/ephemeral = play/next/
queue only.

App-wide standard: Math.round pixel-snap on icon centering across the UI to
kill sub-pixel blur (CircleAction, header back/forward/collapse, and the rest).
NowPlayingBar context icon -> turntable (frees disc-album for the Folders
toggle). New assets: folder-check, folder-tree, turntable.

cc
2026-06-07 10:12:59 -06:00

108 lines
3.4 KiB
Plaintext

// Discover > For You "Qobuz Mixes" — port of Tauri's QobuzMixesRow.
// Four 220px navigation tiles (DailyQ / WeeklyQ / FavQ / TopQ): a
// gradient artwork with a badge + name, and a description below. Pure
// navigation entries (no per-tile data); the mix detail views they
// open are a separate feature, so the callbacks are logged for now.
import { Theme } from "../foundation/semantic-colors.slint";
import { Typography } from "../foundation/typography.slint";
component MixTile inherits Rectangle {
in property <brush> gradient;
in property <string> badge;
in property <string> name;
in property <string> desc;
callback clicked();
width: 220px;
height: 268px;
VerticalLayout {
spacing: 8px;
// Gradient artwork.
Rectangle {
width: 220px;
height: 220px;
border-radius: 8px;
background: root.gradient;
clip: true;
Text {
text: root.badge;
x: 12px;
y: 12px;
color: #ffffffcc;
font-size: 10px;
font-weight: Typography.semibold;
letter-spacing: 1px;
}
Text {
text: root.name;
x: Math.round((parent.width - self.width) / 2 / 1px) * 1px;
y: Math.round((parent.height - self.height) / 2 / 1px) * 1px;
color: #ffffff;
font-size: 22px;
font-weight: Typography.bold;
}
ta := TouchArea {
mouse-cursor: pointer;
clicked => {
root.clicked();
}
}
}
Text {
text: root.desc;
color: Theme.text-muted;
font-size: 12px;
wrap: word-wrap;
width: 220px;
}
}
}
export component QobuzMixesRow inherits VerticalLayout {
callback open-mix(string /* daily | weekly | fav | top */);
spacing: 12px;
Text {
text: @tr("Qobuz Mixes");
color: Theme.text-primary;
font-size: 18px;
font-weight: Typography.semibold;
}
HorizontalLayout {
spacing: 32px;
alignment: start;
MixTile {
gradient: @linear-gradient(135deg, #1e3a8a 0%, #6366f1 50%, #c084fc 100%);
badge: "qobuz";
name: "DailyQ";
desc: @tr("Elevate your day with a customized selection of music.");
clicked => { root.open-mix("daily"); }
}
MixTile {
gradient: @linear-gradient(135deg, #065f46 0%, #10b981 50%, #fbbf24 100%);
badge: "qobuz";
name: "WeeklyQ";
desc: @tr("Take a weekly journey with a fresh mix every Friday.");
clicked => { root.open-mix("weekly"); }
}
MixTile {
gradient: @linear-gradient(135deg, #7f1d1d 0%, #ef4444 50%, #fb923c 100%);
badge: "qbz";
name: "FavQ";
desc: @tr("A fresh shuffle from your personal library.");
clicked => { root.open-mix("fav"); }
}
MixTile {
gradient: @linear-gradient(135deg, #1f2937 0%, #4b5563 50%, #fbbf24 100%);
badge: "qbz";
name: "TopQ";
desc: @tr("Discover new music from your most-played playlists.");
clicked => { root.open-mix("top"); }
}
}
}