nkkklo/video-generador-static-huggingface-actualizado
๐ฌ Generador de Video IA desde SRT o TXT โ 100% en el navegador
Version completamente estatica (HTML + JavaScript puro, sin Python, sin backend) para que funcione gratis en Hugging Face Spaces despues del cambio de julio de 2026 que quito el nivel gratuito de Gradio/Docker.
Todo corre en el navegador de quien la use:
- Parser SRT/TXT โ respeta los timestamps originales exactos, agrupa subtitulos consecutivos que son la misma idea visual en una sola escena (sin dejar huecos en la linea de tiempo).
- Generador de prompts โ interpreta el significado de cada escena (no la traduce literalmente) usando el endpoint de texto gratuito de Pollinations, con variantes A/B/C/D y un generador local de respaldo que nunca deja una escena sin prompt.
- Generador de imagenes โ Pollinations (gratis, sin API key), con validacion real de cada imagen (content-type, tamano, que decodifique), reintentos con backoff+jitter, y una cola con concurrencia controlada (estable/equilibrado/rapido).
- Ensamblado del video โ FFmpeg corriendo en el navegador via ffmpeg.wasm. Cada imagen dura exactamente
endTime - startTime, se escala y recorta para llenar el cuadro sin barras negras, y nunca se dibuja texto (prompt, subtitulo, timestamp) sobre el video. - Recuperacion โ el progreso (prompts e imagenes ya validadas) se guarda en IndexedDB del navegador, identificado por el hash del archivo. Si recargas la pagina o subes el mismo archivo otra vez, se reanuda sin perder lo ya generado.
Nada se sube a ningun servidor propio: las unicas llamadas de red salen directo del navegador hacia Pollinations (texto e imagenes) y hacia el CDN publico de ffmpeg.wasm (para descargar el motor de FFmpeg la primera vez).
Archivos
index.html # estructura de la interfaz
style.css # estilos
app.js # orquestador principal (conecta todo lo demas)
parser.js # parser SRT/TXT + agrupacion de escenas
prompts.js # generador de prompts (variantes A-D + fallback local)
images.js # cliente de Pollinations (imagenes) + cola de concurrencia
video.js # ensamblado del video con ffmpeg.wasm
storage.js # persistencia/recuperacion con IndexedDB
learning.js # aprendizaje local (localStorage) descrito abajoEstilos "Stick Figures" y aprendizaje automatico
Hay 4 estilos calibrados para parecerse a pictogramas/iconos reales (no al "monigote realista" que suelen dibujar por defecto los modelos de imagen):
- Pictograma solido: silueta negra solida rellena, sin cara, sin color (tipo icono de aeropuerto/bano/ascensor).
- Icono de linea: solo contorno negro fino, interior vacio (tipo icono de interfaz).
- Doodle: figura de palitos dibujada a mano, cabeza circular con carita simple, sin relleno de color.
- Stick Figures Coloridos: igual que el pictograma solido pero con algun acento de color plano en accesorios.
Para que la generacion mejore con el uso (sin backend ni entrenamiento real de un modelo, todo con reglas + memoria local en localStorage del navegador), learning.js hace tres cosas:
- Chequeo automatico de estilo: para los estilos "Stick Figures ", cada imagen generada se analiza pixel por pixel (canvas) para confirmar que es mayormente blanco y negro puro. Si el resultado se ve a color o realista, se descarta, se reintenta con otra variante de prompt, y se sube un "nivel de refuerzo monocromo" que se agrega automaticamente a los prompts de las proximas escenas* (y de proximos videos, porque queda guardado en el navegador). Con el uso, cada vez hacen falta menos reintentos.
- Orden de variantes aprendido: se recuerda que variante (A/B/C) tuvo mas exito para cada estilo y se prueba primero, ahorrando llamadas e intentos (generacion mas rapida con el tiempo). El fallback local (D) siempre queda como red de seguridad al final.
- Feedback del usuario (๐/๐ por escena): en la tabla de revision, cada escena tiene botones para aprobar o rechazar el tipo de contenido generado. Esto ajusta que palabras/temas se prefieren o se evitan en los prompts futuros para ese estilo.
Todo esto vive en localStorage bajo la clave srt2video_learning_v1, es independiente por estilo, y se puede borrar en cualquier momento con el boton "Reiniciar aprendizaje" (no borra videos ni imagenes ya hechas).
Desplegar en Hugging Face Spaces (gratis)
- Crea un Space nuevo con SDK Static.
- Sube estos 8 archivos a la raiz del repo (mismos nombres).
- Sin build, sin
requirements.txt, sin contenedor: carga en segundos.
Limitaciones a tener en cuenta
- Rendimiento: ffmpeg.wasm corre en un solo hilo en la mayoria de hostings estaticos (no todos permiten los headers
COOP/COEPnecesarios para el nucleo multi-hilo), asi que ensamblar videos largos o en 1080p puede tardar varios minutos y usar bastante memoria del navegador. Para pruebas, usa 480p/720p y clips mas cortos. - Memoria del navegador: WebAssembly de un solo hilo tiene un limite de memoria (~2 GB). Videos muy largos con muchas imagenes en alta resolucion pueden fallar por falta de memoria; en ese caso, baja la resolucion o procesa el SRT en partes.
- CORS: Pollinations esta pensado para llamarse directamente desde el navegador y normalmente no bloquea estas peticiones. Si una red corporativa o una extension del navegador las bloquea, cada escena sigue teniendo un prompt utilizable gracias al generador local de respaldo, pero la generacion de imagenes si depende de que esas llamadas funcionen.
- La primera vez que se ensambla un video, el navegador descarga el nucleo de FFmpeg (~30 MB) desde jsDelivr; despues queda en cache del navegador.
