// ========================================================================== // ⚙️ VNUS AI CONFIGURATIONS & GLOBAL STATES // ========================================================================== const AVAILABLE_TOOLS = ["Outlook", "Stripe", "Twilio", "OpenAI", "Gmail", "Google Calendar"]; let currentActivePrompt = ""; let fetchedAgentsArray = []; function openMyModal(modalId) { const modal = document.getElementById(modalId); if(modal) { modal.classList.remove('hidden'); modal.classList.add('flex'); } } function closeMyModal(modalId) { const modal = document.getElementById(modalId); if(modal) { modal.classList.remove('flex'); modal.classList.add('hidden'); } setTimeout(() => { document.getElementById('modalBox').className = "bg-white w-full max-w-[450px] rounded-3xl p-6 shadow-2xl relative border border-slate-100 transition-all duration-500 ease-in-out text-slate-800"; document.getElementById('modalInitialState').classList.remove('hidden'); document.getElementById('modalLoadingState').classList.add('hidden'); document.getElementById('modalResultState').classList.add('hidden'); }, 400); } // ========================================================================== // 🧠 SMART KEYWORD EXTRACTOR & DYNAMIC AI ENGINE // ========================================================================== function generateSmartLocalAIResponse(promptText) { const query = promptText.toLowerCase(); let detectedCategory = "Custom Business"; let baseData = { starterName: "Operational Assistant", starterRole: "Automated processing agent built specifically to handle workflow queues. It monitors input parameters, processes standard data structures, and updates your main dashboard logs instantly.", proName: "Professional Automator", proRole: "Advanced operations manager configured to streamline your business pipeline. It automatically executes conditional multi-step routines, tracks customer metrics, filters entries, and generates status reports.", entName: "Autonomous Expert Suite", entRole: "Full-scale enterprise system designed to completely execute the entire lifecycle of your custom operations. It functions with self-healing data loops, connects to global databases, triggers multi-channel alerts, and scales workflows without manual supervision.", t1: ["OpenAI"], t2: ["OpenAI", "Gmail"], t3: ["OpenAI", "Gmail", "Stripe"], p1: 185, p2: 545, p3: 1295 }; if (query.includes("lead") || query.includes("scraper") || query.includes("maker") || query.includes("extract")) { detectedCategory = "Lead Generation"; baseData.starterName = "B2B Lead Scraper"; baseData.starterRole = "High-efficiency extraction agent that automatically crawls digital directories to gather accurate names, verified corporate emails, and telephone records matching your exact target profile."; baseData.proName = "Targeted Lead Optimizer"; baseData.proRole = "Advanced outbound engine that scans multiple networking websites, validates data in real-time, removes duplicate entries, and populates your team spreadsheets with clean b2b prospects."; baseData.entName = "Autonomous Pipeline Fleet"; baseData.entRole = "Comprehensive lead command center that monitors incoming signals, auto-enriches cold profiles, cross-checks active email deliverability scores, and immediately updates your internal CRM hooks to keep pipelines loaded."; baseData.t1 = ["OpenAI", "Gmail"]; baseData.t2 = ["OpenAI", "Gmail", "Outlook"]; baseData.t3 = ["OpenAI", "Gmail", "Outlook", "Twilio"]; baseData.p1 = 249; baseData.p2 = 689; baseData.p3 = 1580; } else if (query.includes("outreach") || query.includes("marketing") || query.includes("mail") || query.includes("campaign")) { detectedCategory = "Cold Outreach"; baseData.starterName = "Campaign Courier"; baseData.starterRole = "Smart delivery bot that automates initial message sequencing, manages contact schedules, and routes cold communications systematically without triggering spam folders."; baseData.proName = "Outreach Relationship Manager"; baseData.proRole = "Dedicated outreach assistant that dynamic-injects user context into communication scripts, keeps track of open-rates, filters automatic out-of-office text replies, and catalogs high-interest responses."; baseData.entName = "Conversational Acquisition Fleet"; baseData.entRole = "Autonomous marketing architecture running continuous follow-up logic. It detects positive intent, books direct discovery conversations via smart links, updates lead scoring, and syncs data to company dashboards."; baseData.t1 = ["OpenAI", "Outlook"]; baseData.t2 = ["OpenAI", "Outlook", "Gmail"]; baseData.t3 = ["OpenAI", "Outlook", "Gmail", "Twilio"]; baseData.p1 = 299; baseData.p2 = 749; baseData.p3 = 1650; } else if (query.includes("dropship") || query.includes("store") || query.includes("shop") || query.includes("product")) { detectedCategory = "E-Commerce Store"; baseData.starterName = "Catalog Sync Agent"; baseData.starterRole = "Automated retail bot that monitors digital catalog listings, updates local stock quantities in real-time, and flags sudden wholesale price changes instantly to protect margins."; baseData.proName = "Order Processing Specialist"; baseData.proRole = "Smart checkout companion that verifies incoming purchase requests, extracts shipping destination text, populates courier details, and pushes accurate notifications back to clients."; baseData.entName = "Fulfillment Matrix Fleet"; baseData.entRole = "Autonomous commercial enterprise structure handling cart abandonment tracking, secure stripe checkout sequences, customized invoice deliveries, and automated international shipping allocation loops."; baseData.t1 = ["OpenAI", "Stripe"]; baseData.t2 = ["OpenAI", "Stripe", "Gmail"]; baseData.t3 = ["OpenAI", "Stripe", "Gmail", "Twilio"]; baseData.p1 = 349; baseData.p2 = 899; baseData.p3 = 1950; } else if (query.includes("schedule") || query.includes("calendar") || query.includes("meet") || query.includes("booking")) { detectedCategory = "AI Scheduler"; baseData.starterName = "Smart Booking Clerk"; baseData.starterRole = "Digital slot coordinator that scans configured calendar windows, blocks incoming public meeting requests, and avoids timing overlaps automatically."; baseData.proName = "Dynamic Meeting Coordinator"; baseData.proRole = "Advanced schedule manager providing automatic timezone shifts, broadcasting personalized calendar confirmations, and distributing briefing notes prior to team sessions."; baseData.entName = "Multi-Zone Scheduling Fleet"; baseData.entRole = "Enterprise logistics manager handling high-volume client intake pipelines, processing payment-backed session checkouts, updating centralized databases, and firing operational sms reminders via api."; baseData.t1 = ["OpenAI", "Google Calendar"]; baseData.t2 = ["OpenAI", "Google Calendar", "Outlook"]; baseData.t3 = ["OpenAI", "Google Calendar", "Outlook", "Twilio"]; baseData.p1 = 199; baseData.p2 = 599; baseData.p3 = 1390; } else if (query.includes("wingman") || query.includes("assistant") || query.includes("helper")) { detectedCategory = "Business Wingman"; baseData.starterName = "Core Wingman Assistant"; baseData.starterRole = "Personal organizational assistant handling daily notification filtering, action item tracking, and organizing notes to keep you focused on operational milestones."; baseData.proName = "Strategic Business Co-Pilot"; baseData.proRole = "Proactive business wingman that summarizes lengthly text reports, suggests data-driven responses for conversations, and organizes your critical project goals systematically."; baseData.entName = "Autonomous Executive Suite"; baseData.entRole = "The ultimate operations wingman running automated background checks across your business stack. It synchronizes calendars, drafts executive proposals, triggers custom task sequences, and maintains workflows."; baseData.t1 = ["OpenAI"]; baseData.t2 = ["OpenAI", "Gmail"]; baseData.t3 = ["OpenAI", "Gmail", "Google Calendar", "Outlook"]; baseData.p1 = 220; baseData.p2 = 640; baseData.p3 = 1450; } const seed = Math.floor(Math.random() * 30); return [ { "id": Date.now(), "name": baseData.starterName, "role": baseData.starterRole, "tools": baseData.t1, "price": "$" + (baseData.p1 + seed), "complexity": "Normal" }, { "id": Date.now() + 1, "name": baseData.proName, "role": baseData.proRole, "tools": baseData.t2, "price": "$" + (baseData.p2 + (seed * 2)), "complexity": "Medium" }, { "id": Date.now() + 2, "name": baseData.entName, "role": baseData.entRole, "tools": baseData.t3, "price": "$" + (baseData.p3 + (seed * 3)), "complexity": "Hard" } ]; } // ========================================================================== // 🚀 MODAL INTERCEPT LOGIC // ========================================================================== function handleSendAction() { const userInput = document.getElementById('userInput'); const text = userInput.value.trim(); if (!text) return; currentActivePrompt = text; openMyModal('architectModal'); userInput.value = ""; const submitBtn = document.getElementById('submitBtn'); if (submitBtn) { submitBtn.disabled = true; submitBtn.style.backgroundColor = '#f1f5f9'; submitBtn.style.color = '#cbd5e1'; submitBtn.style.cursor = 'not-allowed'; } } async function processSystemArchitecture() { const modalBox = document.getElementById('modalBox'); const initialState = document.getElementById('modalInitialState'); const loadingState = document.getElementById('modalLoadingState'); const resultState = document.getElementById('modalResultState'); const popupCardsGrid = document.getElementById('popupCardsGrid'); if (!modalBox || !popupCardsGrid || !currentActivePrompt) return; initialState.classList.add('hidden'); loadingState.classList.remove('hidden'); fetchedAgentsArray = generateSmartLocalAIResponse(currentActivePrompt); setTimeout(() => { loadingState.classList.add('hidden'); modalBox.classList.remove('max-w-[450px]'); modalBox.classList.add('max-w-[840px]'); resultState.classList.remove('hidden'); let cardsHTML = ""; fetchedAgentsArray.forEach(agent => { const toolsArr = agent.tools || ["OpenAI"]; const badges = toolsArr.map(t => `${t}`).join(' '); let compColor = "bg-emerald-50 text-emerald-700 border-emerald-200"; if (agent.complexity === "Medium") compColor = "bg-amber-50 text-amber-700 border-amber-200"; if (agent.complexity === "Hard") compColor = "bg-rose-50 text-rose-700 border-rose-200"; cardsHTML += `

