From b222c556e4732240c9a4d23bb271dceaa4119fb1 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 9 Feb 2022 00:13:56 +0300 Subject: [PATCH 1/2] [DE] Bug 52346 --- .../main/app/view/TableSettings.js | 114 +++++++++++------- 1 file changed, 69 insertions(+), 45 deletions(-) diff --git a/apps/documenteditor/main/app/view/TableSettings.js b/apps/documenteditor/main/app/view/TableSettings.js index 05b84bef1..2a0360355 100644 --- a/apps/documenteditor/main/app/view/TableSettings.js +++ b/apps/documenteditor/main/app/view/TableSettings.js @@ -85,7 +85,10 @@ define([ RepeatRow: false, DisabledControls: false, Width: null, - Height: null + Height: null, + beginPreviewStyles: true, + previewStylesCount: -1, + currentStyleFound: false }; this.spinners = []; this.lockedControls = []; @@ -233,6 +236,10 @@ define([ this.api = o; if (o) { this.api.asc_registerCallback('asc_onInitTableTemplates', _.bind(this.onInitTableTemplates, this)); + this.api.asc_registerCallback('asc_onBeginTableStylesPreview', _.bind(this.onBeginTableStylesPreview, this)); + this.api.asc_registerCallback('asc_onAddTableStylesPreview', _.bind(this.onAddTableStylesPreview, this)); + this.api.asc_registerCallback('asc_onEndTableStylesPreview', _.bind(this.onEndTableStylesPreview, this)); + } return this; }, @@ -524,19 +531,9 @@ define([ //for table-template value = props.get_TableStyle(); if (this._state.TemplateId!==value || this._isTemplatesChanged) { - var rec = this.mnuTableTemplatePicker.store.findWhere({ - templateId: value - }); - 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': '72px', 'background-position': 'center', 'background-size': 'auto 52px'}); - this._state.TemplateId = value; + this._state.currentStyleFound = false; + this.selectCurrentTableStyle(); } this._isTemplatesChanged = false; @@ -740,6 +737,62 @@ define([ !this.btnBorderColor.isAutoColor() && this.btnBorderColor.setColor(this.borderColor.getColor()); }, + selectCurrentTableStyle: function() { + if (!this.mnuTableTemplatePicker) return; + + var rec = this.mnuTableTemplatePicker.store.findWhere({ + templateId: this._state.TemplateId + }); + if (!rec && this._state.previewStylesCount===this.mnuTableTemplatePicker.store.length) { + rec = this.mnuTableTemplatePicker.store.at(0); + } + if (rec) { + this._state.currentStyleFound = true; + 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': '72px', 'background-position': 'center', 'background-size': 'auto 52px'}); + } + }, + + onBeginTableStylesPreview: function(count){ + this._state.beginPreviewStyles = true; + this._state.currentStyleFound = false; + this._state.previewStylesCount = count; + }, + + onEndTableStylesPreview: function(){ + !this._state.currentStyleFound && this.selectCurrentTableStyle(); + }, + + onAddTableStylesPreview: function(Templates){ + var self = this; + var arr = []; + _.each(Templates, function(template){ + var tip = template.asc_getDisplayName(); + if (template.asc_getType()==0) { + ['Table Grid', 'Plain Table', 'Grid Table', 'List Table', 'Light', 'Dark', 'Colorful', 'Accent'].forEach(function(item){ + var str = 'txtTable_' + item.replace(' ', ''); + if (self[str]) + tip = tip.replace(item, self[str]); + }); + + } + arr.push({ + imageUrl: template.asc_getImage(), + id : Common.UI.getId(), + templateId: template.asc_getId(), + tip : tip + }); + }); + if (this._state.beginPreviewStyles) { + this._state.beginPreviewStyles = false; + self.mnuTableTemplatePicker.store.reset(arr); + } else + self.mnuTableTemplatePicker.store.add(arr); + !this._state.currentStyleFound && this.selectCurrentTableStyle(); + }, + onInitTableTemplates: function(){ if (this._initSettings) { this._tableTemplates = true; @@ -749,7 +802,6 @@ define([ }, _onInitTemplates: function(){ - var Templates = this.api.asc_getTableStylesPreviews(); var self = this; this._isTemplatesChanged = true; @@ -780,39 +832,11 @@ define([ }); }); this.btnTableTemplate.render($('#table-btn-template')); + this.btnTableTemplate.cmpEl.find('.icon-template-table').css({'height': '52px', 'width': '72px', 'background-position': 'center', 'background-size': 'auto 52px'}); this.lockedControls.push(this.btnTableTemplate); this.mnuTableTemplatePicker.on('item:click', _.bind(this.onTableTemplateSelect, this, this.btnTableTemplate)); } - - var count = self.mnuTableTemplatePicker.store.length; - if (count>0 && count==Templates.length) { - var data = self.mnuTableTemplatePicker.dataViewItems; - data && _.each(Templates, function(template, index){ - var img = template.asc_getImage(); - data[index].model.set('imageUrl', img, {silent: true}); - $(data[index].el).find('img').attr('src', img); - }); - } else { - var arr = []; - _.each(Templates, function(template){ - var tip = template.asc_getDisplayName(); - if (template.asc_getType()==0) { - ['Table Grid', 'Plain Table', 'Grid Table', 'List Table', 'Light', 'Dark', 'Colorful', 'Accent'].forEach(function(item){ - var str = 'txtTable_' + item.replace(' ', ''); - if (self[str]) - tip = tip.replace(item, self[str]); - }); - - } - arr.push({ - imageUrl: template.asc_getImage(), - id : Common.UI.getId(), - templateId: template.asc_getId(), - tip : tip - }); - }); - self.mnuTableTemplatePicker.store.reset(arr); - } + this.api.asc_generateTableStylesPreviews(); }, openAdvancedSettings: function(e) { @@ -899,7 +923,7 @@ define([ _.each(this.lockedControls, function(item) { item.setDisabled(disable); }); - this.linkAdvanced.toggleClass('disabled', disable); + this.linkAdvanced && this.linkAdvanced.toggleClass('disabled', disable); } }, From 0b93ca69e74a5fc07f913d20cf99bfd301cbe028 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 9 Feb 2022 15:45:30 +0300 Subject: [PATCH 2/2] [DE] Bug 52346: draw current style --- apps/documenteditor/main/app/view/TableSettings.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/apps/documenteditor/main/app/view/TableSettings.js b/apps/documenteditor/main/app/view/TableSettings.js index 2a0360355..f7524b6c7 100644 --- a/apps/documenteditor/main/app/view/TableSettings.js +++ b/apps/documenteditor/main/app/view/TableSettings.js @@ -74,7 +74,7 @@ define([ this._initSettings = true; this._state = { - TemplateId: 0, + TemplateId: undefined, CheckHeader: false, CheckTotal: false, CheckBanded: false, @@ -532,6 +532,9 @@ define([ value = props.get_TableStyle(); if (this._state.TemplateId!==value || this._isTemplatesChanged) { this._state.TemplateId = value; + var template = this.api.asc_getTableStylesPreviews(false, [this._state.TemplateId]); + if (template && template.length>0) + this.$el.find('.icon-template-table').css({'background-image': 'url(' + template[0].asc_getImage() + ')', 'height': '52px', 'width': '72px', 'background-position': 'center', 'background-size': 'auto 52px'}); this._state.currentStyleFound = false; this.selectCurrentTableStyle(); }