diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js
index df5190faf..6eb83d204 100644
--- a/apps/spreadsheeteditor/main/app/controller/Main.js
+++ b/apps/spreadsheeteditor/main/app/controller/Main.js
@@ -1298,7 +1298,7 @@ define([
                 Common.Gateway.setDocumentModified(change);
 
                 if (this.toolbarView && this.toolbarView.btnSave && this.api) {
-                    var isSyncButton = $('.btn-icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
+                    var isSyncButton = $('.icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
                         forcesave = this.appOptions.forcesave;
                     var cansave = this.api.asc_isDocumentCanSave();
                     if (this.toolbarView.btnSave.isDisabled() !== (!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
@@ -1308,7 +1308,7 @@ define([
 
             onDocumentCanSaveChanged: function (isCanSave) {
                 if (this.toolbarView && this.toolbarView.btnSave) {
-                    var isSyncButton = $('.btn-icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
+                    var isSyncButton = $('.icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
                         forcesave = this.appOptions.forcesave;
                     if (this.toolbarView.btnSave.isDisabled() !== (!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
                         this.toolbarView.btnSave.setDisabled(!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
diff --git a/apps/spreadsheeteditor/main/app/controller/Toolbar.js b/apps/spreadsheeteditor/main/app/controller/Toolbar.js
index d1dcaf857..029cdaebb 100644
--- a/apps/spreadsheeteditor/main/app/controller/Toolbar.js
+++ b/apps/spreadsheeteditor/main/app/controller/Toolbar.js
@@ -176,7 +176,7 @@ define([
             Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this));
         },
 
-        onToolbarAfterRender: function(toolbar) {
+        attachUIEvents: function(toolbar) {
             var me = this;
 
             /**
@@ -301,6 +301,7 @@ define([
             if ( !config.isEditDiagram  && !config.isEditMailMerge ) {
                 this.api.asc_registerCallback('asc_onSendThemeColors',      _.bind(this.onSendThemeColors, this));
                 this.api.asc_registerCallback('asc_onMathTypes',            _.bind(this.onMathTypes, this));
+                this.api.asc_registerCallback('asc_onContextMenu',          _.bind(this.onContextMenu, this));
             }
 
             this.api.asc_registerCallback('asc_onInitEditorStyles',     _.bind(this.onApiInitEditorStyles, this));
@@ -324,6 +325,10 @@ define([
         //     Common.component.Analytics.trackEvent('ToolBar', 'Open Document');
         // },
 
+        onContextMenu: function() {
+            this.toolbar.collapseToolbar();
+        },
+
         onPrint: function(e) {
             Common.NotificationCenter.trigger('print', this.toolbar);
         },
@@ -331,7 +336,7 @@ define([
         onSave: function(e) {
             if (this.api) {
                 var isModified = this.api.asc_isDocumentCanSave();
-                var isSyncButton = $('.btn-icon', this.toolbar.btnSave.cmpEl).hasClass('btn-synch');
+                var isSyncButton = $('.icon', this.toolbar.btnSave.cmpEl).hasClass('btn-synch');
                 if (!isModified && !isSyncButton && !this.toolbar.mode.forcesave)
                     return;
 
@@ -506,7 +511,7 @@ define([
                     bordersColor = btnBorders.options.borderscolor;
 
                 if (btnBorders.rendered) {
-                    var iconEl = $('.btn-icon', btnBorders.cmpEl);
+                    var iconEl = $('.icon', btnBorders.cmpEl);
 
                     if (iconEl) {
                         iconEl.removeClass(btnBorders.options.icls);
@@ -575,7 +580,7 @@ define([
 
         onHorizontalAlignMenu: function(menu, item) {
             var btnHorizontalAlign = this.toolbar.btnHorizontalAlign,
-                iconEl = $('.btn-icon', btnHorizontalAlign.cmpEl);
+                iconEl = $('.icon', btnHorizontalAlign.cmpEl);
 
             if (iconEl) {
                 iconEl.removeClass(btnHorizontalAlign.options.icls);
@@ -595,7 +600,7 @@ define([
 
         onVerticalAlignMenu: function(menu, item) {
             var btnVerticalAlign = this.toolbar.btnVerticalAlign,
-                iconEl = $('.btn-icon', btnVerticalAlign.cmpEl);
+                iconEl = $('.icon', btnVerticalAlign.cmpEl);
 
             if (iconEl) {
                 iconEl.removeClass(btnVerticalAlign.options.icls);
@@ -1331,7 +1336,7 @@ define([
             var me = this;
 
             this.toolbar.createDelayedElements();
-            this.onToolbarAfterRender(this.toolbar);
+            this.attachUIEvents(this.toolbar);
 
             if ( !this.appConfig.isEditDiagram && !this.appConfig.isEditMailMerge ) {
                 this.api.asc_registerCallback('asc_onSheetsChanged',            _.bind(this.onApiSheetChanged, this));
@@ -1891,7 +1896,7 @@ define([
 
                         var btnHorizontalAlign = this.toolbar.btnHorizontalAlign;
                         if (btnHorizontalAlign.rendered) {
-                            var hIconEl = $('.btn-icon', btnHorizontalAlign.cmpEl);
+                            var hIconEl = $('.icon', btnHorizontalAlign.cmpEl);
 
                             if (hIconEl) {
                                 hIconEl.removeClass(btnHorizontalAlign.options.icls);
@@ -1925,7 +1930,7 @@ define([
 
                             var btnVerticalAlign = this.toolbar.btnVerticalAlign;
                             if (btnVerticalAlign.rendered) {
-                                var vIconEl = $('.btn-icon', btnVerticalAlign.cmpEl);
+                                var vIconEl = $('.icon', btnVerticalAlign.cmpEl);
 
                                 if (vIconEl) {
                                     vIconEl.removeClass(btnVerticalAlign.options.icls);
diff --git a/apps/spreadsheeteditor/main/app/view/RightMenu.js b/apps/spreadsheeteditor/main/app/view/RightMenu.js
index 3e93ce263..c685e418a 100644
--- a/apps/spreadsheeteditor/main/app/view/RightMenu.js
+++ b/apps/spreadsheeteditor/main/app/view/RightMenu.js
@@ -145,12 +145,12 @@ define([
 
             el.html(this.template({}));
 
-            this.btnText.el         = $('#id-right-menu-text');     this.btnText.render();
-            this.btnImage.el        = $('#id-right-menu-image');    this.btnImage.render();
-            this.btnChart.el        = $('#id-right-menu-chart');    this.btnChart.render();
-            this.btnShape.el        = $('#id-right-menu-shape');    this.btnShape.render();
-            this.btnTextArt.el      = $('#id-right-menu-textart');  this.btnTextArt.render();
-            this.btnTable.el        = $('#id-right-menu-table');    this.btnTable.render();
+            this.btnText.setElement($('#id-right-menu-text'), false);           this.btnText.render();
+            this.btnImage.setElement($('#id-right-menu-image'), false);         this.btnImage.render();
+            this.btnChart.setElement($('#id-right-menu-chart'), false);         this.btnChart.render();
+            this.btnShape.setElement($('#id-right-menu-shape'), false);         this.btnShape.render();
+            this.btnTextArt.setElement($('#id-right-menu-textart'), false);     this.btnTextArt.render();
+            this.btnTable.setElement($('#id-right-menu-table'), false);         this.btnTable.render();
 
             this.btnText.on('click',            _.bind(this.onBtnMenuClick, this));
             this.btnImage.on('click',           _.bind(this.onBtnMenuClick, this));
diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js
index c896e8cd7..3f1445f69 100644
--- a/apps/spreadsheeteditor/main/app/view/Toolbar.js
+++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js
@@ -421,14 +421,6 @@ define([
                             { template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="padding-left:12px;">' + me.textNewColor + '</a>') }
                         ]
                     })
-                }).on('render:after', function(btn) {
-                    var colorVal = $('<div class="btn-color-value-line"></div>');
-                    $('button:first-child', btn.cmpEl).append(colorVal);
-                    colorVal.css('background-color', btn.currentColor || 'transparent');
-
-                    me.mnuTextColorPicker = new Common.UI.ThemeColorPalette({
-                        el: $('#id-toolbar-menu-fontcolor')
-                    });
                 });
 
                 me.mnuBackColorPicker = dummyCmp();
@@ -444,15 +436,6 @@ define([
                             { template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + me.textNewColor + '</a>') }
                         ]
                     })
-                }).on('render:after', function(btn) {
-                    var colorVal = $('<div class="btn-color-value-line"></div>');
-                    $('button:first-child', btn.cmpEl).append(colorVal);
-                    colorVal.css('background-color', btn.currentColor || 'transparent');
-
-                    me.mnuBackColorPicker = new Common.UI.ThemeColorPalette({
-                        el: $('#id-toolbar-menu-paracolor'),
-                        transparent: true
-                    });
                 });
 
                 me.btnBorders = new Common.UI.Button({
@@ -1244,6 +1227,8 @@ define([
                 if (cmp && _.isFunction(cmp.setDisabled))
                     cmp.setDisabled(true);
             });
+
+            this.on('render:after', _.bind(this.onToolbarAfterRender, this));
         },
 
         render: function (mode) {
@@ -1478,9 +1463,9 @@ define([
                                         'data-stopPropagation="true"',
                                     '<% } %>', '>',
                                     '<label class="title">' + this.textZoom + '</label>',
-                                    '<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomin">&nbsp;</span></button>',
+                                    '<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><span class="icon btn-zoomin">&nbsp;</span></button>',
                                     '<label class="zoom"><%= options.value %>%</label>',
-                                    '<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomout">&nbsp;</span></button>',
+                                    '<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><span class="icon btn-zoomout">&nbsp;</span></button>',
                                 '</div>'
                             ].join('')),
                             stopPropagation: true,
@@ -1684,6 +1669,29 @@ define([
             }
         },
 
+        onToolbarAfterRender: function(toolbar) {
+            // DataView and pickers
+            //
+            if (this.btnTextColor && this.btnTextColor.cmpEl) {
+                var colorVal = $('<div class="btn-color-value-line"></div>');
+                $('button:first-child', this.btnTextColor.cmpEl).append(colorVal);
+                colorVal.css('background-color', this.btnTextColor.currentColor || 'transparent');
+                this.mnuTextColorPicker = new Common.UI.ThemeColorPalette({
+                    el: $('#id-toolbar-menu-fontcolor')
+                });
+            }
+            if (this.btnBackColor && this.btnBackColor.cmpEl) {
+                var colorVal = $('<div class="btn-color-value-line"></div>');
+                $('button:first-child', this.btnBackColor.cmpEl).append(colorVal);
+                colorVal.css('background-color', this.btnBackColor.currentColor || 'transparent');
+
+                this.mnuBackColorPicker = new Common.UI.ThemeColorPalette({
+                    el: $('#id-toolbar-menu-paracolor'),
+                    transparent: true
+                });
+            }
+        },
+
         setApi: function(api) {
             this.api = api;
 
@@ -1779,7 +1787,7 @@ define([
             }
 
             this._state.hasCollaborativeChanges = true;
-            var iconEl = $('.btn-icon', this.btnSave.cmpEl);
+            var iconEl = $('.icon', this.btnSave.cmpEl);
             iconEl.removeClass(this.btnSaveCls);
             iconEl.addClass('btn-synch');
 
@@ -1815,7 +1823,7 @@ define([
 
         synchronizeChanges: function() {
             if (this.btnSave.rendered) {
-                var iconEl = $('.btn-icon', this.btnSave.cmpEl);
+                var iconEl = $('.icon', this.btnSave.cmpEl);
 
                 if (iconEl.hasClass('btn-synch')) {
                     iconEl.removeClass('btn-synch');
@@ -1841,7 +1849,7 @@ define([
             if (cls !== this.btnSaveCls && this.btnSave.rendered) {
                 this.btnSaveTip = ((length>1) ? this.tipSaveCoauth : this.tipSave )+ Common.Utils.String.platformKey('Ctrl+S');
 
-                var iconEl = $('.btn-icon', this.btnSave.cmpEl);
+                var iconEl = $('.icon', this.btnSave.cmpEl);
                 if (!iconEl.hasClass('btn-synch')) {
                     iconEl.removeClass(this.btnSaveCls);
                     iconEl.addClass(cls);