script.js

// --- 1. PRELOADER ---
document.addEventListener("DOMContentLoaded", () => {
    const preloader = document.getElementById('preloader');
    setTimeout(() => { if(preloader) { preloader.style.opacity = '0'; setTimeout(() => preloader.style.display = 'none', 1000); } }, 1500);
    setTimeout(() => { if(preloader && preloader.style.display !== 'none') preloader.style.display = 'none'; }, 4000);
});

// --- 2. AUDIO & UI ---
const audioCtx = new (window.AudioContext || window.webkitAudioContext)();
function playSound(type) {
    if (audioCtx.state === 'suspended') audioCtx.resume();
    const osc = audioCtx.createOscillator(); const g = audioCtx.createGain();
    osc.connect(g); g.connect(audioCtx.destination);
    if (type === 'hover') { osc.type = 'sine'; osc.frequency.setValueAtTime(400, audioCtx.currentTime); osc.frequency.exponentialRampToValueAtTime(800, audioCtx.currentTime + 0.1); g.gain.setValueAtTime(0.05, audioCtx.currentTime); g.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + 0.1); osc.start(); osc.stop(audioCtx.currentTime + 0.1); }
    else if (type === 'click') { osc.type = 'square'; osc.frequency.setValueAtTime(150, audioCtx.currentTime); g.gain.setValueAtTime(0.1, audioCtx.currentTime); g.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + 0.1); osc.start(); osc.stop(audioCtx.currentTime + 0.1); }
}

const mobileBtn = document.getElementById('mobile-menu-btn'); const mobileMenu = document.getElementById('mobile-menu');
if (mobileBtn) mobileBtn.addEventListener('click', () => { mobileMenu.classList.toggle('hidden'); playSound('click'); });

// --- 3. CURSOR & TILT ---
const dot = document.getElementById('cursor-dot'); const ring = document.getElementById('cursor-ring');
let mouseX = 0, mouseY = 0, ringX = 0, ringY = 0;
document.addEventListener('mousemove', (e) => { mouseX = e.clientX; mouseY = e.clientY; dot.style.transform = `translate(${mouseX - 4}px, ${mouseY - 4}px)`; });
function animateCursor() { ringX += (mouseX - ringX) * 0.3; ringY += (mouseY - ringY) * 0.3; ring.style.transform = `translate(${ringX - 16}px, ${ringY - 16}px)`; requestAnimationFrame(animateCursor); }
animateCursor();

document.addEventListener('mousemove', (e) => {
    document.querySelectorAll('.interactive-element').forEach(el => { el.addEventListener('mouseenter', () => { ring.style.transform = `translate(${ringX - 24}px, ${ringY - 24}px) scale(1.5)`; ring.style.borderColor = '#d946ef'; playSound('hover'); }); el.addEventListener('mouseleave', () => ring.style.borderColor = '#06b6d4'); el.addEventListener('click', () => playSound('click')); });
    document.querySelectorAll('.magnetic-btn, .magnetic-item').forEach(btn => { const rect = btn.getBoundingClientRect(); const x = e.clientX - (rect.left + rect.width / 2); const y = e.clientY - (rect.top + rect.height / 2); if (Math.abs(x) < 80 && Math.abs(y) < 80) btn.style.transform = `translate(${x * 0.2}px, ${y * 0.2}px)`; else btn.style.transform = `translate(0px, 0px)`; });
    document.querySelectorAll('.tilt-card').forEach(card => { const rect = card.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; if (x >= 0 && x <= rect.width && y >= 0 && y <= rect.height) { const cX = rect.width / 2; const cY = rect.height / 2; const rX = ((y - cY) / cY) * -10; const rY = ((x - cX) / cX) * 10; card.style.transform = `perspective(1000px) rotateX(${rX}deg) rotateY(${rY}deg) scale(1.05)`; } else { card.style.transform = `perspective(1000px) rotateX(0deg) rotateY(0deg) scale(1)`; } });
});

// --- 4. FORM DATA & ADMIN CONSOLE (INTEGRATED) ---
const form = document.getElementById('contactForm');
const adminOverlay = document.getElementById('admin-overlay');
const openAdminBtn = document.getElementById('open-admin-btn');
const closeAdminBtn = document.getElementById('close-admin');
const adminRows = document.getElementById('admin-rows');

// Save Data
if (form) {
    form.addEventListener('submit', (e) => {
        e.preventDefault();
        const data = {
            name: document.getElementById('fname').value,
            email: document.getElementById('femail').value,
            msg: document.getElementById('fmsg').value,
            time: new Date().toLocaleTimeString()
        };
        // Save to browser memory
        let submissions = JSON.parse(localStorage.getItem('aura_submissions') || '[]');
        submissions.push(data);
        localStorage.setItem('aura_submissions', JSON.stringify(submissions));

        const btn = form.querySelector('button'); const btnText = document.getElementById('btn-text');
        btnText.innerText = "TRANSMITTING..."; btn.classList.add('opacity-75', 'cursor-not-allowed');
        setTimeout(() => { btnText.innerText = "APPROVED"; btn.classList.remove('bg-cyan-600'); btn.classList.add('bg-green-600'); form.reset(); playSound('click'); setTimeout(() => { btnText.innerText = "INITIATE UPLOAD"; btn.classList.add('bg-cyan-600'); btn.classList.remove('bg-green-600', 'opacity-75', 'cursor-not-allowed'); }, 3000); }, 1500);
    });
}

// Admin Toggle
openAdminBtn.addEventListener('click', () => {
    adminOverlay.classList.remove('hidden');
    adminOverlay.classList.add('flex');
    renderAdminData();
    playSound('click');
});
closeAdminBtn.addEventListener('click', () => {
    adminOverlay.classList.add('hidden');
    adminOverlay.classList.remove('flex');
});

