const btnLogin = document.querySelector('#btn_login');
const inputPassword = document.querySelector('#password');

inputPassword.addEventListener('keyup', loginByEnter);

btnLogin.addEventListener('click', login);

function loginByEnter(e) {
  if (e.keyCode === 13) {
    e.preventDefault();
    console.log('login!');
    login();
  }
};

function login(){
  console.log('login!');
  var url = "login";
  var xhr = new XMLHttpRequest();
  xhr.open("POST", url);
  xhr.setRequestHeader("accept", "application/json");
  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4) {
      responseOBJ = JSON.parse(xhr.responseText)
      // document.cookie = 'jwt_token='+responseOBJ.jwt_token    // access_token -> jwt_token
      document.cookie = 'jwt_token='+responseOBJ.access_token;
      if (responseOBJ.access_token!=null)
      {
        Swal.fire({
          title: "登入成功",
          icon: 'success',
          confirmButtonColor: '#3085d6',
        },function(isConfirm){
          if(isConfirm){window.location.replace("/make_video");}
        }
        );
      }
      else{
        Swal.fire({
          title: "登入失敗",
          icon: 'error',
          text: responseOBJ.detail,
          confirmButtonColor: '#3085d6',
        });
      }
      
    }
  };
  var data = "grant_type=&username=" + $('#username').val() + "&password="+$('#password').val()+"&scope=&client_id=&client_secret=";
  result = xhr.send(data);
  console.log(result);
}