require('../scss/style.scss');
require('../scss/login.scss');
require('./utils/logger');
const $ = require('jquery');
const ui = require('./ui/common');
const modal = require('./utils/modal');
const utils = require('./utils');
const api = require('./utils/api');
const query_string = require('query-string');
const cookies = require('./utils/cookies');

const $username = $("#username").on("keydown", function(event) {
    if (event.key === "Enter") {
        post_login();
    }
});
const $password = $("#password").on("keydown", function(event) {
    if (event.key === "Enter") {
        post_login();
    }
});
$("#login_button").on("click", post_login);

let qs = query_string.parse(location.search);
logger.log(qs);

if (qs.username) {
    $("#username").val(qs.username);
}

if (cookies.get('cookie_consent')) {
    logger.log("Cookies accepted!");
    // Keep pushing the expires date back since we
    // can't actually keep cookies stored "forever"
    consent_to_cookies();

    let login_message = cookies.get('login_message');
    if (login_message) {
        logger.log("login_message", login_message);
        ui.show_banner(login_message);
        cookies.remove('login_message');
    }
} else {
    modal.create('cookie-consent-modal').append(
        $(`<button class="accept-cookies">Sure, Store Cookies</button>`).on("click", function() {
            consent_to_cookies();
            modal.close();
        })
    );
}

function consent_to_cookies() {
    cookies.set('cookie_consent', true, {
        expires: 10000
    });
}

function post_login() {
    utils.validate.keys({
        username: $username.val().trim(),
        password: $password.val()
    }, [
        ["username", "Username cannot be empty"],
        ["password", "Password cannot be empty"]
    ]).then(function(data) {
        return api.post("/account/login", data);
    }).then(function() {
        window.location = "/";
    }).catch(api.handle_error_message);
}