Socialflow/task.md

Task: Socialflow - Facebook Reels avec Musique et Texte

Context

Ajout d'une fonctionnalité complète de création de Reels Facebook permettant de capturer une vidéo, ajouter une musique libre de droits (FreeSound API), superposer du texte style TikTok, et publier via l'API Graph Facebook. Le traitement vidéo sera effectué via une API FFmpeg Docker locale.

Current Focus

Phase: VERIFICATION - Implémentation terminée, améliorations UI (preview audio, pagination musique).

Master Plan

Phase 0: Clarifications ✅

• Confirmer source de musique → FreeSound API (ex-Jamendo)
• Confirmer URL et format API FFmpeg Docker → /process-reel, base64, X-API-Key
• Style texte → TikTok (animation mot par mot)

Phase 1: Backend Services ✅

• server/services/ffmpeg.ts - Intégration API FFmpeg Docker
• server/services/freesound.ts - Service recherche musique FreeSound
• server/services/facebook.ts - Méthodes publishReel() et publishReelFromBuffer()

Phase 2: Database & Routes ✅

• shared/schema.ts - Ajout type "reel" à postTypeEnum
• server/routes/reels.ts - Routes API complètes
• [NEW] server/cron.ts - Setup Daily Token Check
• [NEW] ffmpeg-service/ - Dedicated Python microservice for video processing
  • main.py (FastAPI, FFmpeg logic)
  • Dockerfile & requirements.txt
  • Fix font_path NameError in main.py
• [CFG] docker-compose.yml - Add ffmpeg-api service & Link to App
• server/routes.ts - Enregistrement du reelsRouter de la configuration

Phase 3: Frontend ✅

• client/src/pages/new-reel.tsx - Page création Reel (workflow 4 étapes)
• client/src/App.tsx - Route /reel
• client/src/components/sidebar.tsx - Lien navigation "Nouveau Reel"
• client/src/pages/settings.tsx - Configuration FFmpeg API

Phase 4: Configuration & UI ⏳

• Configurer FreeSound API (env vars)
• Configurer FFmpeg API URL et clé (interface Settings)
• Ajouter la voix off (TTS) gratuite via Edge-TTS
  • FFmpeg Service: Installer edge-tts et implémenter le mixage audio
  • Backend: Supporter les options TTS (enable, voice)
  • Améliorer le TTS (Genre, Sync, Cleanup)
  • FFmpeg: Nettoyer le texte (No hashtags/emojis) avant TTS
  • FFmpeg: Générer fichier VTT pour synchro sous-titres
  • FFmpeg: Enlever le son original quand TTS activé
  • Frontend: Sélecteur de voix (Homme/Femme) - Switched Male default to Henri
• [/] Ajouter la valeur 'reel' à l'enum post_type en base de données
• Amélioration UI Musique (Pagination, Preview Audio)
• Improve Camera Capture Quality (User Request)
  • Create CameraRecorder component with 4K/1080p/720p quality selector
  • Integrate CameraRecorder into new-reel.tsx
  • Add quality settings panel in camera UI

Phase 5: Reels Enhancements ⚡

• Enable Text Overlay by Default in new-reel.tsx
• Expand French Voice Options
  • Research available French voices (Edge-TTS)
  • Update frontend selection list
  • Update backend validation if needed
• Add Voice Test Button (Preview TTS)

Phase 6: Workflow Initialization 🚫

• [~] Run /bmad-bmgd-workflows-workflow-init (Annulé: Application, pas un Jeu)

Progress Log

• 22 Jan 2026 - Analyse complète et PRD créé
• 22 Jan 2026 - Spécifications confirmées
• 22 Jan 2026 - Backend complet : ffmpeg.ts, freesound.ts, facebook.ts
• 22 Jan 2026 - Frontend créé : new-reel.tsx
• 22 Jan 2026 - Settings FFmpeg ajoutés
• 22 Jan 2026 - Migration Jamendo -> FreeSound effectuée sur demande utilisateur
• 22 Jan 2026 - Correction preview audio et ajout pagination "10 nouvelles musiques"