Samuel_4.0 / ui.py
Lukeetah's picture
Upload 13 files
5b0bb4b verified
# ui.py
# Módulo para generar dinámicamente el HTML de la aplicación.
def get_login_page() -> str:
"""Genera el HTML para la página de login/registro."""
return """
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Samuel - Acceso</title>
<link rel="stylesheet" href="/static/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap" rel="stylesheet">
</head>
<body>
<div class="auth-container">
<h1>Samuel</h1>
<p class="subtitle">El Confidente Digital</p>
<div id="login-form">
<h2>Iniciar Sesión</h2>
<form onsubmit="login(event)">
<input type="email" id="login-email" placeholder="Email" required>
<input type="password" id="login-password" placeholder="Contraseña" required>
<button type="submit">Entrar</button>
</form>
<p class="toggle-form">¿No tenés cuenta? <a href="#" onclick="toggleForms()">Registrate</a></p>
</div>
<div id="register-form" style="display: none;">
<h2>Registro</h2>
<form onsubmit="register(event)">
<input type="email" id="register-email" placeholder="Email" required>
<input type="password" id="register-password" placeholder="Contraseña" required>
<button type="submit">Crear Cuenta</button>
</form>
<p class="toggle-form">¿Ya tenés cuenta? <a href="#" onclick="toggleForms()">Iniciá Sesión</a></p>
</div>
<p id="error-message" class="error"></p>
</div>
<script src="/static/auth.js"></script>
</body>
</html>
"""
def get_main_app_page() -> str:
"""Genera el HTML para la página principal de la aplicación (Chat y Memoria)."""
return """
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Samuel - Santuario Digital</title>
<link rel="stylesheet" href="/static/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap" rel="stylesheet">
</head>
<body>
<div class="main-container">
<aside class="sidebar">
<div class="sidebar-header">
<h2>Samuel</h2>
</div>
<nav>
<a href="#" class="nav-item active" onclick="switchView('chat')">Chat</a>
<a href="#" class="nav-item" onclick="switchView('memoria')">Memoria</a>
</nav>
<div class="sidebar-footer">
<div id="connection-status" class="disconnected">
<span class="status-dot"></span>
<span class="status-text">Desconectado</span>
</div>
<button onclick="logout()">Cerrar Sesión</button>
</div>
</aside>
<main class="content">
<div id="chat-view" class="view active">
<div id="chat-log"></div>
<div class="chat-input-area">
<textarea id="chat-input" placeholder="Escribí acá..." rows="1"></textarea>
<button id="send-button">Enviar</button>
</div>
</div>
<div id="memoria-view" class="view">
<h1>Tu Historia Compartida</h1>
<div id="memoria-log"></div>
</div>
</main>
</div>
<script src="/static/app.js"></script>
</body>
</html>
"""
def get_initiation_page() -> str:
"""Genera el HTML para la secuencia de iniciación."""
return """
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Samuel - Calibración</title>
<link rel="stylesheet" href="/static/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&display=swap" rel="stylesheet">
</head>
<body>
<div class="initiation-container">
<h1 id="initiation-question"></h1>
<textarea id="initiation-answer" placeholder="Tu reflexión..." rows="4"></textarea>
<button onclick="submitInitiationAnswer()">Siguiente</button>
</div>
<script src="/static/initiation.js"></script>
</body>
</html>
"""