devextreme/dist/transpiled/ui/grid_core/ui.grid_core.header_panel.js

HTML5 JavaScript Component Suite for Responsive Web Development

"use strict";

var $ = require("../../core/renderer"),
    Toolbar = require("../toolbar"),
    columnsView = require("./ui.grid_core.columns_view"),
    noop = require("../../core/utils/common").noop,
    isDefined = require("../../core/utils/type").isDefined,
    domUtils = require("../../core/utils/dom");

require("../drop_down_menu");
var HEADER_PANEL_CLASS = "header-panel",
    TOOLBAR_BUTTON_CLASS = "toolbar-button";

var HeaderPanel = columnsView.ColumnsView.inherit({
    _getToolbarItems: function _getToolbarItems() {
        return [];
    },

    _getButtonContainer: function _getButtonContainer() {
        return $("<div>").addClass(this.addWidgetPrefix(TOOLBAR_BUTTON_CLASS));
    },

    _getToolbarButtonClass: function _getToolbarButtonClass(specificClass) {
        var secondClass = specificClass ? " " + specificClass : "";

        return this.addWidgetPrefix(TOOLBAR_BUTTON_CLASS) + secondClass;
    },

    _getToolbarOptions: function _getToolbarOptions() {
        var toolbarItems,
            options = {
            toolbarOptions: {
                items: this._getToolbarItems(),
                onItemRendered: function onItemRendered(e) {
                    var itemRenderedCallback = e.itemData.onItemRendered;

                    if (itemRenderedCallback) {
                        itemRenderedCallback(e);
                    }
                }
            }
        };

        this.executeAction("onToolbarPreparing", options);

        if (options.toolbarOptions && !isDefined(options.toolbarOptions.visible)) {
            toolbarItems = options.toolbarOptions.items;
            options.toolbarOptions.visible = !!(toolbarItems && toolbarItems.length);
        }

        return options.toolbarOptions;
    },

    _renderCore: function _renderCore() {
        if (!this._toolbar) {
            this.element().addClass(this.addWidgetPrefix(HEADER_PANEL_CLASS));
            this._toolbar = this._createComponent($("<div>").appendTo(this.element()), Toolbar, this._toolbarOptions);
        } else {
            this._toolbar.option(this._toolbarOptions);
        }
    },

    _columnOptionChanged: noop,

    _handleDataChanged: function _handleDataChanged() {
        if (this._requireReady) {
            this.render();
        }
    },

    init: function init() {
        this.callBase();
        this.createAction("onToolbarPreparing", { excludeValidators: ["designMode", "disabled", "readOnly"] });
    },

    render: function render() {
        this._toolbarOptions = this._getToolbarOptions();
        this.callBase.apply(this, arguments);
    },

    setToolbarItemDisabled: function setToolbarItemDisabled(name, optionValue) {
        var toolbarInstance = this._toolbar;

        if (toolbarInstance) {
            var items = toolbarInstance.option("items") || [],
                itemIndex = items.indexOf(items.filter(function (item) {
                return item.name === name;
            })[0]);

            if (itemIndex >= 0) {
                var itemOptionPrefix = "items[" + itemIndex + "]";
                if (toolbarInstance.option(itemOptionPrefix + ".options")) {
                    toolbarInstance.option(itemOptionPrefix + ".options.disabled", optionValue);
                } else {
                    toolbarInstance.option(itemOptionPrefix + ".disabled", optionValue);
                }
            }
        }
    },

    updateToolbarDimensions: function updateToolbarDimensions() {
        if (this._toolbar) {
            domUtils.triggerResizeEvent(this.getHeaderPanel());
        }
    },

    getHeaderPanel: function getHeaderPanel() {
        return this.element();
    },

    getHeight: function getHeight() {
        return this.getElementHeight();
    },

    optionChanged: function optionChanged(args) {
        if (args.name === "onToolbarPreparing") {
            this._invalidate();
            args.handled = true;
        }
        this.callBase(args);
    },

    isVisible: function isVisible() {
        return this._toolbarOptions && this._toolbarOptions.visible;
    },

    allowDragging: noop
});

module.exports = {
    defaultOptions: function defaultOptions() {
        return {
            /**
             * @name GridBaseOptions.onToolbarPreparing
             * @publicName onToolbarPreparing
             * @type function(e)
             * @type_function_param1 e:object
             * @type_function_param1_field4 toolbarOptions:dxToolbarOptions
             * @extends Action
             * @action
             */
        };
    },
    views: {
        headerPanel: HeaderPanel
    },
    extenders: {
        controllers: {
            resizing: {
                _updateDimensionsCore: function _updateDimensionsCore() {
                    this.callBase.apply(this, arguments);

                    this.getView("headerPanel").updateToolbarDimensions();
                }
            }
        }
    }
};