Integra GoIA
en tus servicios

<script src="https://goia.unam.mx/goia.js" defer></script>

<!-- GoIA Widget — pega antes de </body> -->
<script src="https://goia.unam.mx/goia.js" defer></script>

<script src="https://goia.unam.mx/goia_dgtic.js" defer></script>

<script src="https://goia.unam.mx/goia_dgaco.js" defer></script>

// components/GoIAWidget.jsx
import { useEffect } from 'react';

export default function GoIAWidget() {
  useEffect(() => {
    const script = document.createElement('script');
    script.src = 'https://goia.unam.mx/goia.js';
    script.defer = true;
    document.body.appendChild(script);
    return () => document.body.removeChild(script);
  }, []);

  return null; // el widget se monta solo en el DOM
}

// Uso: importa <GoIAWidget /> en _app.jsx o en el layout root

<!-- iFrame GoIA — chat completo embebido -->
<iframe
  src="https://goia.unam.mx/iframe.php"
  width="100%"
  height="600"
  frameborder="0"
  allow="clipboard-write"
  title="GoIA - Asistente IA UNAM"
  style="border-radius: 16px; box-shadow: 0 8px 32px rgba(0,0,0,.15);"
></iframe>

<style>
  .goia-full {
    position: fixed; inset: 0; width: 100%; height: 100%;
    border: none; z-index: 9999;
  }
</style>

<iframe
  class="goia-full"
  src="https://goia.unam.mx/iframe.php"
  title="GoIA"
  allow="clipboard-write"
></iframe>

const goiaFrame = document.getElementById('goia-frame');

// Esperar a que el iFrame cargue
goiaFrame.addEventListener('load', () => {
  goiaFrame.contentWindow.postMessage(
    { type: 'goia:prompt', text: '¿Cuáles son los servicios de la UNAM?' },
    'https://goia.unam.mx'
  );
});

{
  "reply": "La Biblioteca Central de la UNAM está ubicada en Ciudad Universitaria, en la Torre de Ingeniería... "
}

class GoIAChat {
  constructor(endpoint = 'https://goia.unam.mx/ia/ia_chat.php') {
    this.endpoint = endpoint;
  }

  async send(prompt) {
    const res = await fetch(this.endpoint, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      credentials: 'include',   // mantiene la sesión PHP
      body: JSON.stringify({ prompt })
    });
    if (!res.ok) throw new Error(`GoIA error: HTTP ${res.status}`);
    const data = await res.json();
    return data.reply ?? data.text ?? data.answer ?? '';
  }

  async reset() {
    await fetch(this.endpoint, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      credentials: 'include',
      body: JSON.stringify({ reset: true })
    });
  }
}

// Uso
const chat = new GoIAChat();
console.log(await chat.send('¿Qué es la UNAM?'));
console.log(await chat.send('¿Y cuándo fue fundada?')); // recuerda el contexto
await chat.reset(); // nuevo hilo

curl -X POST https://goia.unam.mx/ia/ia_iframe.php \
  -H "Content-Type: application/json" \
  -d '{"prompt": "servicios de salud UNAM", "rows": 5}'

{
  "ok": true,
  "schema": "goia.reply.v1",
  "query": "servicios de salud UNAM",
  "intent": "informacion",
  "answer": "La UNAM ofrece servicios médicos gratuitos a toda su comunidad a través de la SSACU ",
  "sources": [
    {
      "title": "SSACU — Servicios de Salud",
      "url": "https://ssacu.unam.mx/servicios"
    }
  ],
  "items": [
    {
      "title": "Clínicas universitarias",
      "snippet": "Atención médica, dental y psicológica disponible en CU y en los Campus Foráneos…",
      "url": "https://ssacu.unam.mx/clinicas",
      "source": "UNAM",
      "date": "2025-01-15",
      "photo": "https://ssacu.unam.mx/img/clinica.jpg"
    }
  ],
  "meta": {
    "confidence": 0.92,
    "needs_followup": false,
    "took_ms": 1340
  }
}

async function goiaSearch(query, rows = 8) {
  const res = await fetch('https://goia.unam.mx/ia/ia_iframe.php', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    credentials: 'include',
    body: JSON.stringify({ prompt: query, rows })
  });

  if (!res.ok) throw new Error(`GoIA HTTP ${res.status}`);

  const data = await res.json();
  if (!data.ok) throw new Error(data.error?.message ?? 'Error desconocido');

  return data; // { answer, items, sources, meta, ... }
}

// Renderizar resultados
async function renderSearch(query) {
  const { answer, items, sources } = await goiaSearch(query);

  document.getElementById('answer').textContent = answer;

  const list = document.getElementById('results');
  list.innerHTML = items.map(item => `
    <article class="result-card">
      ${item.photo ? `<img src="${item.photo}" alt="${item.title}">` : ''}
      <h3><a href="${item.url}" target="_blank">${item.title}</a></h3>
      <p>${item.snippet}</p>
      <small>${item.source} · ${item.date}</small>
    </article>
  `).join('');
}

{
  "ok": false,
  "schema": "goia.reply.v1",
  "error": {
    "code": "INVALID_QUERY",
    "message": "Se requiere \"prompt\" no vacío"
  }
}

<!-- GoIA lee el contenido del selector #main-content como contexto -->
<script
  src="https://goia.unam.mx/goia.js"
  data-context-selector="#main-content"
  defer
></script>

// Extrae el texto de la página y lo añade al prompt
const pageText = document.querySelector('#main-content')?.innerText ?? '';

const res = await fetch('https://goia.unam.mx/ia/ia_chat.php', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  credentials: 'include',
  body: JSON.stringify({
    prompt: '¿Qué dice este artículo sobre becas?',
    context: pageText.slice(0, 4000) // recorta para no superar el límite
  })
});

{
  "prompt": "¿Qué eventos hay esta semana en la Facultad de Ciencias?",
  "tools": ["web_search", "agenda_unam"],
  "context": "El usuario está en la página de la Facultad de Ciencias"
}

// ====== CONFIG AJUSTABLE ======
const ENDPOINT = 'https://goia.unam.mx/ia/ia_chat.php'; // tu endpoint
const MAX_MSGS = 10; // mensajes máximos por sesión

const UI = {
  BTN_SIZE:    60,                              // px — diámetro del botón
  BTN_IMAGE:   'https://goia.unam.mx/img/goia-avatar-colores.png', // imagen del botón
  PULSE_COLOR: 'rgba(44,163,184,.25)',          // color del halo animado
  PULSE_MS:    2000,                            // duración del pulso (ms)
  PULSE_SCALE: 3.0,                             // escala máxima del halo
  PANEL_W:     420,                             // ancho del panel (px)
  PANEL_VW:    94,                              // ancho máximo en vw
  PANEL_MIN_H: 360,                             // alto mínimo del panel
  PANEL_MAX_VH:72,                              // alto máximo en vh
  CORNER:      20,                              // border-radius del panel
  GAP:         10                               // espaciado interno
};

// Paleta oficial GoIA — úsalos en PULSE_COLOR o en CSS
const GOIA_COLORS = {
  lime:  '#B5D334',  // verde lima
  green: '#9DCA4F',  // verde
  teal:  '#33B59A',  // teal
  blue:  '#2CA3B8',  // azul claro
  navy:  '#204E96',  // azul UNAM oscuro
};