$(function () {
  const url = window.location.href;
  const searchParams = new URLSearchParams(new URL(url).search);
  const rParam = searchParams.get("r");

  let submitFlag = false;
  $(".login_btn").on("click", login);
  $("#login-code input").on("keydown", function (e) {
    if (e.key === "Enter" || e.keyCode === 13) {
      login();
    }
  });

  function login() {
    let _lang = $("#language").val();
    var email = $("#login_email input").val();
    var password = $("#login_pwd input").val();
    var code = $("#login-code input").val();
    var uuid = localStorage.getItem("uuid");

    if (email == "" || email == undefined) {
      $("#login_email").addClass("error");
      $("#login_email .error_tip").show();
      return;
    } else {
      $("#login_email").removeClass("error");
      $("#login_email .error_tip").hide();
    }

    if (password == "" || password == undefined) {
      $("#login_pwd").addClass("error");
      $("#login_pwd .error_tip").show();
      return;
    } else {
      $("#login_pwd").removeClass("error");
      $("#login_pwd .error_tip").hide();
    }

    if (code == "" || code == undefined) {
      $("#login-code").addClass("error");
      $("#login-code .error_tip").show();
    } else {
      $("#login-code").removeClass("error");
      $("#login-code .error_tip").hide();
    }

    if (submitFlag) return;
    submitFlag = true;
    $(".loading-mask").show();
    $.ajax({
      url: requestApi + "/login",
      dataType: "json",
      type: "POST",
      contentType: "application/json",
      aysc: false,
      data: JSON.stringify({
        lang: _lang,
        username: email,
        password: password,
        code: code,
        rememberMe: false,
        uuid: uuid,
      }),
      success: function (res) {
        console.log("login", res);
        submitFlag = false;
        $(".loading-mask").hide();

        if (res.code === 200) {
          localStorage.setItem("session", res.token);
          //   localStorage.setItem("user", JSON.stringify(res.data));
          const expiresDate = new Date();
          //   const expires =
          //     res.data.token_cache == 0 ? 9999999999999 : res.data.token_cache;
          expiresDate.setDate(res.expire);
          const domain = window.location.host.split(".").slice(-2).join(".");

          Cookies.set("common_session", res.token, {
            expires: expiresDate,
            domain,
          });
          //   if(!rParam) {
          window.location.href = "cli-traffic.html";
          //   } else {
          //     window.location.href = "https://cliproxy.com" + rParam;
          //   }
        } else {
          messageFn(res.msg);
          reloadCaptcha();
        }
        return;
      },
      error: function () {
        submitFlag = false;
        reloadCaptcha();
        $(".loading-mask").hide();
      },
    });
  }

  const $passwordInput = $("#login_pwd input");
  const $eyeIcon = $("#eyeIcon");
  const $codeImg = $("#codeImg");

  $codeImg.on("click", function () {
    reloadCaptcha();
  });

  $eyeIcon.on("click", function () {
    if ($passwordInput.attr("type") === "password") {
      $passwordInput.attr("type", "text");
      $eyeIcon.attr("src", "static/picture/pwd-2.png");
    } else {
      $passwordInput.attr("type", "password");
      $eyeIcon.attr("src", "static/picture/pwd-1.png");
    }
  });

  function reloadCaptcha() {
    $.ajax({
      url: requestApi + "/captcha",
      dataType: "json",
      type: "GET",
      async: false,
      success: function (res) {
        if (res.code === 200) {
          $("#codeImg").attr("src", res.data);
          localStorage.setItem("uuid", res.id);
        } else {
          messageFn(res.msg);
        }
      },
      error: function (err) {
        messageFn(err);
      },
    });
  }

  reloadCaptcha();
});