Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Added permanent reply textarea in comment popover

Browse source
This commit is contained in:
Alexei Koshelev 2022-10-29 02:55:40 +03:00
parent b111281778
commit 244ebd789d
7 changed files with 63 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
apps/common/main/lib/collection/Comments.js
View file

@ -58,8 +58,9 @@ define([
this.each(function(comment) {
comment.set('editText', false);
comment.set('editTextInPopover', false);
comment.set('showBtnsInPopover', false);
comment.set('showReply', false);
comment.set('showReplyInPopover', false);
comment.set('showReplyInPopover', true);
comment.set('hideAddReply', false);
});
},

8
apps/common/main/lib/controller/Comments.js
View file

@ -966,8 +966,14 @@ define([
if (!comment) continue;
if(comment.get('replys').some(function(reply){ return reply.get('editTextInPopover'); })){
comment.set('showReplyInPopover', false);
}
if (this.subEditStrings[saveTxtId] && !hint) {
comment.set('editTextInPopover', true);
comment.set('showReplyInPopover', false);
text = this.subEditStrings[saveTxtId];
}
else if (this.subEditStrings[saveTxtReplyId] && !hint) {
@ -1348,7 +1354,7 @@ define([
editText : false,
last : undefined,
editTextInPopover : (this.editPopover ? true : false),
showReplyInPopover : false,
showReplyInPopover : true,
hideAddReply : !_.isUndefined(this.hidereply) ? this.hidereply : (this.showPopover ? true : false),
scope : this.view,
editable : (this.mode.canEditComments || (data.asc_getUserId() == this.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getUserName()),

3
apps/common/main/lib/model/Comment.js
View file

@ -72,7 +72,8 @@ define([
id : Common.UI.getId(), // internal
time : 0,
showReply : false,
showReplyInPopover : false,
showReplyInPopover : true,
showBtnsInPopover : false,
editText : false,
editTextInPopover : false,
last : undefined,

26
apps/common/main/lib/template/CommentsPopover.template
View file

@ -59,14 +59,16 @@
<% }); %>
<% } %>
<!-- add reply button -->
<!-- reply -->
<% if (!showReplyInPopover && !hideAddReply && !hint && !scope.viewmode) { %>
<% if (replys.length && !add_arrow) { %>
<label class="user-reply" style="margin-left: 20px; margin-top: 5px;" role="presentation" tabindex="-1">textAddReply</label>
<% } else { %>
<label class="user-reply" role="presentation" tabindex="-1">textAddReply</label>
<% } %>
<% if (showReplyInPopover && !hideAddReply && !hint && !scope.viewmode) { %>
<div class="reply-ct">
<textarea class="msg-reply user-select" placeholder="textAddReply" maxlength="maxCommLength" spellcheck="false"></textarea>
<% if(true) { %>
<button class="btn normal dlg-btn primary btn-reply" id="id-comments-change-popover" style="display:none">textReply</button>
<button class="btn normal dlg-btn btn-close" style="display:none">textClose</button>
<% } %>
</div>
<% } %>
<!-- edit buttons -->
@ -89,16 +91,6 @@
</div>
<% } %>
<!-- reply -->
<% if (showReplyInPopover) { %>
<div class="reply-ct">
<textarea class="msg-reply user-select" placeholder="textAddReply" maxlength="maxCommLength" spellcheck="false"></textarea>
<button class="btn normal dlg-btn primary btn-reply" id="id-comments-change-popover">textReply</button>
<button class="btn normal dlg-btn btn-close">textClose</button>
</div>
<% } %>
<!-- locked user -->
<% if (lock) { %>

2
apps/common/main/lib/view/Comments.js
View file

@ -102,7 +102,7 @@ define([
var view = this,
textBox = $(this.el).find('textarea'),
domTextBox = null,
minHeight = 55,
minHeight = 21,
lineHeight = 0,
scrollPos = 0,
oldHeight = 0,

86
apps/common/main/lib/view/ReviewPopover.js
View file

@ -140,6 +140,10 @@ define([
body.css('position', 'relative');
}
me.$window.on('focus', 'textarea', function(e) { me.commentsView.onFocusTextarea(e.currentTarget) });
me.$window.on('blur', 'textarea', function(e) { me.commentsView.onBlurTextarea(e.currentTarget) });
var CommentsPopoverDataView = Common.UI.DataView.extend((function () {
var parentView = me;
@ -152,6 +156,19 @@ define([
template: _.template('<div class="dataview-ct inner" style="overflow-y: visible;"></div>')
},
onFocusTextarea: function(textarea) {
if($(textarea).parent().hasClass('reply-ct'))
me.$window.find('.reply-ct button').show();
},
onBlurTextarea: function(textarea) {
if($(textarea).parent().hasClass('reply-ct')){
setTimeout(() => {
me.$window.find('.reply-ct button').hide();
}, 120);
}
},
getTextBox: function () {
var text = $(this.el).find('textarea');
return (text && text.length) ? text : undefined;
@ -177,7 +194,7 @@ define([
var view = this,
textBox = this.$el.find('textarea'),
domTextBox = null,
minHeight = 55,
minHeight = 21,
lineHeight = 0,
scrollPos = 0,
oldHeight = 0,
@ -325,7 +342,8 @@ define([
}
if (btn.hasClass('btn-edit')) {
var tip = btn.data('bs.tooltip');
var tip = btn.data('bs.tooltip'),
isEdit = false;
if (tip) tip.dontShow = true;
if (!_.isUndefined(replyId)) {
@ -333,7 +351,19 @@ define([
me.fireEvent('comment:editReply', [commentId, replyId, true]);
this.replyId = replyId;
isEdit = true;
} else {
if (!showEditBox) {
me.fireEvent('comment:closeEditing');
record.set('editTextInPopover', true);
me.fireEvent('comment:show', [commentId]);
isEdit = true;
}
}
if(isEdit) {
record.set('showReplyInPopover', false);
this.autoHeightTextBox();
me.calculateSizeOfContent();
@ -346,26 +376,6 @@ define([
me.autoScrollToEditButtons();
this.setFocusToTextBox();
} else {
if (!showEditBox) {
me.fireEvent('comment:closeEditing');
record.set('editTextInPopover', true);
me.fireEvent('comment:show', [commentId]);
this.autoHeightTextBox();
me.calculateSizeOfContent();
me.setLeftTop(me.arrowPosX, me.arrowPosY, me.leftX);
me.calculateSizeOfContent();
readdresolves();
me.hookTextBox();
me.autoScrollToEditButtons();
this.setFocusToTextBox();
}
}
} else if (btn.hasClass('btn-delete')) {
var tip = btn.data('bs.tooltip');
@ -386,23 +396,8 @@ define([
readdresolves();
} else if (btn.hasClass('user-reply')) {
me.fireEvent('comment:closeEditing');
record.set('showReplyInPopover', true);
me.calculateSizeOfContent();
me.setLeftTop(me.arrowPosX, me.arrowPosY, me.leftX);
me.calculateSizeOfContent();
readdresolves();
this.autoHeightTextBox();
me.hookTextBox();
me.autoScrollToEditButtons();
this.setFocusToTextBox();
} else if (btn.hasClass('btn-reply', false)) {
if (showReplyBox) {
if (true) {
this.clearTextBoxBind();
me.fireEvent('comment:addReply', [commentId, this.getActiveTextBoxVal()]);
@ -412,10 +407,7 @@ define([
readdresolves();
}
} else if (btn.hasClass('btn-close', false)) {
me.fireEvent('comment:closeEditing', [commentId]);
me.calculateSizeOfContent();
me.fireEvent('comment:show', [commentId]);
me.hideComments();
readdresolves();
} else if (btn.hasClass('btn-inner-edit', false)) {
@ -447,9 +439,11 @@ define([
me.calculateSizeOfContent();
}
record.set('showReplyInPopover', true);
readdresolves();
} else if (btn.hasClass('btn-inner-close', false)) {
if (record.get('dummy')) {
me.clearDummyText();
me.hide();
@ -474,6 +468,7 @@ define([
me.setLeftTop(me.arrowPosX, me.arrowPosY, me.leftX);
me.calculateSizeOfContent();
record.set('showReplyInPopover', true);
readdresolves();
} else if (btn.hasClass('btn-resolve')) {
@ -506,7 +501,7 @@ define([
});
me.on({
'show': function () {
'show': function (picker, item, record, e) {
me.commentsView.autoHeightTextBox();
me.$window.find('textarea').keydown(function (event) {
if (event.keyCode == Common.UI.Keys.ESC) {
@ -516,8 +511,9 @@ define([
},
'animate:before': function () {
var text = me.$window.find('textarea');
if (text && text.length)
text.focus();
if (text && text.length && !$(text).parent().hasClass('reply-ct')){
me.commentsView.setFocusToTextBox();
}
}
});
}

2
apps/common/main/resources/less/comments.less
View file

@ -129,7 +129,7 @@
textarea {
width: 100%;
height: 55px;
height: 21px;
resize: none;
margin-bottom: 5px;
border: @scaled-one-px-value-ie solid @border-regular-control-ie;