Merge pull request #166 from ONLYOFFICE/feature/pr2-v5.3.0

Feature/pr2-v5.3.0

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

@@ -45,6 +45,53 @@ define([
         var config = {};
         var app = window.AscDesktopEditor;
 
+        if ( !!app ) {
+            window.on_native_message = function (cmd, param) {
+                if (/^style:change/.test(cmd)) {
+                    var obj = JSON.parse(param);
+
+                    if ( obj.element == 'toolbar' ) {
+                        if ( obj.action == 'off' && obj.style == 'native-color' ) {
+                            $('.toolbar').removeClass('editor-native-color');
+                        }
+                    } else
+                    if ( obj.element == 'body' ) {
+                        if ( obj.action == 'merge' ) {
+                            var style = document.createElement('style');
+                            style.innerHTML = obj.style;
+                            document.body.appendChild(style);
+                        }
+                    }
+                } else
+                if (/window:features/.test(cmd)) {
+                    var obj = JSON.parse(param);
+
+                    if ( obj.canUndock == 'true' ) {
+                        if ( !config.canUndock ) {
+                            config.canUndock = true;
+
+                            if ( !_.isEmpty(config) )
+                                Common.NotificationCenter.trigger('app:config', {canUndock:true});
+                        }
+                    }
+                } else
+                if (/window:status/.test(cmd)) {
+                    var obj = JSON.parse(param);
+
+                    if ( obj.action == 'undocking' ) {
+                        Common.NotificationCenter.trigger('undock:status', {status:obj.status=='undocked'?'undocked':'docked'});
+                    }
+                } else
+                if (/editor:config/.test(cmd)) {
+                    if ( param == 'request' )
+                        app.execCommand('editor:config', JSON.stringify({user: config.user, 'extraleft': $('#box-document-title #slot-btn-dt-save').parent().width()}));
+                }
+            };
+
+            app.execCommand('webapps:events', 'loading');
+            app.execCommand('window:features', 'request');
+        }
+
         return {
             init: function (opts) {
                 _.extend(config, opts);
@@ -57,25 +104,15 @@ define([
                         $('.toolbar').addClass('editor-native-color');
                     });
 
-                    if ( !!app ) {
+                    Common.NotificationCenter.on('action:undocking', function (opts) {
-                        if ( !config.isOffline ) {
+                        app.execCommand('editor:event', JSON.stringify({action:'undocking', state: opts == 'dock' ? 'dock' : 'undock'}));
-                            if ( config.customization.goback && config.customization.goback.url ) {
+                    });
-                                app.execCommand('webapps:config', JSON.stringify({'goback': config.customization.goback.url}));
+
-                            }
+                    Common.NotificationCenter.on('app:face', function (mode) {
+                        if ( config.canUndock ) {
+                            Common.NotificationCenter.trigger('app:config', {canUndock: true});
                         }
-
+                    });
-                        app.on_native_message = function (cmd, param) {
-                            if (/^style:change/.test(cmd)) {
-                                var obj = JSON.parse(param);
-
-                                if ( obj.element == 'toolbar' ) {
-                                    if ( obj.action == 'off' && obj.style == 'native-color' ) {
-                                        $('.toolbar').removeClass('editor-native-color');
-                                    }
-                                }
-                            }
-                        };
-                    }
                 }
             },
             process: function (opts) {
@@ -95,7 +132,7 @@ define([
             },
             requestClose: function () {
                 if ( config.isDesktopApp && !!app ) {
-                    app.execCommand('editor:request', JSON.stringify({action:'close', url: config.customization.goback.url}));
+                    app.execCommand('editor:event', JSON.stringify({action:'close', url: config.customization.goback.url}));
                 }
             }
         };

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

@@ -97,6 +97,7 @@ define([
                                 '</section>'+
                             '</div>' +
                             '<div class="hedset">' +
+                                '<div class="btn-slot" id="slot-btn-undock"></div>' +
                                 '<div class="btn-slot" id="slot-btn-back"></div>' +
                                 '<div class="btn-slot" id="slot-btn-options"></div>' +
                             '</div>' +
@@ -309,6 +310,24 @@ define([
                 me.btnOptions.updateHint(me.tipViewSettings);
         }
 
+        function onAppConfig(config) {
+            var me = this;
+            if ( config.canUndock ) {
+                me.btnUndock = new Common.UI.Button({
+                    cls: 'btn-header no-caret',
+                    iconCls: 'svgicon svg-btn-undock',
+                    hint: me.tipUndock,
+                    split: true
+                });
+
+                me.btnUndock.on('click', function (e) {
+                    Common.NotificationCenter.trigger('action:undocking', 'undock');
+                });
+
+                me.btnUndock.render($('#toolbar .box-tabs #slot-btn-undock'));
+            }
+        }
+
         function onDocNameKeyDown(e) {
             var me = this;
 
@@ -343,6 +362,13 @@ define([
             }
         }
 
+        function onAppUndocked(c) {
+            var me = this;
+            if ( me.btnUndock ) {
+                c.status == 'undocked' ? me.btnUndock.hide() : me.btnUndock.show();
+            }
+        }
+
         return {
             options: {
                 branding: {},
@@ -390,11 +416,11 @@ define([
 
                 me.mnuZoom = {options: {value: 100}};
 
-                Common.NotificationCenter.on('app:ready', function(mode) {
+                Common.NotificationCenter.on({
-                    Common.Utils.asyncCall(onAppReady, me, mode);
+                    'app:ready': function(mode) {Common.Utils.asyncCall(onAppReady, me, mode);},
-                });
+                    'app:face': function(mode) {Common.Utils.asyncCall(onAppShowed, me, mode);},
-                Common.NotificationCenter.on('app:face', function(mode) {
+                    'app:config' : function (c) {Common.Utils.asyncCall(onAppConfig, me, c);},
-                    Common.Utils.asyncCall(onAppShowed, me, mode);
+                    'undock:status': onAppUndocked.bind(this)
                 });
                 Common.NotificationCenter.on('collaboration:sharingdeny', onLostEditRights);
             },
@@ -700,6 +726,7 @@ define([
             tipSave: 'Save',
             tipUndo: 'Undo',
             tipRedo: 'Redo',
+            tipUndock: 'Undock',
             textCompactView: 'Hide Toolbar',
             textHideStatusBar: 'Hide Status Bar',
             textHideLines: 'Hide Rulers',

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

@@ -67,4 +67,10 @@
         <rect x="3" y="10" width="14" height="1"/>
         <rect x="3" y="14" width="14" height="1"/>
     </symbol>
+    <symbol id="svg-btn-undock" viewBox="0 0 20 20">
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M3 7H6V8V9H3V16H12V14H13V16C13 16.5523 12.5523 17 12 17H3C2.44772 17 2 16.5523 2 16V8C2 7.44769 2.44772 7 3 7Z"/>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M17 5H8L8 12H17V5ZM7 4C7 3.44772 7.44772 3 8 3H17C17.5523 3 18 3.44772 18 4V12C18 12.5523 17.5523 13 17 13H8C7.44771 13 7 12.5523 7 12V4Z"/>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M9.64645 10.6464L14.1464 6.14642L14.8536 6.85353L10.3536 11.3535L9.64645 10.6464Z"/>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M14 6H11V7H14L14 10H15V7V6H14Z"/>
+    </symbol>
 </svg>

apps/documenteditor/main/locale/en.json

@@ -167,6 +167,7 @@
   "Common.Views.Header.tipViewUsers": "View users and manage document access rights",
   "Common.Views.Header.txtAccessRights": "Change access rights",
   "Common.Views.Header.txtRename": "Rename",
+  "Common.Views.Header.tipUndock": "Undock into separate window",
   "Common.Views.History.textCloseHistory": "Close History",
   "Common.Views.History.textHide": "Collapse",
   "Common.Views.History.textHideAll": "Hide detailed changes",

apps/presentationeditor/main/locale/en.json

@@ -100,6 +100,7 @@
   "Common.Views.Header.tipViewUsers": "View users and manage document access rights",
   "Common.Views.Header.txtAccessRights": "Change access rights",
   "Common.Views.Header.txtRename": "Rename",
+  "Common.Views.Header.tipUndock": "Undock into separate window",
   "Common.Views.ImageFromUrlDialog.cancelButtonText": "Cancel",
   "Common.Views.ImageFromUrlDialog.okButtonText": "OK",
   "Common.Views.ImageFromUrlDialog.textUrl": "Paste an image URL:",

apps/spreadsheeteditor/main/locale/en.json

@@ -92,6 +92,7 @@
   "Common.Views.Header.tipUndo": "Undo",
   "Common.Views.Header.tipViewSettings": "View settings",
   "Common.Views.Header.tipViewUsers": "View users and manage document access rights",
+  "Common.Views.Header.tipUndock": "Undock into separate window",
   "Common.Views.Header.txtAccessRights": "Change access rights",
   "Common.Views.Header.txtRename": "Rename",
   "Common.Views.ImageFromUrlDialog.cancelButtonText": "Cancel",