Spaces:
Sleeping
Sleeping
File size: 3,415 Bytes
e7a4412 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 |
document.addEventListener('DOMContentLoaded', () => {
// Check if user is already signed in
const token = localStorage.getItem('authToken');
if (token) {
window.location.href = '/dashboard.html'; // Redirect to dashboard if already signed in
return;
}
const zenForm = document.querySelector('.zen-form');
const signinPanel = document.querySelector('.signin-panel');
const inputs = zenForm.querySelectorAll('input');
// Add input validation and interaction
inputs.forEach(input => {
input.addEventListener('focus', () => {
input.parentElement.classList.add('input-focus');
});
input.addEventListener('blur', () => {
input.parentElement.classList.remove('input-focus');
});
});
// Handle form submission
zenForm.addEventListener('submit', async (e) => {
e.preventDefault();
const email = inputs[0].value;
const password = inputs[1].value;
const submitButton = zenForm.querySelector('.enter-gate');
try {
// Show loading state
submitButton.textContent = 'Entering...';
submitButton.disabled = true;
const response = await fetch('/signin', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email, password }),
});
const data = await response.json();
if (response.ok) {
// Store authentication token
localStorage.setItem('authToken', data.token);
// Success animation
signinPanel.style.transform = 'rotateY(180deg)';
signinPanel.style.background = 'linear-gradient(135deg, #6b8e23, #87ceeb)';
setTimeout(() => {
window.location.href = '/dashboard.html'; // Redirect to dashboard
}, 1000);
} else {
// Show error message
const errorDisplay = document.createElement('div');
errorDisplay.className = 'error-message';
errorDisplay.textContent = data.error || 'Invalid credentials';
zenForm.appendChild(errorDisplay);
// Shake animation for error
signinPanel.style.animation = 'shake 0.5s ease-in-out';
// Remove error message after 3 seconds
setTimeout(() => {
errorDisplay.remove();
}, 3000);
}
} catch (error) {
console.error('Signin error:', error);
// Handle network errors or server being down
const errorDisplay = document.createElement('div');
errorDisplay.className = 'error-message';
errorDisplay.textContent = 'Unable to connect to server. Please try again later.';
zenForm.appendChild(errorDisplay);
setTimeout(() => {
errorDisplay.remove();
}, 3000);
} finally {
// Reset button state
submitButton.textContent = 'Enter Sanctuary';
submitButton.disabled = false;
}
});
});
// Helper function for authenticated requests
window.authenticatedFetch = async (url, options = {}) => {
const token = localStorage.getItem('authToken');
if (token) {
options.headers = {
...options.headers,
'Authorization': `Bearer ${token}`,
};
}
const response = await fetch(url, options);
return response;
}; |