Merge pull request #144 from ONLYOFFICE/feature/review-in-viewer

Feature/review in viewer
This commit is contained in:
Julia Radzhabova 2019-01-16 11:17:27 +03:00 committed by GitHub
commit f42585109b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 157 additions and 138 deletions

View file

@ -133,47 +133,8 @@ define([
};
var panel, resizer, stretch = false;
options.items.forEach(function(item) {
item.el instanceof HTMLElement && (item.el = $(item.el));
panel = _.extend(new LayoutPanel(), item);
if ( panel.stretch ) {
stretch = true;
panel.rely = false;
panel.resize = false;
}
this.panels.push(panel);
if (panel.resize) {
resizer = {
isresizer : true,
minpos : panel.resize.min||0,
maxpos : panel.resize.max||0,
fmin : panel.resize.fmin,
fmax : panel.resize.fmax,
behaviour : panel.behaviour,
index : this.splitters.length,
offset : panel.resize.offset || 0
};
if (!stretch) {
panel.resize.el =
resizer.el = panel.el.after('<div class="layout-resizer after"></div>').next();
this.panels.push(resizer);
} else {
panel.resize.el =
resizer.el = panel.el.before('<div class="layout-resizer before"></div>').prev();
this.panels.splice(this.panels.length - 1, 0, resizer);
}
this.splitters.push({resizer:resizer});
panel.resize.hidden && resizer.el.hide();
Common.Gateway.on('processmouse', this.resize.eventStop);
}
}, this);
this.freeze = options.freeze; this.freeze && this.freezePanels(this.freeze);
this.freeze = options.freeze;
this.changeLayout(options.items);
},
doLayout: function() {
@ -181,6 +142,10 @@ define([
changeLayout: function(items) {
var panel, resizer, stretch = false;
this.splitters && this.splitters.forEach(function(item) {
item.resizer && item.resizer.el.remove();
}, this);
this.splitters = [];
this.panels = [];
items.forEach(function(item) {
item.el instanceof HTMLElement && (item.el = $(item.el));
@ -221,6 +186,7 @@ define([
Common.Gateway.on('processmouse', this.resize.eventStop);
}
}, this);
this.freezePanels(this.freeze);
},
getElementHeight: function(el) {
@ -422,8 +388,10 @@ define([
},
setResizeValue: function (index, value) {
if (index >= this.splitters.length)
if (index >= this.splitters.length) {
this.doLayout();
return false;
}
var panel = null, next = null, oldValue = 0,
resize = this.splitters[index].resizer,
@ -472,16 +440,6 @@ define([
Common.UI.VBoxLayout.prototype = _.extend(new BaseLayout(), {
initialize: function(options){
BaseLayout.prototype.initialize.call(this,options);
this.panels.forEach(function(panel){
!panel.stretch && !panel.height && (panel.height = this.getElementHeight(panel.el));
if (panel.isresizer) {
panel.el.on('mousedown', {type: 'vertical', panel: panel}, _.bind(this.resizeStart, this));
}
}, this);
this.doLayout.call(this);
},
doLayout: function() {
@ -518,6 +476,18 @@ define([
height += style.height || this.getElementHeight(panel.el);
}
}, this);
},
changeLayout: function(items) {
BaseLayout.prototype.changeLayout.call(this, items);
this.panels.forEach(function(panel){
!panel.stretch && !panel.height && (panel.height = this.getElementHeight(panel.el));
if (panel.isresizer) {
panel.el.on('mousedown', {type: 'vertical', panel: panel}, _.bind(this.resizeStart, this));
}
}, this);
this.doLayout.call(this);
}
});
@ -529,16 +499,6 @@ define([
Common.UI.HBoxLayout.prototype = _.extend(new BaseLayout(), {
initialize: function(options){
BaseLayout.prototype.initialize.call(this,options);
this.panels.forEach(function(panel){
!panel.stretch && !panel.width && (panel.width = this.getElementWidth(panel.el));
if (panel.isresizer) {
panel.el.on('mousedown', {type: 'horizontal', panel: panel}, _.bind(this.resizeStart, this));
}
}, this);
this.doLayout.call(this);
},
doLayout: function(event) {
@ -581,6 +541,18 @@ define([
width += this.getElementWidth(panel.el);
}
},this);
},
changeLayout: function(items) {
BaseLayout.prototype.changeLayout.call(this, items);
this.panels.forEach(function(panel){
!panel.stretch && !panel.width && (panel.width = this.getElementWidth(panel.el));
if (panel.isresizer) {
panel.el.on('mousedown', {type: 'horizontal', panel: panel}, _.bind(this.resizeStart, this));
}
}, this);
this.doLayout.call(this);
}
});

View file

@ -74,7 +74,7 @@ define([
subEditStrings : {},
filter : undefined,
hintmode : false,
previewmode: false,
viewmode: false,
isSelectedComment : false,
uids : [],
oldUids : [],
@ -169,7 +169,7 @@ define([
this.currentUserName = data.config.user.fullname;
this.sdkViewName = data['sdkviewname'] || this.sdkViewName;
this.hintmode = data['hintmode'] || false;
this.previewmode = data['previewmode'] || false;
this.viewmode = data['viewmode'] || false;
}
},
setApi: function (api) {
@ -194,10 +194,8 @@ define([
setMode: function(mode) {
this.mode = mode;
this.isModeChanged = true; // change show-comment mode from/to hint mode using canComments flag
if (!this.mode.canComments) {
this.view.viewmode = !this.mode.canComments;
this.view.changeLayout(mode);
}
return this;
},
//
@ -283,8 +281,6 @@ define([
return false;
},
onShowComment: function (id, selected) {
if (this.previewmode) return;
var comment = this.findComment(id);
if (comment) {
if (null !== comment.get('quote')) {
@ -818,11 +814,9 @@ define([
}
},
onApiShowComment: function (uids, posX, posY, leftX, opts, hint) {
if (this.previewmode) return;
this.isModeChanged = false;
var same_uids = (0 === _.difference(this.uids, uids).length) && (0 === _.difference(uids, this.uids).length);
if (hint && this.isSelectedComment && same_uids) {
if (hint && this.isSelectedComment && same_uids && !this.isModeChanged) {
// хотим показать тот же коментарий что был и выбран
return;
}
@ -833,7 +827,7 @@ define([
if (popover) {
this.clearDummyComment();
if (this.isSelectedComment && same_uids) {
if (this.isSelectedComment && same_uids && !this.isModeChanged) {
//NOTE: click to sdk view ?
if (this.api) {
//this.view.txtComment.blur();
@ -905,6 +899,7 @@ define([
popover.setLeftTop(posX, posY, leftX);
popover.showComments(animate, false, true, text);
}
this.isModeChanged = false;
},
onApiHideComment: function (hint) {
var t = this;
@ -940,8 +935,6 @@ define([
}
},
onApiUpdateCommentPosition: function (uids, posX, posY, leftX) {
if (this.previewmode) return;
var i, useAnimation = false,
comment = null,
text = undefined,
@ -1480,9 +1473,16 @@ define([
},
setPreviewMode: function(mode) {
this.previewmode = mode;
if (this.viewmode === mode) return;
this.viewmode = mode;
if (mode)
this.prevcanComments = this.mode.canComments;
this.mode.canComments = (mode) ? false : this.prevcanComments;
this.closeEditing();
this.setMode(this.mode);
this.updateComments(true);
if (this.getPopover())
this.getPopover().hide();
this.getPopover().update(true);
}
}, Common.Controllers.Comments || {}));

View file

@ -115,7 +115,7 @@ define([
if (api) {
this.api = api;
if (this.appConfig.canReview) {
if (this.appConfig.canReview || this.appConfig.canViewReview) {
this.api.asc_registerCallback('asc_onShowRevisionsChange', _.bind(this.onApiShowChange, this));
this.api.asc_registerCallback('asc_onUpdateRevisionsChangesPosition', _.bind(this.onApiUpdateChangePosition, this));
}
@ -157,7 +157,7 @@ define([
this.getPopover().showReview(animate, lock, lockUser);
if (!this.appConfig.isReviewOnly && this._state.lock !== lock) {
if (this.appConfig.canReview && !this.appConfig.isReviewOnly && this._state.lock !== lock) {
this.view.btnAccept.setDisabled(lock==true);
this.view.btnReject.setDisabled(lock==true);
if (this.dlgChanges) {
@ -207,7 +207,7 @@ define([
},
getPopover: function () {
if (this.appConfig.canReview && _.isUndefined(this.popover)) {
if ((this.appConfig.canReview || this.appConfig.canViewReview) && _.isUndefined(this.popover)) {
this.popover = Common.Views.ReviewPopover.prototype.getPopover({
reviewStore : this.popoverChanges,
renderTo : this.sdkViewName
@ -408,7 +408,8 @@ define([
lockuser : item.get_LockUserId(),
type : item.get_Type(),
changedata : item,
scope : me.view
scope : me.view,
hint : !me.appConfig.canReview
});
arr.push(change);
@ -513,17 +514,22 @@ define([
},
onReviewViewClick: function(menu, item, e) {
this.turnDisplayMode(item.value);
!this.appConfig.canReview && Common.localStorage.setItem(this.view.appPrefix + "review-mode", item.value);
Common.NotificationCenter.trigger('edit:complete', this.view);
},
turnDisplayMode: function(mode) {
if (this.api) {
if (item.value === 'final')
if (mode === 'final')
this.api.asc_BeginViewModeInReview(true);
else if (item.value === 'original')
else if (mode === 'original')
this.api.asc_BeginViewModeInReview(false);
else
this.api.asc_EndViewModeInReview();
}
this.disableEditing(item.value !== 'markup');
this._state.previewMode = (item.value !== 'markup');
Common.NotificationCenter.trigger('edit:complete', this.view);
this.disableEditing(mode == 'final' || mode == 'original');
this._state.previewMode = (mode == 'final' || mode == 'original');
},
isPreviewChangesMode: function() {
@ -561,21 +567,22 @@ define([
disableEditing: function(disable) {
var app = this.getApplication();
app.getController('RightMenu').getView('RightMenu').clearSelection();
app.getController('Toolbar').DisableToolbar(disable, false, true);
app.getController('DocumentHolder').getView().SetDisabled(disable);
if (this.appConfig.canReview) {
app.getController('RightMenu').getView('RightMenu').clearSelection();
app.getController('RightMenu').SetDisabled(disable, false);
app.getController('Statusbar').getView('Statusbar').SetDisabled(disable);
app.getController('DocumentHolder').getView().SetDisabled(disable);
app.getController('Navigation') && app.getController('Navigation').SetDisabled(disable);
app.getController('Common.Controllers.Plugins').getView('Common.Views.Plugins').disableControls(disable);
}
var leftMenu = app.getController('LeftMenu').leftMenu;
leftMenu.btnComments.setDisabled(disable);
if (disable) leftMenu.close();
var comments = app.getController('Common.Controllers.Comments');
if (comments)
comments.setPreviewMode(disable);
var leftMenu = app.getController('LeftMenu').leftMenu;
leftMenu.getMenu('file').miProtect.setDisabled(disable);
if (this.view) {
@ -626,6 +633,9 @@ define([
me.dlgChanges.show(Math.max(10, offset.left + sdk.width() - 300), Math.max(10, offset.top + sdk.height() - 150));
}
});
} else if (config.canViewReview) {
config.canViewReview = me.api.asc_HaveRevisionsChanges(true); // check revisions from all users
config.canViewReview && me.turnDisplayMode(Common.localStorage.getItem(me.view.appPrefix + "review-mode") || 'original'); // load display mode only in viewer
}
if (me.view && me.view.btnChat) {

View file

@ -62,6 +62,7 @@ define([
lockuser : '',
type : 0,
changedata : null,
hint : false,
id : Common.UI.getId(), // internal
scope : null

View file

@ -10,7 +10,7 @@
<% if (quote!==null && quote!=='') { %>
<div class="user-quote"><%=scope.getFixedQuote(quote)%></div>
<% } %>
<% if (!editText || hint) { %>
<% if (!editText || scope.viewmode) { %>
<div class="user-message" data-can-copy="true"><%=scope.pickLink(comment)%></div>
<% } else { %>
<div class="inner-edit-ct">
@ -25,14 +25,14 @@
<% if (replys.length) { %>
<div class="reply-arrow img-commonctrl"></div>
<% _.each(replys, function (item, index) { %>
<div class="reply-item-ct" <% if (hint && index==replys.length-1) { %>style="padding-bottom: 0;" <% } %>;>
<div class="reply-item-ct" <% if (scope.viewmode && index==replys.length-1) { %>style="padding-bottom: 0;" <% } %>;>
<div class="user-name">
<div class="color" style="display: inline-block; background-color: <% if (item.get("usercolor")!==null) { %><%=item.get("usercolor")%><% } else { %> #cfcfcf <% } %>; " ></div><%= scope.getUserName(item.get("username")) %>
</div>
<div class="user-date"><%=item.get("date")%></div>
<% if (!item.get("editText")) { %>
<div class="user-message" data-can-copy="true"><%=scope.pickLink(item.get("reply"))%></div>
<% if (!hint) { %>
<% if (!scope.viewmode) { %>
<div class="btns-reply-ct">
<% if (item.get("editable")) { %>
<div class="btn-edit img-commonctrl" data-value="<%=item.get("id")%>"></div>
@ -53,7 +53,7 @@
<!-- add reply button -->
<% if (!showReply && !hint) { %>
<% if (!showReply && !scope.viewmode) { %>
<% if (replys.length) { %>
<label class="user-reply" style="margin-left: 20px; margin-top: 5px;" role="presentation" tabindex="-1">textAddReply</label>
<% } else { %>
@ -63,7 +63,7 @@
<!-- edit buttons -->
<% if (!editText && !lock && !hint) { %>
<% if (!editText && !lock && !scope.viewmode) { %>
<div class="edit-ct">
<% if (editable) { %>
<div class="btn-edit img-commonctrl"></div>

View file

@ -4,6 +4,7 @@
</div>
<div class="user-date"><%=date%></div>
<div class="user-message limit-height"><%=changetext%></div>
<% if (!hint) { %>
<div class="edit-ct">
<% if (scope.appConfig.isReviewOnly) { %>
<div class="btn-delete img-commonctrl"></div>
@ -12,4 +13,5 @@
<div class="btn-reject img-commonctrl"></div>
<% } %>
</div>
<% } %>
</div>

View file

@ -79,6 +79,7 @@ define([
addCommentHeight: 45,
newCommentHeight: 110,
textBoxAutoSizeLocked: undefined, // disable autosize textbox
viewmode: false,
initialize: function (options) {
Common.UI.BaseView.prototype.initialize.call(this, options);
@ -550,13 +551,38 @@ define([
},
changeLayout: function(mode) {
if (!mode.canComments) {
var add = $('.new-comment-ct', this.el),
var me = this,
add = $('.new-comment-ct', this.el),
to = $('.add-link-ct', this.el),
msgs = $('.messages-ct', this.el);
msgs.toggleClass('stretch', !mode.canComments);
if (!mode.canComments) {
add.hide(); to.hide();
msgs.addClass('stretch');
this.layout.changeLayout([{el: msgs[0], rely: false, stretch: true}]);
} else {
var container = $('#comments-box', this.el),
items = container.find(' > .layout-item');
to.show();
this.layout.changeLayout([{el: items[0], rely: true,
resize: {
hidden: false,
autohide: false,
fmin: (function () {
var height = container.height();
if (add.css('display') !== 'none') {
if (height * 0.5 < me.newCommentHeight)
return height - me.newCommentHeight;
}
return height * 0.5;
}),
fmax: (function () {
if (add.css('display') !== 'none')
return container.height() - me.newCommentHeight;
return container.height() - me.addCommentHeight;
})
}},
{el: items[1], stretch: true},
{el: items[2], stretch: true}]);
}
},

View file

@ -126,11 +126,11 @@ define([
this.btnsTurnReview.forEach(function (button) {
button.on('click', _click_turnpreview.bind(me));
});
}
if (this.appConfig.canViewReview)
this.btnReviewView.menu.on('item:click', function (menu, item, e) {
me.fireEvent('reviewchanges:view', [menu, item]);
});
}
this.btnsSpelling.forEach(function(button) {
button.on('click', function (b, e) {
@ -206,7 +206,8 @@ define([
enableToggle: true
});
this.btnsTurnReview = [this.btnTurnOn];
}
if (this.appConfig.canViewReview) {
this.btnReviewView = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'btn-ic-reviewview',
@ -223,7 +224,7 @@ define([
});
}
if (!this.appConfig.isOffline && this.appConfig.canCoAuthoring) {
if (this.appConfig.isEdit && !this.appConfig.isOffline && this.appConfig.canCoAuthoring) {
this.btnCoAuthMode = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'btn-ic-coedit',
@ -311,6 +312,10 @@ define([
);
me.btnReject.updateHint([me.tipRejectCurrent, me.txtRejectChanges]);
me.btnAccept.setDisabled(config.isReviewOnly);
me.btnReject.setDisabled(config.isReviewOnly);
}
if (me.appConfig.canViewReview) {
me.btnReviewView.setMenu(
new Common.UI.Menu({
cls: 'ppm-toolbar',
@ -345,11 +350,8 @@ define([
]
}));
me.btnReviewView.updateHint(me.tipReviewView);
me.btnAccept.setDisabled(config.isReviewOnly);
me.btnReject.setDisabled(config.isReviewOnly);
!me.appConfig.canReview && me.turnDisplayMode(Common.localStorage.getItem(me.appPrefix + "review-mode") || 'original');
}
me.btnSharing && me.btnSharing.updateHint(me.tipSharing);
me.btnHistory && me.btnHistory.updateHint(me.tipHistory);
me.btnChat && me.btnChat.updateHint(me.txtChat + Common.Utils.String.platformKey('Alt+Q'));
@ -392,7 +394,7 @@ define([
var separator_sharing = !(me.btnSharing || me.btnCoAuthMode) ? me.$el.find('.separator.sharing') : '.separator.sharing',
separator_comments = !(config.canComments && config.canCoAuthoring) ? me.$el.find('.separator.comments') : '.separator.comments',
separator_review = !config.canReview ? me.$el.find('.separator.review') : '.separator.review',
separator_review = !(config.canReview || config.canViewReview) ? me.$el.find('.separator.review') : '.separator.review',
separator_chat = !me.btnChat ? me.$el.find('.separator.chat') : '.separator.chat',
separator_last;
@ -419,7 +421,7 @@ define([
if (!me.btnHistory && separator_last)
me.$el.find(separator_last).hide();
Common.NotificationCenter.trigger('tab:visible', 'review', true);
Common.NotificationCenter.trigger('tab:visible', 'review', config.isEdit || config.canViewReview);
setEvents.call(me);
});
@ -434,8 +436,8 @@ 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.btnReviewView && this.btnReviewView.render(this.$el.find('#btn-review-view'));
this.btnSharing && this.btnSharing.render(this.$el.find('#slot-btn-sharing'));
this.btnCoAuthMode && this.btnCoAuthMode.render(this.$el.find('#slot-btn-coauthmode'));
@ -529,6 +531,14 @@ define([
this.btnChat && this.btnChat.toggle(state, true);
},
turnDisplayMode: function(mode) {
if (this.btnReviewView) {
this.btnReviewView.menu.items[0].setChecked(mode=='markup', true);
this.btnReviewView.menu.items[1].setChecked(mode=='final', true);
this.btnReviewView.menu.items[2].setChecked(mode=='original', true);
}
},
SetDisabled: function (state, langs) {
this.btnsSpelling && this.btnsSpelling.forEach(function(button) {
if ( button ) {

View file

@ -1109,6 +1109,7 @@ define([
(!this.appOptions.isReviewOnly || this.appOptions.canLicense); // if isReviewOnly==true -> canLicense must be true
this.appOptions.isEdit = this.appOptions.canLicense && this.appOptions.canEdit && this.editorConfig.mode !== 'view';
this.appOptions.canReview = this.permissions.review === true && this.appOptions.canLicense && this.appOptions.isEdit;
this.appOptions.canViewReview = true;
this.appOptions.canUseHistory = this.appOptions.canLicense && this.editorConfig.canUseHistory && this.appOptions.canCoAuthoring && !this.appOptions.isOffline;
this.appOptions.canHistoryClose = this.editorConfig.canHistoryClose;
this.appOptions.canHistoryRestore= this.editorConfig.canHistoryRestore && !!this.permissions.changeHistory;
@ -1214,21 +1215,19 @@ define([
this.contComments.setConfig({config: this.editorConfig}, this.api);
/** coauthoring end **/
if (this.appOptions.isEdit) {
var me = this,
application = this.getApplication(),
toolbarController = application.getController('Toolbar'),
rightmenuController = application.getController('RightMenu'),
fontsControllers = application.getController('Common.Controllers.Fonts'),
reviewController = application.getController('Common.Controllers.ReviewChanges');
reviewController.setMode(me.appOptions).setConfig({config: me.editorConfig}, me.api);
if (this.appOptions.isEdit) {
var toolbarController = application.getController('Toolbar'),
rightmenuController = application.getController('RightMenu'),
fontsControllers = application.getController('Common.Controllers.Fonts');
fontsControllers && fontsControllers.setApi(me.api);
toolbarController && toolbarController.setApi(me.api);
rightmenuController && rightmenuController.setApi(me.api);
reviewController.setMode(me.appOptions).setConfig({config: me.editorConfig}, me.api);
if (this.appOptions.canProtect)
application.getController('Common.Controllers.Protection').setMode(me.appOptions).setConfig({config: me.editorConfig}, me.api);

View file

@ -2718,7 +2718,7 @@ define([
toolbar._state.previewmode = reviewmode && disable;
if (reviewmode) {
toolbar._state.previewmode && toolbar.btnSave.setDisabled(true);
toolbar._state.previewmode && toolbar.btnSave && toolbar.btnSave.setDisabled(true);
if (toolbar.needShowSynchTip) {
toolbar.needShowSynchTip = false;
@ -2768,15 +2768,14 @@ define([
me.toolbar.render(_.extend({isCompactView: compactview}, config));
if ( config.isEdit ) {
me.toolbar.setMode(config);
var tab = {action: 'review', caption: me.toolbar.textTabCollaboration};
var $panel = this.getApplication().getController('Common.Controllers.ReviewChanges').createToolbarPanel();
if ( $panel )
me.toolbar.addTab(tab, $panel, 4);
if ( config.isEdit ) {
me.toolbar.setMode(config);
me.toolbar.btnSave.on('disabled', _.bind(me.onBtnChangeState, me, 'save:disabled'));
// hide 'print' and 'save' buttons group and next separator

View file

@ -390,8 +390,8 @@ define([
DE.getController('DocumentHolder').getView().SetDisabled(disable, true);
DE.getController('Navigation') && DE.getController('Navigation').SetDisabled(disable);
var leftMenu = DE.getController('LeftMenu').leftMenu;
leftMenu.btnComments.setDisabled(disable);
// var leftMenu = DE.getController('LeftMenu').leftMenu;
// leftMenu.btnComments.setDisabled(disable);
var comments = DE.getController('Common.Controllers.Comments');
if (comments)
comments.setPreviewMode(disable);

View file

@ -343,8 +343,8 @@ define([
PE.getController('Common.Controllers.ReviewChanges').SetDisabled(disable);
PE.getController('DocumentHolder').getView('DocumentHolder').SetDisabled(disable);
var leftMenu = PE.getController('LeftMenu').leftMenu;
leftMenu.btnComments.setDisabled(disable);
// var leftMenu = PE.getController('LeftMenu').leftMenu;
// leftMenu.btnComments.setDisabled(disable);
var comments = PE.getController('Common.Controllers.Comments');
if (comments)
comments.setPreviewMode(disable);

View file

@ -389,8 +389,8 @@ define([
SSE.getController('Common.Controllers.ReviewChanges').SetDisabled(disable);
SSE.getController('DocumentHolder').SetDisabled(disable, true);
var leftMenu = SSE.getController('LeftMenu').leftMenu;
leftMenu.btnComments.setDisabled(disable);
// var leftMenu = SSE.getController('LeftMenu').leftMenu;
// leftMenu.btnComments.setDisabled(disable);
var comments = SSE.getController('Common.Controllers.Comments');
if (comments)
comments.setPreviewMode(disable);