jcloud_frontend/assets/scripts/main/main.js

import { hideFiles, showFilesPage, showServerFilesPage, showProperties } from '../files/main.js';
import { getCookie, jCloudUIElements, strip, closeDialog } from '../tools/main.js';
import { loadPageTexts } from '../i18n/main.js';
import { showContactForm, hideContactForm } from '../contact/main.js';
import { loadDashboard } from '../home/main.js';

const getDeviceLanguage = async function () {
    await fetch('https://jcloud-services.ddns.net:1024/client-language')
        .then(async response => {
            if (response.status === 200) {
                return await response.text();
            } else {
                return 'en';
            };
        })
        .catch(_ => {
            return 'en';
        });
};

const hide_login_page = function () {
    document.querySelector('#root').style.overflowY = 'initial';
    jCloudUIElements.overlays.hideOverlay();
    const loginWindow = document.querySelector('#login-content');
    loginWindow.classList.remove('show');
    loginWindow.classList.add('hide');
};

const show_login_page = function () {
    document.querySelector('#email').style.backgroundColor = 'var(--light-background)';
    document.querySelector('#password').style.backgroundColor = 'var(--light-background)';
    document.querySelector('#root').style.overflowY = 'hidden';
    document.querySelector('#login-error').innerHTML = '';
    document.querySelector('#email').value = '';
    document.querySelector('#password').value = '';
    const overlay = document.querySelector('#overlay')
    jCloudUIElements.overlays.showOverlay();
    const loginWindow = document.querySelector('#login-content');
    loginWindow.classList.add('show');
    loginWindow.classList.remove('hide');
    overlay.addEventListener('click', async function () {
        hide_login_page();
        history.pushState(null, '', '/');
        await loadPageTexts('/');
    }, { once: true });
    document.querySelector('#home').setAttribute('class', 'hidden');
};

const hide_signup_page = function () {
    document.querySelector('#root').style.overflowY = 'initial';
    jCloudUIElements.overlays.hideOverlay();
    const signupWindow = document.querySelector('#signup-content');
    signupWindow.classList.remove('show');
    signupWindow.classList.add('hide');
};

const show_signup_page = function () {
    document.querySelector('#root').style.overflowY = 'hidden';
    const overlay = document.querySelector('#overlay');
    jCloudUIElements.overlays.showOverlay();
    const signupWindow = document.querySelector('#signup-content');
    signupWindow.classList.add('show');
    signupWindow.classList.remove('hide');
    overlay.addEventListener('click', async function () {
        hide_signup_page();
        history.pushState(null, '', '/');
        await loadPageTexts('/');
    }, { once: true });
    document.querySelector('#home').setAttribute('class', 'hidden');
};

const show_startpage = function () {
    document.querySelector('#startpage').setAttribute('class', '');
    hide_login_page();
    document.querySelector('#home').setAttribute('class', 'hidden');
};

const show_home = async function () {
    history.pushState(null, '', '/home');
    await loadPageTexts('/home');
    hide_login_page();
    document.querySelector('#files').setAttribute('class', 'hidden');
    document.querySelector('#startpage').setAttribute('class', 'hidden');
    document.querySelector('#home').setAttribute('class', 'home');
    document.querySelector('#link-home').style.display = 'inline';
    document.querySelector('#user-details-on-footer').style.display = 'block';
    document.querySelector('#user-details-on-footer').setAttribute('class', 'user-details-on-footer');
    window.scroll(0, 0);
    await loadDashboard();
};

