import "../apps/Dashboard/Dashboard.js"
import "../apps/Forum/Forum.js"
import "../apps/Tasks/Tasks.js"
import "../apps/Messages/Messages.js"
import "../apps/Market/Market.js"
import "../apps/Jobs/Jobs.js"
import "../apps/People/People.js"

class AppWindow extends Shadow {

    calculateWidth() {
        let sidebar = $("sidebar-").getBoundingClientRect()
        let w = sidebar.width
        return w
    }

    calculateHeight() {
        let appmenu = $("app-menu").getBoundingClientRect()
        let h = appmenu.height
        return h
    }

    render() {
        ZStack(() => {
            switch(global.currentApp) {
                case "Dashboard":
                    Dashboard()
                    break;
                case "People":
                    People()
                    break;
            }
        })
        .overflow("scroll")
        .position("absolute")
        .width(window.innerWidth - this.calculateWidth(), px)
        .height(window.innerHeight - this.calculateHeight(), px)
        .background("var(--app)")
        .x(this.calculateWidth(), px)
        .yBottom(this.calculateHeight(), px)
        .onEvent("resize", () => {
            this.rerender()
        })
        .onEvent("appchange", () => {
            this.rerender()
        })
        .onEvent("networkchange", () => {
            this.rerender()
        })
    }
}

register(AppWindow, "app-window")