🍽️ PlateChart

Welcome Back

if (savedTheme === 'dark') { document.body.classList.add('dark-mode'); } // UI Elements const authTabs = document.querySelectorAll('.auth-tab'); const loginForm = document.getElementById('loginForm'); const signupForm = document.getElementById('signupForm'); const resetForm = document.getElementById('resetForm'); const authTabsContainer = document.getElementById('authTabs'); const messageBox = document.getElementById('messageBox'); const authTitle = document.getElementById('authTitle'); const authSubtitle = document.getElementById('authSubtitle'); // Buttons const loginBtn = document.getElementById('loginBtn'); const signupBtn = document.getElementById('signupBtn'); const resetBtn = document.getElementById('resetBtn'); // --- UI Helper Functions --- function showMessage(text, type = 'error') { if (!messageBox) return; messageBox.textContent = text; messageBox.className = `message ${type}`; messageBox.classList.remove('hidden'); setTimeout(() => { messageBox.classList.add('hidden'); }, 5000); } // --- Initialize Supabase --- let supabase = null; try { if (window.supabase) { supabase = window.supabase.createClient(SUPABASE_URL, SUPABASE_ANON_KEY); console.log("Supabase initialized successfully"); } else { console.error("Supabase script not loaded"); showMessage("Authentication service unavailable. Check your connection.", "error"); } } catch (e) { console.error('Supabase init error:', e); } // Check Session if (supabase) { supabase.auth.getSession().then(({ data: { session } }) => { if (session) { console.log("User already logged in, redirecting..."); window.location.href = '/'; } }).catch(e => console.error('Session check error:', e)); } // --- Event Listeners --- // Tab Switching authTabs.forEach(tab => { tab.addEventListener('click', (e) => { e.preventDefault(); // Prevent accidental form submissions const tabName = tab.dataset.tab; authTabs.forEach(t => t.classList.remove('active')); tab.classList.add('active'); loginForm.classList.remove('active'); signupForm.classList.remove('active'); resetForm.classList.remove('active'); authTabsContainer.classList.remove('hidden'); if (tabName === 'login') { loginForm.classList.add('active'); authTitle.textContent = 'Welcome Back'; authSubtitle.textContent = 'Sign in to access your personalized diet plans'; } else { signupForm.classList.add('active'); authTitle.textContent = 'Create Account'; authSubtitle.textContent = 'Start your personalized nutrition journey'; } }); }); // Navigation Links const forgotLink = document.getElementById('forgotPasswordLink'); if (forgotLink) { forgotLink.addEventListener('click', (e) => { e.preventDefault(); loginForm.classList.remove('active'); signupForm.classList.remove('active'); resetForm.classList.add('active'); authTabsContainer.classList.add('hidden'); authTitle.textContent = 'Reset Password'; authSubtitle.textContent = 'Enter your email to receive a reset link'; }); } const backLink = document.getElementById('backToLoginLink'); if (backLink) { backLink.addEventListener('click', (e) => { e.preventDefault(); resetForm.classList.remove('active'); loginForm.classList.add('active'); authTabsContainer.classList.remove('hidden'); // Reset tabs to Login authTabs.forEach(t => t.classList.remove('active')); document.querySelector('[data-tab="login"]').classList.add('active'); authTitle.textContent = 'Welcome Back'; authSubtitle.textContent = 'Sign in to access your personalized diet plans'; }); } // --- Form Submissions --- // Login if (loginForm) { loginForm.addEventListener('submit', async (e) => { e.preventDefault(); console.log("Login form submitted"); if (!supabase) { showMessage('Authentication service not loaded. Please refresh.', 'error'); return; } const email = document.getElementById('loginEmail').value; const password = document.getElementById('loginPassword').value; loginBtn.disabled = true; loginBtn.textContent = 'Signing in...'; try { const { data, error } = await supabase.auth.signInWithPassword({ email, password }); if (error) throw error; showMessage('Login successful! Redirecting...', 'success'); setTimeout(() => window.location.href = '/', 1000); } catch (error) { console.error("Login error:", error); showMessage(error.message, 'error'); } finally { loginBtn.disabled = false; loginBtn.textContent = 'Sign In'; } }); } // Signup if (signupForm) { signupForm.addEventListener('submit', async (e) => { e.preventDefault(); console.log("Signup form submitted"); if (!supabase) { showMessage('Authentication service not loaded. Please refresh.', 'error'); return; } const name = document.getElementById('signupName').value; const email = document.getElementById('signupEmail').value; const password = document.getElementById('signupPassword').value; signupBtn.disabled = true; signupBtn.textContent = 'Creating account...'; try { const { data, error } = await supabase.auth.signUp({ email, password, options: { data: { full_name: name } } }); if (error) throw error; showMessage('Account created! Please check your email to verify.', 'success'); } catch (error) { console.error("Signup error:", error); showMessage(error.message, 'error'); } finally { signupBtn.disabled = false; signupBtn.textContent = 'Create Account'; } }); } // Reset Password if (resetForm) { resetForm.addEventListener('submit', async (e) => { e.preventDefault(); if (!supabase) { showMessage('Authentication service not loaded. Please refresh.', 'error'); return; } const email = document.getElementById('resetEmail').value; resetBtn.disabled = true; resetBtn.textContent = 'Sending...'; try { const { error } = await supabase.auth.resetPasswordForEmail(email, { redirectTo: window.location.origin + '/reset-password.html' }); if (error) throw error; showMessage('Password reset link sent! Check your email.', 'success'); } catch (error) { console.error("Reset error:", error); showMessage(error.message, 'error'); } finally { resetBtn.disabled = false; resetBtn.textContent = 'Send Reset Link'; } }); } });