mirror of
https://github.com/Psychotoxical/psysonic.git
synced 2026-07-21 23:05:46 +00:00
feat(stats): shareable Top-Albums card export (#425)
* feat(stats): add shareable Top-Albums card export
Adds a shareable PNG export of the user's most-played albums,
available from the Statistics page under the "Most Played Albums"
section header.
Layout:
* 3 formats — Story (1080×1920, 9:16), Square (1080×1080), Twitter
Card (1200×675, 16:9). Story and Square stack a centered URL footer;
Twitter packs logo + label + URL into a single header row.
* 3 grid sizes — 3×3 (default), 4×4, 5×5. Modal fetches up to 25
frequent albums on open so larger grids work even when the entry
surface only loaded a handful.
* Cover tiles render the rank + play count in a thin black info strip
at the bottom of the cover (rank left, "N Plays" right).
* Header label is hardcoded English ("Top Albums") so a shared image
remains legible to followers who don't share the user's UI language.
Caller can override via `opts.meta`.
Source path is local-only — `getAlbumList(type='frequent')` from
Subsonic. Last.fm is intentionally not used.
Implementation:
* `src/utils/exportAlbumCard.ts` — pure Canvas-API renderer. Reads
theme accent / bg from the document's CSS variables so the export
matches the active theme. Cover art is loaded through the existing
`getCachedBlob` IndexedDB cache, so repeated exports are cheap.
Wordmark is rendered from the `PsysonicLogo` React component via
`renderToStaticMarkup`, with both gradient stops baked to a single
accent color for crisp single-tone branding.
* `src/components/StatsExportModal.tsx` — UI: format + grid pickers,
live downscaled preview, native save dialog via
`@tauri-apps/plugin-dialog` + `plugin-fs`.
* `src/components/AlbumRow.tsx` — adds optional `headerExtra` slot so
the share button sits next to the existing scroll-nav arrows.
* i18n keys added under `statistics.*` (`en`, `de`) — other locales
fall back to English.
* docs(changelog): add Top-Albums card export for PR #425
This commit is contained in:
committed by
GitHub
parent
297c9f1125
commit
7064ca500e
@@ -1179,6 +1179,24 @@ export const deTranslation = {
|
||||
topRatedArtists: 'Bestbewertete Künstler',
|
||||
noRatedSongs: 'Noch keine bewerteten Songs. Songs in Album- oder Playlist-Ansicht bewerten.',
|
||||
noRatedArtists: 'Noch keine bewerteten Künstler.',
|
||||
exportShare: 'Teilen',
|
||||
exportTitle: 'Top-Alben teilen',
|
||||
exportSubtitle: 'Ein teilbares Bild deiner meistgespielten Alben erstellen.',
|
||||
exportFormat: 'Format',
|
||||
exportFormatStory: 'Story',
|
||||
exportFormatSquare: 'Quadrat',
|
||||
exportFormatTwitter: 'Twitter-Card',
|
||||
exportGrid: 'Raster',
|
||||
exportGridLabel: '{{n}}×{{n}}',
|
||||
exportPreview: 'Vorschau',
|
||||
exportGenerate: 'Erstellen',
|
||||
exportSave: 'Bild speichern…',
|
||||
exportCancel: 'Abbrechen',
|
||||
exportFooterLabel: 'Top-Alben',
|
||||
exportNotEnough: 'Für ein {{n}}×{{n}}-Raster braucht es mindestens {{count}} Alben in der Library.',
|
||||
exportSaving: 'Speichere…',
|
||||
exportSaved: 'Gespeichert.',
|
||||
exportSaveFailed: 'Bild konnte nicht gespeichert werden.',
|
||||
},
|
||||
player: {
|
||||
regionLabel: 'Musikplayer',
|
||||
|
||||
Reference in New Issue
Block a user