Synchronize save buttons in the toolbar and left menu.

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

@@ -568,10 +568,15 @@ define([
 
                 if (this.api && !toolbarView._state.previewmode) {
                     var cansave = this.api.asc_isDocumentCanSave(),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    var isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch');
+                        isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                    if (toolbarView.btnSave.isDisabled() !== (!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        toolbarView.btnSave.setDisabled(!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (toolbarView.btnSave.isDisabled() !== isDisabled)
+                        toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
 
@@ -1395,9 +1400,14 @@ define([
 
                 if (toolbarView && !toolbarView._state.previewmode) {
                     var isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    if (toolbarView.btnSave.isDisabled() !== (!isModified && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !isModified && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        toolbarView.btnSave.setDisabled(!isModified && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (toolbarView.btnSave.isDisabled() !== isDisabled)
+                        toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
 
                 /** coauthoring begin **/
@@ -1413,9 +1423,14 @@ define([
 
                 if (toolbarView && this.api && !toolbarView._state.previewmode) {
                     var isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    if (toolbarView.btnSave.isDisabled() !== (!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        toolbarView.btnSave.setDisabled(!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (toolbarView.btnSave.isDisabled() !== isDisabled)
+                        toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
 

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

@@ -909,18 +909,23 @@ define([
         },
 
         onSave: function(e) {
+            var toolbar = this.toolbar;
             if (this.api) {
                 var isModified = this.api.asc_isDocumentCanSave();
-                var isSyncButton = $('.icon', this.toolbar.btnSave.cmpEl).hasClass('btn-synch');
+                var isSyncButton = $('.icon', toolbar.btnSave.cmpEl).hasClass('btn-synch');
-                if (!isModified && !isSyncButton && !this.toolbar.mode.forcesave)
+                if (!isModified && !isSyncButton && !toolbar.mode.forcesave)
                     return;
 
                 this.api.asc_Save();
             }
 
-            this.toolbar.btnSave.setDisabled(!this.toolbar.mode.forcesave);
+            toolbar.btnsSave.forEach(function(button) {
+                if ( button ) {
+                    button.setDisabled(!toolbar.mode.forcesave);
+                }
+            });
 
-            Common.NotificationCenter.trigger('edit:complete', this.toolbar);
+            Common.NotificationCenter.trigger('edit:complete', toolbar);
 
             Common.component.Analytics.trackEvent('Save');
             Common.component.Analytics.trackEvent('ToolBar', 'Save');
@@ -2780,7 +2785,12 @@ define([
 
             toolbar._state.previewmode = reviewmode && disable;
             if (reviewmode) {
-                toolbar._state.previewmode && toolbar.btnSave.setDisabled(toolbar._state.previewmode);
+                toolbar._state.previewmode && toolbar.btnsSave.forEach(function(button) {
+                    if ( button ) {
+                        button.setDisabled(true);
+                    }
+                });
+
                 if (toolbar.needShowSynchTip) {
                     toolbar.needShowSynchTip = false;
                     toolbar.onCollaborativeChanges();

apps/documenteditor/main/app/view/FileMenu.js

@@ -339,6 +339,11 @@ define([
             return !this.$el.is(':hidden');
         },
 
+        getButton: function(type) {
+            if (type == 'save')
+                return this.miSave;
+        },
+
         btnSaveCaption          : 'Save',
         btnDownloadCaption      : 'Download as...',
         btnInfoCaption          : 'Document Info...',

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

@@ -122,6 +122,7 @@ define([
                     iconCls: 'no-mask ' + this.btnSaveCls
                 });
                 this.toolbarControls.push(this.btnSave);
+                this.btnsSave = [this.btnSave];
 
                 this.btnUndo = new Common.UI.Button({
                     id: 'id-toolbar-btn-undo',
@@ -1993,6 +1994,13 @@ define([
                     maxRows: 8,
                     maxColumns: 10
                 });
+
+                var btnsave = DE.getController('LeftMenu').getView('LeftMenu').getMenu('file').getButton('save');
+                if (btnsave && this.btnsSave) {
+                    this.btnsSave.push(btnsave);
+                    this.toolbarControls.push(btnsave);
+                    btnsave.setDisabled(this.btnsSave[0].isDisabled());
+                }
             },
 
             onToolbarAfterRender: function(toolbar) {
@@ -2076,7 +2084,11 @@ define([
 
             setMode: function (mode) {
                 if (mode.isDisconnected) {
-                    this.btnSave.setDisabled(true);
+                    this.btnsSave.forEach(function(button) {
+                        if ( button ) {
+                            button.setDisabled(true);
+                        }
+                    });
                     this.btnCopy.setDisabled(true);
                     this.btnPaste.setDisabled(true);
                     this.btnUndo.setDisabled(true);
@@ -2218,7 +2230,11 @@ define([
                     this.btnSave.updateHint(this.tipSynchronize + Common.Utils.String.platformKey('Ctrl+S'));
                 }
 
-                this.btnSave.setDisabled(false);
+                this.btnsSave.forEach(function(button) {
+                    if ( button ) {
+                        button.setDisabled(false);
+                    }
+                });
                 Common.Gateway.collaborativeChanges();
             },
 
@@ -2240,7 +2256,8 @@ define([
 
             synchronizeChanges: function () {
                 if (!this._state.previewmode && this.btnSave.rendered) {
-                    var iconEl = $('.icon', this.btnSave.cmpEl);
+                    var iconEl = $('.icon', this.btnSave.cmpEl),
+                        me = this;
 
                     if (iconEl.hasClass('btn-synch')) {
                         iconEl.removeClass('btn-synch');
@@ -2248,7 +2265,11 @@ define([
                         if (this.synchTooltip)
                             this.synchTooltip.hide();
                         this.btnSave.updateHint(this.btnSaveTip);
-                        this.btnSave.setDisabled(!this.mode.forcesave);
+                        this.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(!me.mode.forcesave);
+                            }
+                        });
                         this._state.hasCollaborativeChanges = false;
                     }
                 }

apps/documenteditor/main/resources/less/filemenu.less

@@ -18,11 +18,11 @@
         height: 27px;
         margin-bottom: 3px;
 
-        &:hover {
+        &:hover:not(.disabled) {
           background-color: @secondary;
         }
 
-        &.active {
+        &.active:not(.disabled) {
           outline: 0;
           background-color: @primary;
 
@@ -30,6 +30,12 @@
             color: #fff;
           }
         }
+
+        &.disabled > a {
+          cursor: default;
+          color: @gray;
+        }
+
       }
 
       &.devider {

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

@@ -390,10 +390,15 @@ define([
                 application.getController('DocumentHolder').getView('DocumentHolder').focus();
                 if (this.api && this.api.asc_isDocumentCanSave) {
                     var cansave = this.api.asc_isDocumentCanSave(),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    var isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch');
+                        isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                    if (toolbarView.btnSave.isDisabled() !== (!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        toolbarView.btnSave.setDisabled(!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (toolbarView.btnSave.isDisabled() !== isDisabled)
+                        toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
 
@@ -1156,9 +1161,14 @@ define([
                 var toolbarView = this.getApplication().getController('Toolbar').getView('Toolbar');
                 if (toolbarView) {
                     var isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    if (toolbarView.btnSave.isDisabled() !== (!isModified && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !isModified && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        toolbarView.btnSave.setDisabled(!isModified && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (toolbarView.btnSave.isDisabled() !== isDisabled)
+                        toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
             onDocumentCanSaveChanged: function (isCanSave) {
@@ -1167,9 +1177,14 @@ define([
                     toolbarView = toolbarController.getView('Toolbar');
                 if (toolbarView) {
                     var isSyncButton = $('.icon', toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    if (toolbarView.btnSave.isDisabled() !== (!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        toolbarView.btnSave.setDisabled(!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (toolbarView.btnSave.isDisabled() !== isDisabled)
+                        toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
 

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

@@ -897,6 +897,7 @@ define([
         },
 
         onSave: function(e) {
+            var toolbar = this.toolbar;
             if (this.api && this.api.asc_isDocumentCanSave) {
                 var isModified = this.api.asc_isDocumentCanSave();
                 var isSyncButton = $('.icon', this.toolbar.btnSave.cmpEl).hasClass('btn-synch');
@@ -906,7 +907,11 @@ define([
                 this.api.asc_Save();
             }
 
-            this.toolbar.btnSave.setDisabled(!this.toolbar.mode.forcesave);
+            toolbar.btnsSave.forEach(function(button) {
+                if ( button ) {
+                    button.setDisabled(!toolbar.mode.forcesave);
+                }
+            });
 
             Common.NotificationCenter.trigger('edit:complete', this.toolbar);
             Common.component.Analytics.trackEvent('Save');

apps/presentationeditor/main/app/view/FileMenu.js

@@ -335,6 +335,11 @@ define([
             return !this.$el.is(':hidden');
         },
 
+        getButton: function(type) {
+            if (type == 'save')
+                return this.miSave;
+        },
+
         btnSaveCaption          : 'Save',
         btnDownloadCaption      : 'Download as...',
         btnInfoCaption          : 'Document Info...',

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

@@ -222,6 +222,7 @@ define([
                     iconCls     : 'no-mask ' + me.btnSaveCls,
                     lock        : [_set.lostConnect]
                 });
+                me.btnsSave = [me.btnSave];
 
                 me.btnUndo = new Common.UI.Button({
                     id          : 'id-toolbar-btn-undo',
@@ -1404,6 +1405,13 @@ define([
 //            // Enable none paragraph components
                 this.lockToolbar(PE.enumLock.disableOnStart, false, {array: this.slideOnlyControls.concat(this.shapeControls)});
 
+                var btnsave = PE.getController('LeftMenu').getView('LeftMenu').getMenu('file').getButton('save');
+                if (btnsave && this.btnsSave) {
+                    this.btnsSave.push(btnsave);
+                    this.lockControls.push(btnsave);
+                    btnsave.setDisabled(this.btnsSave[0].isDisabled());
+                }
+
                 /** coauthoring begin **/
                 this.showSynchTip = !Common.localStorage.getBool('pe-hide-synch');
                 this.needShowSynchTip = false;
@@ -1552,7 +1560,11 @@ define([
                     this.btnSave.updateHint(this.tipSynchronize + Common.Utils.String.platformKey('Ctrl+S'));
                 }
 
-                this.btnSave.setDisabled(false);
+                this.btnsSave.forEach(function(button) {
+                    if ( button ) {
+                        button.setDisabled(false);
+                    }
+                });
                 Common.Gateway.collaborativeChanges();
             },
 
@@ -1574,7 +1586,8 @@ define([
 
             synchronizeChanges: function () {
                 if (this.btnSave.rendered) {
-                    var iconEl = $('.icon', this.btnSave.cmpEl);
+                    var iconEl = $('.icon', this.btnSave.cmpEl),
+                        me = this;
 
                     if (iconEl.hasClass('btn-synch')) {
                         iconEl.removeClass('btn-synch');
@@ -1582,7 +1595,12 @@ define([
                         if (this.synchTooltip)
                             this.synchTooltip.hide();
                         this.btnSave.updateHint(this.btnSaveTip);
-                        this.btnSave.setDisabled(!this.mode.forcesave);
+                        this.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(!me.mode.forcesave);
+                            }
+                        });
+
                         this._state.hasCollaborativeChanges = false;
                     }
                 }

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

@@ -1314,19 +1314,29 @@ define([
 
                 if (this.toolbarView && this.toolbarView.btnSave && this.api) {
                     var isSyncButton = $('.icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    var cansave = this.api.asc_isDocumentCanSave();
+                        cansave = this.api.asc_isDocumentCanSave(),
-                    if (this.toolbarView.btnSave.isDisabled() !== (!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        isDisabled = !cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave;
-                        this.toolbarView.btnSave.setDisabled(!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);
+                    if (this.toolbarView.btnSave.isDisabled() !== isDisabled)
+                        this.toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
 
             onDocumentCanSaveChanged: function (isCanSave) {
                 if (this.toolbarView && this.toolbarView.btnSave) {
                     var isSyncButton = $('.icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
-                        forcesave = this.appOptions.forcesave;
+                        forcesave = this.appOptions.forcesave,
-                    if (this.toolbarView.btnSave.isDisabled() !== (!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
+                        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);
+                    if (this.toolbarView.btnSave.isDisabled() !== isDisabled)
+                        this.toolbarView.btnsSave.forEach(function(button) {
+                            if ( button ) {
+                                button.setDisabled(isDisabled);
+                            }
+                        });
                 }
             },
 

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

@@ -314,6 +314,11 @@ define([
             return !this.$el.is(':hidden');
         },
 
+        getButton: function(type) {
+            if (type == 'save')
+                return this.miSave;
+        },
+
         btnSaveCaption          : 'Save',
         btnDownloadCaption      : 'Download as...',
         btnInfoCaption          : 'Document Info...',

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

@@ -371,6 +371,7 @@ define([
                     cls         : 'btn-toolbar',
                     iconCls     : 'no-mask ' + me.btnSaveCls
                 });
+                me.btnsSave = [me.btnSave];
 
                 me.btnIncFontSize = new Common.UI.Button({
                     id          : 'id-toolbar-btn-incfont',
@@ -1672,6 +1673,12 @@ define([
                     itemTemplate: _.template('<div id="<%= id %>" class="item-chartlist <%= iconCls %>"></div>')
                 });
             }
+
+            var btnsave = SSE.getController('LeftMenu').getView('LeftMenu').getMenu('file').getButton('save');
+            if (btnsave && this.btnsSave) {
+                this.btnsSave.push(btnsave);
+                btnsave.setDisabled(this.btnsSave[0].isDisabled());
+            }
         },
 
         onToolbarAfterRender: function(toolbar) {
@@ -1714,7 +1721,9 @@ define([
             if (mode.isDisconnected) {
                 this.lockToolbar( SSE.enumLock.lostConnect, true );
                 this.lockToolbar( SSE.enumLock.lostConnect, true,
-                    {array:[this.btnEditChart,this.btnUndo,this.btnRedo,this.btnSave]} );
+                    {array:[this.btnEditChart,this.btnUndo,this.btnRedo]} );
+                this.lockToolbar( SSE.enumLock.lostConnect, true,
+                    {array:this.btnsSave} );
                 this.lockToolbar(SSE.enumLock.cantPrint, !mode.canPrint || mode.disableDownload, {array: [this.btnPrint]});
             } else {
                 this.mode = mode;
@@ -1806,7 +1815,11 @@ define([
                 this.btnSave.updateHint(this.tipSynchronize + Common.Utils.String.platformKey('Ctrl+S'));
             }
 
-            this.btnSave.setDisabled(false);
+            this.btnsSave.forEach(function(button) {
+                if ( button ) {
+                    button.setDisabled(false);
+                }
+            });
             Common.Gateway.collaborativeChanges();
         },
 
@@ -1828,7 +1841,8 @@ define([
 
         synchronizeChanges: function() {
             if (this.btnSave.rendered) {
-                var iconEl = $('.icon', this.btnSave.cmpEl);
+                var iconEl = $('.icon', this.btnSave.cmpEl),
+                    me = this;
 
                 if (iconEl.hasClass('btn-synch')) {
                     iconEl.removeClass('btn-synch');
@@ -1836,7 +1850,12 @@ define([
                     if (this.synchTooltip)
                         this.synchTooltip.hide();
                     this.btnSave.updateHint(this.btnSaveTip);
-                    this.btnSave.setDisabled(!this.mode.forcesave);
+                    this.btnsSave.forEach(function(button) {
+                        if ( button ) {
+                            button.setDisabled(!me.mode.forcesave);
+                        }
+                    });
+
                     this._state.hasCollaborativeChanges = false;
                 }
             }

apps/spreadsheeteditor/main/resources/less/leftmenu.less

@@ -98,11 +98,11 @@
                 height: 27px;
                 margin-bottom: 3px;
 
-                &:hover {
+                &:hover:not(.disabled) {
                     background-color: @secondary;
                 }
 
-                &.active {
+                &.active:not(.disabled) {
                     outline: 0;
                     background-color: @primary;
 
@@ -110,6 +110,11 @@
                         color: #fff;
                     }
                 }
+
+                &.disabled > a {
+                    cursor: default;
+                    color: @gray;
+                }
             }
 
             &.devider {