Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>IseaFire</title> | |
| <link rel="stylesheet" href="/styles.css"> | |
| </head> | |
| <body> | |
| <h1>IseaFire</h1> | |
| <p>Sube, gestiona y visualiza tus archivos con seguridad.</p> | |
| <!-- Formulario de registro --> | |
| <h2>Registro</h2> | |
| <form id="registerForm"> | |
| <input type="text" id="registerUsername" placeholder="Usuario" required> | |
| <input type="password" id="registerPassword" placeholder="Contraseña" required> | |
| <button type="submit">Registrarse</button> | |
| </form> | |
| <!-- Formulario de login --> | |
| <h2>Login</h2> | |
| <form id="loginForm"> | |
| <input type="text" id="loginUsername" placeholder="Usuario" required> | |
| <input type="password" id="loginPassword" placeholder="Contraseña" required> | |
| <button type="submit">Login</button> | |
| </form> | |
| <!-- Tablero de archivos --> | |
| <div id="dashboard" style="display:none;"> | |
| <h2>Tu Tablero</h2> | |
| <p id="welcomeMessage"></p> | |
| <form id="uploadForm" enctype="multipart/form-data"> | |
| <label for="fileInput" class="custom-file-upload">Seleccionar archivo</label> | |
| <input type="file" id="fileInput" name="file"> | |
| <button type="submit">Subir archivo</button> | |
| </form> | |
| <div id="fileList"></div> | |
| </div> | |
| <script> | |
| const registerForm = document.getElementById('registerForm'); | |
| const loginForm = document.getElementById('loginForm'); | |
| const dashboard = document.getElementById('dashboard'); | |
| const welcomeMessage = document.getElementById('welcomeMessage'); | |
| const uploadForm = document.getElementById('uploadForm'); | |
| const fileList = document.getElementById('fileList'); | |
| registerForm.addEventListener('submit', async (e) => { | |
| e.preventDefault(); | |
| const username = document.getElementById('registerUsername').value; | |
| const password = document.getElementById('registerPassword').value; | |
| const response = await fetch('/register', { | |
| method: 'POST', | |
| headers: {'Content-Type': 'application/x-www-form-urlencoded'}, | |
| body: new URLSearchParams({username, password}) | |
| }); | |
| if (response.ok) { | |
| alert("Registro exitoso. Ahora puedes iniciar sesión."); | |
| registerForm.reset(); | |
| } else { | |
| alert("Error en el registro. Inténtalo de nuevo."); | |
| } | |
| }); | |
| loginForm.addEventListener('submit', async (e) => { | |
| e.preventDefault(); | |
| const username = document.getElementById('loginUsername').value; | |
| const password = document.getElementById('loginPassword').value; | |
| const response = await fetch('/login', { | |
| method: 'POST', | |
| headers: {'Content-Type': 'application/x-www-form-urlencoded'}, | |
| body: new URLSearchParams({username, password}) | |
| }); | |
| if (response.ok) { | |
| const data = await response.json(); | |
| welcomeMessage.textContent = data.message; | |
| dashboard.style.display = 'block'; | |
| loginForm.style.display = 'none'; | |
| registerForm.style.display = 'none'; | |
| } else { | |
| alert("Error de autenticación. Inténtalo de nuevo."); | |
| } | |
| }); | |
| uploadForm.addEventListener('submit', async (e) => { | |
| e.preventDefault(); | |
| const fileInput = document.getElementById('fileInput'); | |
| const formData = new FormData(); | |
| formData.append('file', fileInput.files[0]); | |
| formData.append('username', document.getElementById('loginUsername').value); | |
| const response = await fetch('/upload', { | |
| method: 'POST', | |
| body: formData | |
| }); | |
| if (response.ok) { | |
| const data = await response.json(); | |
| const fileLink = document.createElement('a'); | |
| fileLink.href = data.url; | |
| fileLink.textContent = data.filename; | |
| fileLink.target = "_blank"; | |
| fileList.appendChild(fileLink); | |
| fileList.appendChild(document.createElement('br')); | |
| } else { | |
| alert("Error al subir el archivo. Inténtalo de nuevo."); | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |