// ShortForge AI – App logic class ShortForgeApp { constructor() { this.currentTemplate = 'narration'; this.generated = false; this.voices = { 'fr-lea': { name: 'Lea', lang: 'fr-FR', gender: 'female' }, 'fr-remy': { name: 'Rémy', lang: 'fr-FR', gender: 'male' }, 'en-bella': { name: 'Bella', lang: 'en-US', gender: 'female' }, 'en-mat': { name: 'Mat', lang: 'en-US', gender: 'male' } }; this.init(); } init() { this.bindEvents(); this.updateTemplateButtons(); } bindEvents() { // Template buttons document.querySelectorAll('.template-btn').forEach(btn => { btn.addEventListener('click', e => { document.querySelectorAll('.template-btn').forEach(b => b.classList.remove('active')); e.target.classList.add('active'); this.currentTemplate = e.target.dataset.template; this.updateTemplatePreview(); }); }); // Generate document.getElementById('voiceSelect').addEventListener('change', () => this.updateVoicePreview()); document.getElementById('generateBtn').addEventListener('click', () => this.generate()); // Download document.getElementById('downloadBtn').addEventListener('click', () => this.download()); // File upload document.getElementById('loadTxt').addEventListener('click', () => this.loadTxt()); document.getElementById('loadReddit').addEventListener('click', () => this.loadReddit()); } updateTemplateButtons() { document.querySelectorAll('.template-btn').forEach(btn => { btn.classList.toggle('active', btn.dataset.template === this.currentTemplate); }); } updateTemplatePreview() { const templates = { narration: 'Narration douce avec transitions lentes.', reddit: 'Reddit story rythmé pour maximiser le retention.', educatif: 'Format éducatif avec captions synchronisés.', top5: 'Top 5 dynamique avec effets punchy.' }; const desc = templates[this.currentTemplate]; const preview = document.createElement('div'); preview.className = 'mt-2 text-xs text-gray-400'; preview.textContent = desc; const existing = document.querySelector('#templateDesc'); if (existing) existing.remove(); preview.id = 'templateDesc'; document.querySelector('.template-btn.active').parentElement.appendChild(preview); } updateVoicePreview() { const select = document.getElementById('voiceSelect'); const voiceId = select.value; const voice = this.voices[voiceId]; const preview = document.createElement('div'); preview.className = 'mt-2 text-xs text-gray-400'; preview.textContent = `${voice.name} – ${voice.lang} (${voice.gender})`; const existing = document.querySelector('#voiceDesc'); if (existing) existing.remove(); preview.id = 'voiceDesc'; select.parentElement.appendChild(preview); } async loadTxt() { const input = document.createElement('input'); input.type = 'file'; input.accept = '.txt'; input.onchange = e => { const file = e.target.files[0]; if (!file) return; const reader = new FileReader(); reader.onload = evt => { document.getElementById('scriptInput').value = evt.target.result; }; reader.readAsText(file); }; input.click(); } loadReddit() { const url = prompt('Collez l’URL Reddit du post :'); if (!url) return; // Mock fetch document.getElementById('scriptInput').value = 'Mock Reddit story récupéré !'; } async generate() { const script = document.getElementById('scriptInput').value.trim(); if (!script) return alert('Veuillez entrer un script.'); const btn = document.getElementById('generateBtn'); const original = btn.innerHTML; btn.disabled = true; btn.innerHTML = 'Génération…'; feather.replace(); // Simulate API await new Promise(r => setTimeout(r, 3000)); // Fake video const video = document.getElementById('previewVideo'); video.src = 'https://sample-videos.com/shorts/9-16/mp4/20.mp4'; document.getElementById('previewPlayer').classList.remove('hidden'); document.getElementById('previewPlaceholder').classList.add('hidden'); document.getElementById('downloadBtn').classList.remove('hidden'); // Save to localStorage const history = JSON.parse(localStorage.getItem('sf-history') || '[]'); history.unshift({ script, template: this.currentTemplate, timestamp: Date.now() }); localStorage.setItem('sf-history', JSON.stringify(history.slice(0, 10))); this.generated = true; btn.disabled = false; btn.innerHTML = original; feather.replace(); } download() { if (!this.generated) return; const link = document.createElement('a'); link.href = 'https://sample-videos.com/shorts/9-16/mp4/20.mp4'; link.download = 'shortforge-video.mp4'; link.click(); } } document.addEventListener('DOMContentLoaded', () => { new ShortForgeApp(); }); // History quick-load window.addEventListener('load', () => { const history = JSON.parse(localStorage.getItem('sf-history') || '[]'); if (history.length > 0) { const last = history[0]; document.getElementById('scriptInput').placeholder = `Dernier script: "${last.script.substring(0, 50)}…"`; } });