Cursor improvements in pad, code and slide

This commit is contained in:
yflory 2018-12-17 11:44:08 +01:00
parent d76c21fcf5
commit a11a883cff
5 changed files with 37 additions and 8 deletions

View File

@ -165,11 +165,13 @@ a > img {
border-left: none; border-left: none;
border-right-width: 4px; border-right-width: 4px;
margin-right: -5px; margin-right: -5px;
margin-left: -1px;
} }
.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: -5px; margin-left: -5px;
margin-right: -1px;
} }
.cp-cursor-avatar { .cp-cursor-avatar {
display: flex; display: flex;

View File

@ -310,18 +310,24 @@ define([
}); });
framework.setContentGetter(function () { framework.setContentGetter(function () {
CodeMirror.removeCursors();
var content = CodeMirror.getContent(); var content = CodeMirror.getContent();
content.highlightMode = CodeMirror.highlightMode; content.highlightMode = CodeMirror.highlightMode;
previewPane.draw(); previewPane.draw();
return content; return content;
}); });
var cursorTo;
var updateCursor = function () {
if (cursorTo) { clearTimeout(cursorTo); }
if (editor._noCursorUpdate) { return; }
cursorTo = setTimeout(function () {
framework.updateCursor();
}, 500); // 500ms to make sure it is sent after chainpad sync
};
framework.onCursorUpdate(CodeMirror.setRemoteCursor); framework.onCursorUpdate(CodeMirror.setRemoteCursor);
framework.setCursorGetter(CodeMirror.getCursor); framework.setCursorGetter(CodeMirror.getCursor);
editor.on('cursorActivity', function () { editor.on('cursorActivity', updateCursor);
if (editor._noCursorUpdate) { return; }
framework.updateCursor();
});
framework.onEditableChange(function () { framework.onEditableChange(function () {
editor.setOption('readOnly', framework.isLocked() || framework.isReadOnly()); editor.setOption('readOnly', framework.isLocked() || framework.isReadOnly());

View File

@ -402,6 +402,12 @@ define([
return html; return html;
}; };
var marks = {}; var marks = {};
exp.removeCursors = function () {
for (var id in marks) {
marks[id].clear();
delete marks[id];
}
};
exp.setRemoteCursor = function (data) { exp.setRemoteCursor = function (data) {
if (data.leave) { if (data.leave) {
$('.cp-codemirror-cursor[id^='+data.id+']').each(function (i, el) { $('.cp-codemirror-cursor[id^='+data.id+']').each(function (i, el) {

View File

@ -136,6 +136,15 @@ define([
end: cursorObj.selectionEnd end: cursorObj.selectionEnd
}, ops); }, ops);
var cursorEl = makeCursor(id, cursorObj); var cursorEl = makeCursor(id, cursorObj);
['start', 'end'].forEach(function (t) {
// Prevent the cursor from creating a new line at the beginning
if (r[t].el.nodeName.toUpperCase() === 'BODY') {
if (!r[t].el.childNodes.length) { r[t] = null; return; }
r[t].el = r[t].el.childNodes[0];
r[t].offset = 0;
}
});
if (!r.start || !r.end) { return; }
if (r.start.el === r.end.el && r.start.offset === r.end.offset) { if (r.start.el === r.end.el && r.start.offset === r.end.offset) {
// Cursor // Cursor
addCursorAtRange(cursorEl, r, cursorObj, ''); addCursorAtRange(cursorEl, r, cursorObj, '');

View File

@ -466,17 +466,23 @@ define([
}); });
framework.setContentGetter(function () { framework.setContentGetter(function () {
CodeMirror.removeCursors();
var content = CodeMirror.getContent(); var content = CodeMirror.getContent();
Slide.update(content.content); Slide.update(content.content);
return content; return content;
}); });
var cursorTo;
var updateCursor = function () {
if (cursorTo) { clearTimeout(cursorTo); }
if (editor._noCursorUpdate) { return; }
cursorTo = setTimeout(function () {
framework.updateCursor();
}, 500); // 500ms to make sure it is sent after chainpad sync
};
framework.onCursorUpdate(CodeMirror.setRemoteCursor); framework.onCursorUpdate(CodeMirror.setRemoteCursor);
framework.setCursorGetter(CodeMirror.getCursor); framework.setCursorGetter(CodeMirror.getCursor);
editor.on('cursorActivity', function () { editor.on('cursorActivity', updateCursor);
if (editor._noCursorUpdate) { return; }
framework.updateCursor();
});
framework.onEditableChange(function () { framework.onEditableChange(function () {
editor.setOption('readOnly', framework.isLocked() || framework.isReadOnly()); editor.setOption('readOnly', framework.isLocked() || framework.isReadOnly());