import menu from "./menu";
import templateManager from "./templateManager";

export abstract class Page {
    protected rootSection: HTMLElement;
    protected pageName: string;

    protected abstract load(): Promise<void>;

    protected constructor(pageName: string) {
        let rootSection = document.getElementById("page-"+pageName);
        if (!rootSection)
            throw new Error("Missing section for page " +typeof this);
        this.rootSection = rootSection;
        this.pageName = pageName;
        this.hide();
    }

    protected hide() {
        this.rootSection.classList.add("hidden");
    }

    protected showWithoutHistory() {
        if (templateManager.currentSection === this)
            return;
        templateManager.currentSection?.hide();
        templateManager.currentSection = this;
        this.rootSection.classList.remove("hidden");
    }

    public getPageName(): string {
        return this.pageName;
    }

    public async show(): Promise<void> {
        if (templateManager.currentSection === this)
            return Promise.resolve();
        this.showWithoutHistory();
        await menu.init();
        history.pushState("", "", `#${this.pageName}`)
        return this.load();
    }
}