From 050d1a697e24061e856f15456c79165bfe9440e2 Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Fri, 13 Dec 2019 15:20:13 +0300 Subject: [PATCH 1/3] [DE] Bug 42429 --- apps/common/main/resources/less/buttons.less | 4 ++ .../main/app/template/TableSettings.template | 2 +- .../main/app/view/TableSettings.js | 69 ++++++++++--------- 3 files changed, 42 insertions(+), 33 deletions(-) diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 5216035c5..616d8d470 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -750,6 +750,10 @@ border: 1px solid @input-border; .border-radius(@border-radius-small); + &.template-table { + width: 97px; + } + .icon { display: inline-block; .btn.btnsize(52px); diff --git a/apps/documenteditor/main/app/template/TableSettings.template b/apps/documenteditor/main/app/template/TableSettings.template index c840cf208..689724965 100644 --- a/apps/documenteditor/main/app/template/TableSettings.template +++ b/apps/documenteditor/main/app/template/TableSettings.template @@ -38,7 +38,7 @@ -
+
diff --git a/apps/documenteditor/main/app/view/TableSettings.js b/apps/documenteditor/main/app/view/TableSettings.js index 553f08134..3f2851ccf 100644 --- a/apps/documenteditor/main/app/view/TableSettings.js +++ b/apps/documenteditor/main/app/view/TableSettings.js @@ -130,7 +130,7 @@ define([ this.fireEvent('editcomplete', this); }, - onTableTemplateSelect: function(combo, record){ + onTableTemplateSelect: function(btn, picker, itemView, record){ if (this.api && !this._noApply) { var properties = new Asc.CTableProp(); properties.put_TableStyle(record.get('templateId')); @@ -466,22 +466,21 @@ define([ } //for table-template - value = props.get_TableStyle(); + value = props.get_TableStyle(); if (this._state.TemplateId!==value || this._isTemplatesChanged) { - this.cmbTableTemplate.suspendEvents(); - var rec = this.cmbTableTemplate.menuPicker.store.findWhere({ + var rec = this.mnuTableTemplatePicker.store.findWhere({ templateId: value }); - this.cmbTableTemplate.menuPicker.selectRecord(rec); - this.cmbTableTemplate.resumeEvents(); - - if (this._isTemplatesChanged) { - if (rec) - this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.getSelectedRec(),true); - else - this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.store.at(0), true); + if (!rec) { + rec = this.mnuTableTemplatePicker.store.at(0); } - this._state.TemplateId=value; + this.btnTableTemplate.suspendEvents(); + this.mnuTableTemplatePicker.selectRecord(rec, true); + this.btnTableTemplate.resumeEvents(); + + this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '74px', 'background-position': 'center'}); + + this._state.TemplateId = value; } this._isTemplatesChanged = false; @@ -693,29 +692,35 @@ define([ var self = this; this._isTemplatesChanged = true; - if (!this.cmbTableTemplate) { - this.cmbTableTemplate = new Common.UI.ComboDataView({ - itemWidth: 70, - itemHeight: 50, - menuMaxHeight: 300, - enableKeyEvents: true, - cls: 'combo-template' + if (!this.btnTableTemplate) { + this.btnTableTemplate = new Common.UI.Button({ + cls : 'btn-large-dataview template-table', + iconCls : 'icon-template-table', + menu : new Common.UI.Menu({ + style: 'width: 575px;height: 478px;', + items: [ + { template: _.template('') } + ] + }) }); - this.cmbTableTemplate.render($('#table-combo-template')); - this.cmbTableTemplate.openButton.menu.cmpEl.css({ - 'min-width': 175, - 'max-width': 175 + this.btnTableTemplate.on('render:after', function(btn) { + self.mnuTableTemplatePicker = new Common.UI.DataView({ + el: $('#id-table-menu-template'), + parentMenu: btn.menu, + restoreHeight: 421, + groups: new Common.UI.DataViewGroupStore(), + store: new Common.UI.DataViewStore(), + itemTemplate: _.template('
') + }); }); - this.cmbTableTemplate.on('click', _.bind(this.onTableTemplateSelect, this)); - this.cmbTableTemplate.openButton.menu.on('show:after', function () { - self.cmbTableTemplate.menuPicker.scroller.update({alwaysVisibleY: true}); - }); - this.lockedControls.push(this.cmbTableTemplate); + this.btnTableTemplate.render($('#table-btn-template')); + this.lockedControls.push(this.btnTableTemplate); + this.mnuTableTemplatePicker.on('item:click', _.bind(this.onTableTemplateSelect, this, this.btnTableTemplate)); } - var count = self.cmbTableTemplate.menuPicker.store.length; + var count = self.mnuTableTemplatePicker.store.length; if (count>0 && count==Templates.length) { - var data = self.cmbTableTemplate.menuPicker.store.models; + var data = self.mnuTableTemplatePicker.store.models; _.each(Templates, function(template, index){ data[index].set('imageUrl', template.asc_getImage()); }); @@ -738,7 +743,7 @@ define([ tip : tip }); }); - self.cmbTableTemplate.menuPicker.store.reset(arr); + self.mnuTableTemplatePicker.store.reset(arr); } }, From 7dd4e731d98c48fac0aec2bf54a22730cad2c7fb Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Fri, 13 Dec 2019 17:18:11 +0300 Subject: [PATCH 2/3] [DE] [SSE] [PE] Fix bug 42429 --- .../main/app/view/TableSettings.js | 7 +- .../main/app/template/TableSettings.template | 2 +- .../main/app/view/TableSettings.js | 70 ++++++++++--------- .../main/app/template/TableSettings.template | 2 +- .../main/app/view/TableSettings.js | 68 ++++++++++-------- 5 files changed, 82 insertions(+), 67 deletions(-) diff --git a/apps/documenteditor/main/app/view/TableSettings.js b/apps/documenteditor/main/app/view/TableSettings.js index 3f2851ccf..b0870fe87 100644 --- a/apps/documenteditor/main/app/view/TableSettings.js +++ b/apps/documenteditor/main/app/view/TableSettings.js @@ -697,7 +697,7 @@ define([ cls : 'btn-large-dataview template-table', iconCls : 'icon-template-table', menu : new Common.UI.Menu({ - style: 'width: 575px;height: 478px;', + style: 'width: 575px;', items: [ { template: _.template('') } ] @@ -707,10 +707,11 @@ define([ self.mnuTableTemplatePicker = new Common.UI.DataView({ el: $('#id-table-menu-template'), parentMenu: btn.menu, - restoreHeight: 421, + restoreHeight: 350, groups: new Common.UI.DataViewGroupStore(), store: new Common.UI.DataViewStore(), - itemTemplate: _.template('
') + itemTemplate: _.template('
'), + style: 'max-height: 350px;' }); }); this.btnTableTemplate.render($('#table-btn-template')); diff --git a/apps/presentationeditor/main/app/template/TableSettings.template b/apps/presentationeditor/main/app/template/TableSettings.template index 6d3db0d7e..4a1829672 100644 --- a/apps/presentationeditor/main/app/template/TableSettings.template +++ b/apps/presentationeditor/main/app/template/TableSettings.template @@ -38,7 +38,7 @@ -
+
diff --git a/apps/presentationeditor/main/app/view/TableSettings.js b/apps/presentationeditor/main/app/view/TableSettings.js index dae5bb44a..281d6c5dd 100644 --- a/apps/presentationeditor/main/app/view/TableSettings.js +++ b/apps/presentationeditor/main/app/view/TableSettings.js @@ -128,7 +128,7 @@ define([ this.fireEvent('editcomplete', this); }, - onTableTemplateSelect: function(combo, record){ + onTableTemplateSelect: function(btn, picker, itemView, record){ if (this.api && !this._noApply) { var properties = new Asc.CTableProp(); properties.put_TableStyle(record.get('templateId')); @@ -436,20 +436,19 @@ define([ //for table-template value = props.get_TableStyle(); if (this._state.TemplateId!==value || this._isTemplatesChanged) { - this.cmbTableTemplate.suspendEvents(); - var rec = this.cmbTableTemplate.menuPicker.store.findWhere({ + var rec = this.mnuTableTemplatePicker.store.findWhere({ templateId: value }); - this.cmbTableTemplate.menuPicker.selectRecord(rec); - this.cmbTableTemplate.resumeEvents(); - - if (this._isTemplatesChanged) { - if (rec) - this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.getSelectedRec(),true); - else - this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.store.at(0), true); + if (!rec) { + rec = this.mnuTableTemplatePicker.store.at(0); } - this._state.TemplateId=value; + this.btnTableTemplate.suspendEvents(); + this.mnuTableTemplatePicker.selectRecord(rec, true); + this.btnTableTemplate.resumeEvents(); + + this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '74px', 'background-position': 'center'}); + + this._state.TemplateId = value; } this._isTemplatesChanged = false; @@ -660,29 +659,36 @@ define([ var self = this; this._isTemplatesChanged = true; - if (!this.cmbTableTemplate) { - this.cmbTableTemplate = new Common.UI.ComboDataView({ - itemWidth: 70, - itemHeight: 50, - menuMaxHeight: 300, - enableKeyEvents: true, - cls: 'combo-template' + if (!this.btnTableTemplate) { + this.btnTableTemplate = new Common.UI.Button({ + cls : 'btn-large-dataview template-table', + iconCls : 'icon-template-table', + menu : new Common.UI.Menu({ + style: 'width: 575px;', + items: [ + { template: _.template('') } + ] + }) }); - this.cmbTableTemplate.render($('#table-combo-template')); - this.cmbTableTemplate.openButton.menu.cmpEl.css({ - 'min-width': 175, - 'max-width': 175 + this.btnTableTemplate.on('render:after', function(btn) { + self.mnuTableTemplatePicker = new Common.UI.DataView({ + el: $('#id-table-menu-template'), + parentMenu: btn.menu, + restoreHeight: 350, + groups: new Common.UI.DataViewGroupStore(), + store: new Common.UI.DataViewStore(), + itemTemplate: _.template('
'), + style: 'max-height: 350px;' + }); }); - this.cmbTableTemplate.on('click', _.bind(this.onTableTemplateSelect, this)); - this.cmbTableTemplate.openButton.menu.on('show:after', function () { - self.cmbTableTemplate.menuPicker.scroller.update({alwaysVisibleY: true}); - }); - this.lockedControls.push(this.cmbTableTemplate); + this.btnTableTemplate.render($('#table-btn-template')); + this.lockedControls.push(this.btnTableTemplate); + this.mnuTableTemplatePicker.on('item:click', _.bind(this.onTableTemplateSelect, this, this.btnTableTemplate)); } - - var count = self.cmbTableTemplate.menuPicker.store.length; + + var count = self.mnuTableTemplatePicker.store.length; if (count>0 && count==Templates.length) { - var data = self.cmbTableTemplate.menuPicker.store.models; + var data = self.mnuTableTemplatePicker.store.models; _.each(Templates, function(template, index){ data[index].set('imageUrl', template.asc_getImage()); }); @@ -705,7 +711,7 @@ define([ tip : tip }); }); - self.cmbTableTemplate.menuPicker.store.reset(arr); + self.mnuTableTemplatePicker.store.reset(arr); } }, diff --git a/apps/spreadsheeteditor/main/app/template/TableSettings.template b/apps/spreadsheeteditor/main/app/template/TableSettings.template index 829d2ff50..fe5731e8b 100644 --- a/apps/spreadsheeteditor/main/app/template/TableSettings.template +++ b/apps/spreadsheeteditor/main/app/template/TableSettings.template @@ -43,7 +43,7 @@ -
+
diff --git a/apps/spreadsheeteditor/main/app/view/TableSettings.js b/apps/spreadsheeteditor/main/app/view/TableSettings.js index 6747876c7..b5889072a 100644 --- a/apps/spreadsheeteditor/main/app/view/TableSettings.js +++ b/apps/spreadsheeteditor/main/app/view/TableSettings.js @@ -100,7 +100,7 @@ define([ Common.NotificationCenter.trigger('edit:complete', this); }, - onTableTemplateSelect: function(combo, record){ + onTableTemplateSelect: function(btn, picker, itemView, record){ if (this.api && !this._noApply) { this.api.asc_changeAutoFilter(this._state.TableName, Asc.c_oAscChangeFilterOptions.style, record.get('name')); } @@ -398,19 +398,18 @@ define([ //for table-template value = props.asc_getTableStyleName(); if (this._state.TemplateName!==value || this._isTemplatesChanged) { - this.cmbTableTemplate.suspendEvents(); - var rec = this.cmbTableTemplate.menuPicker.store.findWhere({ + var rec = this.mnuTableTemplatePicker.store.findWhere({ name: value }); - this.cmbTableTemplate.menuPicker.selectRecord(rec); - this.cmbTableTemplate.resumeEvents(); - - if (this._isTemplatesChanged) { - if (rec) - this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.getSelectedRec(),true); - else - this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.store.at(0), true); + if (!rec) { + rec = this.mnuTableTemplatePicker.store.at(0); } + this.btnTableTemplate.suspendEvents(); + this.mnuTableTemplatePicker.selectRecord(rec, true); + this.btnTableTemplate.resumeEvents(); + + this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '71px', 'background-position': 'center'}); + this._state.TemplateName=value; } this._isTemplatesChanged = false; @@ -429,29 +428,38 @@ define([ var self = this; this._isTemplatesChanged = true; - if (!this.cmbTableTemplate) { - this.cmbTableTemplate = new Common.UI.ComboDataView({ - itemWidth: 61, - itemHeight: 46, - menuMaxHeight: 300, - enableKeyEvents: true + if (!this.btnTableTemplate) { + this.btnTableTemplate = new Common.UI.Button({ + cls : 'btn-large-dataview template-table', + iconCls : 'icon-template-table', + menu : new Common.UI.Menu({ + style: 'width: 575px;', + items: [ + { template: _.template('') } + ] + }) }); - this.cmbTableTemplate.render($('#table-combo-template')); - this.cmbTableTemplate.openButton.menu.cmpEl.css({ - 'min-width': 175, - 'max-width': 175 + this.btnTableTemplate.on('render:after', function(btn) { + self.mnuTableTemplatePicker = new Common.UI.DataView({ + el: $('#id-table-menu-template'), + parentMenu: btn.menu, + restoreHeight: 350, + groups: new Common.UI.DataViewGroupStore(), + store: new Common.UI.DataViewStore(), + itemTemplate: _.template('
'), + style: 'max-height: 350px;' + }); }); - this.cmbTableTemplate.on('click', _.bind(this.onTableTemplateSelect, this)); - this.cmbTableTemplate.openButton.menu.on('show:after', function () { - self.cmbTableTemplate.menuPicker.scroller.update({alwaysVisibleY: true}); - }); - this.lockedControls.push(this.cmbTableTemplate); - if (this._locked) this.cmbTableTemplate.setDisabled(this._locked); + this.btnTableTemplate.render($('#table-btn-template')); + this.lockedControls.push(this.btnTableTemplate); + this.mnuTableTemplatePicker.on('item:click', _.bind(this.onTableTemplateSelect, this, this.btnTableTemplate)); + if (this._locked) this.btnTableTemplate.setDisabled(this._locked); } - var count = self.cmbTableTemplate.menuPicker.store.length; + + var count = self.mnuTableTemplatePicker.store.length; if (count>0 && count==Templates.length) { - var data = self.cmbTableTemplate.menuPicker.store.models; + var data = self.mnuTableTemplatePicker.store.models; _.each(Templates, function(template, index){ data[index].set('imageUrl', template.asc_getImage()); }); @@ -469,7 +477,7 @@ define([ tip : template.asc_getDisplayName() }); }); - self.cmbTableTemplate.menuPicker.store.reset(arr); + self.mnuTableTemplatePicker.store.reset(arr); } }, From eb7cbca182052ed0272092cf27014e7d00ea02f7 Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Mon, 16 Dec 2019 13:55:13 +0300 Subject: [PATCH 3/3] [DE] [SSE] [PE] Bug 42429 --- apps/common/main/resources/less/buttons.less | 6 +++++- apps/documenteditor/main/app/view/TableSettings.js | 2 +- .../main/app/view/TableSettings.js | 2 +- .../main/app/template/TableSettings.template | 2 +- .../spreadsheeteditor/main/app/view/TableSettings.js | 12 ++++++------ apps/spreadsheeteditor/main/app/view/Toolbar.js | 2 +- 6 files changed, 15 insertions(+), 11 deletions(-) diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 616d8d470..8cb8df299 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -751,7 +751,11 @@ .border-radius(@border-radius-small); &.template-table { - width: 97px; + width: 92px; + } + &.sheet-template-table { + width: 83px; + height: 54px; } .icon { diff --git a/apps/documenteditor/main/app/view/TableSettings.js b/apps/documenteditor/main/app/view/TableSettings.js index b0870fe87..89d622520 100644 --- a/apps/documenteditor/main/app/view/TableSettings.js +++ b/apps/documenteditor/main/app/view/TableSettings.js @@ -478,7 +478,7 @@ define([ this.mnuTableTemplatePicker.selectRecord(rec, true); this.btnTableTemplate.resumeEvents(); - this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '74px', 'background-position': 'center'}); + this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '72px', 'background-position': 'center'}); this._state.TemplateId = value; } diff --git a/apps/presentationeditor/main/app/view/TableSettings.js b/apps/presentationeditor/main/app/view/TableSettings.js index 281d6c5dd..75976eb32 100644 --- a/apps/presentationeditor/main/app/view/TableSettings.js +++ b/apps/presentationeditor/main/app/view/TableSettings.js @@ -446,7 +446,7 @@ define([ this.mnuTableTemplatePicker.selectRecord(rec, true); this.btnTableTemplate.resumeEvents(); - this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '74px', 'background-position': 'center'}); + this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '72px', 'background-position': 'center'}); this._state.TemplateId = value; } diff --git a/apps/spreadsheeteditor/main/app/template/TableSettings.template b/apps/spreadsheeteditor/main/app/template/TableSettings.template index fe5731e8b..2ed6e5d01 100644 --- a/apps/spreadsheeteditor/main/app/template/TableSettings.template +++ b/apps/spreadsheeteditor/main/app/template/TableSettings.template @@ -43,7 +43,7 @@ -
+
diff --git a/apps/spreadsheeteditor/main/app/view/TableSettings.js b/apps/spreadsheeteditor/main/app/view/TableSettings.js index b5889072a..14ef3f5de 100644 --- a/apps/spreadsheeteditor/main/app/view/TableSettings.js +++ b/apps/spreadsheeteditor/main/app/view/TableSettings.js @@ -408,7 +408,7 @@ define([ this.mnuTableTemplatePicker.selectRecord(rec, true); this.btnTableTemplate.resumeEvents(); - this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '52px', 'width': '71px', 'background-position': 'center'}); + this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '48px', 'width': '63px', 'background-position': 'center'}); this._state.TemplateName=value; } @@ -430,10 +430,10 @@ define([ if (!this.btnTableTemplate) { this.btnTableTemplate = new Common.UI.Button({ - cls : 'btn-large-dataview template-table', + cls : 'btn-large-dataview sheet-template-table', iconCls : 'icon-template-table', menu : new Common.UI.Menu({ - style: 'width: 575px;', + style: 'width: 512px;', items: [ { template: _.template('') } ] @@ -443,11 +443,11 @@ define([ self.mnuTableTemplatePicker = new Common.UI.DataView({ el: $('#id-table-menu-template'), parentMenu: btn.menu, - restoreHeight: 350, + restoreHeight: 325, groups: new Common.UI.DataViewGroupStore(), store: new Common.UI.DataViewStore(), - itemTemplate: _.template('
'), - style: 'max-height: 350px;' + itemTemplate: _.template('
'), + style: 'max-height: 325px;' }); }); this.btnTableTemplate.render($('#table-btn-template')); diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js index 81b8ff23f..7a06d91bd 100644 --- a/apps/spreadsheeteditor/main/app/view/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js @@ -736,7 +736,7 @@ define([ lock : [_set.editCell, _set.selChart, _set.selChartText, _set.selShape, _set.selShapeText, _set.selImage, _set.lostConnect, _set.coAuth, _set.ruleFilter, _set.multiselect, _set.cantModifyFilter], menu : new Common.UI.Menu({ items: [ - { template: _.template('
') } + { template: _.template('
') } ] }) });