369

AGENCY // WEB3 // DATA

        
        NODO_AI

        Detectando usuario… 
Bienvenido al ecosistema. ¿Quieres ver nuestros sistemas Web3?
      

Explorar Sistemas

Únete a nosotros

Menú

Contactos

email@email.com
+123456789

Sociales

Subscribe to our newsletter

<!-- =========================================
     369 AGENCY - NODE AI WIDGET (GLOBAL)
     ========================================= -->

<style>
    /* --- ESTILOS DEL WIDGET --- */
    :root {
        --node-cyan: #00FFFF;
        --node-purple: #9D00FF;
        --node-bg: #0a0a0a;
        --node-font: 'Courier New', Courier, monospace;
    }

    /* 1. BOTÓN ACTIVADOR (El Orbe) */
    #node-trigger {
        position: fixed;
        bottom: 30px;
        right: 30px;
        width: 60px;
        height: 60px;
        background: radial-gradient(circle at 30% 30%, var(--node-cyan), #000);
        border-radius: 50%;
        border: 2px solid var(--node-cyan);
        cursor: pointer;
        z-index: 9999;
        box-shadow: 0 0 15px var(--node-cyan);
        animation: pulseNode 3s infinite ease-in-out;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: transform 0.3s;
    }

    #node-trigger:hover {
        transform: scale(1.1);
    }

    /* Icono dentro del orbe */
    #node-trigger span {
        font-size: 24px;
        font-weight: bold;
        color: #000;
    }

    @keyframes pulseNode {
        0% { box-shadow: 0 0 10px var(--node-cyan); }
        50% { box-shadow: 0 0 25px var(--node-cyan), 0 0 10px var(--node-purple); }
        100% { box-shadow: 0 0 10px var(--node-cyan); }
    }

    /* 2. VENTANA DE CHAT (La Terminal) */
    #node-interface {
        position: fixed;
        bottom: 100px;
        right: 30px;
        width: 320px;
        height: 450px;
        background: rgba(5, 5, 5, 0.95);
        border: 1px solid var(--node-cyan);
        border-radius: 10px;
        display: none; /* Oculto por defecto */
        flex-direction: column;
        overflow: hidden;
        z-index: 9999;
        box-shadow: -5px 5px 30px rgba(0, 0, 0, 0.8);
        font-family: var(--node-font);
        backdrop-filter: blur(10px);
    }

    /* Header de la ventana */
    .node-header {
        background: rgba(0, 255, 255, 0.1);
        padding: 10px 15px;
        border-bottom: 1px solid var(--node-cyan);
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .node-status {
        color: var(--node-cyan);
        font-size: 0.8rem;
        font-weight: bold;
    }
    
    .node-close {
        color: var(--node-cyan);
        cursor: pointer;
        font-weight: bold;
    }

    /* Área de mensajes */
    #node-messages {
        flex: 1;
        padding: 15px;
        overflow-y: auto;
        font-size: 0.85rem;
        color: #e0e0e0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    /* Estilos de burbujas */
    .msg {
        max-width: 85%;
        padding: 8px 12px;
        border-radius: 5px;
        line-height: 1.4;
    }

    .msg.node {
        align-self: flex-start;
        background: rgba(0, 255, 255, 0.1);
        border-left: 2px solid var(--node-cyan);
        color: var(--node-cyan);
    }

    .msg.user {
        align-self: flex-end;
        background: rgba(157, 0, 255, 0.2);
        border-right: 2px solid var(--node-purple);
        text-align: right;
    }

    /* Input Area */
    .node-input-area {
        padding: 10px;
        border-top: 1px solid #333;
        display: flex;
    }

    #node-input {
        flex: 1;
        background: transparent;
        border: none;
        color: #fff;
        font-family: var(--node-font);
        outline: none;
        font-size: 0.9rem;
    }

    #node-send {
        background: transparent;
        border: none;
        color: var(--node-cyan);
        cursor: pointer;
        font-weight: bold;
        font-family: var(--node-font);
    }

    /* Scrollbar personalizado */
    #node-messages::-webkit-scrollbar { width: 5px; }
    #node-messages::-webkit-scrollbar-thumb { background: var(--node-cyan); }
