- Parse coreaudio_device_input/output depuis system_profiler (nombre canaux)
- Ajoute sampleRate reel par device
- Ajoute metadata: manufacturer, transport, isDefault
- Filtre devices sans input ni output
- Corrige l'API pour exposer les 11 devices au lieu de 2
- Import LocalAudioTrack depuis @livekit/rtc-node
- Utilise LocalAudioTrack.createAudioTrack() pour creer track depuis source
- Corrige erreur 'Cannot read properties of undefined (reading handle)'
- Permet publication correcte du track audio du bridge
- Import AccessToken depuis livekit-server-sdk
- Generation token avec identity 'AudioBridge' et metadata role:bridge
- Permissions completes (publish, subscribe, data)
- Utilise devkey/secret du serveur LiveKit
- Permet au bridge de se connecter en tant que participant authentifie
- Remplacement livekit-client (navigateur) par @livekit/rtc-node (serveur Node.js)
- Support natif AudioSource/AudioFrame pour gestion PCM bas niveau
- Réception audio via AudioStream asynchrone (for await)
- Publication track audio via AudioSource.captureFrame()
- Permet au serveur d'agir comme participant LiveKit complet
- Suppression dépendance livekit-client inutile côté serveur
- Import dynamique de AudioBridge.js
- Création instance avec config complète (routing, groupes, LiveKit)
- Démarrage effectif du bridge audio
- Gestion erreur pour ne pas bloquer le serveur si pas de carte son
- Remplace le mode placeholder par le vrai système audio
Probleme: AudioLevelsServer creait son propre port (3001) au lieu d'utiliser le serveur HTTP existant (3000)
Solution:
- Modification AudioLevelsServer pour accepter option 'server'
- Si serveur HTTP fourni, utilise WebSocket upgrade sur meme port avec path /audio-levels
- Sinon, fallback sur port standalone (3001)
- Client se connecte maintenant a ws://localhost:3000/audio-levels
Architecture WebSocket:
HTTP GET /config, POST /token (port 3000)
WebSocket ws://localhost:3000/audio-levels (upgrade HTTP)
Plus besoin de port separe pour WebSocket
Probleme: Client tentait de se connecter a ws://localhost:3001 mais serveur n'avait pas de WebSocket demarre
Solution:
- Ajout import AudioLevelsServer dans server/index.js
- Demarrage WebSocket sur meme port que l'API REST (3000)
- Correction port dans useAudioLevels.js (3000 au lieu de 3001)
Le WebSocket audio-levels fonctionne maintenant pour monitoring temps reel
Probleme: naudiodon (bindings PortAudio) causait segfaults sur macOS
Solution: Utiliser sox (Sound eXchange) en subprocess
Modifications CoreAudioBackend.js:
- Remplacement naudiodon par sox (stable, deja installe sur macOS)
- Detection devices via system_profiler SPAudioDataType (vraies cartes)
- Capture audio via sox avec driver coreaudio
- Lecture audio via sox avec stdin/stdout
- Meme API (EventEmitter), compatible avec AudioBridge
Avantages sox:
- Stable (aucun segfault)
- Supporte toutes les cartes CoreAudio (USB, Thunderbolt, virtuelles)
- Multi-canaux natif
- Installe par defaut sur macOS (ou via brew install sox)
- Meme approche que JACK/PipeWire (subprocess)
Detection reelle des cartes:
- Parse system_profiler pour lister VRAIES cartes son
- Focusrite, MOTU, RME, Dante DVS, etc. detectes
- Fallback sur Built-in Mic/Output si aucune carte externe
Modifications package.json:
- Suppression dependance naudiodon (instable)
Modifications install/macos.sh:
- Ajout installation sox via Homebrew
- Detection si deja installe
Plus de warning "devices fictifs" au demarrage !
Phase 3.1 - Support Linux professionnel
Nouveaux backends audio:
- JACKBackend.js : support JACK Audio Connection Kit pour audio pro
- PipeWireBackend.js : support PipeWire (standard moderne Linux)
- Detection automatique dans AudioBridge (PipeWire > JACK > erreur)
Script installation:
- install/linux.sh pour Ubuntu/Debian/Arch/Fedora
- Installation automatique dependencies (Node.js, PipeWire/JACK)
- Telechargement LiveKit Server pour Linux (amd64/arm64)
Fonctionnalites:
- Detection serveur audio (PipeWire/JACK)
- Enumeration devices audio via pactl/jack_lsp
- Capture et lecture audio basse latence (pw-cat, jack_rec/play)
- Messages d'erreur detailles pour troubleshooting
- Compatibilite Ubuntu 22.04+, Debian 11+, Arch Linux, Fedora
TODO.md mis a jour: Phase 3.1 en cours
- Calcul RMS et peak par canal (dBFS)
- Détection clipping automatique
- Broadcast temps réel 20 fois/sec (configurable)
- Support inputs, groups, outputs
- Gestion multi-clients WebSocket
- API pour mise à jour depuis GroupAudioRouter
- Dropdown gain -12dB à +6dB pour chaque route active
- Interface visuelle améliorée (checkbox + gain)
- Gestion gains input->group et group->output
- Sauvegarde gains dans config.yaml
- Design responsive mobile
- Mix de plusieurs canaux physiques vers groupes (gains individuels)
- Distribution groupes vers plusieurs canaux physiques (gains individuels)
- Support canaux partagés avec mixage additif
- Gestion gains par route (-120dB à +6dB)
- Anti-clipping automatique
- Statistiques routing temps réel
- Ajout React.Fragment avec keys pour éliminer warnings
- Import de React pour utiliser React.Fragment
- Meilleure gestion erreurs HTTP (status check)
- Messages d'erreur plus détaillés avec status code
- Logging amélioré pour debugging
- Ajout grid-template-columns dynamique basé sur nombre groupes
- Suppression display:contents qui causait le bug
- Utilisation de fragments React au lieu de div wrapper
- Matrice 1: 120px + N colonnes pour les groupes
- Matrice 2: 120px + 8 colonnes pour les outputs
- Nettoyage CSS classes inutilisées
- API GET/POST /admin/audio/routing
- Composant AudioRoutingMatrix avec 2 matrices :
* Inputs vers Groupes (8 inputs x N groupes)
* Groupes vers Outputs (N groupes x 8 outputs)
- Interface visuelle type grille cliquable
- Intégration noms de canaux personnalisés
- Stockage routing dans config.yaml
- Responsive design avec CSS Grid
- Style cohérent avec interface admin
- API GET /admin/audio/channels/names
- API PUT /admin/audio/channels/names
- Interface admin : nommage 8 inputs/outputs
- Mode édition avec sauvegarde/annulation
- Stockage dans config.yaml (section audio.channelNames)
- Formulaire organisé en 2 colonnes (inputs/outputs)
- ConfigManager: gestionnaire centralisé config avec EventEmitter
- AudioBridgeManager: gestion bridge avec auto-reload sur changement config
- Intégration dans serveur principal (index.js)
- Événements 'audio-device-updated' et 'config-updated'
- Reload automatique du bridge sans redémarrer serveur
- Mode placeholder pour développement (vrai bridge Phase 3)
- Nouvel onglet Audio dans l'interface admin
- Sélection carte son d'entrée/sortie via dropdowns
- Configuration sample rate (44.1/48/96kHz)
- Affichage liste toutes cartes disponibles
- Affichage configuration actuelle
- Sauvegarde vers API backend
Problème : les IDs étaient sauvegardés dans config.yaml alors qu'ils doivent être générés dynamiquement.
Solution :
- saveConfig() nettoie maintenant les IDs avant sauvegarde
- Suppression récursive des 'id' pour groupes et canaux
- config.yaml restauré sans IDs (format propre)
- Les IDs sont uniquement en mémoire après loadConfig()
Garantit :
- config.yaml reste lisible et maintenable
- Pas de conflit d'IDs
- Source de vérité = nom du groupe/canal
- IDs cohérents et prévisibles (slugify)
Problème : l'édition et la suppression de groupes ne fonctionnaient pas car les IDs n'étaient pas persistés dans le YAML.
Solution :
- loadConfig() génère maintenant les IDs à chaque chargement (slugify du nom)
- PUT /admin/groups/:id cherche le groupe par nom slugifié au lieu de l'ID
- DELETE /admin/groups/:id idem
- Les IDs ne sont jamais sauvegardés dans config.yaml (source de vérité = nom)
- Rechargement après mise à jour pour renvoyer les IDs corrects au client
Comportement :
- Création : génère l'ID depuis le nom
- Édition : trouve le groupe par son nom slugifié, sauvegarde sans ID, recharge
- Suppression : trouve le groupe par son nom slugifié
- Les IDs restent cohérents entre les rechargements
Changements de style :
- Utilisation des variables CSS globales (--color-*, --spacing-*)
- Cohérence visuelle avec App.css et index.css
- Suppression emojis du header et boutons (🎛️⚠️✏️🗑️ ✕)
- Remplacement par texte simple ou symboles HTML (×)
- Boutons 'Modifier' et 'Supprimer' au lieu d'icônes
Design system unifié :
- Couleurs : var(--color-primary, --color-surface, etc.)
- Espacements : var(--spacing-xs à --spacing-xl)
- Typographie et transitions cohérentes
- Border radius, padding, hover states alignés
Interface plus professionnelle et accessible sans dépendance externe.
Simplification majeure de la configuration des groupes :
- Suppression des champs redondants 'id' et 'description'
- Le nom du groupe sert maintenant d'identifiant (converti en slug automatiquement)
- Génération automatique des IDs pour groupes et canaux via fonction slugify()
Backend (server/) :
- Ajout fonction slugify() pour génération d'IDs à partir des noms
- Génération automatique des IDs au chargement de la config (index.js)
- API admin adaptée : POST/PUT /admin/groups génèrent les IDs automatiquement
- Pas besoin de fournir l'ID lors de la création/modification
Frontend (client/src/Admin.jsx + Admin.css) :
- Suppression champs ID et description du formulaire
- Simplification interface : nom + bitrate + canaux
- Mise à jour layout CSS canal (4 colonnes au lieu de 5)
- Cartes de groupe épurées (plus d'affichage d'ID)
Configuration (config.yaml) :
- Format simplifié : groupes avec 'name', 'channels' et 'audioBitrate' optionnel
- Exemple : "Production" au lieu de id/name/description séparés
- Plus lisible et maintenable
Les IDs sont générés dynamiquement :
- Groupe "Production" → id: "production"
- Canal "Principal" → id: "production-principal"
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implémentation complète de l'interface d'administration web :
Backend (server/api/admin.js) :
- Endpoints CRUD pour gestion des groupes (GET/POST/PUT/DELETE /admin/groups)
- Gestion utilisateurs connectés en temps réel (GET/DELETE /admin/users)
- Monitoring statistiques système (GET /admin/stats)
- Affichage logs serveur avec filtrage (GET /admin/logs)
- Configuration audio globale (PUT /admin/config/audio)
- Système de tracking des connexions/déconnexions
- Export fonctions registerUser, unregisterUser, addLog
Frontend (client/src/Admin.jsx + Admin.css) :
- Interface admin complète avec 4 onglets (Groupes, Utilisateurs, Stats, Logs)
- Gestion groupes : création, modification, suppression avec formulaires
- Gestion canaux audio par groupe (inputs/outputs)
- Liste utilisateurs connectés avec déconnexion forcée
- Dashboard statistiques temps réel (connexions, uptime, mémoire)
- Viewer logs avec code couleur par niveau (debug/info/warn/error)
- Rafraîchissement auto toutes les 3s
- Design responsive et mode sombre
Intégration système :
- Routes admin montées sous /admin dans index.js
- Enregistrement automatique des utilisateurs lors de la génération de token
- Logs serveur centralisés dans le système admin
- Routing simple frontend pour /admin (main.jsx)
🎛️ Interface accessible via https://localhost:5173/admin🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
NOUVEAU DESIGN :
- VU-mètre transformé en anneau SVG autour du bouton PTT
- Cercle progressif (0-360°) selon le niveau audio
- Couleurs dynamiques selon le niveau :
- Vert (0-75%) : audio normal
- Orange (75-90%) : niveau élevé
- Rouge (90-100%) : saturation/danger avec effet glow
- Bleu : mode talking (micro actif)
AVANTAGES :
- Beaucoup plus discret et élégant
- Intégré visuellement au bouton principal
- Pas d'encombrement UI supplémentaire
- Contextuellement pertinent (niveau autour du contrôle)
TECHNIQUE :
- SVG avec stroke-dasharray pour l'arc progressif
- Transition fluide 0.1s sur le niveau
- Drop-shadow dynamique selon couleur
- Responsive (adapté mobile/paysage)
- z-index stratifié (anneau derrière, bouton devant)
SUPPRESSION :
- Ancien composant AudioIndicator.jsx retiré de App.jsx
- Garde plus d'espace pour UserList et GroupSelector
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
CORRECTIONS :
- Hauteur max passée de 180px à 300px (desktop)
- Hauteur max passée de 150px à 250px (mobile)
- Ajout min-height: 100px pour garantir visibilité
AMÉLIORATIONS SCROLL :
- Scrollbar personnalisée fine et discrète
- Support -webkit-overflow-scrolling: touch (iOS)
- Scrollbar visible au hover (desktop)
- Gap réduit entre items pour densité optimale
RESPONSIVE :
- Portrait mobile : 200px max
- Paysage : 120px max (priorité au bouton PTT)
- Padding réduit pour maximiser l'espace visible
Résultat : Affichage de 4-5 utilisateurs au lieu de 1-2
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
CORRECTIONS :
- Fix son qui ne restait pas actif en mode lock (utilisation de ref au lieu de state)
- Les event handlers utilisent isLockModeRef.current pour accès immédiat
NOUVELLE ACTIVATION :
- Remplacement appui long 3s par drag vertical (glisser vers le haut)
- Drag de 80px vers le haut active le mode lock
- Indicateur visuel avec flèche + texte "Glissez pour verrouiller"
- Bouton suit le doigt pendant le drag (transform translateY)
- Feedback haptique à l'activation (triple vibration)
DÉSACTIVATION :
- Tap/clic sur le bouton en mode lock désactive le mode
- Feedback haptique simple à la désactivation
UX AMÉLIORÉE :
- Plus intuitif qu'un appui long
- Retour visuel immédiat du drag
- Compatible touch (mobile) et mouse (desktop)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Phase 2.1 : Support multi-groupes ✓
- Phase 2.2 : Mode PTT continu ✓
- Mise à jour statut : Phase 2 en cours
- Ajout section "Prochaines actions" avec roadmap Phase 2/3
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Nouveau mode PTT continu (lock) activé par appui long de 3s
- Barre de progression visuelle pendant l'appui (0-100%)
- Badge cadenas en haut à droite quand mode actif
- Animation pulsante distinctive pour mode lock
- Feedback haptique à l'activation (triple vibration)
- Désactivation par simple tap quand mode lock actif
- Indication textuelle claire de l'état (normal/lock)
- Styles responsifs mobile + accessibilité (prefers-reduced-motion)
Mode d'emploi :
- Normal : Maintenir pour parler, relâcher pour arrêter
- Lock : Maintenir 3s → mode continu → tap pour désactiver
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Ajout de 3 groupes dans config.yaml : Production, Technique, Sonorisation
- Nouvel endpoint API GET /groups pour lister les groupes disponibles
- Composant GroupSelector.jsx pour changer de groupe pendant la session
- Hook useLiveKit étendu avec fonction switchGroup() pour reconnexion
- Intégration dans App.jsx avec gestion du changement de groupe
- Chaque groupe = 1 room LiveKit distincte
- Qualité audio configurable par groupe (96-128 kbps)
benoit