Fonoteca Pontes

Context

Fonoteca Pontes este platforma audio de teatru radiofonic a Asociației Pontes — cea mai mare colecție de piese de teatru în limba română, destinată persoanelor cu deficiențe de vedere. Platforma pune la dispoziție sute de piese de teatru radiofonic, organizate pe decenii, autori, actori și genuri, cu redare directă în browser sau pe dispozitivul Android.

Sistemul este cross-platform: o aplicație web Angular 22 și o aplicație Android nativă (Java) împart același backend API și aceeași bază de date, oferind o experiență completă pe orice dispozitiv.

Caracteristici principale

• Catalog cu sute de piese — navigare ierarhică pe categorii, autori, actori, decenii, ani și etichete
• Player audio complet — redare cu control viteză (0.5×–2×), sleep timer, salt la timp, comenzi rapide de tastatură (Ctrl+Space, săgeți)
• Liste de redare — creează, amestecă, șterge trackuri; persistă între sesiuni; exportă în RSS, PLS și M3U
• Topuri & clasamente — cele mai ascultate, cele mai noi, top actori
• Profil actori — browse actori de teatru radiofonic cu integrare Wikipedia
• Navigare pe decenii/ani — grupează piesele după deceniul sau anul difuzării
• Etichete (tag cloud) — navigare prin etichete de gen cu interfață filtrabilă
• Selecție aleatorie — alege piese random din categorii specifice
• Descărcare offline — utilizatorii pot descărca fișiere MP3 pentru ascultare offline
• Autentificare cont — acces pe bază de cont cu JWT (access + refresh token)
• Temă light/dark — design editorial „Forest Studio“ cu paletă verde organic

Arhitectură

┌───────────────────────────────────────────────────────────┐
│                     FONOTECA PONTES                        │
├───────────────────┬───────────────────────────────────────┤
│   Angular 22 SPA  │      Android (Java)                  │
│   Standalone      │      ViewPager2 + Media3             │
│   RxJS + Signals  │      ORMLite SQLite cache            │
│   Angular Material│      Chromecast + NanoHTTPD          │
├───────────────────┴───────────────────────────────────────┤
│              pontes.ro/fonoteca/api/                       │
│   Node.js / Express (WIP) → PHP (producție) + MariaDB    │
└───────────────────────────────────────────────────────────┘

Frontend web Angular

Interfața web modernă este construită cu Angular 22 în arhitectură standalone (fără NgModule-uri), cu zoneless change detection și RxJS Signals. Designul „Forest Studio“ folosește o paletă verde organic (#3d6600) cu typografie Playfair Display + Source Sans 3, peste 2600 de linii de tokeni CSS custom properties.

Caracteristici

• Player persistent — bara de redare rămâne vizibilă în timpul navigării, cu controale complete și suport pentru comenzi rapide de tastatură
• Căutare full-text — autocomplete pe titluri, autori, actori, cu suport pentru diacritice
• Breadcrumb ierarhic — navigare profundă prin catalog cu indicație clară a poziției curente
• Panou administrare — analytics cu grafice temporale (Chart.js): ascultări, descărcări, căutări în timp, top utilizatori, distribuție pe categorii, heatmap activitate, breakdown platformă
• JWT auth — access token (15 min) + refresh token (30 zile) cu reîmprospătare automată la 401

Aplicația Android

Aplicația Android nativă este scrisă în Java și folosește un layout cu 3 taburi: „Fonoteca“ (bibliotecă + căutare), „Player“ (redare), „Fișiere“ (manager fișiere locale).

Caracteristici

• Media3 ExoPlayer — redare audio profesională cu suport pentru liste de redare, control viteză și sleep timer
• Chromecast — integrare Google Cast Framework cu server HTTP local NanoHTTPD pentru streaming
• Cache offline ORMLite — metadatele pieselor și listele de redare se persistă în SQLite
• Descărcare MP3 — fișierele audio se descarcă prin Android DownloadManager pentru ascultare offline

Repere tehnice

• Angular 22 standalone — arhitectură fără NgModule-uri, bootstrapping cu bootstrapApplication, lazy loading, control flow syntax
• RxJS + Signals — state management reactiv cu BehaviorSubject în servicii și signal/computed în componente
• Node.js/Express backend — 15 module de rutare, JWT middleware, caching în memorie (node-cache), migrare activă din PHP legacy
• PHP backend legacy — 7 scripturi API (api.php, auth.php, users.php, log.php, analytics.php) în producție live
• Android Java — 3-tab ViewPager2, Media3 ExoPlayer, ORMLite SQLite, Chromecast + NanoHTTPD, versiunea 1.7.2
• Admin analytics — agregare temporală configurabilă (zi/săptămână/lună), topuri conținut, distribuție categorii, heatmap activitate

Galerie

• Ecran principal — bibliotecă audio cu categorii și căutare
• Player — redare cu controale de viteză, sleep timer și progress bar
• Detaliu piesă — autor, actori, an, descriere și etichete
• Autentificare — login și înregistrare cont
• Topuri — cele mai ascultate piese și autori
• Navigare actori — browse actori cu integrare Wikipedia
• Panou administrare — statistici și analytics