// Initialize wallet connection let walletConnected = false; let solBalance = 0; let tokens = []; // Mock data for demo function fetchWalletData() { // Simulate API call setTimeout(() => { walletConnected = true; solBalance = 4.52; tokens = [ { name: "Solana", symbol: "SOL", balance: 4.52, value: 452.00, change: "+2.5%", logo: "http://static.photos/white/200x200/1" }, { name: "USDC", symbol: "USDC", balance: 150.00, value: 150.00, change: "0.0%", logo: "http://static.photos/blue/200x200/2" }, { name: "Raydium", symbol: "RAY", balance: 25.00, value: 75.50, change: "+5.2%", logo: "http://static.photos/yellow/200x200/3" }, { name: "Serum", symbol: "SRM", balance: 10.50, value: 42.00, change: "-1.3%", logo: "http://static.photos/green/200x200/4" } ]; // Update UI document.querySelector('custom-wallet-card').setAttribute('connected', 'true'); document.querySelector('custom-wallet-card').setAttribute('balance', solBalance.toString()); document.querySelector('custom-token-list').setAttribute('tokens', JSON.stringify(tokens)); }, 1000); } // Connect wallet function function connectWallet() { if (!walletConnected) { fetchWalletData(); } } // Handle dark/light mode toggle function toggleDarkMode() { const html = document.documentElement; if (html.classList.contains('dark')) { html.classList.remove('dark'); localStorage.setItem('theme', 'light'); } else { html.classList.add('dark'); localStorage.setItem('theme', 'dark'); } } // Initialize theme based on user preference function initTheme() { if (localStorage.getItem('theme') === 'dark' || (!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) { document.documentElement.classList.add('dark'); } else { document.documentElement.classList.remove('dark'); } } // Initialize app document.addEventListener('DOMContentLoaded', () => { initTheme(); feather.replace(); // Demo: Auto connect for demo purposes setTimeout(connectWallet, 500); });