${agent.name}

${agent.complexity || "Normal"}

${agent.role}

${badges}
${agent.price}
`; }); popupCardsGrid.innerHTML = cardsHTML; currentActivePrompt = ""; }, 800); } // ========================================================================== // 🛒 HIRE ACTION & FLEET MANAGEMENT // ========================================================================== function handleHireAction(agentId) { const selectedAgent = fetchedAgentsArray.find(a => a.id === agentId); if (!selectedAgent) return; const isLoggedIn = localStorage.getItem('userIsLoggedIn'); if (isLoggedIn === 'true' || isLoggedIn === true) { let currentFleet = []; try { const existingFleet = localStorage.getItem('activeHiredAgentFleet'); if (existingFleet) currentFleet = JSON.parse(existingFleet); } catch(e) { currentFleet = []; } currentFleet.push(selectedAgent); localStorage.setItem('activeHiredAgentFleet', JSON.stringify(currentFleet)); renderHiredEmployeeState(); closeMyModal('architectModal'); } else { localStorage.setItem('pendingHiredAgent', JSON.stringify(selectedAgent)); window.location.href = 'auth.html'; } } // ========================================================================== // 🛡️ AUTHENTICATION PROFILE & DASHBOARD SYNC LOGIC // ========================================================================== function checkAndRenderUserState() { const isLoggedIn = localStorage.getItem('userIsLoggedIn'); const userDisplayName = localStorage.getItem('userDisplayName') || "User"; const guestAuthArea = document.getElementById('guestAuthArea'); const userProfileArea = document.getElementById('userProfileArea'); const profileLetterCircle = document.getElementById('profileLetterCircle'); const promoBanner = document.getElementById('promoBanner'); if (isLoggedIn === 'true' || isLoggedIn === true) { if (guestAuthArea) guestAuthArea.classList.add('hidden'); if (userProfileArea && profileLetterCircle) { userProfileArea.classList.remove('hidden'); userProfileArea.classList.add('flex'); profileLetterCircle.innerText = userDisplayName.charAt(0); } if (promoBanner) promoBanner.classList.add('hidden'); const pendingAgent = localStorage.getItem('pendingHiredAgent'); if (pendingAgent) { let currentFleet = []; try { const existingFleet = localStorage.getItem('activeHiredAgentFleet'); if (existingFleet) currentFleet = JSON.parse(existingFleet); } catch(e) { currentFleet = []; } currentFleet.push(JSON.parse(pendingAgent)); localStorage.setItem('activeHiredAgentFleet', JSON.stringify(currentFleet)); localStorage.removeItem('pendingHiredAgent'); } renderHiredEmployeeState(); } else { if (guestAuthArea) guestAuthArea.classList.add('hidden'); if (userProfileArea) userProfileArea.classList.add('hidden'); if (promoBanner) promoBanner.classList.remove('hidden'); } } // ========================================================================== // 🤖 RENDER MULTIPLE HIRED EMPLOYEES (PURE CARD CLICKABLE) // ========================================================================== function renderHiredEmployeeState() { const activeFleetData = localStorage.getItem('activeHiredAgentFleet'); const hiredEmployeeSection = document.getElementById('hiredEmployeeSection'); const hiredEmployeeCardSpace = document.getElementById('hiredEmployeeCardSpace'); if (activeFleetData && hiredEmployeeSection && hiredEmployeeCardSpace) { const fleetArray = JSON.parse(activeFleetData); if(fleetArray.length === 0) { hiredEmployeeSection.classList.add('hidden'); return; } hiredEmployeeSection.classList.remove('hidden'); let fullFleetHTML = `
`; fleetArray.forEach(agent => { const toolsArr = agent.tools || ["OpenAI"]; const badges = toolsArr.map(t => `${t}`).join(' '); fullFleetHTML += `

