import { hide_login_page, show_login_page, hide_signup_page, show_signup_page, show_home, handlePopstate, getDeviceLanguage } from '../main/main.js';
import { more_options_menu_expand } from '../nav/menus/moreoptions/main.js';
import { showFilesPage, showServerFilesPage } from '../files/main.js';
import { handleHomeScroll } from '../scroll/main.js';
import { getCookie, showDialog, jCloudUIElements, addQueryParam } from '../tools/main.js';
import { signOut, submit_email, check_password, createUser, signupPage1, signupPage2, signupPage3 } from '../users/main.js';
import { loadPageTexts, loadSectionTexts, getPageText, getSectionText, getUiLabels } from '../i18n/main.js';
import { showContactForm, submitContactForm } from '../contact/main.js';
import { showSearch, displaySuggestions as displaySearchSuggestions, refreshSuggestions as refreshSearchSuggestions, displayResults } from '../search/main.js';

document.addEventListener('DOMContentLoaded', async function () {
    import('../elements/dropdown/main.js');
    
    window.keyDownCallbacks = {};
    window.keyUpCallbacks = {};

    document.querySelector(':root').style.setProperty('--scrollbar-width', window.innerWidth - document.documentElement.clientWidth + 'px')
    document.querySelector('#private-application-banner-close-button').addEventListener('click', function () {
        document.querySelector('#private-application-banner').classList.add('hide');
    });
    document.querySelector('#expand-more-options').addEventListener('click', function () {
        more_options_menu_expand();
    });
    document.querySelector('#login-button').addEventListener('click', async function () {
        history.pushState(null, '', '/login');
        await loadPageTexts('/login');
        console.log('login link clicked');
        show_login_page();
    });
    document.querySelector('#login-link').addEventListener('click', async function () {
        history.pushState(null, '', '/login');
        await loadPageTexts('/login');
        hide_signup_page();
        show_login_page();
    });
    document.querySelector('#email-form').addEventListener('submit', function (event) {
        event.preventDefault();
        submit_email();
    });
    document.querySelector('#password-form').addEventListener('submit', async function (event) {
        event.preventDefault();
        await check_password();
    });
    document.querySelector('#email').addEventListener('input', function () {
        if (document.querySelector('#email').value.length > 0) {
            document.querySelector('#email-input-submit-arrow').setAttribute('fill', '#000');
            document.querySelector('#email-input-submit-button').style.border = '1px solid #000';
            document.querySelector('#email-input-submit-button').style.cursor = 'pointer'
        } else {
            document.querySelector('#email-input-submit-arrow').setAttribute('fill', '#787878');
            document.querySelector('#email-input-submit-button').style.border = '1px solid #787878';
            document.querySelector('#email-input-submit-button').style.cursor = 'default';
        };
    });
    document.querySelector('#password').addEventListener('input', function () {
        if (document.querySelector('#password').value.length > 0) {
            document.querySelector('#password-input-submit-arrow').setAttribute('fill', '#000');
            document.querySelector('#password-input-submit-button').style.border = '1px solid #000';
            document.querySelector('#password-input-submit-button').style.cursor = 'pointer';
        } else {
            document.querySelector('#password-input-submit-arrow').setAttribute('fill', '#787878');
            document.querySelector('#password-input-submit-button').style.border = '1px solid #787878';
            document.querySelector('#password-input-submit-button').style.cursor = 'default';
        };
    });
    document.querySelector('#link-home').addEventListener('click', async function () {
        await show_home();
    });
    document.querySelector('#signup-link').addEventListener('click', async function () {
        hide_login_page();
        show_signup_page();
        history.pushState(null, '', '/signup');
        await loadPageTexts('/signup');
    });
    document.querySelector('#signup-form-page-1').addEventListener('submit', function (event) {
        event.preventDefault();
        signupPage2();
    });
    document.querySelector('#signup-form-page-2').addEventListener('submit', function (event) {
        event.preventDefault();
        signupPage3();
    });
    document.querySelector('#signup-form-page-3').addEventListener('submit', function (event) {
        event.preventDefault();
        createUser();
    });
    document.querySelector('#signup-form-page-2-back-button').addEventListener('click', function (event) {
        event.preventDefault();
        signupPage1();
    });
    document.querySelector('#signup-form-page-3-back-button').addEventListener('click', function (event) {
        event.preventDefault();
        signupPage2();
    });
    document.querySelector('#mom-sign-out').addEventListener('click', async function () {
        await signOut();
    }); // mom = more options menu
    document.querySelector('#mom-files').addEventListener('click', async function () {
        await showFilesPage();
    }); // mom = more options menu
    document.querySelector('#mom-server-files').addEventListener('click', async function () {
        await showServerFilesPage();
    }); // mom = more options menu
    document.querySelector('#footer-language').addEventListener('click', async function () {
        history.pushState(null, '', addQueryParam(window.location.href, 'popup', 'set-client-language'));
        // await handlePopstate();
        if (!window.popupFunctions) {
            window.popupFunctions = (await import('../popups/popups.js')).popups;
        };
        if (window.popupFunctions['set-client-language']) {
            (await window.popupFunctions['set-client-language']())();
        };
    });
    document.querySelector('#footer-revoke-consent').addEventListener('click', async function () {
        if (await jCloudUIElements.confirm(await getSectionText('nav/globalfooter', 'e1b2075290314b7d825223932ee1adfe', 0), true, false)) {
            document.cookie = 'user_consent=revoked; max-age=0; path=/';
            window.location.reload();
        };
    });

    document.querySelector('#footer-contact').addEventListener('click', async function () {
        await showContactForm();
    });
    document.querySelector('#contact-form').addEventListener('submit', async function (e) {
        e.preventDefault();
        await submitContactForm();
    });
    // displaySearchSuggestions(refreshSearchSuggestions());
    document.querySelector('#search-form').addEventListener('submit', function (e) {
        e.preventDefault();
        displayResults(document.querySelector('#search-input').value)
    });
    document.querySelector('#search-trigger').addEventListener('click', function (e) {
        if (e.currentTarget.dataset.expanded === undefined) {
            showSearch();
        };
    });
    window.addEventListener('scroll', function () {
        handleHomeScroll();
    });
    window.addEventListener('popstate', async function () {
        await handlePopstate();
    });
    window.addEventListener('pageshow', function (event) {
        if (!getCookie('user_consent')) {
            window.location.href = '/';
        };
    });
    document.addEventListener('keydown', function (event) {
        for (let cbName of Object.keys(window.keyDownCallbacks)) {
            window.keyDownCallbacks[cbName](event);
        };
    });
    document.addEventListener('keyup', function (event) {
        for (let cbName of Object.keys(window.keyUpCallbacks)) {
            window.keyUpCallbacks[cbName](event);
        };
    });
    window.LANGUAGE = undefined;
    if (typeof (Storage) !== 'undefined') {
        if (new URLSearchParams(window.location.search).get('lang')) {
            window.localStorage.setItem('lang', new URLSearchParams(window.location.search).get('lang'))
        };
        window.LANGUAGE = localStorage.getItem('lang');
    };
    if (!window.LANGUAGE) {
        await fetch('https://jcloud-services.ddns.net:1024/client-language')
            .then(async response => {
                if (response.status === 200) {
                    window.LANGUAGE = await response.text();
                } else {
                    window.LANGUAGE = 'en';
                };
            })
            .catch(_ => {
                window.LANGUAGE = 'en';
            });
    };
    document.querySelector('html').setAttribute('lang', window.LANGUAGE);
    document.querySelector('#footer-language').textContent = (await getUiLabels()).LANGUAGES[window.LANGUAGE];
    if (getCookie('signed_in')) {
        document.querySelector('#authorized-mom-part').style.display = 'block';
        document.querySelector('#link-home').style.display = 'inline';
    } else {
        document.querySelector('#authorized-mom-part').style.display = 'none';
        document.querySelector('#link-home').style.display = 'none';
    };
    await loadSectionTexts('nav/menus/moreoptions');
    await loadSectionTexts('nav/globalfooter');
    await loadSectionTexts('private-application-banner');
    await loadSectionTexts('search');
    handlePopstate(true);
});