`public/js/login.js`

59 lines
document.addEventListener('DOMContentLoaded', () => {
  const loginForm = document.getElementById('loginForm');
  const errorMessage = document.getElementById('errorMessage');
  const buttonText = document.getElementById('buttonText');
  const buttonLoader = document.getElementById('buttonLoader');
  const loginButton = loginForm.querySelector('button[type="submit"]');

  loginForm.addEventListener('submit', async (e) => {
    e.preventDefault();

    const username = document.getElementById('username').value;
    const password = document.getElementById('password').value;

    // Clear previous errors
    errorMessage.classList.remove('show');
    errorMessage.textContent = '';

    // Show loader
    buttonText.style.display = 'none';
    buttonLoader.style.display = 'inline-block';
    loginButton.disabled = true;

    try {
      const response = await fetch('/auth/login', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({ username, password })
      });

      const data = await response.json();

      if (data.success) {
        // Redirect to main app
        window.location.href = '/';
      } else {
        // Show error
        errorMessage.textContent = data.error || 'Authentication failed';
        errorMessage.classList.add('show');

        // Reset button
        buttonText.style.display = 'inline';
        buttonLoader.style.display = 'none';
        loginButton.disabled = false;
      }
    } catch (error) {
      console.error('Login error:', error);
      errorMessage.textContent = 'Connection error. Please try again.';
      errorMessage.classList.add('show');

      // Reset button
      buttonText.style.display = 'inline';
      buttonLoader.style.display = 'none';
      loginButton.disabled = false;
    }
  });
});