72f4d2e160
Fork de la librairie headless svelte-podcast transformé en lecteur : radio Funkwhale mizik.o-k-i.net (~2000 titres), page démo RSS Syntax.fm, file de lecture, préférences et progression persistées. État avant refonte playbook OKI (bugs connus : volume inerte, bouton démo RSS cassé en navigation client, cibles tactiles mobiles).
74 lines
3.7 KiB
Markdown
74 lines
3.7 KiB
Markdown
# Radyobòkaz Player
|
|
|
|
Lecteur audio web pour la radio **Radyobòkaz**, hébergée sur l'instance Funkwhale
|
|
[mizik.o-k-i.net](https://mizik.o-k-i.net/library/radios/7) (~2000 titres).
|
|
|
|
Construit sur une version modifiée de [svelte-podcast](https://github.com/OllieJT/svelte-podcast)
|
|
(librairie headless de lecteur audio, voir `src/lib`).
|
|
|
|
## Utilitaires RSS (SSR)
|
|
|
|
La librairie inclut des utilitaires pour consommer des flux RSS de podcasts,
|
|
compatibles SSR (pas de `DOMParser`, parsing via `fast-xml-parser`) :
|
|
|
|
```ts
|
|
// src/routes/podcast/+page.ts
|
|
import { fetch_podcast_feed } from '$lib/rss';
|
|
import type { PageLoad } from './$types';
|
|
|
|
export const load: PageLoad = async ({ fetch }) => ({
|
|
// passer le `fetch` de SvelteKit : SSR, cache et hydration
|
|
feed: await fetch_podcast_feed('https://feed.syntax.fm/rss', fetch),
|
|
});
|
|
```
|
|
|
|
- `fetch_podcast_feed(url, fetcher?)` — télécharge et parse un flux (RSS 2.0 + tags iTunes)
|
|
- `parse_podcast_feed(xml)` — parse une chaîne XML déjà récupérée
|
|
- Types exportés : `PodcastFeed`, `PodcastEpisode` (titre, guid, date ISO, durée en
|
|
secondes, enclosure, pochette, numéros d'épisode/saison, explicit…)
|
|
|
|
Les durées `itunes:duration` sont acceptées aux formats `3723`, `62:03` et `1:02:03`.
|
|
Les épisodes sans enclosure audio sont ignorés. Voir la route `/podcast` pour un
|
|
exemple complet (flux chargé côté serveur, épisodes joués dans le lecteur).
|
|
|
|
## Fonctionnalités
|
|
|
|
- 📻 **Mode radio aléatoire** : file de lecture infinie de titres piochés au hasard
|
|
- 🎵 **Écoute à la carte** : liste complète des titres avec recherche (titre, artiste, album)
|
|
- 🎙️ **Flux RSS de podcasts** : parsing SSR + lecture des épisodes (démo sur `/podcast`)
|
|
- ⏭️ Passage automatique au titre suivant en fin de piste
|
|
- 🎛️ Contrôles : lecture/pause, précédent/suivant, volume, mute, seek
|
|
- 🖼️ Pochette, titre, artiste et album du morceau en cours
|
|
- 🔃 L'audio continue de jouer lors de la navigation entre pages
|
|
|
|
## Développement
|
|
|
|
```bash
|
|
yarn install
|
|
yarn dev # serveur de dev
|
|
yarn build # build statique (adapter-static) dans build/
|
|
yarn run check # svelte-check
|
|
```
|
|
|
|
## Comment ça marche
|
|
|
|
L'API publique de Funkwhale est utilisée côté client, sans authentification :
|
|
|
|
- `GET /api/v1/radios/radios/7/tracks/?page=N&page_size=50` — liste des titres de la radio
|
|
- `GET /api/v1/listen/<uuid>/` — flux audio du titre (CORS ouvert, supporte `Range`)
|
|
|
|
Structure du code :
|
|
|
|
| Fichier | Rôle |
|
|
| ------------------------------- | ----------------------------------------------------------------- |
|
|
| `src/lib/` | Librairie svelte-podcast (store audio, composants headless) |
|
|
| `src/lib/rss.ts` | Utilitaires SSR pour flux RSS de podcasts (parse + fetch) |
|
|
| `src/radio/funkwhale.ts` | Client de l'API Funkwhale |
|
|
| `src/radio/playable.ts` | Type `PlayableTrack` (titre jouable, quelle que soit la source) |
|
|
| `src/radio/radio-store.ts` | File de lecture : mode radio aléatoire / liste, suivant/précédent |
|
|
| `src/radio/library-store.ts` | Chargement progressif de la liste complète des titres |
|
|
| `src/radio/radio-player.svelte` | Barre de lecture (pochette, contrôles, progression) |
|
|
| `src/radio/track-list.svelte` | Liste des titres avec recherche |
|
|
| `src/routes/+page.svelte` | Page radio Radyobòkaz |
|
|
| `src/routes/podcast/` | Démo des utilitaires RSS (flux chargé en SSR, épisodes jouables) |
|