// Mock Data Generator
function getMockData() {
    return [
        { time: "10:42:15", name: "Sarah Connor", email: "s.connor@sky.net", msg: "Requesting dev kit access." },
        { time: "09:15:30", name: "Neo Anderson", email: "the.one@matrix.io", msg: "Bandwidth upgrade needed." },
        { time: "08:05:11", name: "Hiro Protag", email: "hiro@meta.com", msg: "Latency check." }
    ];
}

function renderAdminData() {
    let data = JSON.parse(localStorage.getItem('aura_submissions') || '[]');
    // If empty, use mock data
    if (data.length === 0) data = getMockData();

    adminRows.innerHTML = data.map((item, index) => `
        <div class="flex items-center text-xs p-3 hover:bg-green-900/30 border-b border-green-900/30 transition-colors font-mono text-green-300">
            <div class="w-16 font-bold text-white">#${String(index + 1).padStart(3, '0')}</div>
            <div class="w-32 hidden md:block text-slate-500">${item.time}</div>
            <div class="w-48 text-white font-bold truncate pr-4">${item.name}</div>
            <div class="w-48 hidden md:block text-green-600 truncate pr-4">${item.email}</div>
            <div class="flex-1 text-slate-400 truncate pr-4">${item.msg}</div>
            <div class="w-24 text-center"><span class="px-2 py-1 bg-green-900 text-green-400 rounded text-[10px] border border-green-700">STORED</span></div>
        </div>
    `).join('');
}

function clearData() {
    if(confirm("PURGE DATA?")) { localStorage.removeItem('aura_submissions'); renderAdminData(); }
}

// Clock
setInterval(() => { const now = new Date(); if(document.getElementById('clock')) document.getElementById('clock').innerText = now.toLocaleTimeString(); }, 1000);

// --- 5. UTILS ---
window.addEventListener('scroll', () => { const sT = document.documentElement.scrollTop||document.body.scrollTop; const sH = document.documentElement.scrollHeight - document.documentElement.clientHeight; document.getElementById('scroll-progress').style.width = (sT/sH)*100 + "%"; });
const matrixCanvas=document.getElementById('matrix-canvas'); const mCtx=matrixCanvas.getContext('2d'); let matrixInterval; let isMatrixOn=false; document.addEventListener('keydown', (e) => { if(e.key.toLowerCase()==='x') { isMatrixOn=!isMatrixOn; if(isMatrixOn){ matrixCanvas.style.opacity='1'; startMatrix(); playSound('hover'); } else { matrixCanvas.style.opacity='0'; clearInterval(matrixInterval); mCtx.clearRect(0,0,matrixCanvas.width,matrixCanvas.height); } } }); function startMatrix(){ matrixCanvas.width=window.innerWidth; matrixCanvas.height=window.innerHeight; const alphabet='01'.split(''); const fontSize=16; const columns=matrixCanvas.width/fontSize; const drops=[]; for(let x=0; x<columns; x++) drops[x]=1; function draw(){ mCtx.fillStyle='rgba(0, 0, 0, 0.05)'; mCtx.fillRect(0,0,matrixCanvas.width,matrixCanvas.height); mCtx.fillStyle='#0F0'; mCtx.font=fontSize+'px monospace'; for(let i=0; i<drops.length; i++){ const text=alphabet[Math.floor(Math.random()*alphabet.length)]; mCtx.fillText(text, i*fontSize, drops[i]*fontSize); if(drops[i]*fontSize>matrixCanvas.height && Math.random()>0.975) drops[i]=0; drops[i]++; } } clearInterval(matrixInterval); matrixInterval=setInterval(draw,30); }
const pCanvas=document.getElementById('particle-canvas'); const pCtx=pCanvas.getContext('2d'); pCanvas.width=window.innerWidth; pCanvas.height=window.innerHeight; let particles=[]; class Particle{ constructor(){ this.x=Math.random()*pCanvas.width; this.y=Math.random()*pCanvas.height; this.vx=Math.random()*0.5-0.25; this.vy=Math.random()*0.5-0.25; this.size=Math.random()*2; } update(){ this.x+=this.vx; this.y+=this.vy; if(this.x<0||this.x>pCanvas.width) this.vx*=-1; if(this.y<0||this.y>pCanvas.height) this.vy*=-1; } draw(){ pCtx.fillStyle='#06b6d4'; pCtx.beginPath(); pCtx.arc(this.x,this.y,this.size,0,Math.PI*2); pCtx.fill(); } } function initP(){ particles=[]; for(let i=0; i<100; i++) particles.push(new Particle()); } function animP(){ pCtx.clearRect(0,0,pCanvas.width,pCanvas.height); particles.forEach(p=>{ p.update(); p.draw(); }); requestAnimationFrame(animP); } initP(); animP();
document.querySelectorAll(".scramble-text").forEach(el=>{ el.onmouseover=e=>{ let iter=0; const interval=setInterval(()=>{ e.target.innerText=e.target.innerText.split("").map((l,i)=>{ if(i<iter) return e.target.dataset.value[i]; return "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"[Math.floor(Math.random()*36)]; }).join(""); if(iter>=e.target.dataset.value.length) clearInterval(interval); iter+=1/3; },30); } });
function toggleFaq(el) { const p = el.querySelector('p'); const i = el.querySelector('.ph-caret-down'); if (p.classList.contains('hidden')) { p.classList.remove('hidden'); i.style.transform = 'rotate(180deg)'; el.style.borderColor = '#06b6d4'; } else { p.classList.add('hidden'); i.style.transform = 'rotate(0deg)'; el.style.borderColor = 'rgba(255,255,255,0.1)'; } }