depau/HackMD
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Update editor other cursor classes and adding option for other cursors features in CodeMirror

Browse source
This commit is contained in:
Wu Cheng-Han 2016-11-28 01:20:23 +08:00
parent bd3d4958e4
commit 3a305b8258
5 changed files with 56 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
public/css/index.css
View file

@ -241,16 +241,7 @@ body {
.dropdown-menu > li > a {
cursor: pointer;
}
.other-cursors {
position:relative;
z-index:3;
}
.other-cursor {
width: 0px;
position: absolute;
border-right: none;
}
.dropdown-menu.other-cursor {
.dropdown-menu.CodeMirror-other-cursor {
transition: none;
}
.cursortag {
@ -288,7 +279,7 @@ div[contenteditable]:empty:not(:focus):before{
.dropdown-menu .emoji {
margin-bottom: 0 !important;
}
.dropdown-menu.other-cursor {
.dropdown-menu.CodeMirror-other-cursor {
max-height: 50vh;
width: auto !important;
overflow: auto;

15
public/js/index.js
View file

@ -455,6 +455,7 @@ window.editor = CodeMirror.fromTextArea(textit, {
addModeClass: true,
readOnly: true,
autoRefresh: true,
otherCursors: true,
placeholder: "← Start by entering a title here\n===\nVisit /features if you don't know what to do.\nHappy hacking :)"
});
var inlineAttach = inlineAttachment.editors.codemirror4.attach(editor);
@ -2719,7 +2720,7 @@ socket.on('online users', function (data) {
console.debug(data);
onlineUsers = data.users;
updateOnlineStatus();
$('.other-cursors').children().each(function (key, value) {
$('.CodeMirror-other-cursors').children().each(function (key, value) {
var found = false;
for (var i = 0; i < data.users.length; i++) {
var user = data.users[i];
@ -3044,11 +3045,11 @@ function buildCursor(user) {
iconClass = 'fa-desktop';
break;
}
if ($('.other-cursors').length <= 0) {
$("<div class='other-cursors'>").insertAfter('.CodeMirror-cursors');
if ($('.CodeMirror-other-cursors').length <= 0) {
$("<div class='CodeMirror-other-cursors'>").insertAfter('.CodeMirror-cursors');
}
if ($('div[data-clientid="' + user.id + '"]').length <= 0) {
var cursor = $('<div data-clientid="' + user.id + '" class="other-cursor" style="display:none;"></div>');
var cursor = $('<div data-clientid="' + user.id + '" class="CodeMirror-other-cursor" style="display:none;"></div>');
cursor.attr('data-line', user.cursor.line);
cursor.attr('data-ch', user.cursor.ch);
cursor.attr('data-offset-left', 0);
@ -3119,7 +3120,7 @@ function buildCursor(user) {
cursor[0].style.left = coord.left + 'px';
cursor[0].style.top = coord.top + 'px';
$('.other-cursors').append(cursor);
$('.CodeMirror-other-cursors').append(cursor);
if (!user.idle)
cursor.stop(true).fadeIn();
@ -3622,8 +3623,8 @@ function checkCursorMenuInner() {
// get cursor
var cursor = editor.getCursor();
// set element cursor data
if (!dropdown.hasClass('other-cursor'))
dropdown.addClass('other-cursor');
if (!dropdown.hasClass('CodeMirror-other-cursor'))
dropdown.addClass('CodeMirror-other-cursor');
dropdown.attr('data-line', cursor.line);
dropdown.attr('data-ch', cursor.ch);
// get coord position

34
public/vendor/codemirror/codemirror.min.js vendored
View file

File diff suppressed because one or more lines are too long

14
public/vendor/codemirror/lib/codemirror.css vendored
View file

@ -86,6 +86,12 @@
/* Can style cursor different in overwrite (non-insert) mode */
.CodeMirror-overwrite .CodeMirror-cursor {}
.CodeMirror-other-cursor {
width: 0px;
position: absolute;
border-right: none;
}
.cm-tab { display: inline-block; text-decoration: inherit; }
.CodeMirror-rulers {
@ -316,6 +322,11 @@ div.CodeMirror-dragcursors {
visibility: visible;
}
div.CodeMirror-other-cursors {
position:relative;
z-index:3;
}
.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
.CodeMirror-crosshair { cursor: crosshair; }
@ -338,6 +349,9 @@ div.CodeMirror-dragcursors {
.CodeMirror div.CodeMirror-cursors {
visibility: hidden;
}
.CodeMirror div.CodeMirror-other-cursors {
visibility: hidden;
}
}
/* See issue #2901 */

26
public/vendor/codemirror/lib/codemirror.js vendored
View file

@ -2330,7 +2330,7 @@
for (var i = 0; i < doc.sel.ranges.length; i++) {
if (primary === false && i == doc.sel.primIndex) continue;
var range = doc.sel.ranges[i];
//if (range.from().line >= cm.display.viewTo || range.to().line < cm.display.viewFrom) continue;
if (!cm.options.otherCursors && (range.from().line >= cm.display.viewTo || range.to().line < cm.display.viewFrom)) continue;
var collapsed = range.empty();
if (collapsed || cm.options.showCursorWhenSelecting)
drawSelectionCursor(cm, range.head, curFragment);
@ -2357,16 +2357,20 @@
otherCursor.style.top = pos.other.top + "px";
otherCursor.style.height = (pos.other.bottom - pos.other.top) * .85 + "px";
}
$('.other-cursor').each(function(key, value) {
var line = parseInt($(value).attr('data-line'));
var ch = parseInt($(value).attr('data-ch'));
var offsetLeft = parseFloat($(value).attr('data-offset-left'));
var offsetTop = parseFloat($(value).attr('data-offset-top'));
var coord = cm.charCoords({line: line, ch: ch}, 'windows');
$(value)[0].style.left = coord.left + offsetLeft + 'px';
$(value)[0].style.top = coord.top + offsetTop + 'px';
});
if (cm.options.otherCursors) {
var others = cm.display.lineSpace.getElementsByClassName('CodeMirror-other-cursor');
for (var i = 0, l = others.length; i < l; i++) {
var other = others[i];
var line = parseInt(other.getAttribute('data-line'));
var ch = parseInt(other.getAttribute('data-ch'));
var offsetLeft = parseFloat(other.getAttribute('data-offset-left'));
var offsetTop = parseFloat(other.getAttribute('data-offset-top'));
var coord = cm.charCoords({line: line, ch: ch}, 'windows');
other.style.left = coord.left + offsetLeft + 'px';
other.style.top = coord.top + offsetTop + 'px';
}
}
}
// Draws the given range as a highlighted selection