/** * DevExtreme (ui/diagram/ui.diagram.rightpanel.js) * Version: 19.1.16 * Build date: Tue Oct 18 2022 * * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/ */ "use strict"; var _renderer = require("../../core/renderer"); var _renderer2 = _interopRequireDefault(_renderer); var _diagram = require("./diagram.panel"); var _diagram2 = _interopRequireDefault(_diagram); var _accordion = require("../accordion"); var _accordion2 = _interopRequireDefault(_accordion); var _form = require("../form"); var _form2 = _interopRequireDefault(_form); var _uiDiagram = require("./ui.diagram.commands"); var _uiDiagram2 = _interopRequireDefault(_uiDiagram); var _extend = require("../../core/utils/extend"); var _diagram_bar = require("./diagram_bar"); var _diagram_bar2 = _interopRequireDefault(_diagram_bar); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj } } function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) { return typeof obj } : function(obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj }, _typeof(obj) } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function") } } function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) { descriptor.writable = true } Object.defineProperty(target, descriptor.key, descriptor) } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) { _defineProperties(Constructor.prototype, protoProps) } if (staticProps) { _defineProperties(Constructor, staticProps) } Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor } function _get() { if ("undefined" !== typeof Reflect && Reflect.get) { _get = Reflect.get.bind() } else { _get = function(target, property, receiver) { var base = _superPropBase(target, property); if (!base) { return } var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(arguments.length < 3 ? target : receiver) } return desc.value } } return _get.apply(this, arguments) } function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (null === object) { break } } return object } function _inherits(subClass, superClass) { if ("function" !== typeof superClass && null !== superClass) { throw new TypeError("Super expression must either be null or a function") } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) { _setPrototypeOf(subClass, superClass) } } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(o, p) { o.__proto__ = p; return o }; return _setPrototypeOf(o, p) } function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function() { var result, Super = _getPrototypeOf(Derived); if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget) } else { result = Super.apply(this, arguments) } return _possibleConstructorReturn(this, result) } } function _possibleConstructorReturn(self, call) { if (call && ("object" === _typeof(call) || "function" === typeof call)) { return call } else { if (void 0 !== call) { throw new TypeError("Derived constructors may only return object or undefined") } } return _assertThisInitialized(self) } function _assertThisInitialized(self) { if (void 0 === self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called") } return self } function _isNativeReflectConstruct() { if ("undefined" === typeof Reflect || !Reflect.construct) { return false } if (Reflect.construct.sham) { return false } if ("function" === typeof Proxy) { return true } try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})); return true } catch (e) { return false } } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(o) { return o.__proto__ || Object.getPrototypeOf(o) }; return _getPrototypeOf(o) } var DIAGRAM_RIGHT_PANEL_CLASS = "dx-diagram-right-panel"; var DIAGRAM_RIGHT_PANEL_BEGIN_GROUP_CLASS = "dx-diagram-right-panel-begin-group"; var DiagramRightPanel = function(_DiagramPanel) { _inherits(DiagramRightPanel, _DiagramPanel); var _super = _createSuper(DiagramRightPanel); function DiagramRightPanel() { _classCallCheck(this, DiagramRightPanel); return _super.apply(this, arguments) } _createClass(DiagramRightPanel, [{ key: "_init", value: function() { _get(_getPrototypeOf(DiagramRightPanel.prototype), "_init", this).call(this); this.bar = new OptionsDiagramBar(this); this._valueConverters = {} } }, { key: "_initMarkup", value: function() { _get(_getPrototypeOf(DiagramRightPanel.prototype), "_initMarkup", this).call(this); this.$element().addClass(DIAGRAM_RIGHT_PANEL_CLASS); var $accordion = (0, _renderer2.default)("
").appendTo(this.$element()); this._renderAccordion($accordion) } }, { key: "_getAccordionDataSource", value: function() { return [{ title: "Page Properties", onTemplate: function(widget, $element) { return widget._renderOptions($element) } }] } }, { key: "_renderAccordion", value: function($container) { var _this = this; this._accordionInstance = this._createComponent($container, _accordion2.default, { multiple: true, collapsible: true, displayExpr: "title", dataSource: this._getAccordionDataSource(), itemTemplate: function(data, index, $element) { return data.onTemplate(_this, $element) } }) } }, { key: "_renderOptions", value: function($container) { var _this2 = this; this._formInstance = this._createComponent($container, _form2.default, { items: _uiDiagram2.default.getOptions().map(function(item) { return (0, _extend.extend)(true, { editorType: item.widget, dataField: item.command.toString(), cssClass: item.beginGroup && DIAGRAM_RIGHT_PANEL_BEGIN_GROUP_CLASS, label: { text: item.text }, options: { text: item.text, hint: item.hint, icon: item.icon, onInitialized: function(e) { return _this2._onToolbarItemInitialized(e.component, item.command) } } }, _this2._createWidgetOptions(item)) }), onFieldDataChanged: function(e) { return _this2._onDiagramOptionChanged(e.dataField, e.value) } }) } }, { key: "_createWidgetOptions", value: function(item) { if (item.getValue && item.setValue) { this._valueConverters[item.command] = { getValue: item.getValue, setValue: item.setValue } } if ("dxSelectBox" === item.widget) { return { editorOptions: { dataSource: item.items, displayExpr: "title", valueExpr: "value" } } } } }, { key: "_onDiagramOptionChanged", value: function(key, value) { if (!this._updateLocked && void 0 !== value) { var valueConverter = this._valueConverters[key]; if (valueConverter) { value = valueConverter.getValue(value) } this.bar.raiseBarCommandExecuted(parseInt(key), value) } } }, { key: "_setItemValue", value: function(key, value) { var valueConverter = this._valueConverters[key]; if (valueConverter) { value = valueConverter.setValue(value) } this._updateLocked = true; this._formInstance.updateData(key.toString(), value); this._updateLocked = false } }, { key: "_setItemSubItems", value: function(key, items) { this._updateLocked = true; var editorInstance = this._formInstance.getEditor(key.toString()); editorInstance.option("items", items.map(function(item) { var value = "object" === _typeof(item.value) ? JSON.stringify(item.value) : item.value; return { value: value, title: item.text } })); this._updateLocked = false } }, { key: "_setEnabled", value: function(enabled) { this._formInstance.option("disabled", !enabled) } }, { key: "_getDefaultOptions", value: function() { return (0, _extend.extend)(_get(_getPrototypeOf(DiagramRightPanel.prototype), "_getDefaultOptions", this).call(this), { container: null }) } }]); return DiagramRightPanel }(_diagram2.default); var OptionsDiagramBar = function(_DiagramBar) { _inherits(OptionsDiagramBar, _DiagramBar); var _super2 = _createSuper(OptionsDiagramBar); function OptionsDiagramBar() { _classCallCheck(this, OptionsDiagramBar); return _super2.apply(this, arguments) } _createClass(OptionsDiagramBar, [{ key: "getCommandKeys", value: function() { return _uiDiagram2.default.getOptions().map(function(c) { return c.command }) } }, { key: "setItemValue", value: function(key, value) { this._owner._setItemValue(key, value) } }, { key: "setEnabled", value: function(enabled) { this._owner._setEnabled(enabled) } }, { key: "setItemSubItems", value: function(key, items) { this._owner._setItemSubItems(key, items) } }]); return OptionsDiagramBar }(_diagram_bar2.default); module.exports = DiagramRightPanel;