const handlePopstate = async function (initial = false) {
    let path = (new URL(window.location.href)).pathname;
    const queryParams = Object.fromEntries(((new URL(window.location.href)).searchParams).entries());
    if ('popup' in queryParams) {
        if (!window.popupFunctions) {
            window.popupFunctions = (await import('../popups/popups.js')).popups;
        };
        if (window.popupFunctions[queryParams.popup]) {
            (await window.popupFunctions[queryParams.popup]())();
        };
    };
    if (path === '/' || path === '') {
        document.querySelector('#startpage').setAttribute('class', '');
        hide_login_page();
        hide_signup_page();
        document.querySelector('#home').setAttribute('class', 'hidden');
        document.querySelector('#user-details-on-footer').setAttribute('class', 'hidden');
        if (getCookie('signed_in')) {
            await show_home();
        };
        hideFiles();
        hideContactForm();
        await loadPageTexts('/');
    };
    if (path === '/contact' || path === '/contact/') {
        showContactForm();
    } else {
        hideContactForm();
    }
    if (path === '/login' || path === '/login/') {
        document.querySelector('#startpage').setAttribute('class', '');
        hide_signup_page();
        show_login_page();
        document.querySelector('#home').setAttribute('class', 'hidden');
        document.querySelector('#user-details-on-footer').style.display = 'none';
        document.querySelector('#user-details-on-footer').setAttribute('class', 'hidden');
        if (getCookie('signed_in')) {
            await show_home();
        };
        hideFiles();
        hideContactForm();
        await loadPageTexts('/login');
        return;
    } else {
        hide_login_page();
    }
    if (path === '/signup' || path === '/signup/') {
        document.querySelector('#startpage').setAttribute('class', '');
        hide_login_page();
        show_signup_page();
        document.querySelector('#home').setAttribute('class', 'hidden');
        document.querySelector('#user-details-on-footer').style.display = 'none';
        document.querySelector('#user-details-on-footer').setAttribute('class', 'hidden');
        if (getCookie('signed_in')) {
            await show_home();
        };
        hideFiles();
        hideContactForm();
        await loadPageTexts('/signup');
        return;
    };
    if (path === '/home' || path === '/home/') {
        hideContactForm();
        if (getCookie('signed_in')) {
            document.querySelector('#startpage').setAttribute('class', 'hidden');
            hide_login_page();
            hide_signup_page();
            document.querySelector('#home').setAttribute('class', 'home');
            document.querySelector('#user-details-on-footer').style.display = 'block';
            document.querySelector('#user-details-on-footer').setAttribute('class', 'user-details-on-footer');
            hideFiles();
            await loadPageTexts('/home');
            await loadDashboard();
        } else {
            document.querySelector('#startpage').setAttribute('class', '');
            hide_signup_page();
            show_login_page();
            document.querySelector('#home').setAttribute('class', 'hidden');
            document.querySelector('#user-details-on-footer').style.display = 'none';
            document.querySelector('#user-details-on-footer').setAttribute('class', 'hidden');
            hideFiles();
            await loadPageTexts('/login');
        };
        return;
    };
    if (path.startsWith('/files')) {
        path = '/' + strip(path, '/');
        hideContactForm();
        if (getCookie('signed_in')) {
            document.querySelector('#startpage').setAttribute('class', 'hidden');
            hide_login_page();
            hide_signup_page();
            document.querySelector('#home').setAttribute('class', 'home');
            document.querySelector('#user-details-on-footer').style.display = 'block';
            document.querySelector('#user-details-on-footer').setAttribute('class', 'user-details-on-footer');
            showFilesPage('', new URLSearchParams(window.location.search).get('id'), !initial, path === '/files' || path === '/files/directory');
            if (path === '/files/directory/properties') {
                showProperties(queryParams.iid);
            } else {
                closeDialog(document.querySelector('#files-item-properties'))
            }
        } else {
            document.querySelector('#startpage').setAttribute('class', '');
            hide_signup_page();
            show_login_page();
            document.querySelector('#home').setAttribute('class', 'hidden');
            document.querySelector('#user-details-on-footer').style.display = 'none';
            document.querySelector('#user-details-on-footer').setAttribute('class', 'hidden');
            if (getCookie('signed_in')) {
                await show_home();
            };
            hideFiles();
            await loadPageTexts('/login');
        };
        await loadPageTexts('/files');
        return;
    };
    if (path.startsWith('/server-files')) {
        hideContactForm();
        if (getCookie('signed_in')) {
            document.querySelector('#startpage').setAttribute('class', 'hidden');
            hide_login_page();
            hide_signup_page();
            document.querySelector('#home').setAttribute('class', 'home');
            document.querySelector('#user-details-on-footer').style.display = 'block';
            document.querySelector('#user-details-on-footer').setAttribute('class', 'user-details-on-footer');
            showServerFilesPage(path.split('/').slice(2).join('/'), !initial, initial);
        } else {
            document.querySelector('#startpage').setAttribute('class', '');
            hide_signup_page();
            show_login_page();
            document.querySelector('#home').setAttribute('class', 'hidden');
            document.querySelector('#user-details-on-footer').style.display = 'none';
            document.querySelector('#user-details-on-footer').setAttribute('class', 'hidden');
            if (getCookie('signed_in')) {
                await show_home();
            };
            hideFiles();
        };
        await loadPageTexts('/files');
        return;
    };
};

export { hide_login_page, show_login_page, hide_signup_page, show_signup_page, show_startpage, show_home, handlePopstate, getDeviceLanguage };