From ba2800c14e0cb4a35c1f25afad8b3680421b2645 Mon Sep 17 00:00:00 2001 From: Maxim Kadushkin Date: Mon, 27 Feb 2017 15:04:18 +0300 Subject: [PATCH] [DE] 'Review' controls moved to the toolbar --- .../main/lib/controller/ReviewChanges.js | 47 +++--- apps/common/main/lib/view/ReviewChanges.js | 137 ++++++++++-------- .../main/resources/less/review-changes.less | 100 ++++++------- .../main/app/controller/Main.js | 2 + .../main/app/template/Toolbar.template | 1 - .../main/app/template/Viewport.template | 1 - 6 files changed, 152 insertions(+), 136 deletions(-) diff --git a/apps/common/main/lib/controller/ReviewChanges.js b/apps/common/main/lib/controller/ReviewChanges.js index d837386e6..e0f392902 100644 --- a/apps/common/main/lib/controller/ReviewChanges.js +++ b/apps/common/main/lib/controller/ReviewChanges.js @@ -69,7 +69,8 @@ define([ // comments handlers 'reviewchange:accept': _.bind(this.onAcceptClick, this), 'reviewchange:reject': _.bind(this.onRejectClick, this), - 'reviewchange:delete': _.bind(this.onDeleteClick, this) + 'reviewchange:delete': _.bind(this.onDeleteClick, this), + 'reviewchange:preview': _.bind(this.onBtnPreviewClick, this) } }); }, @@ -78,21 +79,6 @@ define([ this.popoverChanges = new Common.Collections.ReviewChanges(); this.userCollection = this.getApplication().getCollection('Common.Collections.Users'); - this.view = this.createView('Common.Views.ReviewChanges', { - store : this.collection, - popoverChanges : this.popoverChanges - }); - this.view.render(); - this.bindViewEvents(this.view, this.events); - - var me = this; - this.view.btnPrev.on('click', _.bind(this.onBtnPreviewClick, this)); - this.view.btnNext.on('click', _.bind(this.onBtnPreviewClick, this)); - this.view.btnAccept.on('click', _.bind(this.onAcceptClick, this)); - this.view.btnAccept.menu.on('item:click', _.bind(this.onAcceptClick, this)); - this.view.btnReject.on('click', _.bind(this.onRejectClick, this)); - this.view.btnReject.menu.on('item:click', _.bind(this.onRejectClick, this)); - this._state = {posx: -1000, posy: -1000, popoverVisible: false}; }, setConfig: function (data, api) { @@ -112,9 +98,23 @@ define([ }, setMode: function(mode) { - this.view.isReviewOnly = mode.isReviewOnly; - this.view.btnAccept.setDisabled(mode.isReviewOnly); - this.view.btnReject.setDisabled(mode.isReviewOnly); + if ( mode.canReview || mode.isReviewOnly ) { + this.view = this.createView('Common.Views.ReviewChanges', { + store : this.collection, + popoverChanges : this.popoverChanges + }); + + var tab = {action: 'review', caption: 'Review'}; + var $panel = this.view.getPanel(); + + var toolbar = this.getApplication().getController('Toolbar').getView('Toolbar'); + toolbar.addTab(tab, $panel, 'layout'); + + this.view.isReviewOnly = mode.isReviewOnly; + this.view.btnAccept.setDisabled(mode.isReviewOnly); + this.view.btnReject.setDisabled(mode.isReviewOnly); + } + return this; }, @@ -413,13 +413,10 @@ define([ onBtnPreviewClick: function(btn, eOpts){ switch (btn.options.value) { - case 1: - this.api.asc_GetPrevRevisionsChange(); - break; - case 2: - this.api.asc_GetNextRevisionsChange(); - break; + case 1: this.api.asc_GetPrevRevisionsChange(); break; + case 2: this.api.asc_GetNextRevisionsChange(); break; } + Common.NotificationCenter.trigger('edit:complete', this.view); }, diff --git a/apps/common/main/lib/view/ReviewChanges.js b/apps/common/main/lib/view/ReviewChanges.js index c0cd245a4..a066366ea 100644 --- a/apps/common/main/lib/view/ReviewChanges.js +++ b/apps/common/main/lib/view/ReviewChanges.js @@ -410,6 +410,50 @@ define([ }); Common.Views.ReviewChanges = Common.UI.BaseView.extend(_.extend((function(){ + var template = + '
' + + '
' + + '' + + '
' + + '
' + + '
' + + '' + + '' + + '
' + + '
' + + '
' + + '' + + '' + + '
' + + '
'; + + function setEvents() { + var me = this; + this.btnPrev.on('click', function (e) { + me.fireEvent('reviewchange:preview', [me.btnPrev]); + }); + + this.btnNext.on('click', function (e) { + me.fireEvent('reviewchange:preview', [me.btnNext]); + }); + + this.btnAccept.on('click', function (e) { + me.fireEvent('reviewchange:accept', [me.btnAccept, 'current']); + }); + + this.btnAccept.menu.on('item:click', function (menu, item, e) { + me.fireEvent('reviewchange:accept', [menu, item]); + }); + + this.btnReject.on('click', function (e) { + me.fireEvent('reviewchange:reject', [me.btnReject, 'current']); + }); + + this.btnReject.menu.on('item:click', function (menu, item, e) { + me.fireEvent('reviewchange:reject', [menu, item]); + }); + } + return { el: '#review-changes-panel', @@ -418,59 +462,26 @@ define([ initialize: function (options) { Common.UI.BaseView.prototype.initialize.call(this, options); - this.template = [ - '
', - '
', - '
', - '
', - '
', - '
', - '
', - '
', - '
', - '
', - '
', - '
', - '
' - ].join(''); - this.store = this.options.store; this.popoverChanges = this.options.popoverChanges; - }, - - render: function () { - var el = $(this.el), - me = this; - el.addClass('review-changes'); - el.html(_.template(this.template, { - scope: this - })); this.btnPrev = new Common.UI.Button({ cls: 'btn-toolbar', iconCls: 'img-commonctrl review-prev', - value: 1, - hint: this.txtPrev, - hintAnchor: 'top' + value: 1 }); - this.btnPrev.render($('#id-review-button-prev')); this.btnNext = new Common.UI.Button({ cls: 'btn-toolbar', iconCls: 'img-commonctrl review-next', - value: 2, - hint: this.txtNext, - hintAnchor: 'top' + value: 2 }); - this.btnNext.render($('#id-review-button-next')); this.btnAccept = new Common.UI.Button({ cls: 'btn-toolbar', caption: this.txtAccept, split: true, menu: new Common.UI.Menu({ - menuAlign: 'bl-tl', - style: 'margin-top:-5px;', items: [ this.mnuAcceptCurrent = new Common.UI.MenuItem({ caption: this.txtAcceptCurrent, @@ -483,15 +494,12 @@ define([ ] }) }); - this.btnAccept.render($('#id-review-button-accept')); this.btnReject = new Common.UI.Button({ cls: 'btn-toolbar', caption: this.txtReject, split: true, menu: new Common.UI.Menu({ - menuAlign: 'bl-tl', - style: 'margin-top:-5px;', items: [ this.mnuRejectCurrent = new Common.UI.MenuItem({ caption: this.txtRejectCurrent, @@ -504,25 +512,42 @@ define([ ] }) }); - this.btnReject.render($('#id-review-button-reject')); - this.btnClose = new Common.UI.Button({ + this.btnTurnOn = new Common.UI.Button({ cls: 'btn-toolbar', - iconCls: 'img-commonctrl review-close', - hint: this.txtClose, - hintAnchor: 'top' + iconCls: 'img-commonctrl review-close' + // hint: this.txtClose, }); - this.btnClose.render($('#id-review-button-close')); - this.btnClose.on('click', _.bind(this.onClose, this)); - this.boxSdk = $('#editor_sdk'); - - Common.NotificationCenter.on('layout:changed', _.bind(this.onLayoutChanged, this)); + var me = this; + (new Promise(function (resolve) { + Common.NotificationCenter.on('app:ready', function () { resolve(); }); + })).then(function(){ + me.btnPrev.updateHint(me.txtPrev); + me.btnNext.updateHint(me.txtNext); + me.btnTurnOn.updateHint(me.textChangesOn); + setEvents.call(me); + } + ); }, - onClose: function (event) { - this.hide(); - this.fireEvent('hide', this); + render: function (el) { + this.boxSdk = $('#editor_sdk'); + if ( el ) el.html( this.getPanel() ); + + return this; + }, + + getPanel: function () { + var _html = $(_.template( template, {} )); + + this.btnPrev.render(_html.find('#btn-change-prev')); + this.btnNext.render(_html.find('#btn-change-next')); + this.btnAccept.render(_html.find('#btn-change-accept')); + this.btnReject.render(_html.find('#btn-change-reject')); + this.btnTurnOn.render(_html.find('#btn-review-on')); + + return _html; }, show: function () { @@ -530,12 +555,6 @@ define([ this.fireEvent('show', this); }, - onLayoutChanged: function (area) { - if (area == 'rightmenu' && this.boxSdk) { - this.$el.css('right', ($('body').width() - this.boxSdk.offset().left - this.boxSdk.width() + 15) + 'px'); - } - }, - getPopover: function (sdkViewName) { if (_.isUndefined(this.popover)) { this.popover = new Common.Views.ReviewChangesPopover({ @@ -554,13 +573,13 @@ define([ txtPrev: 'To previous change', txtNext: 'To next change', + textChangesOn: 'Preview changes', txtAccept: 'Accept', txtAcceptCurrent: 'Accept current Changes', txtAcceptAll: 'Accept all Changes', txtReject: 'Reject', txtRejectCurrent: 'Reject current Changes', - txtRejectAll: 'Reject all Changes', - txtClose: 'Close' + txtRejectAll: 'Reject all Changes' } }()), Common.Views.ReviewChanges || {})) }); \ No newline at end of file diff --git a/apps/common/main/resources/less/review-changes.less b/apps/common/main/resources/less/review-changes.less index f4f5da96c..7ae93bc1d 100644 --- a/apps/common/main/resources/less/review-changes.less +++ b/apps/common/main/resources/less/review-changes.less @@ -1,55 +1,55 @@ .review-changes { - position: absolute; - bottom: -1px; - right: 55px; - background: @gray-light; - border: 1px solid @gray-dark; - height: 35px; - z-index: @zindex-dropdown - 1; + //position: absolute; + //bottom: -1px; + //right: 55px; + //background: @gray-light; + //border: 1px solid @gray-dark; + //height: 35px; + //z-index: @zindex-dropdown - 1; + // + //.review-group { + // display: inline-block; + // vertical-align: middle; + // padding: 6px 0px 6px 10px; + // + // & > div, & > label { + // margin-right: 10px; + // display: inline-block; + // } + //} + // + //#id-review-label-total { + // font: bold 10px Helvetica, Arial, Verdana, sans-serif; + // color: @gray-darker; + // text-shadow: none; + // white-space: nowrap; + // cursor: pointer; + // vertical-align: middle; + //} + // + //#id-review-button-accept, + //#id-review-button-reject { + // span.caption { + // vertical-align: middle; + // font-size: 12px; + // margin: 0 6px; + // } + //} - .review-group { - display: inline-block; - vertical-align: middle; - padding: 6px 0px 6px 10px; + //.separator { + // margin: 0 !important; + // height: 19px; + //} +} - & > div, & > label { - margin-right: 10px; - display: inline-block; - } - } +.review-prev {background-position: -40px -250px;} +button.active > .review-prev, +button:active > .review-prev {background-position: -60px -250px !important;} - #id-review-label-total { - font: bold 10px Helvetica, Arial, Verdana, sans-serif; - color: @gray-darker; - text-shadow: none; - white-space: nowrap; - cursor: pointer; - vertical-align: middle; - } +.review-next {background-position: -40px -270px;} +button.active > .review-next, +button:active > .review-next {background-position: -60px -270px !important;} - #id-review-button-accept, - #id-review-button-reject { - span.caption { - vertical-align: middle; - font-size: 12px; - margin: 0 6px; - } - } - - .separator { - margin: 0 !important; - height: 19px; - } - - .review-prev {background-position: -40px -250px;} - button.active > .review-prev, - button:active > .review-prev {background-position: -60px -250px !important;} - - .review-next {background-position: -40px -270px;} - button.active > .review-next, - button:active > .review-next {background-position: -60px -270px !important;} - - .review-close {background-position: -40px -290px;} - button.active > .review-close, - button:active > .review-close {background-position: -60px -290px !important;} -} \ No newline at end of file +.review-close {background-position: -40px -290px;} +button.active > .review-close, +button:active > .review-close {background-position: -60px -290px !important;} diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index 2415f839c..81c6b89df 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -763,6 +763,8 @@ define([ if (this._isDocReady) return; + Common.NotificationCenter.trigger('app:ready'); + var me = this, value; diff --git a/apps/documenteditor/main/app/template/Toolbar.template b/apps/documenteditor/main/app/template/Toolbar.template index 5aa186500..f926a1efa 100644 --- a/apps/documenteditor/main/app/template/Toolbar.template +++ b/apps/documenteditor/main/app/template/Toolbar.template @@ -148,7 +148,6 @@
-
review panel
plugins panel
diff --git a/apps/documenteditor/main/app/template/Viewport.template b/apps/documenteditor/main/app/template/Viewport.template index fc155b3e8..6d545747d 100644 --- a/apps/documenteditor/main/app/template/Viewport.template +++ b/apps/documenteditor/main/app/template/Viewport.template @@ -10,7 +10,6 @@
-