Update app.py

app.py

@@ -81,6 +81,7 @@ def predict(prompt, language, reference_audio):
         
         output_path = "pedro_labattaglia_TTS.wav"
         # Guardar el audio directamente desde el output del modelo
+        import scipy.io.wavfile as wavfile
         wavfile.write(output_path, config.audio["output_sample_rate"], out["wav"])
 
         audio_length = len(out["wav"]) / config.audio["output_sample_rate"]  # duración del audio en segundos
@@ -124,27 +125,71 @@ Sintetizador de voz con la voz del locutor argentino Pedro Labattaglia.
 - Presione generar voz
 """
 
-# JavaScript mejorado para limpiar los datos de autenticación
+# JavaScript para limpiar los datos de autenticación
 clear_auth_js = """
 function clearAuthData() {
     localStorage.removeItem('gradio_auth_token');
     localStorage.removeItem('gradio_auth_expiration');
-    sessionStorage.removeItem('gradio_auth_token');
-    sessionStorage.removeItem('gradio_auth_expiration');
-    document.cookie = 'gradio_auth_token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
-    document.cookie = 'gradio_auth_expiration=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
 }
 
+// Limpiar datos de autenticación cuando la página se refresca o se cierra
 window.addEventListener('beforeunload', clearAuthData);
 
-function logout() {
-    clearAuthData();
-    window.location.reload();
-}
+// Agregar un botón para limpiar manualmente los datos de autenticación
+document.addEventListener('DOMContentLoaded', (event) => {
+    const clearAuthButton = document.createElement('button');
+    clearAuthButton.textContent = 'Cerrar sesión';
+    clearAuthButton.style.position = 'fixed';
+    clearAuthButton.style.top = '10px';
+    clearAuthButton.style.right = '10px';
+    clearAuthButton.style.zIndex = '1000';
+    clearAuthButton.onclick = function() {
+        clearAuthData();
+        alert('Sesión cerrada. Por favor, recarga la página.');
+    };
+    document.body.appendChild(clearAuthButton);
+});
 """
 
-# CSS personalizado
-custom_css = """
+# Interfaz de Gradio
+with gr.Blocks(theme=theme) as demo:
+    gr.Markdown(description)
+
+    # Fila para centrar la imagen
+    with gr.Row():
+        with gr.Column(equal_height=True):
+            gr.Image(
+                "https://www.labattaglia.com.ar/images/about_me_pic2.jpg", 
+                label="", 
+                show_label=False,
+                container=False,
+                elem_id="image-container"
+            )
+
+    # Fila para seleccionar idioma, referencia y generar voz
+    with gr.Row():
+        with gr.Column(scale=2):
+            language_selector = gr.Dropdown(label="Idioma", choices=supported_languages)
+            reference_audio = gr.Dropdown(label="Audio de referencia", choices=reference_audios)
+            input_text = gr.Textbox(label="Texto a sintetizar", placeholder="Escribe aquí el texto que quieres convertir a voz...")
+            generate_button = gr.Button("Generar voz", variant="primary")
+
+        with gr.Column(scale=1):
+            generated_audio = gr.Audio(label="Audio generado", interactive=False)
+            metrics_output = gr.Textbox(label="Métricas", value="Tiempo de generación: -- segundos\nFactor de tiempo real: --")
+
+    # Configuración del botón para generar voz
+    generate_button.click(
+        predict,
+        inputs=[input_text, language_selector, reference_audio],
+        outputs=[generated_audio, metrics_output]
+    )
+
+    # Agregar el JavaScript para limpiar los datos de autenticación
+    gr.HTML("<script>" + clear_auth_js + "</script>")
+
+# Estilos CSS personalizados
+demo.css = """
 #image-container img {
     display: block;
     margin-left: auto;
@@ -152,95 +197,7 @@ custom_css = """
     max-width: 256px;
     height: auto;
 }
-.logout-button {
-    position: fixed;
-    top: 10px;
-    right: 10px;
-    z-index: 1000;
-    padding: 8px 16px;
-    background-color: #f44336;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-}
-.logout-button:hover {
-    background-color: #d32f2f;
-}
-.login-container {
-    background-color: white;
-    padding: 2rem;
-    border-radius: 10px;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-    text-align: center;
-    max-width: 400px;
-    width: 100%;
-}
-.login-container h1 {
-    margin-bottom: 1rem;
-    color: #4a4a4a;
-}
-.login-container input {
-    width: 100%;
-    padding: 0.5rem;
-    margin-bottom: 1rem;
-    border: 1px solid #ddd;
-    border-radius: 4px;
-}
-.login-container button {
-    width: 100%;
-    padding: 0.5rem;
-    background-color: #3498db;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-}
-.login-container button:hover {
-    background-color: #2980b9;
-}
 """
 
-# Modificar la parte del formulario de inicio de sesión
-def custom_auth(username, password):
-    if (username, password) in [("Pedro Labattaglia", "PL2024"), ("Invitado", "PLTTS2024")]:
-        return True
-    return False
-
-iface = gr.Interface(
-    fn=predict,
-    inputs=[
-        gr.Textbox(label="Texto a sintetizar", placeholder="Escribe aquí el texto que quieres convertir a voz..."),
-        gr.Dropdown(label="Idioma", choices=supported_languages),
-        gr.Dropdown(label="Audio de referencia", choices=reference_audios)
-    ],
-    outputs=[
-        gr.Audio(label="Audio generado"),
-        gr.Textbox(label="Métricas")
-    ],
-    title="Sintetizador de voz de Pedro Labattaglia",
-    description=description,
-    theme=theme,
-    css=custom_css,
-    allow_flagging="never"
-)
-
-# Crear una nueva interfaz para el inicio de sesión
-login_iface = gr.Interface(
-    fn=custom_auth,
-    inputs=[
-        gr.Textbox(label="Usuario", placeholder="Ingrese su nombre de usuario"),
-        gr.Textbox(label="Contraseña", type="password", placeholder="Ingrese su contraseña")
-    ],
-    outputs=gr.Textbox(visible=False),
-    title="Bienvenido al sintetizador de voz de Pedro Labattaglia",
-    description="Por favor, introduzca sus credenciales para acceder.",
-    theme=theme,
-    css=custom_css
-)
-
-# Combinar las interfaces
-demo = gr.TabbedInterface([login_iface, iface], ["Login", "Sintetizador"])
-
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch(auth=[("Pedro Labattaglia", "PL2024"), ("Invitado", "PLTTS2024")])