' + icon + ' ' + user.name + '
');
+ //cursortag[0].style.background = color;
+ cursortag[0].style.color = user.color;
+
+ cursor.attr('data-mode', 'state');
+ cursor.hover(
+ function () {
+ if (cursor.attr('data-mode') == 'hover')
+ cursortag.stop(true).fadeIn("fast");
+ },
+ function () {
+ if (cursor.attr('data-mode') == 'hover')
+ cursortag.stop(true).fadeOut("fast");
+ });
+
+ function switchMode(ele) {
+ if (ele.attr('data-mode') == 'state')
+ ele.attr('data-mode', 'hover');
+ else if (ele.attr('data-mode') == 'hover')
+ ele.attr('data-mode', 'state');
+ }
+
+ function switchTag(ele) {
+ if (ele.css('display') === 'none')
+ ele.stop(true).fadeIn("fast");
+ else
+ ele.stop(true).fadeOut("fast");
+ }
+ var hideCursorTagDelay = 2000;
+ var hideCursorTagTimer = null;
+
+ function hideCursorTag() {
+ if (cursor.attr('data-mode') == 'hover')
+ cursortag.fadeOut("fast");
+ }
+ cursor.on('touchstart', function (e) {
+ var display = cursortag.css('display');
+ cursortag.stop(true).fadeIn("fast");
+ clearTimeout(hideCursorTagTimer);
+ hideCursorTagTimer = setTimeout(hideCursorTag, hideCursorTagDelay);
+ if (display === 'none') {
+ e.preventDefault();
+ e.stopPropagation();
+ }
+ });
+ cursortag.on('mousedown touchstart', function (e) {
+ if (cursor.attr('data-mode') == 'state')
+ switchTag(cursortag);
+ switchMode(cursor);
+ e.preventDefault();
+ e.stopPropagation();
+ });
+
+ cursor.append(cursorbar);
+ cursor.append(cursortag);
+
cursor[0].style.left = coord.left + 'px';
cursor[0].style.top = coord.top + 'px';
- cursor[0].style.height = '18px';
- cursor[0].style.borderLeft = '2px solid ' + color;
$('.other-cursors').append(cursor);
- cursor.hide().fadeIn();
+
+ if (!user.idle)
+ cursor.stop(true).fadeIn();
+
+ checkCursorTag(coord, cursortag);
} else {
- var cursor = $('#' + id);
- cursor.attr('data-line', pos.line);
- cursor.attr('data-ch', pos.ch);
- var coord = editor.charCoords(pos, 'windows');
- cursor.stop(true).css('opacity', 1).animate({
- "left": coord.left,
- "top": coord.top
- }, cursorAnimatePeriod);
- //cursor[0].style.left = coord.left + 'px';
- //cursor[0].style.top = coord.top + 'px';
- cursor[0].style.height = '18px';
- cursor[0].style.borderLeft = '2px solid ' + color;
+ var cursor = $('#' + user.id);
+ cursor.attr('data-line', user.cursor.line);
+ cursor.attr('data-ch', user.cursor.ch);
+
+ var cursorbar = cursor.find('.cursorbar');
+ cursorbar[0].style.height = defaultTextHeight + 'px';
+ cursorbar[0].style.borderLeft = '2px solid ' + user.color;
+
+ var cursortag = cursor.find('.cursortag');
+ cursortag.find('i').removeClass().addClass('fa').addClass(iconClass);
+ cursortag.find(".name").text(user.name);
+
+ if (cursor.css('display') === 'none') {
+ cursor[0].style.left = coord.left + 'px';
+ cursor[0].style.top = coord.top + 'px';
+ } else {
+ cursor.animate({
+ "left": coord.left,
+ "top": coord.top
+ }, {
+ duration: cursorAnimatePeriod,
+ queue: false
+ });
+ }
+
+ if (user.idle && cursor.css('display') !== 'none')
+ cursor.stop(true).fadeOut();
+ else if (!user.idle && cursor.css('display') === 'none')
+ cursor.stop(true).fadeIn();
+
+ checkCursorTag(coord, cursortag);
}
}
@@ -601,13 +1129,19 @@ editor.on('change', function (i, op) {
if (debug)
console.debug(op);
if (op.origin != 'setValue' && op.origin != 'ignoreHistory') {
- socket.emit('change', LZString.compressToBase64(JSON.stringify(op)));
+ socket.emit('change', LZString.compressToUTF16(JSON.stringify(op)));
}
isDirty = true;
clearTimeout(doneTypingTimer);
doneTypingTimer = setTimeout(doneTyping, doneTypingDelay);
});
editor.on('focus', function (cm) {
+ for (var i = 0; i < onlineUsers.length; i++) {
+ if (onlineUsers[i].id == personalInfo.id) {
+ onlineUsers[i].cursor = editor.getCursor();
+ }
+ }
+ personalInfo['cursor'] = editor.getCursor();
socket.emit('cursor focus', editor.getCursor());
});
var cursorActivityTimer = null;
@@ -617,20 +1151,38 @@ editor.on('cursorActivity', function (cm) {
});
function cursorActivity() {
- socket.emit('cursor activity', editor.getCursor());
+ if (editorHasFocus() && !Visibility.hidden()) {
+ for (var i = 0; i < onlineUsers.length; i++) {
+ if (onlineUsers[i].id == personalInfo.id) {
+ onlineUsers[i].cursor = editor.getCursor();
+ }
+ }
+ personalInfo['cursor'] = editor.getCursor();
+ socket.emit('cursor activity', editor.getCursor());
+ }
}
editor.on('blur', function (cm) {
+ for (var i = 0; i < onlineUsers.length; i++) {
+ if (onlineUsers[i].id == personalInfo.id) {
+ onlineUsers[i].cursor = null;
+ }
+ }
+ personalInfo['cursor'] = null;
socket.emit('cursor blur');
});
function saveInfo() {
+ var scrollbarStyle = editor.getOption('scrollbarStyle');
var left = $(document.body).scrollLeft();
var top = $(document.body).scrollTop();
switch (currentMode) {
case modeType.edit:
- //lastInfo.edit.scroll.left = left;
- //lastInfo.edit.scroll.top = top;
- lastInfo.edit.scroll = editor.getScrollInfo();
+ if (scrollbarStyle == 'native') {
+ lastInfo.edit.scroll.left = left;
+ lastInfo.edit.scroll.top = top;
+ } else {
+ lastInfo.edit.scroll = editor.getScrollInfo();
+ }
break;
case modeType.view:
lastInfo.view.scroll.left = left;
@@ -647,6 +1199,7 @@ function saveInfo() {
}
function restoreInfo() {
+ var scrollbarStyle = editor.getOption('scrollbarStyle');
if (lastInfo.needRestore) {
var line = lastInfo.edit.cursor.line;
var ch = lastInfo.edit.cursor.ch;
@@ -654,12 +1207,15 @@ function restoreInfo() {
switch (currentMode) {
case modeType.edit:
- //$(document.body).scrollLeft(lastInfo.edit.scroll.left);
- //$(document.body).scrollTop(lastInfo.edit.scroll.top);
- var left = lastInfo.edit.scroll.left;
- var top = lastInfo.edit.scroll.top;
- editor.scrollIntoView();
- editor.scrollTo(left, top);
+ if (scrollbarStyle == 'native') {
+ $(document.body).scrollLeft(lastInfo.edit.scroll.left);
+ $(document.body).scrollTop(lastInfo.edit.scroll.top);
+ } else {
+ var left = lastInfo.edit.scroll.left;
+ var top = lastInfo.edit.scroll.top;
+ editor.scrollIntoView();
+ editor.scrollTo(left, top);
+ }
break;
case modeType.view:
$(document.body).scrollLeft(lastInfo.view.scroll.left);
@@ -685,15 +1241,19 @@ var finishChangeTimer = null;
var input = editor.getInputField();
//user is "finished typing," do something
function doneTyping() {
+ emitRefresh();
updateView();
- var value = editor.getValue();
- socket.emit('refresh', LZString.compressToBase64(value));
}
function finishChange() {
updateView();
}
+function emitRefresh() {
+ var value = editor.getValue();
+ socket.emit('refresh', LZString.compressToUTF16(value));
+}
+
var lastResult = null;
function updateView() {
@@ -703,12 +1263,22 @@ function updateView() {
//ui.area.markdown.html(result);
//finishView(ui.area.markdown);
partialUpdate(result, lastResult, ui.area.markdown.children().toArray());
- lastResult = $(result).clone(true);
+ if (result && lastResult && result.length != lastResult.length)
+ updateDataAttrs(result, ui.area.markdown.children().toArray());
+ lastResult = $(result).clone();
finishView(ui.area.view);
writeHistory(ui.area.markdown);
isDirty = false;
- emitUserStatus();
clearMap();
+ buildMap();
+}
+
+function updateDataAttrs(src, des) {
+ //sync data attr startline and endline
+ for (var i = 0; i < src.length; i++) {
+ copyAttribute(src[i], des[i], 'data-startline');
+ copyAttribute(src[i], des[i], 'data-endline');
+ }
}
function partialUpdate(src, tar, des) {
@@ -733,8 +1303,8 @@ function partialUpdate(src, tar, des) {
var end = 0;
//find diff start position
for (var i = 0; i < tar.length; i++) {
- copyAttribute(src[i], des[i], 'data-startline');
- copyAttribute(src[i], des[i], 'data-endline');
+ //copyAttribute(src[i], des[i], 'data-startline');
+ //copyAttribute(src[i], des[i], 'data-endline');
var rawSrc = cloneAndRemoveDataAttr(src[i]);
var rawTar = cloneAndRemoveDataAttr(tar[i]);
if (!rawSrc || !rawTar || rawSrc.outerHTML != rawTar.outerHTML) {
@@ -746,8 +1316,8 @@ function partialUpdate(src, tar, des) {
var srcEnd = 0;
var tarEnd = 0;
for (var i = 0; i < src.length; i++) {
- copyAttribute(src[i], des[i], 'data-startline');
- copyAttribute(src[i], des[i], 'data-endline');
+ //copyAttribute(src[i], des[i], 'data-startline');
+ //copyAttribute(src[i], des[i], 'data-endline');
var rawSrc = cloneAndRemoveDataAttr(src[i]);
var rawTar = cloneAndRemoveDataAttr(tar[i]);
if (!rawSrc || !rawTar || rawSrc.outerHTML != rawTar.outerHTML) {
@@ -759,8 +1329,8 @@ function partialUpdate(src, tar, des) {
for (var i = 1; i <= tar.length + 1; i++) {
var srcLength = src.length;
var tarLength = tar.length;
- copyAttribute(src[srcLength - i], des[srcLength - i], 'data-startline');
- copyAttribute(src[srcLength - i], des[srcLength - i], 'data-endline');
+ //copyAttribute(src[srcLength - i], des[srcLength - i], 'data-startline');
+ //copyAttribute(src[srcLength - i], des[srcLength - i], 'data-endline');
var rawSrc = cloneAndRemoveDataAttr(src[srcLength - i]);
var rawTar = cloneAndRemoveDataAttr(tar[tarLength - i]);
if (!rawSrc || !rawTar || rawSrc.outerHTML != rawTar.outerHTML) {
@@ -772,8 +1342,8 @@ function partialUpdate(src, tar, des) {
for (var i = 1; i <= src.length + 1; i++) {
var srcLength = src.length;
var tarLength = tar.length;
- copyAttribute(src[srcLength - i], des[srcLength - i], 'data-startline');
- copyAttribute(src[srcLength - i], des[srcLength - i], 'data-endline');
+ //copyAttribute(src[srcLength - i], des[srcLength - i], 'data-startline');
+ //copyAttribute(src[srcLength - i], des[srcLength - i], 'data-endline');
var rawSrc = cloneAndRemoveDataAttr(src[srcLength - i]);
var rawTar = cloneAndRemoveDataAttr(tar[tarLength - i]);
if (!rawSrc || !rawTar || rawSrc.outerHTML != rawTar.outerHTML) {
@@ -805,12 +1375,12 @@ function partialUpdate(src, tar, des) {
var repeatDiff = Math.abs(srcEnd - tarEnd) - 1;
//push new elements
var newElements = [];
- if(srcEnd >= start) {
+ if (srcEnd >= start) {
for (var j = start; j <= srcEnd; j++) {
if (!src[j]) continue;
newElements.push(src[j].outerHTML);
}
- } else if(repeatAdd) {
+ } else if (repeatAdd) {
for (var j = srcEnd - repeatDiff; j <= srcEnd; j++) {
if (!des[j]) continue;
newElements.push(des[j].outerHTML);
@@ -818,12 +1388,12 @@ function partialUpdate(src, tar, des) {
}
//push remove elements
var removeElements = [];
- if(tarEnd >= start) {
+ if (tarEnd >= start) {
for (var j = start; j <= tarEnd; j++) {
if (!des[j]) continue;
removeElements.push(des[j]);
}
- } else if(!repeatAdd) {
+ } else if (!repeatAdd) {
for (var j = start; j <= start + repeatDiff; j++) {
if (!des[j]) continue;
removeElements.push(des[j]);
@@ -853,7 +1423,7 @@ function partialUpdate(src, tar, des) {
function cloneAndRemoveDataAttr(el) {
if (!el) return;
- var rawEl = $(el).clone(true)[0];
+ var rawEl = $(el).clone()[0];
rawEl.removeAttribute('data-startline');
rawEl.removeAttribute('data-endline');
return rawEl;
@@ -862,4 +1432,229 @@ function cloneAndRemoveDataAttr(el) {
function copyAttribute(src, des, attr) {
if (src && src.getAttribute(attr) && des)
des.setAttribute(attr, src.getAttribute(attr));
-}
\ No newline at end of file
+}
+
+if ($('.cursor-menu').length <= 0) {
+ $("").insertAfter('.CodeMirror-cursors');
+}
+
+var upSideDown = false;
+var menuMargin = 60;
+
+function checkCursorMenu() {
+ var dropdown = $('.cursor-menu .dropdown-menu');
+ var cursor = editor.getCursor();
+ var scrollInfo = editor.getScrollInfo();
+ if (!dropdown.hasClass('other-cursor'))
+ dropdown.addClass('other-cursor');
+ dropdown.attr('data-line', cursor.line);
+ dropdown.attr('data-ch', cursor.ch);
+ var coord = editor.charCoords({
+ line: cursor.line,
+ ch: cursor.ch
+ }, 'windows');
+ var viewport = editor.getViewport();
+ var viewportHeight = (viewport.to - viewport.from) * editor.defaultTextHeight();
+ var editorWidth = ui.area.codemirror.width();
+ var editorHeight = ui.area.codemirror.height();
+ var width = dropdown.width();
+ var height = dropdown.height();
+ var left = coord.left;
+ var top = coord.top;
+ var offsetLeft = 0;
+ var offsetTop = defaultTextHeight;
+ if (left + width + offsetLeft > editorWidth - menuMargin)
+ offsetLeft = -(left + width - editorWidth + menuMargin);
+ if (top + height + offsetTop > Math.max(viewportHeight, editorHeight) + menuMargin && top - height > menuMargin) {
+ offsetTop = -(height + defaultTextHeight);
+ upSideDown = true;
+ } else {
+ upSideDown = false;
+ }
+ dropdown.attr('data-offset-left', offsetLeft);
+ dropdown.attr('data-offset-top', offsetTop);
+ dropdown[0].style.left = left + offsetLeft + 'px';
+ dropdown[0].style.top = top + offsetTop + 'px';
+}
+
+var isInCode = false;
+
+function check(text) {
+ var cursor = editor.getCursor();
+ text = [];
+ for (var i = 0; i < cursor.line; i++)
+ text.push(editor.getLine(i));
+ text = text.join('\n') + '\n' + editor.getLine(cursor.line).slice(0, cursor.ch);
+ //console.log(text);
+ var match;
+ match = text.match(/`{3,}/g);
+ if (match && match.length % 2) {
+ isInCode = true;
+ } else {
+ match = text.match(/`/g);
+ if (match && match.length % 2) {
+ isInCode = true;
+ } else {
+ isInCode = false;
+ }
+ }
+}
+
+$(editor.getInputField())
+ .textcomplete([
+ { // emoji strategy
+ match: /(?:^|\n|)\B:([\-+\w]*)$/,
+ search: function (term, callback) {
+ callback($.map(emojify.emojiNames, function (emoji) {
+ return emoji.indexOf(term) === 0 ? emoji : null;
+ }));
+ checkCursorMenu();
+ },
+ template: function (value) {
+ return '
' + value;
+ },
+ replace: function (value) {
+ return ':' + value + ':';
+ },
+ index: 1,
+ context: function (text) {
+ check(text);
+ return !isInCode;
+ }
+ },
+ { // Code block language strategy
+ langs: supportCodeModes,
+ match: /(^|\n)```(\w*)$/,
+ search: function (term, callback) {
+ callback($.map(this.langs, function (lang) {
+ return lang.indexOf(term) === 0 ? lang : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (lang) {
+ return '$1```' + lang + '=\n\n```';
+ },
+ done: function () {
+ editor.doc.cm.moveV(-1, "line");
+ },
+ context: function () {
+ return isInCode;
+ }
+ },
+ { //header
+ match: /(?:^|\n)(\s{0,3})(#{1,6}\w*)$/,
+ search: function (term, callback) {
+ callback($.map(supportHeaders, function (header) {
+ return header.search.indexOf(term) === 0 ? header.text : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //referral
+ match: /(^|\n|\s)(\!|\!|\[\])(\w*)$/,
+ search: function (term, callback) {
+ callback($.map(supportReferrals, function (referral) {
+ return referral.search.indexOf(term) === 0 ? referral.text : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //externals
+ match: /(^|\n|\s)\{\}(\w*)$/,
+ search: function (term, callback) {
+ callback($.map(supportExternals, function (external) {
+ return external.search.indexOf(term) === 0 ? external.text : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //blockquote personal info & general info
+ match: /(^|\n|\s|\>.*)\[(\w*)=$/,
+ search: function (term, callback) {
+ var list = typeof personalInfo[term] != 'undefined' ? [personalInfo[term]] : [];
+ $.map(supportGenerals, function (general) {
+ if (general.search.indexOf(term) === 0)
+ list.push(general.command());
+ });
+ callback(list);
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1[$2=' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //blockquote quick start tag
+ match: /(^.*(?!>)\n|)(\>\s{0,1})$/,
+ search: function (term, callback) {
+ var self = '[name=' + personalInfo.name + '] [time=' + moment().format('llll') + '] [color=' + personalInfo.color + ']';
+ callback([self]);
+ checkCursorMenu();
+ },
+ template: function (value) {
+ return '[Your name, time, color tags]';
+ },
+ replace: function (value) {
+ return '$1$2' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ }
+], {
+ appendTo: $('.cursor-menu')
+ })
+ .on({
+ 'textComplete:select': function (e, value, strategy) {
+ //NA
+ },
+ 'textComplete:show': function (e) {
+ checkCursorMenu();
+ $(this).data('autocompleting', true);
+ editor.setOption("extraKeys", {
+ "Up": function () {
+ return CodeMirror.PASS;
+ },
+ "Right": function () {
+ editor.doc.cm.execCommand("goCharRight");
+ },
+ "Down": function () {
+ return CodeMirror.PASS;
+ },
+ "Left": function () {
+ editor.doc.cm.execCommand("goCharLeft");
+ },
+ "Enter": function () {
+ return CodeMirror.PASS;
+ },
+ "Backspace": function () {
+ editor.doc.cm.execCommand("delCharBefore");
+ checkCursorMenu();
+ }
+ });
+ },
+ 'textComplete:hide': function (e) {
+ $(this).data('autocompleting', false);
+ editor.setOption("extraKeys", defaultExtraKeys);
+ }
+ });
\ No newline at end of file
diff --git a/public/js/syncscroll.js b/public/js/syncscroll.js
index 3d97324c..4dee0996 100644
--- a/public/js/syncscroll.js
+++ b/public/js/syncscroll.js
@@ -144,10 +144,14 @@ md.renderer.rules.code = function (tokens, idx /*, options, env */ ) {
return '
' + value;
+ },
+ replace: function (value) {
+ return ':' + value + ':';
+ },
+ index: 1,
+ context: function (text) {
+ check(text);
+ return !isInCode;
+ }
+ },
+ { // Code block language strategy
+ langs: supportCodeModes,
+ match: /(^|\n)```(\w*)$/,
+ search: function (term, callback) {
+ callback($.map(this.langs, function (lang) {
+ return lang.indexOf(term) === 0 ? lang : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (lang) {
+ return '$1```' + lang + '=\n\n```';
+ },
+ done: function () {
+ editor.doc.cm.moveV(-1, "line");
+ },
+ context: function () {
+ return isInCode;
+ }
+ },
+ { //header
+ match: /(?:^|\n)(\s{0,3})(#{1,6}\w*)$/,
+ search: function (term, callback) {
+ callback($.map(supportHeaders, function (header) {
+ return header.search.indexOf(term) === 0 ? header.text : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //referral
+ match: /(^|\n|\s)(\!|\!|\[\])(\w*)$/,
+ search: function (term, callback) {
+ callback($.map(supportReferrals, function (referral) {
+ return referral.search.indexOf(term) === 0 ? referral.text : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //externals
+ match: /(^|\n|\s)\{\}(\w*)$/,
+ search: function (term, callback) {
+ callback($.map(supportExternals, function (external) {
+ return external.search.indexOf(term) === 0 ? external.text : null;
+ }));
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //blockquote personal info & general info
+ match: /(^|\n|\s|\>.*)\[(\w*)=$/,
+ search: function (term, callback) {
+ var list = typeof personalInfo[term] != 'undefined' ? [personalInfo[term]] : [];
+ $.map(supportGenerals, function (general) {
+ if (general.search.indexOf(term) === 0)
+ list.push(general.command());
+ });
+ callback(list);
+ checkCursorMenu();
+ },
+ replace: function (value) {
+ return '$1[$2=' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ },
+ { //blockquote quick start tag
+ match: /(^.*(?!>)\n|)(\>\s{0,1})$/,
+ search: function (term, callback) {
+ var self = '[name=' + personalInfo.name + '] [time=' + moment().format('llll') + '] [color=' + personalInfo.color + ']';
+ callback([self]);
+ checkCursorMenu();
+ },
+ template: function (value) {
+ return '[Your name, time, color tags]';
+ },
+ replace: function (value) {
+ return '$1$2' + value;
+ },
+ context: function (text) {
+ return !isInCode;
+ }
+ }
+], {
+ appendTo: $('.cursor-menu')
+ })
+ .on({
+ 'textComplete:select': function (e, value, strategy) {
+ //NA
+ },
+ 'textComplete:show': function (e) {
+ checkCursorMenu();
+ $(this).data('autocompleting', true);
+ editor.setOption("extraKeys", {
+ "Up": function () {
+ return CodeMirror.PASS;
+ },
+ "Right": function () {
+ editor.doc.cm.execCommand("goCharRight");
+ },
+ "Down": function () {
+ return CodeMirror.PASS;
+ },
+ "Left": function () {
+ editor.doc.cm.execCommand("goCharLeft");
+ },
+ "Enter": function () {
+ return CodeMirror.PASS;
+ },
+ "Backspace": function () {
+ editor.doc.cm.execCommand("delCharBefore");
+ checkCursorMenu();
+ }
+ });
+ },
+ 'textComplete:hide': function (e) {
+ $(this).data('autocompleting', false);
+ editor.setOption("extraKeys", defaultExtraKeys);
+ }
+ });
\ No newline at end of file
diff --git a/public/js/syncscroll.js b/public/js/syncscroll.js
index 3d97324c..4dee0996 100644
--- a/public/js/syncscroll.js
+++ b/public/js/syncscroll.js
@@ -144,10 +144,14 @@ md.renderer.rules.code = function (tokens, idx /*, options, env */ ) {
return '' + Remarkable.utils.escapeHtml(tokens[idx].content) + '';
};
+//var editorScrollThrottle = 100;
+var buildMapThrottle = 100;
+
var viewScrolling = false;
var viewScrollingDelay = 200;
var viewScrollingTimer = null;
+//editor.on('scroll', _.throttle(syncScrollToView, editorScrollThrottle));
editor.on('scroll', syncScrollToView);
ui.area.view.on('scroll', function () {
viewScrolling = true;
@@ -168,10 +172,12 @@ function clearMap() {
lineHeightMap = null;
}
+var buildMap = _.throttle(buildMapInner, buildMapThrottle);
+
// Build offsets for each line (lines can be wrapped)
// That's a bit dirty to process each line everytime, but ok for demo.
// Optimizations are required only for big texts.
-function buildMap() {
+function buildMapInner(syncBack) {
var i, offset, nonEmptyList, pos, a, b, _lineHeightMap, linesCount,
acc, sourceLikeDiv, textarea = ui.area.codemirror,
wrap = $('.CodeMirror-wrap pre'),
@@ -182,8 +188,6 @@ function buildMap() {
visibility: 'hidden',
height: 'auto',
width: wrap.width(),
- padding: wrap.css('padding'),
- margin: wrap.css('margin'),
'font-size': textarea.css('font-size'),
'font-family': textarea.css('font-family'),
'line-height': textarea.css('line-height'),
@@ -198,21 +202,23 @@ function buildMap() {
_lineHeightMap = [];
acc = 0;
- editor.getValue().split('\n').forEach(function (str) {
+ var lines = editor.getValue().split('\n');
+ for (i = 0; i < lines.length; i++) {
+ var str = lines[i];
var h, lh;
_lineHeightMap.push(acc);
if (str.length === 0) {
acc++;
- return;
+ continue;
}
sourceLikeDiv.text(str);
h = parseFloat(sourceLikeDiv.css('height'));
lh = parseFloat(sourceLikeDiv.css('line-height'));
acc += Math.round(h / lh);
- });
+ }
sourceLikeDiv.remove();
_lineHeightMap.push(acc);
linesCount = acc;
@@ -224,9 +230,10 @@ function buildMap() {
nonEmptyList.push(0);
_scrollMap[0] = 0;
- ui.area.markdown.find('.part').each(function (n, el) {
- var $el = $(el),
- t = $el.data('startline') - 1;
+ var parts = ui.area.markdown.find('.part').toArray();
+ for (i = 0; i < parts.length; i++) {
+ var $el = $(parts[i]),
+ t = $el.attr('data-startline') - 1;
if (t === '') {
return;
}
@@ -235,7 +242,7 @@ function buildMap() {
nonEmptyList.push(t);
}
_scrollMap[t] = Math.round($el.offset().top + offset);
- });
+ }
nonEmptyList.push(linesCount);
_scrollMap[linesCount] = ui.area.view[0].scrollHeight;
@@ -256,6 +263,9 @@ function buildMap() {
scrollMap = _scrollMap;
lineHeightMap = _lineHeightMap;
+
+ if(loaded && syncBack)
+ syncScrollToView();
}
function getPartByEditorLineNo(lineNo) {
@@ -290,20 +300,20 @@ function getEditorLineNoByTop(top) {
return null;
}
-function syncScrollToView(_lineNo) {
+function syncScrollToView(event, _lineNo) {
+ if (currentMode != modeType.both) return;
var lineNo, posTo;
var scrollInfo = editor.getScrollInfo();
if (!scrollMap || !lineHeightMap) {
- buildMap();
+ buildMap(true);
+ return;
}
- if (typeof _lineNo != "number") {
+ if (!_lineNo) {
var topDiffPercent, posToNextDiff;
var textHeight = editor.defaultTextHeight();
lineNo = Math.floor(scrollInfo.top / textHeight);
- var lineCount = editor.lineCount();
- var lastLineHeight = editor.getLineHandle(lineCount - 1).height;
- //if reach last line, then scroll to end
- if (scrollInfo.top + scrollInfo.clientHeight >= scrollInfo.height - lastLineHeight) {
+ //if reach bottom, then scroll to end
+ if (scrollInfo.top + scrollInfo.clientHeight >= scrollInfo.height - defaultTextHeight) {
posTo = ui.area.view[0].scrollHeight - ui.area.view.height();
} else {
topDiffPercent = (scrollInfo.top % textHeight) / textHeight;
@@ -316,12 +326,18 @@ function syncScrollToView(_lineNo) {
posTo = scrollMap[lineHeightMap[_lineNo]];
}
var posDiff = Math.abs(ui.area.view.scrollTop() - posTo);
+ var duration = posDiff / 50;
+ ui.area.view.stop(true, true).animate({
+ scrollTop: posTo
+ }, duration >= 100 ? duration : 100, "linear");
+ /*
if (posDiff > scrollInfo.clientHeight / 5) {
var duration = posDiff / 50;
- ui.area.view.stop(true).animate({
+ ui.area.view.stop(true, true).animate({
scrollTop: posTo
- }, duration >= 50 ? duration : 100, "linear");
+ }, duration >= 100 ? duration : 100, "linear");
} else {
- ui.area.view.stop(true).scrollTop(posTo);
+ ui.area.view.stop(true, true).scrollTop(posTo);
}
+ */
}
\ No newline at end of file
--
cgit v1.2.3