// HOME v3.0

// register sign in buttons
const openRegisterContainerButton = document.getElementById('open-register-container-button');
let registerButtons = document.querySelectorAll('.register-button');
const registerFormCloseButton = document.getElementById('register-form-close-button');
const responseCloseButton = document.getElementById('registration-response-close-button');

// register inputs
const registerEmail = document.getElementById('register-email');
const registerPassword = document.getElementById('register-password');
const registerPasswordRepeated = document.getElementById('register-password-repeated');
const signInEmail = document.getElementById('sign-in-email');
const signInPassword = document.getElementById('sign-in-password');

// register container
const registerDisplayBox = document.getElementById('register-container-box');
const registrationResponseDisplay = document.getElementById('registration-response-box');
const registrationResponseCard = document.getElementById('registration-response-card');
const error = document.getElementById('error');
const errorMessage = document.getElementById('error-message');

// forms
const registerForm = document.getElementById('register-form');
const signInForm = document.getElementById('sign-in-form');

// register new user info
function registerNewUser(e){
  e.preventDefault();
  const newUser = {// creates user info into an object
    email: registerEmail.value,
    pw: registerPasswordRepeated.value
  };
  if(registerEmail.value === '' || registerPassword.value === '' || registerPasswordRepeated.value === ''){
    showErrorMessage('One or more registration values are empty.');
    }
  else if(registerPassword.value != registerPasswordRepeated.value){
    showErrorMessage('Passwords do not match.');
  }
}

// checks sign in entries
function signIn(e){
  e.preventDefault();
  if(signInEmail.value === ''){
    showErrorMessage('The email you registered with is needed.');
  }
  else if(signInPassword.value ===''){
    showErrorMessage('A password is needed.');
  }
}

// generates error message
function showErrorMessage(errorType){
  setTimeout(function(){
    errorMessage.innerText = errorType;
    error.style.opacity = '1'
  }, 150);// displays in .15 of a second
  setTimeout(function(){
    error.style.opacity = '0';
  }, 5000);// goes away after 5 seconds
}

// opens the register container, adds dim wrapper to the screen
function openRegister(){
  for(let i = 0; i < registerButtons.length; i++){
    registerDisplayBox.classList.add('move');
    wrapper.classList.add('wrapper-dim');
  }
}

registerForm.addEventListener('submit', registerNewUser);
signInForm.addEventListener('submit', signIn);
// removes the dim effect, closes the register container
registerFormCloseButton.addEventListener('click', function(){
  registerDisplayBox.classList.remove('move');
  wrapper.classList.remove('wrapper-dim');
  document.body.style.overflowY = 'auto';
  registerForm.reset();
  signInForm.reset();
});