[DE] Set display mode for review.

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

@@ -75,6 +75,7 @@ define([
                     'reviewchange:reject':      _.bind(this.onRejectClick, this),
                     'reviewchange:delete':      _.bind(this.onDeleteClick, this),
                     'reviewchange:preview':     _.bind(this.onBtnPreviewClick, this),
+                    'reviewchanges:view':       _.bind(this.onReviewViewClick, this),
                     'lang:document':            _.bind(this.onDocLanguage, this)
                 },
                 'Common.Views.ReviewChangesDialog': {
@@ -127,10 +128,10 @@ define([
             return this;
         },
 
-        SetDisabled: function() {
+        SetDisabled: function(state) {
             if (this.dlgChanges)
                 this.dlgChanges.close();
-            this.view && this.view.SetDisabled(true);
+            this.view && this.view.SetDisabled(state);
         },
 
         onApiShowChange: function (sdkchange) {
@@ -500,6 +501,38 @@ define([
             this.api.asc_setSpellCheck(state);
         },
 
+        onReviewViewClick: function(menu, item, e) {
+            if (this.api) {
+                if (item.value === 'final')
+                    this.api.asc_BeginViewModeInReview(true);
+                else if (item.value === 'original')
+                    this.api.asc_BeginViewModeInReview(false);
+                else
+                    this.api.asc_EndViewModeInReview();
+            }
+            this.disableEditing(item.value !== 'markup');
+            Common.NotificationCenter.trigger('edit:complete', this.view);
+        },
+
+        disableEditing: function(disable) {
+            var app = this.getApplication();
+            app.getController('RightMenu').getView('RightMenu').clearSelection();
+            app.getController('Toolbar').DisableToolbar(disable, false, true);
+            app.getController('RightMenu').SetDisabled(disable, false);
+            app.getController('Statusbar').getView('Statusbar').SetDisabled(disable);
+            // app.getController('DocumentHolder').getView('DocumentHolder').SetDisabled(disable);
+            app.getController('LeftMenu').leftMenu.btnComments.setDisabled(disable);
+
+            if (this.view) {
+                var group = this.view.$el.find('.move-changes');
+                group.css('position', disable ? 'relative' : 'initial');
+                disable && group.find('.toolbar-group-mask').css({
+                    left: 0, right: 0, top: 0, bottom: 0
+                });
+                this.view.$el.find('.no-group-mask').css('opacity', 1);
+            }
+        },
+
         createToolbarPanel: function() {
             return this.view.getPanel();
         },

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

@@ -423,6 +423,12 @@ define([
                 '<div class="separator long review"/>' +
                 '<div class="group">' +
                     '<span id="btn-review-on" class="btn-slot text x-huge"></span>' +
+                '</div>' +
+                '<div class="group no-group-mask" style="padding-left: 0;">' +
+                    '<span id="btn-review-view" class="btn-slot text x-huge"></span>' +
+                '</div>' +
+                '<div class="separator long review"/>' +
+                '<div class="group move-changes">' +
                     '<span id="btn-change-prev" class="btn-slot text x-huge"></span>' +
                     '<span id="btn-change-next" class="btn-slot text x-huge"></span>' +
                     '<span id="btn-change-accept" class="btn-slot text x-huge"></span>' +
@@ -468,6 +474,10 @@ define([
                     button.on('click', _click_turnpreview.bind(me));
                     Common.NotificationCenter.trigger('edit:complete', me);
                 });
+
+                this.btnReviewView.menu.on('item:click', function (menu, item, e) {
+                    me.fireEvent('reviewchanges:view', [menu, item]);
+                });
             }
 
             this.btnsSpelling.forEach(function(button) {
@@ -528,6 +538,13 @@ define([
                         enableToggle: true
                     });
                     this.btnsTurnReview = [this.btnTurnOn];
+
+                    this.btnReviewView = new Common.UI.Button({
+                        cls: 'btn-toolbar x-huge icon-top',
+                        iconCls: 'btn-ic-reviewview',
+                        caption: this.txtView,
+                        menu: true
+                    });
                 }
 
                 this.btnSetSpelling = new Common.UI.Button({
@@ -597,6 +614,35 @@ define([
                         );
                         me.btnReject.updateHint([me.txtRejectCurrent, me.txtRejectChanges]);
 
+                        me.btnReviewView.setMenu(
+                            new Common.UI.Menu({
+                                cls: 'ppm-toolbar',
+                                items: [
+                                    {
+                                        caption: me.txtMarkup,
+                                        checkable: true,
+                                        toggleGroup: 'menuReviewView',
+                                        checked: true,
+                                        value: 'markup'
+                                    },
+                                    {
+                                        caption: me.txtFinal,
+                                        checkable: true,
+                                        toggleGroup: 'menuReviewView',
+                                        checked: false,
+                                        value: 'final'
+                                    },
+                                    {
+                                        caption: me.txtOriginal,
+                                        checkable: true,
+                                        toggleGroup: 'menuReviewView',
+                                        checked: false,
+                                        value: 'original'
+                                    }
+                                ]
+                            }));
+                        me.btnReviewView.updateHint(me.tipReviewView);
+
                         me.btnAccept.setDisabled(config.isReviewOnly);
                         me.btnReject.setDisabled(config.isReviewOnly);
                     } else {
@@ -627,6 +673,7 @@ define([
                     this.btnAccept.render(this.$el.find('#btn-change-accept'));
                     this.btnReject.render(this.$el.find('#btn-change-reject'));
                     this.btnTurnOn.render(this.$el.find('#btn-review-on'));
+                    this.btnReviewView.render(this.$el.find('#btn-review-view'));
                 }
 
                 this.btnSetSpelling.render(this.$el.find('#slot-btn-spelling'));
@@ -739,7 +786,12 @@ define([
             tipSetSpelling: 'Spell checking',
             tipReview: 'Review',
             txtAcceptChanges: 'Accept Changes',
-            txtRejectChanges: 'Reject Changes'
+            txtRejectChanges: 'Reject Changes',
+            txtView: 'Set View',
+            txtMarkup: 'Markup',
+            txtFinal: 'Final',
+            txtOriginal: 'Original',
+            tipReviewView: 'Display for Review'
         }
     }()), Common.Views.ReviewChanges || {}));
 

apps/common/main/resources/less/toolbar.less

@@ -273,6 +273,7 @@
 .button-normal-icon(btn-addslide,         11, @toolbar-big-icon-size);
 .button-normal-icon(~'x-huge .btn-ic-docspell', 12, @toolbar-big-icon-size);
 .button-normal-icon(~'x-huge .btn-ic-review', 13, @toolbar-big-icon-size);
+.button-normal-icon(~'x-huge .btn-ic-reviewview', 13, @toolbar-big-icon-size);
 .button-normal-icon(review-save,          14, @toolbar-big-icon-size);
 .button-normal-icon(review-deny,          15, @toolbar-big-icon-size);
 .button-normal-icon(review-next,          16, @toolbar-big-icon-size);

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

@@ -2752,23 +2752,30 @@ define([
             this.editMode = false;
         },
 
-        DisableToolbar: function(disable, viewMode) {
+        DisableToolbar: function(disable, viewMode, reviewmode) {
             if (viewMode!==undefined) this.editMode = !viewMode;
             disable = disable || !this.editMode;
 
-            var mask = $('.toolbar-mask');
+            var toolbar_mask = $('.toolbar-mask'),
+                group_mask = $('.toolbar-group-mask'),
+                mask = reviewmode ? group_mask : toolbar_mask;
             if (disable && mask.length>0 || !disable && mask.length==0) return;
 
             var toolbar = this.toolbar;
-            toolbar.$el.find('.toolbar').toggleClass('masked', disable);
-            toolbar.btnHide.setDisabled(disable);
             if(disable) {
-                mask = $("<div class='toolbar-mask'>").appendTo(toolbar.$el.find('.toolbar'));
+                if (reviewmode) {
-                Common.util.Shortcuts.suspendEvents('alt+h');
+                    mask = $("<div class='toolbar-group-mask'>").appendTo(toolbar.$el.find('.toolbar section.panel .group:not(.no-mask):not(.no-group-mask)'));
+                } else
+                    mask = $("<div class='toolbar-mask'>").appendTo(toolbar.$el.find('.toolbar'));
             } else {
                 mask.remove();
-                Common.util.Shortcuts.resumeEvents('alt+h');
             }
+            $('.no-group-mask').css('opacity', (reviewmode || !disable) ? 1 : 0.4);
+
+            disable = disable || (reviewmode ? toolbar_mask.length>0 : group_mask.length>0);
+            toolbar.$el.find('.toolbar').toggleClass('masked', disable);
+            toolbar.btnHide.setDisabled(disable);
+            disable ? Common.util.Shortcuts.suspendEvents('alt+h') : Common.util.Shortcuts.resumeEvents('alt+h');
 
             if ( toolbar.synchTooltip )
                 toolbar.synchTooltip.hide();

apps/documenteditor/main/locale/en.json

@@ -211,6 +211,11 @@
   "Common.Views.ReviewChanges.txtRejectCurrent": "Reject Current Change",
   "Common.Views.ReviewChanges.txtSpelling": "Spell checking",
   "Common.Views.ReviewChanges.txtTurnon": "Track Changes",
+  "Common.Views.ReviewChanges.txtView": "Set View",
+  "Common.Views.ReviewChanges.txtMarkup": "Markup",
+  "Common.Views.ReviewChanges.txtFinal": "Final",
+  "Common.Views.ReviewChanges.txtOriginal": "Original",
+  "Common.Views.ReviewChanges.tipReviewView": "Display for Review",
   "Common.Views.ReviewChangesDialog.textTitle": "Review Changes",
   "Common.Views.ReviewChangesDialog.txtAccept": "Accept",
   "Common.Views.ReviewChangesDialog.txtAcceptAll": "Accept All Changes",

apps/documenteditor/main/resources/less/toolbar.less

@@ -41,6 +41,17 @@
     z-index: @zindex-tooltip + 1;
 }
 
+.toolbar-group-mask {
+    position: absolute;
+    top: 32px;
+    left: 48px;
+    right: 45px;
+    bottom: 0;
+    opacity: 0;
+    background-color: @gray-light;
+    z-index: @zindex-tooltip + 1;
+}
+
 .item-markerlist {
     .background-ximage('@{app-image-path}/toolbar/bullets-and-numbering.png', '@{app-image-path}/toolbar/bullets-and-numbering@2x.png', 38px);
     width: 38px;