homepage/res/index.js

let selectedButtonId = 'button-home';

const changeSelected = (buttonId) => {
    A(`#${selectedButtonId}`).removeClass('button-selected');
    A(`#${buttonId}`).addClass('button-selected');
    selectedButtonId = buttonId;
};

const onButtonClick = (buttonId) => {
    if (selectedButtonId === buttonId) {
        return;
    }
    changeSelected(buttonId);
    switch (buttonId) {
        case 'button-home': {
            A('#content-container').load('/pages/home.html');
            break;
        }
        case 'button-file-server': {
            A('#content-container').load('/pages/upload.html');
            break;
        }
        case 'button-git-server': {
            window.location.href = 'https://git.hippoz.xyz/';
            break;
        }
        case 'button-about-me': {
            A('#content-container').load('/pages/about.html');
            break;
        }
        case 'button-contact-me': {
            A('#content-container').load('/pages/contact.html');
            break;
        }
        default: {
            console.error('Page not found. Invalid button ID.');
            A('#content-container').html('<h2>page not found</h2><p>i think</p>');
            return;
        }
    }
};

A(() => {
    A('#content-container').load('/pages/home.html');
    A('.navigation-buttons .button-default').each((el) => {
        A(el).on('click', () => {
            onButtonClick(el.id);
        });
    })
});