The_Great_Archive/cryptpad
1
0
Fork 0
mirror of https://github.com/cryptpad/cryptpad.git synced 2026-09-14 11:05:41 +05:00
Code Issues Packages Projects Releases Wiki Activity

Better representation of active comments

Browse Source
This commit is contained in:
yflory 2020-04-23 16:19:58 +02:00
parent 5fc40974cb
commit a71d75bad3
3 changed files with 38 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
www/pad/comment.js
View File

@ -17,7 +17,7 @@
onLoad: function () {
CKEDITOR.addCss('comment { background-color: '+color1+' }' +
'@keyframes color { 0% { background-color: '+color2+' } 50% { background-color: '+color1+' } 100% { background-color: '+color2+' } }' +
'comment:focus { animation-name: color; animation-duration: 1s; animation-iteration-count: 2; background-color: '+color2+' outline: none;}' +
'comment.active { animation-name: color; animation-duration: 1s; animation-iteration-count: 2; background-color: '+color2+' outline: none;}' +
'comment * { background-color: transparent !important; }');
},
init: function (editor) {
@ -27,7 +27,6 @@
element: 'comment',
attributes: {
'data-uid': '#(uid)',
'tabindex': '1'
},
overrides: [ {
element: 'comment'
@ -79,17 +78,17 @@
element: 'comment',
attributes: {
'data-uid': id,
'tabindex': '1'
},
});
style.alwaysRemoveElement = true;
els.forEach(function (el) {
// Create range for the entire document
// Create range for this element
el.removeAttribute('class');
var node = new CKEDITOR.dom.node(el);
var range = editor.createRange();
range.setStart(node, 0);
range.setEnd(node, Number.MAX_SAFE_INTEGER);
// Remove style for the document
// Remove style for the comment
style.removeFromRange(range, editor);
});

46
www/pad/comments.js
View File

@ -270,7 +270,17 @@ define([
});
var focusContent = function () {
Env.$inner.find('comment[data-uid="'+key+'"]').focus();
// Add class "active"
Env.$inner.find('comment.active').removeClass('active');
Env.$inner.find('comment[data-uid="'+key+'"]').addClass('active');
var $last = Env.$inner.find('comment[data-uid="'+key+'"]').last();
// Scroll into view
if (!$last.length) { return; }
var size = Env.$inner.outerHeight();
var pos = $last[0].getBoundingClientRect();
var visible = (pos.y + pos.height) < size;
if (!visible) { $last[0].scrollIntoView(); }
};
$div.click(function () {
@ -382,30 +392,6 @@ define([
return;
}
/*
sel.forEach(function (el) {
// For each comment ID, check if the comment will be deleted
// if we add a comment on our selection
var id = el.getAttribute('data-uid');
// Get all nodes for this comment
var all = Env.$inner.find('comment[data-uid="'+id+'"]');
// Get our selection
var sel = Env.ifrWindow.getSelection();
if (!sel.containsNode) {
// IE doesn't support this method, always allow comments for them...
sel.containsNode = function () { return false; };
}
var notDeleted = all.some(function (i, el) {
// If this node is completely outside of the selection, continue
if (!sel.containsNode(el, true)) { return true; }
});
// only continue if notDeleted is true (at least one node for
// this comment won't be deleted)
});
*/
Env.$container.find('.cp-comment-form').remove();
var form = getCommentForm(Env, false, function (val) {
$(form).remove();
@ -460,11 +446,21 @@ sel.forEach(function (el) {
addAddCommentHandler(Env);
// Unselect comment when clicking outside
$(window).click(function (e) {
if ($(e.target).closest('.cp-comment-container').length) {
return;
}
Env.$container.find('.cp-comment-active').removeClass('cp-comment-active');
Env.$inner.find('comment.active').removeClass('active');
Env.$container.find('.cp-comment-form').remove();
});
// Unselect comment when clicking on another part of the doc
Env.$inner.on('click', function (e) {
if ($(e.target).closest('comment').length) { return; }
Env.$container.find('.cp-comment-active').removeClass('cp-comment-active');
Env.$inner.find('comment.active').removeClass('active');
Env.$container.find('.cp-comment-form').remove();
});
Env.$inner.on('click', 'comment', function (e) {
var $comment = $(e.target);

13
www/pad/inner.js
View File

@ -155,8 +155,13 @@ define([
if (hj[0] === 'MEDIA-TAG') { hj[2] = []; }
return hj;
};
var commentActiveFilter = function (hj) {
if (hj[0] === 'COMMENT') { delete (hj[1] || {}).class; }
return hj;
};
brFilter(hj);
mediatagContentFilter(hj);
commentActiveFilter(hj);
widgetFilter(hj);
return hj;
};
@ -280,6 +285,14 @@ define([
}
}
// Don't remote the "active" class of our comments
if (info.node && info.node.tagName === 'COMMENT') {
if (info.diff.action === 'removeAttribute' &&
['class'].indexOf(info.diff.name) !== -1) {
return true;
}
}
if (info.node && info.node.tagName === 'BODY') {
if (info.diff.action === 'removeAttribute' &&
['class', 'spellcheck'].indexOf(info.diff.name) !== -1) {