${agent.name}

Live

${agent.role}

${badges}
Subscribed ${agent.price}
`; }); fullFleetHTML += `
`; hiredEmployeeCardSpace.innerHTML = fullFleetHTML; } } // ========================================================================== // 🏁 RUN LOGIC HANDLERS ON DOM READY // ========================================================================== document.addEventListener('DOMContentLoaded', () => { const userInput = document.getElementById('userInput'); const submitBtn = document.getElementById('submitBtn'); const architectTriggerBtn = document.getElementById('architectTriggerBtn'); const closeArchitectModal = document.getElementById('closeArchitectModal'); const closeBlueprintBtn = document.getElementById('closeBlueprintBtn'); const logoutBtn = document.getElementById('logoutBtn'); checkAndRenderUserState(); if (logoutBtn) { logoutBtn.addEventListener('click', () => { localStorage.clear(); window.location.reload(); }); } if (architectTriggerBtn) architectTriggerBtn.addEventListener('click', processSystemArchitecture); if (closeArchitectModal) closeArchitectModal.addEventListener('click', () => closeMyModal('architectModal')); if (closeBlueprintBtn) closeBlueprintBtn.addEventListener('click', () => closeMyModal('architectModal')); if (userInput && submitBtn) { userInput.addEventListener('input', function() { if(this.value.trim().length > 0) { submitBtn.disabled = false; submitBtn.style.backgroundColor = '#0f172a'; submitBtn.style.color = '#ffffff'; submitBtn.style.cursor = 'pointer'; } else { submitBtn.disabled = true; submitBtn.style.backgroundColor = '#f1f5f9'; submitBtn.style.color = '#cbd5e1'; submitBtn.style.cursor = 'not-allowed'; } }); submitBtn.addEventListener('click', handleSendAction); userInput.addEventListener('keydown', function(e) { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); handleSendAction(); } }); } document.querySelectorAll('.suggest-tag').forEach(tag => { tag.addEventListener('click', function() { const spans = this.querySelectorAll('span'); let clickedText = spans.length >= 2 ? spans[1].innerText.trim() : this.innerText.trim(); if (userInput && clickedText) { userInput.value = `I need an AI workflow optimized for ${clickedText} integrations...`; userInput.dispatchEvent(new Event('input')); userInput.focus(); } }); }); });