// Age verification functionality document.addEventListener('DOMContentLoaded', function() { // Initialize feather icons if (typeof feather !== 'undefined') { feather.replace(); } // Age verification logic const ageVerification = document.getElementById('ageVerification'); const mainContent = document.getElementById('mainContent'); const enterButton = document.getElementById('enterSite'); const exitButton = document.getElementById('exitSite'); // Check if user has already verified age const hasVerified = localStorage.getItem('ageVerified'); if (hasVerified === 'true') { ageVerification.classList.add('hidden'); mainContent.classList.remove('hidden'); } enterButton.addEventListener('click', function() { localStorage.setItem('ageVerified', 'true'); ageVerification.classList.add('hidden'); mainContent.classList.remove('hidden'); // Re-initialize feather icons for main content if (typeof feather !== 'undefined') { setTimeout(() => feather.replace(), 100); } }); exitButton.addEventListener('click', function() { window.location.href = 'https://www.google.com'; }); // Theme toggle functionality const themeToggle = document.getElementById('themeToggle'); const themeIcon = themeToggle.querySelector('i'); themeToggle.addEventListener('click', function() { const html = document.documentElement; if (html.classList.contains('dark')) { html.classList.remove('dark'); themeIcon.setAttribute('data-feather', 'moon'); localStorage.setItem('theme', 'light'); } else { html.classList.add('dark'); themeIcon.setAttribute('data-feather', 'sun'); localStorage.setItem('theme', 'dark'); } if (typeof feather !== 'undefined') { feather.replace(); } }); // Set initial theme based on localStorage or system preference const savedTheme = localStorage.getItem('theme'); if (savedTheme === 'dark' || (!savedTheme && window.matchMedia('(prefers-color-scheme: dark)').matches) { document.documentElement.classList.add('dark'); themeIcon.setAttribute('data-feather', 'sun'); if (typeof feather !== 'undefined') { feather.replace(); } } // Upload modal functionality const uploadTrigger = document.getElementById('uploadTrigger'); const uploadModal = document.getElementById('uploadModal'); const closeModal = document.getElementById('closeModal'); const cancelUpload = document.getElementById('cancelUpload'); const uploadArea = document.getElementById('uploadArea'); const fileInput = document.getElementById('fileInput'); const uploadProgress = document.getElementById('uploadProgress'); const progressBar = document.getElementById('progressBar'); const uploadError = document.getElementById('uploadError'); const confirmUpload = document.getElementById('confirmUpload'); let selectedFile = null; // Open modal uploadTrigger.addEventListener('click', function() { uploadModal.classList.remove('hidden'); resetUploadState(); }); // Close modal functions function closeUploadModal() { uploadModal.classList.add('hidden'); resetUploadState(); } closeModal.addEventListener('click', closeUploadModal); cancelUpload.addEventListener('click', closeUploadModal); // Click outside modal to close uploadModal.addEventListener('click', function(e) { if (e.target === uploadModal) { closeUploadModal(); } }); // File upload handling uploadArea.addEventListener('click', function() { fileInput.click(); }); uploadArea.addEventListener('dragover', function(e) { e.preventDefault(); uploadArea.classList.add('border-primary', 'bg-primary-50', 'dark:bg-primary-900/20'); }); uploadArea.addEventListener('dragleave', function() { uploadArea.classList.remove('border-primary', 'bg-primary-50', 'dark:bg-primary-900/20'); }); uploadArea.addEventListener('drop', function(e) { e.preventDefault(); uploadArea.classList.remove('border-primary', 'bg-primary-50', 'dark:bg-primary-900/20'); handleFileSelect(e.dataTransfer.files[0]); }); fileInput.addEventListener('change', function(e) { if (e.target.files.length > 0) { handleFileSelect(e.target.files[0]); } }); function handleFileSelect(file) { // Validate file type const validTypes = ['image/jpeg', 'image/jpg', 'image/png']; if (!validTypes.includes(file.type)) { showUploadError('Please upload only JPG or PNG files.'); return; } // Validate file size (10MB) const maxSize = 10 * 1024 * 1024; if (file.size > maxSize) { showUploadError('File size must be less than 10MB.'); return; } selectedFile = file; uploadArea.innerHTML = `

${file.name}

${(file.size / 1024 / 1024).toFixed(2)} MB

`; confirmUpload.disabled = false; if (typeof feather !== 'undefined') { feather.replace(); } } confirmUpload.addEventListener('click', function() { if (!selectedFile) return; // Show progress bar uploadProgress.classList.remove('hidden'); progressBar.style.width = '0%'; // Simulate upload progress let progress = 0; const interval = setInterval(() => { progress += Math.random() * 15; if (progress > 100) progress = 100; progressBar.style.width = progress + '%'; if (progress === 100) { clearInterval(interval); simulateAIRating(); } }, 200); }); function simulateAIRating() { // Simulate AI processing setTimeout(() => { // Show success and redirect to results alert('Your photo has been analyzed! Here is your brutally honest rating...'); closeUploadModal(); // In a real implementation, this would redirect to the results page }, 1500); } function resetUploadState() { selectedFile = null; uploadArea.innerHTML = `

Click to upload or drag and drop

JPG, PNG up to 10MB

`; uploadProgress.classList.add('hidden'); uploadError.classList.add('hidden'); confirmUpload.disabled = true; fileInput.value = ''; if (typeof feather !== 'undefined') { feather.replace(); } } function showUploadError(message) { uploadError.querySelector('p').textContent = message; uploadError.classList.remove('hidden'); setTimeout(() => { uploadError.classList.add('hidden'); }, 5000); } // Keyboard navigation document.addEventListener('keydown', function(e) { if (e.key === 'Escape' && !uploadModal.classList.contains('hidden')) { closeUploadModal(); } }); // Performance optimization: Lazy loading for future implementations if ('IntersectionObserver' in window) { const observer = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { // Future: Load content when it comes into view } }); }); } });