web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Cursor in pads (again)

Browse Source
This commit is contained in:
yflory 2018-12-14 16:40:15 +01:00
parent ee3102143f
commit 2031d535d7
3 changed files with 27 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
customize.dist/ckeditor-contents.css
View File

@ -158,18 +158,18 @@ a > img {
border: 2px solid red; border: 2px solid red;
border-right-color: transparent !important; border-right-color: transparent !important;
border-left-color: transparent !important; border-left-color: transparent !important;
margin-left: -2px; margin-left: -3px;
margin-right: -2px; margin-right: -3px;
} }
.cp-cursor-position[data-type="start"] { .cp-cursor-position[data-type="start"] {
border-left: none; border-left: none;
border-right-width: 4px; border-right-width: 4px;
margin-right: -4px; margin-right: -5px;
} }
.cp-cursor-position[data-type="end"] { .cp-cursor-position[data-type="end"] {
border-right: none; border-right: none;
border-left-width: 4px; border-left-width: 4px;
margin-left: -4px; margin-left: -5px;
} }
.cp-cursor-avatar { .cp-cursor-avatar {
display: flex; display: flex;

2
customize.dist/src/less2/include/cursor.less
View File

@ -8,6 +8,8 @@
border: 2px solid red; border: 2px solid red;
border-right-color: transparent !important; border-right-color: transparent !important;
border-left-color: transparent !important; border-left-color: transparent !important;
margin-left: -3px;
margin-right: -3px;
} }
.cp-codemirror-selection { .cp-codemirror-selection {
background-color: rgba(255,0,0,0.3); background-color: rgba(255,0,0,0.3);

30
www/pad/inner.js
View File

@ -567,9 +567,16 @@ define([
var DD = new DiffDom(mkDiffOptions(cursor, framework.isReadOnly())); var DD = new DiffDom(mkDiffOptions(cursor, framework.isReadOnly()));
var cursorStopped = false; var cursorStopped = false;
var cursorTo;
var updateCursor = function () { var updateCursor = function () {
if (cursorStopped) { return; } if (cursorTo) { clearTimeout(cursorTo); }
framework.updateCursor();
// If we're receiving content
if (cursorStopped) { return void setTimeout(updateCursor, 100); }
cursorTo = setTimeout(function () {
framework.updateCursor();
}, 500); // 500ms to make sure it is sent after chainpad sync
}; };
// apply patches, and try not to lose the cursor in the process! // apply patches, and try not to lose the cursor in the process!
@ -604,8 +611,10 @@ define([
var ops = ChainPad.Diff.diff(oldText, newText); var ops = ChainPad.Diff.diff(oldText, newText);
cursor.restoreOffset(ops); cursor.restoreOffset(ops);
cursorStopped = false; setTimeout(function () {
updateCursor(); cursorStopped = false;
updateCursor();
}, 200);
// MEDIATAG: Migrate old mediatags to the widget system // MEDIATAG: Migrate old mediatags to the widget system
$inner.find('media-tag:not(.cke_widget_element)').each(function (i, el) { $inner.find('media-tag:not(.cke_widget_element)').each(function (i, el) {
@ -780,10 +789,10 @@ define([
}); });
/* Display the cursor of other users and send our cursor */ /* Display the cursor of other users and send our cursor */
//framework.setCursorGetter(cursors.cursorGetter); framework.setCursorGetter(cursors.cursorGetter);
//framework.onCursorUpdate(cursors.onCursorUpdate); framework.onCursorUpdate(cursors.onCursorUpdate);
//inner.addEventListener('click', updateCursor); inner.addEventListener('click', updateCursor);
//inner.addEventListener('keyup', updateCursor); inner.addEventListener('keyup', updateCursor);
/* hitting enter makes a new line, but places the cursor inside /* hitting enter makes a new line, but places the cursor inside
@ -806,7 +815,10 @@ define([
The solution is the "input" event, triggered by the browser as soon as the The solution is the "input" event, triggered by the browser as soon as the
character is inserted. character is inserted.
*/ */
inner.addEventListener('input', framework.localChange); inner.addEventListener('input', function () {
framework.localChange();
updateCursor();
});
editor.on('change', framework.localChange); editor.on('change', framework.localChange);
// export the typing tests to the window. // export the typing tests to the window.