import { Component } from '@angular/core';
import { AppMenuService } from '../../services/app-menu.service';
import { TreeListDefault } from '../tree-grid/tree-list.class';
var AppMenuComponent = (function () {
    function AppMenuComponent(appMenuService) {
        this.appMenuService = appMenuService;
        this.flat = false;
        this.treeList = new TreeListDefault();
        this.dragEnabled = true;
    }
    AppMenuComponent.prototype.ngOnInit = function () {
        var _this = this;
        this.appMenuService.getMenu().subscribe(function (menu) { return _this.setMenu(menu); });
    };
    AppMenuComponent.prototype.setMenu = function (menuObject) {
        this.model.groups = menuObject.groups;
        this.treeList.setGroups(menuObject.groups);
        this.model.items = menuObject.elements;
        this.treeList.setElements(menuObject.elements);
    };
    Object.defineProperty(AppMenuComponent.prototype, "uiElement", {
        get: function () {
            return this.model.uiElement;
        },
        set: function (input) {
            this.model.uiElement = input;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "closed", {
        get: function () {
            return this.model.closed;
        },
        set: function (input) {
            this.model.closed = input;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "gridType", {
        get: function () {
            switch (this.uiElement) {
                case 'sidebar':
                case 'right sidebar':
                    return 'column';
                case 'fab':
                    return 'column-reverse';
                case 'toolbar':
                    return 'row';
                case 'popup':
                case 'fullscreen':
                default:
                    return 'grid';
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "gridCols", {
        get: function () {
            return this.model.gridCols;
        },
        set: function (input) {
            this.model.gridCols = input;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "treeGridCols", {
        get: function () {
            return this.model.treeGridCols;
        },
        set: function (input) {
            this.model.treeGridCols = input;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "appStyle", {
        get: function () {
            switch (this.uiElement) {
                case 'sidebar':
                case 'right sidebar':
                    return 'list';
                case 'fab':
                    return 'fab';
                case 'toolbar':
                    return 'tab';
                case 'fullscreen':
                    return 'hub';
                case 'popup':
                default:
                    return 'icon';
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "onlyIcons", {
        get: function () {
            return this.model.onlyIcons;
        },
        set: function (input) {
            this.model.onlyIcons = input;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(AppMenuComponent.prototype, "model", {
        get: function () {
            return {
                items: new Array(),
                groups: new Array(),
                uiElement: 'sidebar',
                closed: false,
                onlyIcons: false,
                flat: false,
                gridCols: 3,
                treeGridCols: 3
            };
        },
        enumerable: true,
        configurable: true
    });
    AppMenuComponent.decorators = [
        { type: Component, args: [{
                    selector: 'app-menu',
                    inputs: [
                        'id',
                        'uiElement: ui-element',
                        'apps: docked-apps',
                        'closed',
                        'onlyIcons: only-icons',
                        'flat: ui-flat',
                        'gridCols: grid-columns',
                        'treeGridCols: tree-grid-columns',
                        'dragEnabled: drag-enabled'
                    ],
                    template: "\n    <app-menu-frame fxFlexFill [ui-element]=\"uiElement\" [ui-closed]=\"closed\" [ui-flat]=\"flat\">\n      <tree-grid class=\"contained\"\n        [tree-grid]=\"treeList\"\n        [grid-type]=\"gridType\"\n        [grid-columns]=\"gridCols\"\n        [tree-grid-columns]=\"treeGridCols\">\n\n        <ng-template let-app>\n          <app-menu-title\n            [app-label]=\"app.label\"\n            [app-style]=\"appStyle\"\n            [only-icons]=\"onlyIcons\"\n            [title-closed]=\"app.closed\">\n          </app-menu-title>\n        </ng-template>\n\n        <ng-template let-app>\n          <app-menu-item\n            [app-icon]=\"app.icon\"\n            [app-label]=\"app.label\"\n            [app-id]=\"app.id\"\n            [app-style]=\"appStyle\"\n            [only-icons]=\"onlyIcons\"\n            [drag-enabled]=\"dragEnabled\"\n            app-indent=\"6px\">\n          </app-menu-item>\n        </ng-template>\n      </tree-grid>\n      <ng-content class=\"framed\"></ng-content>\n    </app-menu-frame>\n  ",
                    styles: ["\n    ::-webkit-scrollbar{width:5px;height:4px}::-webkit-scrollbar-button{width:0px;height:0px}::-webkit-scrollbar-thumb{background:rgba(255,223,119,0.2)}::-webkit-scrollbar-track{background:rgba(17,17,17,0.3)}::-webkit-scrollbar-thumb:active{background:rgba(17,17,17,0.3)}::-webkit-scrollbar-thumb,::-webkit-scrollbar-track{border:none}::-webkit-scrollbar-track:hover,::-webkit-scrollbar-track:active,::-webkit-scrollbar-corner{background:transparent}o-dynamic-form-builder .dynamicform-container{height:100%}o-dynamic-form-builder .dynamicform-container .dropzone-container{height:95%;overflow:auto}app-menu-frame .menu-frame-container,mat-toolbar{background-color:#da4644;color:#eee}:host app-menu-frame .menu-frame-container{background-color:#da4644;box-shadow:0em 0em 0em 0em black, 0em 0em 0em 0em black inset}\n  "]
                },] },
    ];
    AppMenuComponent.ctorParameters = function () { return [
        { type: AppMenuService }
    ]; };
    return AppMenuComponent;
}());
export { AppMenuComponent };
//# sourceMappingURL=app-menu.component.js.map