Merge branch 'feature/desktop-title-buttons' into develop

apps/common/main/lib/component/Button.js

@@ -575,6 +575,13 @@ define([
                 this.trigger('toggle', this, state);
         },
 
+        click: function(opts) {
+            if ( !this.disabled ) {
+                this.doToggle();
+                this.trigger('click', this, opts);
+            }
+        },
+
         isActive: function() {
             if (this.enableToggle)
                 return this.pressed;
@@ -643,6 +650,24 @@ define([
             btnIconEl.addClass(cls || '');
         },
 
+        changeIcon: function(opts) {
+            var me = this;
+            if ( opts && (opts.curr || opts.next)) {
+                !!opts.curr && (me.$icon.removeClass(opts.curr));
+                !!opts.next && !me.$icon.hasClass(opts.next) && (me.$icon.addClass(opts.next));
+
+                if ( !!me.options.signals ) {
+                    if ( !(me.options.signals.indexOf('icon:changed') < 0) ) {
+                        me.trigger('icon:changed', me, opts);
+                    }
+                }
+            }
+        },
+
+        hasIcon: function(iconcls) {
+            return this.$icon.hasClass(iconcls);
+        },
+
         setVisible: function(visible) {
             if (this.cmpEl) this.cmpEl.toggleClass('hidden', !visible);
             this.visible = visible;

apps/common/main/lib/controller/Desktop.js

@@ -42,8 +42,15 @@ define([
     'use strict';
 
     var Desktop = function () {
-        var config = {};
+        var config = {version:'{{PRODUCT_VERSION}}'};
-        var app = window.AscDesktopEditor;
+        var app = window.AscDesktopEditor,
+            webapp = window.DE || window.PE || window.SSE;
+        var titlebuttons;
+        var btnsave_icons = {
+            'btn-save': 'save',
+            'btn-save-coauth': 'coauth',
+            'btn-synch': 'synch' };
+
 
         if ( !!app ) {
             window.on_native_message = function (cmd, param) {
@@ -83,15 +90,80 @@ define([
                     }
                 } else
                 if (/editor:config/.test(cmd)) {
-                    if ( param == 'request' )
+                    if ( param == 'request' ) {
-                        app.execCommand('editor:config', JSON.stringify({user: config.user, 'extraleft': $('#box-document-title #slot-btn-dt-save').parent().width()}));
+                        if ( !!titlebuttons ) {
+                            var opts = {
+                                user: config.user,
+                                title: { buttons: [] }
+                            };
+
+                            var header = webapp.getController('Viewport').getView('Common.Views.Header');
+                            if ( header ) {
+                                for (var i in titlebuttons) {
+                                    opts.title.buttons.push(_serializeHeaderButton(i, titlebuttons[i]));
+                                }
+                            }
+
+                            app.execCommand('editor:config', JSON.stringify(opts));
+                        } else
+                        if ( !config.callback_editorconfig ) {
+                            config.callback_editorconfig = function() {
+                                setTimeout(function(){window.on_native_message(cmd, param);},0);
+                            }
+                        }
+                    }
+                } else
+                if (/button:click/.test(cmd)) {
+                    var obj = JSON.parse(param);
+                    if ( !!obj.action ) {
+                        titlebuttons[obj.action].btn.click();
+                    }
                 }
             };
 
-            app.execCommand('webapps:events', 'loading');
+            if ( !!window.native_message_cmd ) {
-            app.execCommand('window:features', 'request');
+                for ( var c in window.native_message_cmd ) {
+                    window.on_native_message(c, window.native_message_cmd[c]);
+                }
+            }
+
+            // app.execCommand('window:features', {version: config.version, action: 'request'});
+            app.execCommand('webapps:features', {version: config.version, eventloading:true, titlebuttons:true});
         }
 
+        var _serializeHeaderButton = function(action, config) {
+            return {
+                action: action,
+                icon: config.icon || undefined,
+                hint: config.btn.options.hint,
+                disabled: config.disabled
+            };
+        };
+
+        var _onTitleButtonDisabled = function (action, e, status) {
+            titlebuttons[action].disabled = status;
+            var _buttons = {};
+            _buttons[action] = status;
+            app.execCommand('title:button', JSON.stringify({disabled: _buttons}));
+        };
+
+        var _onSaveIconChanged = function (e, opts) {
+            app.execCommand('title:button', JSON.stringify({'icon:changed': {'save': btnsave_icons[opts.next]}}));
+        };
+
+        var _onModalDialog = function (status) {
+            if ( status == 'open' ) {
+                app.execCommand('title:button', JSON.stringify({disabled: {'all':true}}));
+            } else {
+                var _buttons = {};
+                for (var i in titlebuttons) {
+                    _buttons[i] = titlebuttons[i].disabled;
+                }
+
+                app.execCommand('title:button', JSON.stringify({'disabled': _buttons}));
+            }
+        };
+
         return {
             init: function (opts) {
                 _.extend(config, opts);
@@ -112,6 +184,35 @@ define([
                         if ( config.canUndock ) {
                             Common.NotificationCenter.trigger('app:config', {canUndock: true});
                         }
+
+                        var header = webapp.getController('Viewport').getView('Common.Views.Header');
+                        titlebuttons = {
+                            'save': {btn: header.btnSave, disabled:false},
+                            'print': {btn: header.btnPrint, disabled:false},
+                            'undo': {btn: header.btnUndo, disabled:false},
+                            'redo': {btn: header.btnRedo,  disabled:false}
+                        };
+
+                        for (var i in titlebuttons) {
+                            titlebuttons[i].btn.options.signals = ['disabled'];
+                            titlebuttons[i].btn.on('disabled', _onTitleButtonDisabled.bind(this, i));
+                        }
+
+                        header.btnSave.options.signals.push('icon:changed');
+                        header.btnSave.on('icon:changed', _onSaveIconChanged.bind(this));
+
+                        var iconname = /\s?([^\s]+)$/.exec(titlebuttons.save.btn.$icon.attr('class'));
+                        !!iconname && iconname.length && (titlebuttons.save.icon = btnsave_icons[iconname]);
+
+                        if ( !!config.callback_editorconfig ) {
+                            config.callback_editorconfig();
+                            delete config.callback_editorconfig;
+                        }
+                    });
+
+                    Common.NotificationCenter.on({
+                        'modal:show': _onModalDialog.bind(this, 'open'),
+                        'modal:close': _onModalDialog.bind(this, 'close')
                     });
                 }
             },

apps/common/main/lib/view/Header.js

@@ -527,7 +527,7 @@ define([
                     me.btnRedo = createTitleButton('toolbar__icon icon--inverse btn-redo', $html.findById('#slot-btn-dt-redo'), true);
 
                     if ( me.btnSave.$icon.is('svg') ) {
-                        me.btnSave.$icon.addClass('icon-save');
+                        me.btnSave.$icon.addClass('icon-save btn-save');
                         var _create_use = function (extid, intid) {
                             var _use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
                             _use.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', extid);

apps/common/main/resources/img/header/buttons.svg

@@ -21,8 +21,8 @@
         <polygon points="14.243,7.585 11,10.829 11,4 9,4 9,10.827 5.758,7.585 4.344,9 10.001,14.656 15.657,9 "/>
     </symbol>
     <symbol id="svg-btn-print" viewBox="0 0 20 20">
-        <rect x="4" y="8" width="1" height="1" fill="#ffffff"/>
+        <rect x="4" y="8" width="1" height="1"/>
-        <path fill-rule="evenodd" clip-rule="evenodd" d="M14 4H6V6H14V4ZM5 4V6H3C2.44772 6 2 6.44772 2 7V12V13H3H5V15C5 15.5523 5.44772 16 6 16H14C14.5523 16 15 15.5523 15 15V13H17H18V12V7C18 6.44772 17.5523 6 17 6H15V4C15 3.44772 14.5523 3 14 3H6C5.44772 3 5 3.44772 5 4ZM15 12H17V7H14H6H3V12H5V11C5 10.4477 5.44772 10 6 10H14C14.5523 10 15 10.4477 15 11V12ZM6 11H14V15H6V11Z" fill="#ffffff"/>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M14 4H6V6H14V4ZM5 4V6H3C2.44772 6 2 6.44772 2 7V12V13H3H5V15C5 15.5523 5.44772 16 6 16H14C14.5523 16 15 15.5523 15 15V13H17H18V12V7C18 6.44772 17.5523 6 17 6H15V4C15 3.44772 14.5523 3 14 3H6C5.44772 3 5 3.44772 5 4ZM15 12H17V7H14H6H3V12H5V11C5 10.4477 5.44772 10 6 10H14C14.5523 10 15 10.4477 15 11V12ZM6 11H14V15H6V11Z"/>
     </symbol>
     <symbol id="svg-btn-edit" viewBox="0 0 20 20">
         <polygon points="11.738,7.891 6.434,13.195 5.02,14.859 4.5,17.5 7,17.5 8.555,15.566 13.859,10.137"/>	
@@ -30,9 +30,9 @@
 		c0.391,0.391,0.391,1.023,0,1.414L15.273,8.598z"/>
     </symbol>
     <symbol id="svg-btn-save" viewBox="0 0 20 20">
-        <path fill-rule="evenodd" clip-rule="evenodd" d="M15 15H4V4H6V7H12V4H12.5858L15 6.41421V15ZM11 4H10V6H11V4ZM4 3H13L16 6V15C16 15.5523 15.5523 16 15 16H4C3.44772 16 3 15.5523 3 15V4C3 3.44772 3.44772 3 4 3Z" fill="#ffffff"/>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M15 15H4V4H6V7H12V4H12.5858L15 6.41421V15ZM11 4H10V6H11V4ZM4 3H13L16 6V15C16 15.5523 15.5523 16 15 16H4C3.44772 16 3 15.5523 3 15V4C3 3.44772 3.44772 3 4 3Z"/>
-        <rect x="6" y="10" width="7" height="1" fill="#ffffff"/>
+        <rect x="6" y="10" width="7" height="1"/>
-        <rect x="6" y="12" width="7" height="1" fill="#ffffff"/>
+        <rect x="6" y="12" width="7" height="1"/>
     </symbol>
     <symbol id="svg-btn-save-coauth" viewBox="0 0 20 20">
         <rect x="6" y="10" width="3" height="1" fill="#ffffff"/>

apps/documenteditor/main/index.html.deploy

@@ -199,6 +199,13 @@
             logo = params["headerlogo"] ? encodeUrlParam(params["headerlogo"]) : null;
 
         window.frameEditorId = params["frameEditorId"];
+
+        if ( window.AscDesktopEditor ) {
+            window.on_native_message = function (cmd, param) {
+                !window.native_message_cmd && (window.native_message_cmd = []);
+                window.native_message_cmd[cmd] = param;
+            }
+        }
     </script>
 
     <link rel="stylesheet" type="text/css" href="../../../apps/documenteditor/main/resources/css/app.css">

apps/presentationeditor/main/index.html.deploy

@@ -236,6 +236,13 @@
             logo = params["headerlogo"] ? encodeUrlParam(params["headerlogo"]) : null;
 
         window.frameEditorId = params["frameEditorId"];
+
+        if ( window.AscDesktopEditor ) {
+            window.on_native_message = function (cmd, param) {
+                !window.native_message_cmd && (window.native_message_cmd = []);
+                window.native_message_cmd[cmd] = param;
+            }
+        }
     </script>
 
     <link rel="stylesheet" type="text/css" href="../../../apps/presentationeditor/main/resources/css/app.css">

apps/spreadsheeteditor/main/index.html.deploy

@@ -204,6 +204,13 @@
             logo = params["headerlogo"] ? encodeUrlParam(params["headerlogo"]) : null;
 
         window.frameEditorId = params["frameEditorId"];
+
+        if ( window.AscDesktopEditor ) {
+            window.on_native_message = function (cmd, param) {
+                !window.native_message_cmd && (window.native_message_cmd = []);
+                window.native_message_cmd[cmd] = param;
+            }
+        }
     </script>
 
     <link rel="stylesheet" type="text/css" href="../../../../sdkjs/cell/css/main.css"/>

build/Gruntfile.js

@@ -264,7 +264,7 @@ module.exports = function(grunt) {
                     src: ['<%= pkg.main.js.requirejs.options.out %>'],
                     overwrite: true,
                     replacements: [{
-                        from: /\{\{PRODUCT_VERSION\}\}/,
+                        from: /\{\{PRODUCT_VERSION\}\}/g,
                         to: packageFile.version
                     }]
                 },