$(function () {
    const id = $("input[name = 'username']");
    const pwd = $("input[name = 'password']");
    const logBtn = $(".input-box > div:nth-child(3)");
    function init() {
        logBtn.on("click", () => {
            loginCheck();
        });

        id.on("keydown", (e) => {
            if (e.key === "Enter") {
                loginCheck();
            }
        });

        pwd.on("keydown", (e) => {
            if (e.key === "Enter") {
                loginCheck();
            }
        });

        logBtn.on("mouseenter", () => {
            $(".input-box > div:nth-child(3)> i:nth-child(1)").css("display", "none");
            $(".input-box > div:nth-child(3)> i:nth-child(2)").css("display", "block");
            logBtn.css({
                background: "#124c9b",
                border: "1px solid #124c9b",
            });
        });
        logBtn.on("mouseleave", () => {
            $(".input-box > div:nth-child(3)> i:nth-child(1)").css({ display: "block", top: "15px" });
            $(".input-box > div:nth-child(3)> i:nth-child(2)").css("display", "none");
            logBtn.css({
                background: "#1e65c5",
                border: "1px solid #1e65c5",
            });
        });
    }

    init();

    function nullChecker(checkItem) {
        return checkItem || null;
    }
    function loginCheck() {
        let idVal = $.trim(id.val());
        let pwdVal = $.trim(pwd.val());
        if (!nullChecker(idVal)) {
            alert("id를 입력해주세요");
            id.focus();
            return false;
        }
        if (!nullChecker(pwdVal)) {
            alert("비밀번호를 입력해주세요");
            pwd.focus();
            return false;
        }
        $("form").submit();
    }
});