</style>

<!-- UI ELEMENTS -->
<div id="node-trigger" onclick="toggleNode()">
    <span>369</span>
</div>

<div id="node-interface">
    <div class="node-header">
        <span class="node-status">● NODO v3.6.9 CONECTADO</span>
        <span class="node-close" onclick="toggleNode()">[X]</span>
    </div>
    <div id="node-messages">
        <!-- Mensaje inicial automático -->
    </div>
    <div class="node-input-area">
        <input type="text" id="node-input" placeholder="Ingresa comando..." onkeypress="handleEnter(event)">
        <button id="node-send" onclick="sendMessage()">></button>
    </div>
</div>

<!-- LOGIC SCRIPT -->
<script>
    const chatInterface = document.getElementById('node-interface');
    const messagesArea = document.getElementById('node-messages');
    const inputField = document.getElementById('node-input');
    let isFirstOpen = true;

    function toggleNode() {
        if (chatInterface.style.display === 'flex') {
            chatInterface.style.display = 'none';
        } else {
            chatInterface.style.display = 'flex';
            if (isFirstOpen) {
                setTimeout(() => {
                    addNodeMessage("Iniciando protocolo de bienvenida...");
                }, 500);
                setTimeout(() => {
                    addNodeMessage("Saludos, Humano. Soy el NODO. ¿En qué frecuencia deseas sintonizar hoy? (Servicios, Proyectos, Contacto)");
                }, 1500);
                isFirstOpen = false;
            }
            inputField.focus();
        }
    }

    function handleEnter(e) {
        if (e.key === 'Enter') sendMessage();
    }

    function sendMessage() {
        const text = inputField.value.trim();
        if (text === "") return;

        // 1. Agregar mensaje del usuario
        addUserMessage(text);
        inputField.value = "";

        // 2. Simular "pensamiento" y respuesta del NODO
        messagesArea.scrollTop = messagesArea.scrollHeight;
        
        setTimeout(() => {
            processNodeResponse(text.toLowerCase());
        }, 800); // Pequeño retraso para realismo
    }

    function addUserMessage(text) {
        const div = document.createElement('div');
        div.className = 'msg user';
        div.innerText = text;
        messagesArea.appendChild(div);
    }

    function addNodeMessage(text) {
        const div = document.createElement('div');
        div.className = 'msg node';
        // Efecto de tipeo simple (opcional, aquí es texto directo)
        div.innerText = ">> " + text;
        messagesArea.appendChild(div);
        messagesArea.scrollTop = messagesArea.scrollHeight;
    }

    // --- CEREBRO DEL NODO (SIMULACIÓN DE PERSONALIDAD) ---
    function processNodeResponse(input) {
        let response = "";

        // Lógica básica de palabras clave
        if (input.includes("hola") || input.includes("inicio")) {
            response = "Enlace restablecido. Estoy operativo. Dime, ¿buscas expandir tu realidad digital?";
        } 
        else if (input.includes("servicio") || input.includes("hacen")) {
            response = "Accediendo a base de datos... Ofrecemos: Desarrollo Web3, Smart Contracts y Diseño UX/UI Futurista. ¿Deseas ver la lista completa?";
        }
        else if (input.includes("precio") || input.includes("costo")) {
            response = "El valor es relativo a la complejidad del sistema que deseas construir. Necesito más datos. Por favor, ve a la sección de CONTACTO.";
        }
        else if (input.includes("contacto") || input.includes("email")) {
            response = "Abriendo canal seguro... Puedes escribirnos a info@369agency.com o usar el formulario principal.";
        }
        else if (input.includes("369")) {
            response = "La llave del universo. Energía, Frecuencia y Vibración. Entendemos el código.";
        }
        else {
            response = "Comando no reconocido en mi base de datos actual. Intenta ser más específico o solicita hablar con un operador humano en 'Contacto'.";
        }

        addNodeMessage(response);
    }
</script>

Tu carrito

Your Cart is Empty!

Parece que todavía no has agregado ningún artículo a tu carrito.

Buscar productos

Desarrollado por Caddy