// DO NOT ADD PHP TO JS FILES!

/**
 * Login Sign-in view Component class
 */
LoginSignInComponent = function ()
{
}


LoginSignInComponent.onInit = function ()
{
  LoginSignInComponent.onSignInCodeEntered();

  watchChanges("#password", LoginSignInComponent.onPasswordChange);
  watchChanges("#user_4_digit_pin", LoginSignInComponent.onUserPinChange);
}


LoginSignInComponent.onStop = function ()
{
  unWatchChanges("#password", LoginSignInComponent.onPasswordChange);
  unWatchChanges("#user_4_digit_pin", LoginSignInComponent.onUserPinChange);

  LoginSignInComponent.onSignInCodeRemoved();
}


LoginSignInComponent.onSignInCodeEntered = function()
{
  var sign_in_code    = document.getElementById("username").value;
  var username_val    = stringToHex(sign_in_code);
  var token_anti_csrf = $("#token_login").val();

  load_spinner();

  jQuery.post("login_components.php",
  {
    check_4_digit_pin: 1,
    username : username_val,
    anti_csrf: token_anti_csrf
  },
  function(data)
  {
    stop_spinner(false);

    if (data.no_success == "1")
    {
      $("#error-message").text(data.message);
      return;
    }

    if (data.error)
    {
      LoginSignInComponent.show4DigitPinInput(true);
      $("#error-message").text(data.error);
      return;
    }

    LoginSignInComponent.show4DigitPinInput();
  }, "json");
}


LoginSignInComponent.onSignInCodeRemoved = function()
{
  LoginSignInComponent.hide4DigitPinInput();
}


LoginSignInComponent.show4DigitPinInput = function(show_password)
{
  LoginComponent.disableLogin();

  jQuery("#label_username").text(translations['YOUR_SIGN_IN_CODE']);
  jQuery('#user_4_digit_pin').pincodeInput({
    hidedigits: true,
    inputs: 4,
    keydown: function(e) { if (e.which == 13) do_login(); },
    change: function() { jQuery('#user_4_digit_pin').trigger('change'); }
  });

  jQuery("#user_4_digit_pin_container").show();

  if (!show_password)
  {
    jQuery("#password").parent().hide();
    jQuery("#forgot_password").hide();
  }
  else
  {
    jQuery("#middle-container-top").css("height", "595px");
    jQuery("#error-message").css("top", "65%");
  }
}


LoginSignInComponent.hide4DigitPinInput = function()
{
  jQuery("#label_username").text(translations['YOUR_USERNAME']);
  jQuery("#user_4_digit_pin_container").hide();
  jQuery("#middle-container-top").css("height", '');
  jQuery("#error-message").css("top", '');
  jQuery("#error-message").text("");
  jQuery("#password").parent().show();
  jQuery("#forgot_password").show();
  jQuery('#user_4_digit_pin').pincodeInput().data('plugin_pincodeInput').clear();
  LoginComponent.enableLogin();
}


LoginSignInComponent.onPasswordChange = function()
{
  LoginSignInComponent.toggleLogin();
}


LoginSignInComponent.onUserPinChange = function()
{
  LoginSignInComponent.toggleLogin();
}


LoginSignInComponent.toggleLogin = function()
{
  var password = document.getElementById("password");
  var user_pin = document.getElementById("user_4_digit_pin");
  var password_required = jQuery("#password").parent().is(':visible');

  if ((!password_required || password.value.length > 0) && user_pin.value.length === 4)
  {
    LoginComponent.enableLogin();
  }
  else
  {
    LoginComponent.disableLogin();
  }
}