/* * (c) Copyright Ascensio System SIA 2010-2014 * * This program is a free software product. You can redistribute it and/or * modify it under the terms of the GNU Affero General Public License (AGPL) * version 3 as published by the Free Software Foundation. In accordance with * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect * that Ascensio System SIA expressly excludes the warranty of non-infringement * of any third-party rights. * * This program is distributed WITHOUT ANY WARRANTY; without even the implied * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html * * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, * EU, LV-1021. * * The interactive user interfaces in modified source and object code versions * of the Program must display Appropriate Legal Notices, as required under * Section 5 of the GNU AGPL version 3. * * Pursuant to Section 7(b) of the License you must retain the original Product * logo when distributing the program. Pursuant to Section 7(e) we decline to * grant you any rights under trademark law for use of our trademarks. * * All the Product's GUI elements, including illustrations and icon sets, as * well as technical writing content are licensed under the terms of the * Creative Commons Attribution-ShareAlike 4.0 International. See the License * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode * */ Ext.define("PE.view.TableSettings", { extend: "Common.view.AbstractSettingsPanel", alias: "widget.petablesettings", height: 488, requires: ["Common.component.ThemeColorPalette", "Ext.button.Button", "Ext.form.Label", "Ext.form.field.ComboBox", "Ext.container.Container", "Ext.toolbar.Spacer", "Ext.Array", "Ext.menu.Menu", "Ext.menu.Manager", "PE.view.InsertTableDialog", "Ext.data.Model", "Ext.data.Store", "Ext.XTemplate", "PE.view.TableSettingsAdvanced", "Common.component.ComboDataView", "Common.plugin.ComboBoxScrollPane"], constructor: function (config) { this.callParent(arguments); this.initConfig(config); return this; }, initComponent: function () { this.title = this.txtTitle; this._initedSettings = false; this._state = { TemplateId: 0, CheckHeader: false, CheckTotal: false, CheckBanded: false, CheckFirst: false, CheckLast: false, CheckColBanded: false, BackColor: "#000000" }; this._originalLook = new CTablePropLook(); var me = this; this._originalProps = null; this.CellBorders = {}; this.CellColor = { Value: 1, Color: "transparent" }; this.BorderSize = 0; this.ThemeValues = [6, 15, 7, 16, 0, 1, 2, 3, 4, 5]; this._cmbTableTemplate = Ext.create("Common.component.ComboDataView", { id: "table-combo-template", width: 185, height: 64, itemWidth: 70, itemHeight: 50, menuMaxHeight: 300, repeatedselect: true, viewData: [], emptyComboText: this.textEmptyTemplate, listeners: { select: function (combo, record) { if (me.api && !me._noApply) { var properties = new CTableProp(); properties.put_TableStyle(record.data.data.templateId); me.api.tblApply(properties); } me.fireEvent("editcomplete", me); }, menuhide: function () { me.fireEvent("editcomplete", me); }, releasecapture: function (cnt) { me.fireEvent("editcomplete", me); } } }); this.controls.push(this._cmbTableTemplate); this._chHeader = Ext.create("Ext.form.field.Checkbox", { id: "table-checkbox-header", boxLabel: this.textHeader, checked: false, width: 85, listeners: { change: Ext.bind(function (field, newValue, oldValue, eOpts) { if (me.api) { var properties = new CTableProp(); var look = (me._originalLook) ? me._originalLook : new CTablePropLook(); look.put_FirstRow(newValue); properties.put_TableLook(look); me.api.tblApply(properties); } me.fireEvent("editcomplete", this); }, me) } }); this.controls.push(this._chHeader); this._chTotal = Ext.create("Ext.form.field.Checkbox", { id: "table-checkbox-total", boxLabel: this.textTotal, checked: false, width: 85, listeners: { change: Ext.bind(function (field, newValue, oldValue, eOpts) { if (me.api) { var properties = new CTableProp(); var look = (me._originalLook) ? me._originalLook : new CTablePropLook(); look.put_LastRow(newValue); properties.put_TableLook(look); me.api.tblApply(properties); } me.fireEvent("editcomplete", this); }, me) } }); this.controls.push(this._chTotal); this._chBanded = Ext.create("Ext.form.field.Checkbox", { id: "table-checkbox-banded", boxLabel: this.textBanded, checked: false, width: 85, listeners: { change: Ext.bind(function (field, newValue, oldValue, eOpts) { if (me.api) { var properties = new CTableProp(); var look = (me._originalLook) ? me._originalLook : new CTablePropLook(); look.put_BandHor(newValue); properties.put_TableLook(look); me.api.tblApply(properties); } me.fireEvent("editcomplete", this); }, me) } }); this.controls.push(this._chBanded); this._chFirst = Ext.create("Ext.form.field.Checkbox", { id: "table-checkbox-first", boxLabel: this.textFirst, checked: false, width: 85, listeners: { change: Ext.bind(function (field, newValue, oldValue, eOpts) { if (me.api) { var properties = new CTableProp(); var look = (me._originalLook) ? me._originalLook : new CTablePropLook(); look.put_FirstCol(newValue); properties.put_TableLook(look); me.api.tblApply(properties); } me.fireEvent("editcomplete", this); }, me) } }); this.controls.push(this._chFirst); this._chLast = Ext.create("Ext.form.field.Checkbox", { id: "table-checkbox-last", boxLabel: this.textLast, checked: false, width: 85, listeners: { change: Ext.bind(function (field, newValue, oldValue, eOpts) { if (me.api) { var properties = new CTableProp(); var look = (me._originalLook) ? me._originalLook : new CTablePropLook(); look.put_LastCol(newValue); properties.put_TableLook(look); me.api.tblApply(properties); } me.fireEvent("editcomplete", this); }, me) } }); this.controls.push(this._chLast); this._chColBanded = Ext.create("Ext.form.field.Checkbox", { id: "table-checkbox-col-banded", boxLabel: this.textBanded, checked: false, width: 85, listeners: { change: Ext.bind(function (field, newValue, oldValue, eOpts) { if (me.api) { var properties = new CTableProp(); var look = (me._originalLook) ? me._originalLook : new CTablePropLook(); look.put_BandVer(newValue); properties.put_TableLook(look); me.api.tblApply(properties); } me.fireEvent("editcomplete", this); }, me) } }); this.controls.push(this._chColBanded); this._TemplatePanel = Ext.create("Ext.container.Container", { layout: "vbox", layoutConfig: { align: "stretch" }, height: 185, width: "100%", items: [{ xtype: "container", height: 86, layout: { type: "table", columns: 2, tdAttrs: { style: "padding-right: 8px;vertical-align: middle;" } }, items: [{ xtype: "label", text: this.textRows, style: "display: block;font-weight: bold;", width: 85 }, { xtype: "label", text: this.textColumns, style: "display: block;font-weight: bold;", width: 85 }, { xtype: "tbspacer", height: 4 }, { xtype: "tbspacer", height: 4 }, this._chHeader, this._chFirst, this._chTotal, this._chLast, this._chBanded, this._chColBanded] }, { xtype: "tbspacer", height: 8 }, { xtype: "label", text: this.textTemplate, style: "font-weight: bold;margin-bottom: 8px;" }, this._cmbTableTemplate] }); var _arrBorderPosition = [[c_tableBorder.BORDER_VERTICAL_LEFT, "l", "asc-right-panel-small-btn btn-position-left", "table-button-border-left", this.tipLeft], [c_tableBorder.BORDER_VERTICAL_CENTER, "c", "asc-right-panel-small-btn btn-position-inner-vert", "table-button-border-inner-vert", this.tipInnerVert], [c_tableBorder.BORDER_VERTICAL_RIGHT, "r", "asc-right-panel-small-btn btn-position-right", "table-button-border-right", this.tipRight], [c_tableBorder.BORDER_HORIZONTAL_TOP, "t", "asc-right-panel-small-btn btn-position-top", "table-button-border-top", this.tipTop], [c_tableBorder.BORDER_HORIZONTAL_CENTER, "m", "asc-right-panel-small-btn btn-position-inner-hor", "table-button-border-inner-hor", this.tipInnerHor], [c_tableBorder.BORDER_HORIZONTAL_BOTTOM, "b", "asc-right-panel-small-btn btn-position-bottom", "table-button-border-bottom", this.tipBottom], [c_tableBorder.BORDER_INNER, "cm", "asc-right-panel-small-btn btn-position-inner", "table-button-border-inner", this.tipInner], [c_tableBorder.BORDER_OUTER, "lrtb", "asc-right-panel-small-btn btn-position-outer", "table-button-border-outer", this.tipOuter], [c_tableBorder.BORDER_ALL, "lrtbcm", "asc-right-panel-small-btn btn-position-all", "table-button-border-all", this.tipAll], [c_tableBorder.BORDER_NONE, "", "asc-right-panel-small-btn btn-position-none", "table-button-border-none", this.tipNone]]; this._btnsBorderPosition = []; Ext.Array.forEach(_arrBorderPosition, function (item, index) { var _btn = Ext.create("Ext.Button", { id: item[3], cls: item[2], posId: item[0], strId: item[1], text: "", tooltip: item[4], enableToggle: false, listeners: { click: Ext.bind(function (btn, eOpts) { this._UpdateBordersStyle(btn.strId, true); if (this.api) { var properties = new CTableProp(); properties.put_CellBorders(this.CellBorders); properties.put_CellSelect(true); this.api.tblApply(properties); } this.fireEvent("editcomplete", this); }, this) } }); this._btnsBorderPosition.push(_btn); }, this); var dataBorders = [{ borderstyle: "", text: this.txtNoBorders, value: 0, offsety: 0 }, { text: "0.5 pt", value: 0.5, offsety: 0 }, { text: "1 pt", value: 1, offsety: 20 }, { text: "1.5 pt", value: 1.5, offsety: 40 }, { text: "2.25 pt", value: 2.25, offsety: 60 }, { text: "3 pt", value: 3, offsety: 80 }, { text: "4.5 pt", value: 4.5, offsety: 100 }, { text: "6 pt", value: 6, offsety: 120 }]; for (var i = 1; i < dataBorders.length; i++) { dataBorders[i].borderstyle = Ext.String.format("background:url({0}) 0 {1}px; width:69px; height:20px; margin-right:5px;", "resources/img/right-panels/BorderSize.png", -dataBorders[i].offsety); } var fieldStore = Ext.create("Ext.data.Store", { model: "PE.model.ModelBorders", data: dataBorders }); var item_tpl = Ext.create("Ext.XTemplate", '' + '{text}' + '' + ""); this.cmbBorderSize = Ext.create("Ext.form.field.ComboBox", { width: 93, height: 21, editable: false, queryMode: "local", matchFieldWidth: false, displayField: "text", store: fieldStore, listConfig: { mode: "local", width: 145, itemTpl: item_tpl }, listeners: { select: Ext.bind(function (combo, records, eOpts) { this.BorderSize = records[0].data.value; if (combo.inputEl) { if (records[0].data.value > 0) { combo.inputEl.set({ type: "image" }); combo.inputEl.set({ src: "data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" }); var style = Ext.String.format("background:url({0}) no-repeat scroll 0 {1}px, url({2}) repeat scroll 0 0 white", "resources/img/right-panels/BorderSize.png", -records[0].data.offsety, "resources/img/controls/text-bg.gif"); Ext.DomHelper.applyStyles(combo.inputEl, style); } else { var style = Ext.String.format("background: url({0}) repeat scroll 0 0 white", "resources/img/controls/text-bg.gif"); Ext.DomHelper.applyStyles(combo.inputEl, style); combo.inputEl.set({ type: "text" }); combo.inputEl.set({ value: me.txtNoBorders }); combo.onItemClick(combo.picker, records[0]); } } }, this), afterRender: function () { if (this.inputEl) { Ext.DomHelper.applyStyles(this.inputEl, "padding-left:7px"); this.inputEl.set({ type: "image" }); this.inputEl.set({ src: "data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" }); var style = Ext.String.format("background:url({0}) repeat scroll 0 {1}px, url({2}) repeat scroll 0 0 white", "resources/img/right-panels/BorderSize.png", -20, "resources/img/controls/text-bg.gif"); Ext.DomHelper.applyStyles(this.inputEl, style); } } }, plugins: [{ ptype: "comboboxscrollpane", pluginId: "scrollpane", settings: { enableKeyboardNavigation: true } }] }); var rec = this.cmbBorderSize.getStore().getAt(2); this.cmbBorderSize.select(rec); this.BorderSize = rec.data.value; this._btnBorderColor = Ext.create("Ext.button.Button", { id: "table-button-border-color", arrowCls: "", width: 45, height: 22, color: "000000", menu: { showSeparator: false, items: [this.colorsBorder = Ext.create("Common.component.ThemeColorPalette", { value: "000000", width: 165, height: 214, dynamiccolors: true, dyncolorscount: 10, colors: [this.textThemeColors, "-", { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 3 }, { color: "FFFFFF", effectId: 4 }, { color: "000000", effectId: 5 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 3 }, { color: "FFFFFF", effectId: 4 }, "-", { color: "3D55FE", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 3 }, { color: "FFFFFF", effectId: 4 }, { color: "000000", effectId: 5 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, "-", "--", "-", this.textStandartColors, "-", "3D55FE", "5301B3", "980ABD", "B2275F", "F83D26", "F86A1D", "F7AC16", "F7CA12", "FAFF44", "D6EF39", "-", "--"], listeners: { select: Ext.bind(function (picker, color, eOpts) { Ext.menu.Manager.hideAll(); this._btnBorderColor.color = color; if (this._btnBorderColor.btnEl) { Ext.DomHelper.applyStyles(this._btnBorderColor.btnEl, { "background-color": Ext.String.format("#{0}", (typeof(color) == "object") ? color.color : color) }); } }, this) } }), { cls: "menu-item-noicon menu-item-color-palette-theme", text: this.textNewColor, listeners: { click: function (item, event) { me.colorsBorder.addNewColor(); } } }] }, listeners: { render: function (c) { var colorStyle = Ext.String.format("background-color:#{0}", (typeof(c.color) == "object") ? c.color.color : c.color); Ext.DomHelper.applyStyles(c.btnEl, colorStyle); } }, setColor: function (newcolor) { var border, clr; this.color = newcolor; if (newcolor == "transparent" || newcolor.color == "transparent") { border = "1px solid #BEBEBE"; clr = newcolor; } else { border = "none"; clr = Ext.String.format("#{0}", (typeof(newcolor) == "object") ? newcolor.color : newcolor); } if (this.btnEl !== undefined) { Ext.DomHelper.applyStyles(this.btnEl, { "background-color": clr, "border": border }); } } }); this._btnBackColor = Ext.create("Ext.button.Button", { id: "table-button-back-color", arrowCls: "", width: 45, height: 22, color: "transparent", menu: { showSeparator: false, items: [this.colorsBack = Ext.create("Common.component.ThemeColorPalette", { value: "000000", width: 165, height: 214, dynamiccolors: true, dyncolorscount: 10, colors: [this.textThemeColors, "-", { color: "3366FF", effectId: 1 }, { color: "0000FF", effectId: 2 }, { color: "000090", effectId: 3 }, { color: "660066", effectId: 4 }, { color: "800000", effectId: 5 }, { color: "FF0000", effectId: 1 }, { color: "FF6600", effectId: 1 }, { color: "FFFF00", effectId: 2 }, { color: "CCFFCC", effectId: 3 }, { color: "008000", effectId: 4 }, "-", { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 3 }, { color: "FFFFFF", effectId: 4 }, { color: "000000", effectId: 5 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, { color: "FFFFFF", effectId: 2 }, { color: "000000", effectId: 1 }, "-", "--", "-", this.textStandartColors, "-", "transparent", "5301B3", "980ABD", "B2275F", "F83D26", "F86A1D", "F7AC16", "F7CA12", "FAFF44", "D6EF39", "-", "--"], listeners: { select: Ext.bind(function (picker, color, eOpts) { Ext.menu.Manager.hideAll(); var clr, border; if (color == "transparent") { this._btnBackColor.color = "transparent"; clr = "transparent"; border = "1px solid #BEBEBE"; } else { this._btnBackColor.color = color; clr = Ext.String.format("#{0}", (typeof(color) == "object") ? color.color : color); border = "none"; } if (this._btnBackColor.btnEl) { Ext.DomHelper.applyStyles(this._btnBackColor.btnEl, { "background-color": clr, "border": border }); } this.CellColor = { Value: 1, Color: this._btnBackColor.color }; if (this.api) { var properties = new CTableProp(); var background = new CBackground(); properties.put_CellsBackground(background); var fill = new CAscFill(); if (this.CellColor.Color == "transparent") { background.put_Value(1); fill.put_type(c_oAscFill.FILL_TYPE_NOFILL); fill.put_fill(null); } else { background.put_Value(0); fill.put_type(c_oAscFill.FILL_TYPE_SOLID); fill.put_fill(new CAscFillSolid()); fill.get_fill().put_color(this.getRgbColor(this.CellColor.Color)); } background.put_fill(fill); this.api.tblApply(properties); } this.fireEvent("editcomplete", this); }, this) } }), { cls: "menu-item-noicon menu-item-color-palette-theme", text: this.textNewColor, listeners: { click: function (item, event) { me.colorsBack.addNewColor(); } } }] }, listeners: { render: function (c) { var border, clr; if (c.color == "transparent") { border = "1px solid #BEBEBE"; clr = c.color; } else { border = "none"; clr = Ext.String.format("#{0}", (typeof(c.color) == "object") ? c.color.color : c.color); } Ext.DomHelper.applyStyles(c.btnEl, { "background-color": clr, "border": border }); } }, setColor: function (newcolor) { var border, clr; this.color = newcolor; if (newcolor == "transparent") { border = "1px solid #BEBEBE"; clr = newcolor; } else { border = "none"; clr = Ext.String.format("#{0}", (typeof(newcolor) == "object") ? newcolor.color : newcolor); } if (this.btnEl !== undefined) { Ext.DomHelper.applyStyles(this.btnEl, { "background-color": clr, "border": border }); } } }); this.controls.push(this.colorsBack); this._BordersPanel = Ext.create("Ext.container.Container", { layout: "vbox", layoutConfig: { align: "stretch" }, height: 168, width: 190, items: [{ xtype: "tbspacer", height: 8 }, { xtype: "container", layout: { type: "hbox", align: "middle" }, height: 26, width: 190, style: "vertical-align: middle;", items: [this.cmbBorderSize, { xtype: "tbspacer", flex: 1 }, { xtype: "label", text: this.textBorderColor }, { xtype: "tbspacer", width: 7 }, this._btnBorderColor, { xtype: "tbspacer", width: 5 }] }, { xtype: "tbspacer", height: 8 }, { xtype: "container", height: 30, width: 190, layout: "hbox", items: [{ xtype: "label", height: 30, flex: 1, text: this.textSelectBorders }, { xtype: "tbspacer", width: 5 }] }, { xtype: "tbspacer", height: 8 }, { xtype: "container", layout: { type: "hbox", align: "middle" }, width: 190, items: [this._btnsBorderPosition[8], this._btnsBorderPosition[9], this._btnsBorderPosition[6], this._btnsBorderPosition[7], { xtype: "tbspacer", flex: 1 }] }, { xtype: "tbspacer", height: 8 }, { xtype: "container", layout: { type: "hbox", align: "middle" }, width: 190, items: [this._btnsBorderPosition[0], this._btnsBorderPosition[1], this._btnsBorderPosition[2], this._btnsBorderPosition[3], this._btnsBorderPosition[4], this._btnsBorderPosition[5], { xtype: "tbspacer", flex: 1 }] }, { xtype: "tbspacer", height: 12 }, { xtype: "container", height: 25, width: 190, layout: "hbox", items: [{ xtype: "label", text: this.textBackColor, margin: "2px 0 0 0", style: "text-align: right;", flex: 1 }, { xtype: "tbspacer", width: 7 }, this._btnBackColor, { xtype: "tbspacer", width: 5 }] }] }); var tableMenu = Ext.widget("menu", { showSeparator: false, bodyCls: "no-icons", listeners: { hide: function (cnt, eOpt) { me.fireEvent("editcomplete", me); }, show: function (cnt, eOpt) { if (me.api) { me.mnuMerge.setDisabled(!me.api.CheckBeforeMergeCells()); me.mnuSplit.setDisabled(!me.api.CheckBeforeSplitCells()); } } }, items: [{ text: me.selectRowText, listeners: { click: function (item) { if (me.api) { me.api.selectRow(); } } } }, { text: me.selectColumnText, listeners: { click: function (item) { if (me.api) { me.api.selectColumn(); } } } }, { text: me.selectCellText, listeners: { click: function (item) { if (me.api) { me.api.selectCell(); } } } }, { text: me.selectTableText, listeners: { click: function (item) { if (me.api) { me.api.selectTable(); } } } }, { xtype: "menuseparator" }, { text: me.insertRowAboveText, listeners: { click: function (item) { if (me.api) { me.api.addRowAbove(); } } } }, { text: me.insertRowBelowText, listeners: { click: function (item) { if (me.api) { me.api.addRowBelow(); } } } }, { text: me.insertColumnLeftText, listeners: { click: function (item) { if (me.api) { me.api.addColumnLeft(); } } } }, { text: me.insertColumnRightText, listeners: { click: function (item) { if (me.api) { me.api.addColumnRight(); } } } }, { xtype: "menuseparator" }, { text: me.deleteRowText, listeners: { click: function (item) { if (me.api) { me.api.remRow(); } } } }, { text: me.deleteColumnText, listeners: { click: function (item) { if (me.api) { me.api.remColumn(); } } } }, { text: me.deleteTableText, listeners: { click: function (item) { if (me.api) { me.api.remTable(); } } } }, { xtype: "menuseparator" }, me.mnuMerge = Ext.create("Ext.menu.Item", { text: me.mergeCellsText, listeners: { click: function (item) { if (me.api) { me.api.MergeCells(); } } } }), me.mnuSplit = Ext.create("Ext.menu.Item", { text: me.splitCellsText, listeners: { click: function (item) { if (me.api) { var win = Ext.create("PE.view.InsertTableDialog", { labelTitle: this.splitCellTitleText }); win.addListener("onmodalresult", Ext.bind(function (o, mr, s) { if (mr) { me.api.SplitCell(s[0], s[1]); } me.fireEvent("editcomplete", me); }, this), false); win.show(); } } } })] }); this._btnEdit = Ext.create("Ext.button.Button", { id: "table-button-edit", width: 45, iconCls: "btn-icon-edit-table", cls: "asc-right-panel-edit-btn", menu: tableMenu }); this._EditContainer = Ext.create("Ext.container.Container", { layout: "vbox", layoutConfig: { align: "stretch" }, height: 38, width: "100%", items: [{ xtype: "tbspacer", height: 5 }, { xtype: "container", height: 40, width: 190, layout: "hbox", items: [{ xtype: "label", text: this.textEdit, margin: "2px 0 0 0", style: "font-weight: bold;margin-top: 1px;", flex: 1 }, { xtype: "tbspacer", width: 7 }, this._btnEdit, { xtype: "tbspacer", width: 5 }] }] }); this.items = [{ xtype: "tbspacer", height: 8 }, this._TemplatePanel, { xtype: "tbspacer", height: 5 }, { xtype: "tbspacer", width: "100%", height: 10, style: "padding-right: 10px;", html: '
' }, { xtype: "label", style: "font-weight: bold;margin-top: 1px;", text: this.textBorders }, this._BordersPanel, { xtype: "tbspacer", height: 5 }, { xtype: "tbspacer", width: "100%", height: 10, style: "padding-right: 10px;", html: '
' }, this._EditContainer, { xtype: "tbspacer", width: "100%", height: 10, style: "padding-right: 10px;", html: '
' }, { xtype: "tbspacer", height: 3 }, { xtype: "container", height: 20, width: 200, items: [{ xtype: "box", html: '
", listeners: { afterrender: function (cmp) { document.getElementById("table-advanced-link").onclick = Ext.bind(this._openAdvancedSettings, this); }, scope: this } }] }]; this.addEvents("editcomplete"); this.callParent(arguments); }, setApi: function (o) { this.api = o; if (o) { this.api.asc_registerCallback("asc_onInitTableTemplates", Ext.bind(this._onInitTemplates, this)); } }, getRgbColor: function (clr) { var color = (typeof(clr) == "object") ? clr.color : clr; color = color.replace(/#/, ""); if (color.length == 3) { color = color.replace(/(.)/g, "$1$1"); } color = parseInt(color, 16); var c = new CAscColor(); c.put_type((typeof(clr) == "object") ? c_oAscColor.COLOR_TYPE_SCHEME : c_oAscColor.COLOR_TYPE_SRGB); c.put_r(color >> 16); c.put_g((color & 65280) >> 8); c.put_b(color & 255); c.put_a(255); if (clr.effectId !== undefined) { c.put_value(clr.effectId); } return c; }, getHexColor: function (r, g, b) { r = r.toString(16); g = g.toString(16); b = b.toString(16); if (r.length == 1) { r = "0" + r; } if (g.length == 1) { g = "0" + g; } if (b.length == 1) { b = "0" + b; } return r + g + b; }, ChangeSettings: function (props) { if (!this._initedSettings && this.effectcolors && this.standartcolors) { this.colorsBorder.updateColors(this.effectcolors, this.standartcolors); this.colorsBack.updateColors(this.effectcolors, this.standartcolors); } this._initedSettings = true; if (props) { this._originalProps = new CTableProp(props); this._originalProps.put_CellSelect(true); this.SuspendEvents(); var value = props.get_TableStyle(); if (this._state.TemplateId !== value || this._isTemplatesChanged) { var styleIndex = this._cmbTableTemplate.dataMenu.picker.store.findBy(function (record, id) { return (record.data.data.templateId === value); }, this); this._cmbTableTemplate.selectByIndex(styleIndex); if (this._isTemplatesChanged) { if (styleIndex >= 0) { this._cmbTableTemplate.fillComboView(this._cmbTableTemplate.dataMenu.picker.store.getAt(styleIndex), true, true); } else { this._cmbTableTemplate.fillComboView(this._cmbTableTemplate.dataMenu.picker.store.getAt(0), false, true); } } this._state.TemplateId = value; } this._isTemplatesChanged = false; var look = props.get_TableLook(); if (look) { value = look.get_FirstRow(); if (this._state.CheckHeader !== value) { this._chHeader.setValue(value); this._state.CheckHeader = value; this._originalLook.put_FirstRow(value); } value = look.get_LastRow(); if (this._state.CheckTotal !== value) { this._chTotal.setValue(value); this._state.CheckTotal = value; this._originalLook.put_LastRow(value); } value = look.get_BandHor(); if (this._state.CheckBanded !== value) { this._chBanded.setValue(value); this._state.CheckBanded = value; this._originalLook.put_BandHor(value); } value = look.get_FirstCol(); if (this._state.CheckFirst !== value) { this._chFirst.setValue(value); this._state.CheckFirst = value; this._originalLook.put_FirstCol(value); } value = look.get_LastCol(); if (this._state.CheckLast !== value) { this._chLast.setValue(value); this._state.CheckLast = value; this._originalLook.put_LastCol(value); } value = look.get_BandVer(); if (this._state.CheckColBanded !== value) { this._chColBanded.setValue(value); this._state.CheckColBanded = value; this._originalLook.put_BandVer(value); } } var background = props.get_CellsBackground(); if (background) { var fill = background.get_fill(); var fill_type = fill.get_type(); if (fill === null || fill_type === null || fill_type == c_oAscFill.FILL_TYPE_NOFILL) { this.CellColor = { Value: 1, Color: "transparent" }; } else { if (fill_type == c_oAscFill.FILL_TYPE_SOLID) { fill = fill.get_fill(); var color = fill.get_color(); if (color) { if (color.get_type() == c_oAscColor.COLOR_TYPE_SCHEME) { this.CellColor = { Value: 1, Color: { color: this.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value() } }; } else { this.CellColor = { Value: 1, Color: this.getHexColor(color.get_r(), color.get_g(), color.get_b()) }; } } else { this.CellColor = { Value: 0, Color: "transparent" }; } } } } else { this.CellColor = { Value: 0, Color: "transparent" }; } var type1 = typeof(this.CellColor.Color), type2 = typeof(this._state.BackColor); if ((type1 !== type2) || (type1 == "object" && (this.CellColor.Color.effectValue !== this._state.BackColor.effectValue || this._state.BackColor.color.indexOf(this.CellColor.Color.color) < 0)) || (type1 != "object" && this._state.BackColor.indexOf(this.CellColor.Color) < 0)) { this._btnBackColor.setColor(this.CellColor.Color); if (typeof(this.CellColor.Color) == "object") { for (var i = 0; i < 10; i++) { if (this.ThemeValues[i] == this.CellColor.Color.effectValue) { this.colorsBack.select(this.CellColor.Color, false); break; } } } else { this.colorsBack.select(this.CellColor.Color, false); } this._state.BackColor = this.CellColor.Color; } this.ResumeEvents(); } }, _UpdateBordersStyle: function (border) { this.CellBorders = new CBorders(); var updateBorders = this.CellBorders; var visible = (border != ""); if (border.indexOf("l") > -1 || !visible) { if (updateBorders.get_Left() === null || updateBorders.get_Left() === undefined) { updateBorders.put_Left(new CBorder()); } this._UpdateBorderStyle(updateBorders.get_Left(), visible); } if (border.indexOf("t") > -1 || !visible) { if (updateBorders.get_Top() === null || updateBorders.get_Top() === undefined) { updateBorders.put_Top(new CBorder()); } this._UpdateBorderStyle(updateBorders.get_Top(), visible); } if (border.indexOf("r") > -1 || !visible) { if (updateBorders.get_Right() === null || updateBorders.get_Right() === undefined) { updateBorders.put_Right(new CBorder()); } this._UpdateBorderStyle(updateBorders.get_Right(), visible); } if (border.indexOf("b") > -1 || !visible) { if (updateBorders.get_Bottom() === null || updateBorders.get_Bottom() === undefined) { updateBorders.put_Bottom(new CBorder()); } this._UpdateBorderStyle(updateBorders.get_Bottom(), visible); } if (border.indexOf("c") > -1 || !visible) { if (updateBorders.get_InsideV() === null || updateBorders.get_InsideV() === undefined) { updateBorders.put_InsideV(new CBorder()); } this._UpdateBorderStyle(updateBorders.get_InsideV(), visible); } if (border.indexOf("m") > -1 || !visible) { if (updateBorders.get_InsideH() === null || updateBorders.get_InsideH() === undefined) { updateBorders.put_InsideH(new CBorder()); } this._UpdateBorderStyle(updateBorders.get_InsideH(), visible); } }, _UpdateBorderStyle: function (border, visible) { if (null == border) { border = new CBorder(); } if (visible && this.BorderSize > 0) { var size = parseFloat(this.BorderSize); border.put_Value(1); border.put_Size(size * 25.4 / 72); var color = this.getRgbColor(this._btnBorderColor.color); border.put_Color(color); } else { border.put_Value(0); } }, _openAdvancedSettings: function (e) { var me = this; var win; if (me.api) { var selectedElements = me.api.getSelectedElements(); if (selectedElements && Ext.isArray(selectedElements)) { var elType, elValue; for (var i = selectedElements.length - 1; i >= 0; i--) { elType = selectedElements[i].get_ObjectType(); elValue = selectedElements[i].get_ObjectValue(); if (c_oAscTypeSelectElement.Table == elType) { win = Ext.create("PE.view.TableSettingsAdvanced"); win.updateMetricUnit(); win.setSettings({ tableProps: elValue }); break; } } } } if (win) { win.addListener("onmodalresult", Ext.bind(function (o, mr, s) { if (mr == 1) { var props = win.getSettings(); me.borderAdvancedProps = props.borderProps; me.api.tblApply(props.tableProps); } me.fireEvent("editcomplete", me); }, this), false); win.show(); } }, _onInitTemplates: function (Templates) { var self = this; this._isTemplatesChanged = true; var count = self._cmbTableTemplate.dataMenu.picker.store.getCount(); if (count > 0 && count == Templates.length) { var data = self._cmbTableTemplate.dataMenu.picker.store.data.items; Ext.each(Templates, function (template, index) { data[index].data.imageUrl = template.get_Image(); }); self._cmbTableTemplate.dataMenu.picker.store.fireEvent("datachanged", self._cmbTableTemplate.dataMenu.picker.store); } else { var arr = []; self._cmbTableTemplate.dataMenu.picker.store.removeAll(); Ext.each(Templates, function (template) { arr.push({ imageUrl: template.get_Image(), uid: Ext.id(), data: { templateId: template.get_Id() } }); }); self._cmbTableTemplate.dataMenu.picker.store.loadData(arr); } }, SendThemeColors: function (effectcolors, standartcolors) { this.effectcolors = effectcolors; if (standartcolors && standartcolors.length > 0) { this.standartcolors = standartcolors; } if (this._initedSettings) { this.colorsBorder.updateColors(effectcolors, standartcolors); this.colorsBack.updateColors(effectcolors, standartcolors); } }, hideMenus: function () { this._btnBorderColor.hideMenu(); this._btnBackColor.hideMenu(); this._cmbTableTemplate.dataMenu.hide(); this._btnEdit.hideMenu(); }, textBorders: "Border's Style", textBorderColor: "Color", textBackColor: "Background color", textEdit: "Rows & Columns", selectRowText: "Select Row", selectColumnText: "Select Column", selectCellText: "Select Cell", selectTableText: "Select Table", insertRowAboveText: "Insert Row Above", insertRowBelowText: "Insert Row Below", insertColumnLeftText: "Insert Column Left", insertColumnRightText: "Insert Column Right", deleteRowText: "Delete Row", deleteColumnText: "Delete Column", deleteTableText: "Delete Table", mergeCellsText: "Merge Cells", splitCellsText: "Split Cell...", splitCellTitleText: "Split Cell", textSelectBorders: "Select borders that you want to change", textAdvanced: "Show advanced settings", txtTitle: "Table", txtNoBorders: "No borders", textTemplate: "Select From Template", textNewColor: "Add New Custom Color", textThemeColors: "Theme Colors", textStandartColors: "Standart Colors", textRows: "Rows", textColumns: "Columns", textHeader: "Header", textTotal: "Total", textBanded: "Banded", textFirst: "First", textLast: "Last", textEmptyTemplate: "No templates", tipTop: "Set Outer Top Border Only", tipLeft: "Set Outer Left Border Only", tipBottom: "Set Outer Bottom Border Only", tipRight: "Set Outer Right Border Only", tipAll: "Set Outer Border and All Inner Lines", tipNone: "Set No Borders", tipInner: "Set Inner Lines Only", tipInnerVert: "Set Vertical Inner Lines Only", tipInnerHor: "Set Horizontal Inner Lines Only", tipOuter: "Set Outer Border Only" });