Spaces:

askbyte
/

biter-zephyr

Running

App Files Files Community

askbyte commited on Mar 22

Commit

2d74b8f

verified ·

1 Parent(s): 76e5973

Update index.html

Browse files

Files changed (1) hide show

index.html +63 -99

index.html CHANGED Viewed

@@ -1,99 +1,63 @@
-/**
- * Ejemplo de código para integrar BITER en justbyte.es
- * Este archivo muestra cómo implementar la comunicación con la API de BITER
- * desde tu sitio web.
- */
-// URL de tu Hugging Face Space
-const BITER_API_URL = "https://tu-usuario-huggingface.hf.space/generate"
-// Elementos del DOM
-const chatForm = document.getElementById("chat-form")
-const userInput = document.getElementById("user-input")
-const chatMessages = document.getElementById("chat-messages")
-const loadingIndicator = document.getElementById("loading-indicator")
-// Manejar envío del formulario
-chatForm.addEventListener("submit", async (e) => {
-  e.preventDefault()
-  // Obtener mensaje del usuario
-  const userMessage = userInput.value.trim()
-  if (!userMessage) return
-  // Limpiar input
-  userInput.value = ""
-  // Mostrar mensaje del usuario
-  appendMessage("user", userMessage)
-  // Mostrar indicador de carga
-  loadingIndicator.style.display = "block"
-  try {
-    // Enviar solicitud a la API de BITER
-    const response = await fetch(BITER_API_URL, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({
-        message: userMessage,
-      }),
-    })
-    // Verificar si la respuesta es exitosa
-    if (!response.ok) {
-      throw new Error("Error en la respuesta de la API")
-    }
-    // Obtener datos de la respuesta
-    const data = await response.json()
-    // Mostrar respuesta de BITER
-    appendMessage("assistant", data.response)
-  } catch (error) {
-    console.error("Error:", error)
-    appendMessage(
-      "system",
-      "Lo siento, ha ocurrido un error al conectar con BITER. Por favor, intenta de nuevo más tarde.",
-    )
-  } finally {
-    // Ocultar indicador de carga
-    loadingIndicator.style.display = "none"
-  }
-})
-// Función para añadir mensajes al chat
-function appendMessage(role, content) {
-  const messageDiv = document.createElement("div")
-  messageDiv.className = `message ${role}-message`
-  // Crear avatar
-  const avatar = document.createElement("div")
-  avatar.className = "avatar"
-  // Icono según el rol
-  if (role === "user") {
-    avatar.innerHTML = "👤"
-  } else if (role === "assistant") {
-    avatar.innerHTML = "🤖"
-  } else {
-    avatar.innerHTML = "⚠️"
-  }
-  // Crear contenido del mensaje
-  const messageContent = document.createElement("div")
-  messageContent.className = "message-content"
-  messageContent.textContent = content
-  // Añadir elementos al mensaje
-  messageDiv.appendChild(avatar)
-  messageDiv.appendChild(messageContent)
-  // Añadir mensaje al contenedor
-  chatMessages.appendChild(messageDiv)
-  // Scroll al último mensaje
-  chatMessages.scrollTop = chatMessages.scrollHeight
-}

+<!DOCTYPE html>
+<html lang="es">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>BITER - Tu Mentor de Negocios IA</title>
+    <style>
+        body {
+            font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+            max-width: 800px;
+            margin: 0 auto;
+            padding: 20px;
+            line-height: 1.6;
+            color: #333;
+            background-color: #f9f9f9;
+        }
+        h1 {
+            color: #1a1a1a;
+            border-bottom: 2px solid #eee;
+            padding-bottom: 10px;
+        }
+        .card {
+            background: #fff;
+            border-radius: 8px;
+            padding: 20px;
+            margin: 20px 0;
+            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+        }
+        .info {
+            background-color: #e9f5ff;
+            border-left: 4px solid #0070f3;
+            padding: 15px;
+            margin: 20px 0;
+            border-radius: 0 8px 8px 0;
+        }
+        .loading {
+            text-align: center;
+            margin: 40px 0;
+            font-style: italic;
+            color: #666;
+        }
+    </style>
+</head>
+<body>
+    <h1>BITER - Tu Mentor en Tiempo Real</h1>
+    <div class="card">
+        <h2>Estado del Servicio</h2>
+        <p>✅ BITER está activo y funcionando</p>
+        <p>Modelo: Microsoft Phi-2 (2.7B parámetros)</p>
+    </div>
+    <div class="info">
+        <h3>Información Importante</h3>
+        <p>La primera consulta puede tardar hasta 1-2 minutos mientras se carga el modelo en memoria.</p>
+        <p>Este servicio está optimizado para funcionar en CPU con recursos limitados.</p>
+    </div>
+    <div class="loading">
+        <p>Para comenzar a usar BITER, simplemente haz clic en el botón "Abrir en una nueva pestaña" arriba.</p>
+    </div>
+</body>
+</html>