import { ErrorModelCollectionEventType } from "../../Models/ErrorModelCollectionEvent.js";
import { PopUpItem } from "../PopUp/PopUpItem.js";
export class NavigationOverflowItem extends PopUpItem {
    constructor(options) {
        super(options);
        this.m_source = options.source;
        this.state.unset("source");
    }
    get source() {
        return this.m_source;
    }
    template() {
        let icon = Jade.IconSet.get("pdjs")
            .resolve("sign_warning.png", Jade.IconSetSizeSpecificDirectory.x16);
        return `<a href="#" role="tab" class="-fb-layout-nav-overflow-item">
                    ${this.source.name}
                    <img src="${icon}"/>
                </a>`;
    }
    onActivate(e) {
        super.onActivate(e);
        this.node.on(Jade.BrowserEvent.CLICK, e => {
            e.cancelBubble = true;
            e.returnValue = false;
            e.stopPropagation();
            this.onSelect();
            return false;
        });
        this.m_selectEventSubscription =
            this.source.globals.events.navigationSelectSubscribe((e) => {
                e.id == this.source.id ?
                    this.node.addClass("-fb-selected") :
                    this.node.removeClass("-fb-selected");
            });
        this.m_loadErrorsSubscription =
            this.source.root.errors.subscribe((e) => {
                this.processValidationErrors();
            }, ErrorModelCollectionEventType.load);
        this.m_clearErrorsSubscription =
            this.source.root.errors.subscribe((e) => {
                this.processValidationErrors();
            }, ErrorModelCollectionEventType.clear);
    }
    onDestroy(e) {
        super.onDestroy(e);
        if (this.m_clearErrorsSubscription) {
            this.m_clearErrorsSubscription.unsubscribe();
        }
        if (this.m_loadErrorsSubscription) {
            this.m_loadErrorsSubscription.unsubscribe();
        }
        if (this.m_selectEventSubscription) {
            this.m_selectEventSubscription.unsubscribe();
        }
    }
    onSelect() {
        this.source.globals.events.navigationSelectPublish({
            id: this.source.id,
            scrollIntoView: true
        });
    }
    processValidationErrors() {
        if (this.node == null) {
            return;
        }
        this.source.errors.length === 0 ?
            this.node.removeClass("-fb-error") :
            this.node.addClass("-fb-error");
    }
}
