[SSE] Optimize textart loading

apps/spreadsheeteditor/main/app/controller/Main.js

@@ -766,7 +766,6 @@ define([
                                 if (shapes)
                                     me.fillAutoShapes(shapes[0], shapes[1]);
 
-                                me.fillTextArt(me.api.asc_getTextArtPreviews());
                                 me.updateThemeColors();
                                 toolbarController.activateControls();
                             }
@@ -1800,11 +1799,14 @@ define([
             },
 
             fillTextArt: function(shapes){
-                if (_.isEmpty(shapes)) return;
+                var arr = [],
-
-                var me = this, arr = [],
                     artStore = this.getCollection('Common.Collections.TextArt');
 
+                if (!shapes && artStore.length>0) {// shapes == undefined when update textart collection (from asc_onSendThemeColors)
+                    shapes = this.api.asc_getTextArtPreviews();
+                }
+                if (_.isEmpty(shapes)) return;
+
                 _.each(shapes, function(shape, index){
                     arr.push({
                         imageUrl : shape,
@@ -1814,15 +1816,6 @@ define([
                     });
                 });
                 artStore.reset(arr);
-
-                setTimeout(function(){
-                    me.getApplication().getController('Toolbar').fillTextArt();
-                }, 50);
-
-                setTimeout(function(){
-                    me.getApplication().getController('RightMenu').fillTextArt();
-                }, 50);
-
             },
             
             updateThemeColors: function() {
@@ -1846,7 +1839,7 @@ define([
                     this.updateThemeColors();
                     var me = this;
                     setTimeout(function(){
-                        me.fillTextArt(me.api.asc_getTextArtPreviews());
+                        me.fillTextArt();
                     }, 1);
                 }
             },

apps/spreadsheeteditor/main/app/controller/RightMenu.js

@@ -299,10 +299,6 @@ define([
             this.rightmenu.imageSettings.updateMetricUnit();
         },
 
-        fillTextArt:  function() {
-            this.rightmenu.textartSettings.fillTextArt();
-        },
-
         createDelayedElements: function() {
             var me = this;
             if (this.api) {

apps/spreadsheeteditor/main/app/controller/Toolbar.js

@@ -71,7 +71,8 @@ define([
             this.addListeners({
                 'Toolbar': {
                     'change:compact': this.onClickChangeCompact.bind(me),
-                    'add:chart'     : this.onSelectChart
+                    'add:chart'     : this.onSelectChart,
+                    'insert:textart': this.onInsertTextart
                 },
                 'FileMenu': {
                     'menu:hide': me.onFileMenu.bind(me, 'hide'),
@@ -1019,6 +1020,19 @@ define([
             Common.NotificationCenter.trigger('edit:complete', this.toolbar);
         },
 
+        onInsertTextart: function (data) {
+            if (this.api) {
+                this.toolbar.fireEvent('inserttextart', this.toolbar);
+                this.api.asc_addTextArt(data);
+
+                if (this.toolbar.btnInsertShape.pressed)
+                    this.toolbar.btnInsertShape.toggle(false, true);
+
+                Common.NotificationCenter.trigger('edit:complete', this.toolbar, this.toolbar.btnInsertTextArt);
+                Common.component.Analytics.trackEvent('ToolBar', 'Add Text Art');
+            }
+        },
+
         onBtnInsertTextClick: function(btn, e) {
             if (this.api)
                 this._addAutoshape(btn.pressed, 'textRect');
@@ -2614,53 +2628,6 @@ define([
             }
         },
 
-        fillTextArt: function() {
-            if (!this.toolbar.btnInsertTextArt.rendered) return;
-
-            if ( this.toolbar.mnuTextArtPicker ) {
-                var models = this.getApplication().getCollection('Common.Collections.TextArt').models,
-                    count = this.toolbar.mnuTextArtPicker.store.length;
-                if (count>0 && count==models.length) {
-                    var data = this.toolbar.mnuTextArtPicker.store.models;
-                    _.each(models, function(template, index){
-                        data[index].set('imageUrl', template.get('imageUrl'));
-                    });
-                } else {
-                    this.toolbar.mnuTextArtPicker.store.reset(models);
-                }
-            } else if (!this.binding.onShowBeforeTextArt) {
-                var me = this;
-                me.binding.onShowBeforeTextArt = function(menu) {
-                    me.toolbar.mnuTextArtPicker = new Common.UI.DataView({
-                        el: $('#id-toolbar-menu-insart'),
-                        store: me.getApplication().getCollection('Common.Collections.TextArt'),
-                        parentMenu: menu,
-                        showLast: false,
-                        itemTemplate: _.template('<div class="item-art"><img src="<%= imageUrl %>" id="<%= id %>" style="width:50px;height:50px;"></div>')
-                    });
-
-                    me.toolbar.mnuTextArtPicker.on('item:click',
-                        function(picker, item, record, e) {
-                            if (record) {
-                                me.toolbar.fireEvent('inserttextart', me.toolbar);
-                                me.api.asc_addTextArt(record.get('data'));
-                            }
-                            if ( me.toolbar.btnInsertShape.pressed )
-                                me.toolbar.btnInsertShape.toggle(false, true);
-
-                             if ( e.type !== 'click' )
-                                 me.toolbar.btnInsertTextArt.menu.hide();
-
-                            Common.NotificationCenter.trigger('edit:complete', me.toolbar, me.toolbar.btnInsertTextArt);
-                            Common.component.Analytics.trackEvent('ToolBar', 'Add Text Art');
-                        }
-                    );
-                    menu.off('show:before', me.binding.onShowBeforeTextArt);
-                };
-                me.toolbar.btnInsertTextArt.menu.on('show:before', me.binding.onShowBeforeTextArt);
-            }
-        },
-
         fillEquations: function() {
             if (!this.toolbar.btnInsertEquation.rendered || this.toolbar.btnInsertEquation.menu.items.length>0) return;
 

apps/spreadsheeteditor/main/app/view/TextArtSettings.js

@@ -124,6 +124,10 @@ define([
             this.FillPatternContainer = $('#textart-panel-pattern-fill');
             this.FillGradientContainer = $('#textart-panel-gradient-fill');
             this.TransparencyContainer = $('#textart-panel-transparent-fill');
+
+            SSE.getCollection('Common.Collections.TextArt').bind({
+                reset: this.fillTextArt.bind(this)
+            });
         },
 
         render: function () {
@@ -1436,6 +1440,10 @@ define([
 
             var models = this.application.getCollection('Common.Collections.TextArt').models,
                 count = this.cmbTextArt.menuPicker.store.length;
+            if (models.length<1) {
+                SSE.getController('Main').fillTextArt(this.api.asc_getTextArtPreviews());
+                return;
+            }
             if (count>0 && count==models.length) {
                 var data = this.cmbTextArt.menuPicker.store.models;
                 _.each(models, function(template, index){

apps/spreadsheeteditor/main/app/view/Toolbar.js

@@ -1836,6 +1836,28 @@ define([
                 this.btnInsertChart.menu.on('show:before', onShowBefore);
             }
 
+            if (this.btnInsertTextArt) {
+                var onShowBeforeTextArt = function (menu) {
+                    var collection = SSE.getCollection('Common.Collections.TextArt');
+                    if (collection.length<1)
+                        SSE.getController('Main').fillTextArt(me.api.asc_getTextArtPreviews());
+                    var picker = new Common.UI.DataView({
+                        el: $('#id-toolbar-menu-insart'),
+                        store: collection,
+                        parentMenu: menu,
+                        showLast: false,
+                        itemTemplate: _.template('<div class="item-art"><img src="<%= imageUrl %>" id="<%= id %>" style="width:50px;height:50px;"></div>')
+                    });
+                    picker.on('item:click', function (picker, item, record, e) {
+                        if (record)
+                            me.fireEvent('insert:textart', [record.get('data')]);
+                        if (e.type !== 'click') menu.hide();
+                    });
+                    menu.off('show:before', onShowBeforeTextArt);
+                };
+                this.btnInsertTextArt.menu.on('show:before', onShowBeforeTextArt);
+            }
+
             if (!this.mode.isEditMailMerge && !this.mode.isEditDiagram)
                 this.updateMetricUnit();
         },