#include utility.js
#include ui/elems.js

Umi.UI.Menus = (function() {
    const ids = [];

    const sidebarMenu = 'sidebar__menu',
        sidebarMenuActive = 'sidebar__menu--active',
        sidebarMenuHidden = 'sidebar__menu--hidden',
        sidebarSelectorMode = 'sidebar__selector-mode',
        sidebarSelectorModeActive = 'sidebar__selector-mode--active',
        sidebarSelectorModeAttention = 'sidebar__selector-mode--attention',
        sidebarSelectorModeHidden = 'sidebar__selector-mode--hidden';

    const attention = function(baseId, mode) {
        if(mode === undefined)
            mode = true;
        
        const element = $i(Umi.UI.Elements.Icons.id + '-' + baseId);
        element.classList.remove(sidebarSelectorModeHidden);

        if(mode && !element.classList.contains(sidebarSelectorModeAttention) && !element.classList.contains('active'))
            element.classList.add(sidebarSelectorModeAttention);
        else if(!mode && element.classList.contains(sidebarSelectorModeAttention))
            element.classList.remove(sidebarSelectorModeAttention);
    };

    const activate = function(baseId) {
        const icon = Umi.UI.Elements.Icons.id + '-' + baseId,
            menu = Umi.UI.Elements.Menus.id + '-' + baseId;

        const menuToggle = Umi.UI.Toggles.Get('menu-toggle');
        if(menuToggle.className.indexOf('closed') !== -1)
            menuToggle.click();

        attention(baseId, false);

        $c(sidebarMenuActive)[0].classList.remove(sidebarMenuActive);
        $i(menu).classList.add(sidebarMenuActive);

        $c(sidebarSelectorModeActive)[0].classList.remove(sidebarSelectorModeActive);
        $i(icon).classList.add(sidebarSelectorModeActive);
    };

    return {
        Add: function(baseId, title, initiallyHidden) {
            if(ids.indexOf(baseId) < 0) {
                ids.push(baseId);

                const menuClass = [sidebarMenu, sidebarMenu + '--' + baseId],
                    iconClass = [sidebarSelectorMode, sidebarSelectorMode + '--' + baseId];

                if(Umi.UI.Elements.Menus.children.length < 1) {
                    menuClass.push(sidebarMenuActive);
                    iconClass.push(sidebarSelectorModeActive);
                }

                if(initiallyHidden) {
                    menuClass.push(sidebarMenuHidden);
                    iconClass.push(sidebarSelectorModeHidden);
                }
                
                Umi.UI.Elements.Icons.appendChild($e({
                    attrs: {
                        id: Umi.UI.Elements.Icons.id + '-' + baseId,
                        classList: iconClass,
                        title: title,
                        onclick: function() {
                            activate(baseId);
                        },
                    },
                }));

                Umi.UI.Elements.Menus.appendChild($e({ attrs: { 'class': menuClass, id: Umi.UI.Elements.Menus.id + '-' + baseId } }));
            }
        },
        Get: function(baseId, icon) {
            const id = (icon ? Umi.UI.Elements.Icons : Umi.UI.Elements.Menus).id + '-' + baseId;
            if(ids.indexOf(baseId) >= 0)
                return $i(id);

            return null;
        },
        Remove: function(baseId) {
            $ri(Umi.UI.Elements.Icons.id + '-' + baseId);
            $ri(Umi.UI.Elements.Menus.id + '-' + baseId);
        },
        Activate: activate,
        Attention: attention,
        Active: function() {
            return $c(sidebarMenuActive)[0].id.substring(10); // LOL
        },
    };
})();
