vicrodh
45cbe24206
Replace the heavy reused SearchResultsView and FavoritesView on the kiosk search/favorites routes with Pi-light versions built from the shared kiosk cards: KioskAlbumGrid (wrapping grid of KioskCard), KioskArtistCard (round), KioskTrackRow. KioskSearch tabs All/Albums/Tracks/Artists/Playlists reading SearchState; KioskLibrary tabs Tracks/Albums/Artists/Playlists/Labels reading FavoritesState. Both bind the shared models so the artwork pipeline pushes covers in with no request hook (album covers windowed = first ~60 for now). Validated via slintcheck. cc
36 lines
1.4 KiB
Plaintext
36 lines
1.4 KiB
Plaintext
// KioskAlbumGrid — a lightweight wrapping grid of KioskCards for the kiosk
|
|
// Search/Library album tabs (2.0.2 frente #3). Absolute-positioned cells
|
|
// (Math.mod/Math.floor columns, the same idiom the desktop grids use) inside a
|
|
// vertical Flickable; card width derives from the grid width so it reflows.
|
|
// Binds `[AlbumCardItem]` directly so the artwork pipeline's in-place pushes
|
|
// land on the cards.
|
|
import { AlbumCardItem } from "../state.slint";
|
|
import { KioskCard } from "KioskCard.slint";
|
|
|
|
export component KioskAlbumGrid inherits Flickable {
|
|
in property <[AlbumCardItem]> albums;
|
|
in property <int> columns: 6;
|
|
in property <length> gap: 16px;
|
|
in property <length> pad: 16px;
|
|
callback open(string);
|
|
|
|
property <length> card-w: (self.width - 2 * root.pad - (root.columns - 1) * root.gap) / root.columns;
|
|
property <length> card-h: root.card-w + 46px;
|
|
property <float> rows: Math.ceil(root.albums.length / root.columns);
|
|
|
|
viewport-width: self.width;
|
|
viewport-height: root.rows * (root.card-h + root.gap) + root.pad;
|
|
|
|
Rectangle {
|
|
for album[i] in root.albums: KioskCard {
|
|
x: root.pad + Math.mod(i, root.columns) * (root.card-w + root.gap);
|
|
y: root.pad + Math.floor(i / root.columns) * (root.card-h + root.gap);
|
|
art-size: root.card-w;
|
|
album: album;
|
|
clicked(id) => {
|
|
root.open(id);
|
|
}
|
|
}
|
|
}
|
|
}
|