document.addEventListener('DOMContentLoaded', () => { const browserFrame = document.getElementById('browser-frame'); const proxyForm = document.querySelector('custom-proxy-form'); // Default page to load loadUrl('https://www.google.com'); // Handle URL loading function loadUrl(url, useProxy = false) { try { browserFrame.classList.add('loading'); // Validate URL if (!url.startsWith('http://') && !url.startsWith('https://')) { url = 'https://' + url; } // Create new URL object to validate new URL(url); if (useProxy) { // Use a reliable proxy service (cors-anywhere requires activation) const proxyUrl = `https://api.allorigins.win/get?url=${encodeURIComponent(url)}`; fetch(proxyUrl) .then(response => response.json()) .then(data => { const proxyDocument = browserFrame.contentDocument || browserFrame.contentWindow.document; proxyDocument.open(); proxyDocument.write(data.contents); proxyDocument.close(); document.querySelector('.proxy-indicator').classList.remove('hidden'); }) .catch(error => { console.error('Proxy error:', error); browserFrame.src = url; // Fallback to direct load document.querySelector('.proxy-indicator').classList.add('hidden'); }); } else { browserFrame.src = url; document.querySelector('.proxy-indicator').classList.add('hidden'); } // Remove loading class when page is loaded browserFrame.onload = () => { browserFrame.classList.remove('loading'); }; browserFrame.onerror = () => { browserFrame.classList.remove('loading'); browserFrame.srcdoc = `

Failed to load page

Could not load ${url}

Try enabling proxy or check your connection

`; }; } catch (error) { console.error('URL loading error:', error); browserFrame.classList.remove('loading'); browserFrame.srcdoc = `

Invalid URL

${url} is not a valid web address

Please enter a complete URL like "https://example.com"

`; } } // Handle proxy form submission proxyForm.addEventListener('proxy-submit', (e) => { const { url, useProxy } = e.detail; loadUrl(url, useProxy); }); // Handle quick link clicks document.addEventListener('quick-link-click', (e) => { loadUrl(e.detail.url, e.detail.useProxy); }); // VPN toggle functionality const toggleVpnButtons = document.querySelectorAll('#toggle-vpn'); let vpnActive = false; toggleVpnButtons.forEach(button => { button.addEventListener('click', () => { vpnActive = !vpnActive; const indicator = document.querySelector('.proxy-indicator'); if (vpnActive) { indicator.classList.remove('hidden'); indicator.innerHTML = ` VPN Active`; feather.replace(); } else { indicator.classList.add('hidden'); } }); }); // Clear data functionality const clearDataButtons = document.querySelectorAll('#clear-data'); clearDataButtons.forEach(button => { button.addEventListener('click', () => { try { // Attempt to clear browser data if (confirm('Clear all browsing data (cookies, cache, etc.)?')) { const browserFrame = document.getElementById('browser-frame'); browserFrame.src = 'about:blank'; setTimeout(() => { loadUrl('https://www.google.com'); alert('Browser data cleared!'); }, 500); } } catch (e) { alert('Could not clear data due to browser restrictions'); } }); }); // Initialize feather icons feather.replace(); });