var Panel = Namespace.declare("com.twitter.Bootstrap",
    class Panel extends UcpComponent {
        static get implements() { return []; };
        static start() {}

        static get dependencies() {
            return [
                "/EAMD.ucp/Components/com/twitter/Bootstrap/3.3.7/Bootstrap.component.xml"
            ];
        }

        constructor() {
            super();
            //Thinglish.defineProperty(this,"classes","col-sm-6 fullHeight");
            //Thinglish.defineProperty(this,"heading","this.heading");
            //Thinglish.defineProperty(this,"overflow","auto");
            //Thinglish.defineProperty(this,"footer","this.footer");
            this.classes = "";
            this.fullHeight = true;
            this.heading = "this.heading";
            this.footer = "this.footer";
            this.overflow = "hidden";
            Thinglish.defineAlias(this, "classes", "cssClasses");

            //this.controller.eventSupport.addEventListener("newView", this, this.newView.bind(this));
        }

        init() {
            if (this._private.isInitialized) {
                return;
            }
            super.init();
            /*
            this.model = {
                classes: "",
                fullHeight: true,
                heading: "this.heading",
                footer: "this.footer",
                overflow: "hidden"

            }
            */
            return this;
        }


        get name() {
            return this.heading;
        }

        set name(newValue) {
            if (this.properties) {
                this.properties.heading = newValue;
            } else {
                this.heading = newValue;
            }
        }

        toggleFullHeight(newValue) {
            if (newValue === undefined) {
                this.fullHeight = newValue = !this.fullHeight;
            }
            this.fullHeight = newValue;
            let element = this.documentElement;
            if (element) {
                this.manageFullHeightCssClass(element);
                this.manageFullHeightCssClass(element.children[0]);
                if (this.fullHeight) {
                    element.children[0].children[1].style.height = "80%";
                } else {
                    element.children[0].children[1].style.height = "";
                }
                while (element) {
                    element.classList.add("fullHeight");
                    element = element.parentElement;
                }
            }
        }

        manageFullHeightCssClass(element) {
            if (element) {
                if (this.fullHeight) {
                    if (!element.classList.contains("fullHeight")) {
                        element.classList.add("fullHeight");
                    }
                } else {
                    element.classList.remove("fullHeight");
                }

            }
        }

        updateView(view) {
            if (view instanceof DefaultView) {
                this.toggleFullHeight(this.fullHeight);
            }
        }

        toggleHeading(hidden) {
            if (this.defaultView.toggleCssClass("hidden", this.panelHeadingElement, hidden)) {
                this.panelBodyElement.style.height = "90%";
            } else {
                this.panelBodyElement.style.height = "80%";
            }
        }

        toggleFooter(hidden) {
            if (this.defaultView.toggleCssClass("hidden", this.panelFooterElement, hidden)) {
                this.panelBodyElement.style.height = "90%";
            } else {
                this.panelBodyElement.style.height = "80%";
            }
        }

        get panelHeadingElement() {
            if (!this.documentElement) {
                return null;
            }
            return this.documentElement.children[0].children[0];
        }

        get panelBodyElement() {
            if (!this.documentElement) {
                return null;
            }
            return this.documentElement.children[0].children[1];
        }

        get panelFooterElement() {
            if (!this.documentElement) {
                return null;
            }
            return this.documentElement.children[0].children[2];
        }

        /*
        newView(event, item) {
            console.log("new View")
        }
        */


    }
);