Core.UI = Core.UI || {};
Core.UI.TabMenu = class extends Core.Singleton {
    /**
     * Get class name.
     * @return {string}
     */
    static getClassName() {
        return 'Core.UI.TabMenu';
    }
    /**
     * Initialize tab menu.
     * @param {string} tabMenuName
     * @param {object} parameters
     */
    init(tabMenuName, parameters) {
        if (
            parameters.prototype instanceof _core
            || parameters.prototype instanceof _page
            || parameters.prototype instanceof _modal
            || parameters instanceof _page
            || parameters instanceof _modal
        ) {
            parameters = {
                instance: parameters
            };
        }
        this.tabMenuName = tabMenuName;
        this.$menu = (parameters.$container || $('body')).find(`.ui.tabular.menu[data-name="${tabMenuName}"]`);
        this.instance = parameters.instance || this.instance || Page.activePage;

        let $activeTab = this.getActiveTab();
        let me = this;
        me.$menu.children('.item').each(function () {
            let $tab = $(this);
            $tab.off('click')
            $tab.tab({
                alwaysRefresh: true,
                context: me.$menu.parent()
            });
            $tab.on(
                'click',
                () => me.refresh($tab.data('tab'))
            );
            $tab.find('.dropdown').off('click');
            $tab.find('.dropdown').dropdown({
                onShow: function () {
                    Core.UI.Bind.get(
                        $(this),
                        {
                            instance: me.instance
                        }
                    );
                }
            });
            $tab.find('.dropdown').on(
                'click',
                (e) => e.stopPropagation()
            );
            $tab.find('.dropdown').find('input').each(function () {
                $(this).attr(
                    'data-refresh-on-change',
                    new RefreshOnChange({
                        tab_menu: me.$menu.data('name'),
                        tab_name: $tab.data('tab')
                    }).getJSON()
                );
            });
        });
        $activeTab.trigger('click');
    }
    /**
     * If the object becomes stale, re-initialize it.
     * @param {string} id
     * @param {object} parameters
     */
    reinit(id, parameters) {
        console.debug(`Reinit ${id} tab menu`);
        return this.init(id, parameters);
    }
    /**
     * Open tab.
     * @param {string} tabName
     */
    openTab(tabName) {
        this.$menu.children(`.item[data-tab="${tabName}"]`).trigger('click');
    }
    /**
     * Get active tab in this menu.
     * @return {jQuery}
     */
    getActiveTab() {
        return this.$menu.children('.active.item');
    }
    /**
     * Get active tab segment.
     * @return {jQuery}
     */
    getActiveTabSegment() {
        return this.getTabSegment(this.getActiveTab().data('tab'));
    }
    /**
     * Get tab.
     * @param {string} tabName
     * @return {jQuery}
     */
    getTab(tabName) {
        if (!tabName) {
            tabName = this.getActiveTab().data('tab');
        }
        return this.$menu.children(`.item[data-tab="${tabName}"]`);
    }
    /**
     * Get tab segment.
     * @param {string} tabName
     * @return {jQuery}
     */
    getTabSegment(tabName) {
        return this.$menu.siblings(`.ui.segment[data-tab="${tabName}"]`);
    }
    /**
     * Refresh tab.
     * @param {string} tabName
     * @param {function()} callback
     */
    refresh(tabName, callback) {
        let $tab = this.getTab(tabName);
        let $tabSegment = this.getTabSegment($tab.data('tab'));
        if ($tabSegment.isVisible() && $tab.data('refresh')) {
            let data = $tab.data('refresh').parameters;
            data.tab_name = $tab.data('tab');
            data.tab_menu = this.tabMenuName;
            data.error_return_code = -1;
            data.configuration = Page.getParameters();
            Core.API.call({
                url: $tab.data('refresh').uri,
                data: data,
                callback: (data) => {
                    if (data.return == -1) {
                        $tabSegment.fade('dialog', data.message);
                    }
                    if ($tabSegment.isVisible()) {
                        $tabSegment.children('.content').html(data.html);

                        Core.UI.Bind.get(
                            $tabSegment,
                            {
                                instance: this.instance
                            }
                        );
                        this.instance.bindTab(
                            $tabSegment.data('tab'),
                            $tabSegment,
                            data
                        );
                    }
                    if ($.isFunction(callback)) {
                        callback();
                    }
                },
                $context: $tabSegment
            });
        }
    }
};