Fixed editor copy/paste

This commit is contained in:
benweet 2014-04-19 02:09:25 +01:00
parent 45543f6fd8
commit b5191a7457
6 changed files with 72 additions and 73 deletions

View File

@ -92,8 +92,8 @@ define([
result.push([0, removeDiff[1] + addDiff[1]]); result.push([0, removeDiff[1] + addDiff[1]]);
} }
else { else {
removeDiff[1] = '//' + removeDiff[1] + '//'; removeDiff[1] = '' + removeDiff[1] + '';
addDiff[1] += '//'; addDiff[1] += '';
result.push(removeDiff); result.push(removeDiff);
result.push(addDiff); result.push(addDiff);
} }
@ -330,9 +330,6 @@ define([
if(contentChanged || discussionListChanged) { if(contentChanged || discussionListChanged) {
editor.watcher.noWatch(_.bind(function() { editor.watcher.noWatch(_.bind(function() {
if(contentChanged) { if(contentChanged) {
if(!/\n$/.test(newContent)) {
newContent += '\n';
}
if(fileMgr.currentFile === fileDesc) { if(fileMgr.currentFile === fileDesc) {
editor.setValueNoWatch(newContent); editor.setValueNoWatch(newContent);
editorSelection && editor.selectionMgr.setSelectionStartEnd( editorSelection && editor.selectionMgr.setSelectionStartEnd(

View File

@ -148,17 +148,6 @@ define([
if(end === undefined) { if(end === undefined) {
end = this.selectionEnd; end = this.selectionEnd;
} }
var textContent = inputElt.textContent;
if(start === textContent.length && textContent[textContent.length -1 ] == '\n') {
start--;
range = undefined;
skipSelectionUpdate = false;
}
if(end === textContent.length && textContent[textContent.length - 1] == '\n') {
end--;
range = undefined;
skipSelectionUpdate = false;
}
this.selectionStart = start; this.selectionStart = start;
this.selectionEnd = end; this.selectionEnd = end;
var min = Math.min(start, end); var min = Math.min(start, end);
@ -223,6 +212,9 @@ define([
}; };
})(); })();
this.getCoordinates = function(inputOffset, container, offset) { this.getCoordinates = function(inputOffset, container, offset) {
if(inputOffset === textContent.length) {
return this.getCoordinates(inputOffset - 1);
}
if(!container) { if(!container) {
offset = this.findOffset(inputOffset); offset = this.findOffset(inputOffset);
container = offset.container; container = offset.container;
@ -508,15 +500,17 @@ define([
eventMgr.addListener('onDiscussionRemoved', onComment); eventMgr.addListener('onDiscussionRemoved', onComment);
eventMgr.addListener('onCommentsChanged', onComment); eventMgr.addListener('onCommentsChanged', onComment);
var trailingLfNode;
function checkContentChange() { function checkContentChange() {
var newTextContent = inputElt.textContent; var newTextContent = inputElt.textContent;
if(contentElt.lastChild === trailingLfNode && trailingLfNode.textContent.slice(-1) === '\n') {
newTextContent = newTextContent.slice(0, -1);
}
if(fileChanged === false) { if(fileChanged === false) {
if(newTextContent == textContent) { if(contentElt.children.length && newTextContent == textContent) {
return; return;
} }
if(!/\n$/.test(newTextContent)) {
newTextContent += '\n';
}
undoMgr.currentMode = undoMgr.currentMode || 'typing'; undoMgr.currentMode = undoMgr.currentMode || 'typing';
var discussionList = _.values(fileDesc.discussionList); var discussionList = _.values(fileDesc.discussionList);
fileDesc.newDiscussion && discussionList.push(fileDesc.newDiscussion); fileDesc.newDiscussion && discussionList.push(fileDesc.newDiscussion);
@ -533,11 +527,8 @@ define([
} }
else { else {
textContent = newTextContent; textContent = newTextContent;
if(!/\n$/.test(textContent)) {
textContent += '\n';
fileDesc.content = textContent;
}
selectionMgr.setSelectionStartEnd(fileDesc.editorStart, fileDesc.editorEnd); selectionMgr.setSelectionStartEnd(fileDesc.editorStart, fileDesc.editorEnd);
selectionMgr.saveSelectionState();
eventMgr.onFileOpen(fileDesc, textContent); eventMgr.onFileOpen(fileDesc, textContent);
previewElt.scrollTop = fileDesc.previewScrollTop; previewElt.scrollTop = fileDesc.previewScrollTop;
scrollTop = fileDesc.editorScrollTop; scrollTop = fileDesc.editorScrollTop;
@ -713,8 +704,10 @@ define([
actions[action](state, options); actions[action](state, options);
setValue(state.before + state.selection + state.after); setValue(state.before + state.selection + state.after);
selectionMgr.setSelectionStartEnd(state.selectionStart, state.selectionEnd); _.defer(function() {
$inputElt.trigger('input'); selectionMgr.setSelectionStartEnd(state.selectionStart, state.selectionEnd);
//$inputElt.trigger('input');
});
}; };
var actions = { var actions = {
@ -855,7 +848,6 @@ define([
if(fileChanged === true) { if(fileChanged === true) {
contentElt.innerHTML = ''; contentElt.innerHTML = '';
contentElt.appendChild(newSectionEltList); contentElt.appendChild(newSectionEltList);
selectionMgr.setSelectionStartEnd();
} }
else { else {
// Remove outdated sections // Remove outdated sections
@ -880,8 +872,10 @@ define([
} }
childNode = nextNode; childNode = nextNode;
} }
selectionMgr.setSelectionStartEnd();
} }
trailingLfNode = document.createTextNode('\n');
contentElt.appendChild(trailingLfNode);
selectionMgr.setSelectionStartEnd();
}); });
} }

View File

@ -39,29 +39,25 @@ define([
selectionMgr = editor.selectionMgr; selectionMgr = editor.selectionMgr;
}; };
var offsetMap = {}; var yList = [];
function setCommentEltCoordinates(commentElt, y) { function setCommentEltCoordinates(commentElt, y, isNew) {
var lineIndex = Math.round(y / 5); y = Math.round(y);
// Try to find the nearest existing lineIndex var yListIndex = y - 21;
if(offsetMap.hasOwnProperty(lineIndex)) { // Avoid overlap of comment icons
// Keep current lineIndex while(yListIndex < y + 22) {
} if(yList[yListIndex]) {
else if(offsetMap.hasOwnProperty(lineIndex - 1)) { y = yListIndex + 22;
lineIndex--; }
} yListIndex++;
else if(offsetMap.hasOwnProperty(lineIndex + 1)) {
lineIndex++;
} }
!isNew && (yList[y] = 1);
var yOffset = -8; var yOffset = -8;
if(commentElt.className.indexOf(' icon-split') !== -1) { if(commentElt.className.indexOf(' icon-split') !== -1) {
yOffset = -12; yOffset = -12;
} }
var top = y + yOffset; var top = y + yOffset;
var right = (offsetMap[lineIndex] || 0) * 25 + 10;
commentElt.orderedIndex = lineIndex * 10000 + right;
commentElt.style.top = top + 'px'; commentElt.style.top = top + 'px';
commentElt.style.right = right + 'px'; commentElt.style.right = '12px';
return lineIndex;
} }
var inputElt; var inputElt;
@ -116,8 +112,10 @@ define([
someReplies = false; someReplies = false;
sortedCommentEltList = []; sortedCommentEltList = [];
var author = storage['author.name']; var author = storage['author.name'];
offsetMap = {}; yList = [];
var discussionList = _.values(currentFileDesc.discussionList); var discussionList = _.sortBy(currentFileDesc.discussionList, function(discussion) {
return discussion.selectionEnd;
});
function refreshOne() { function refreshOne() {
var coordinates; var coordinates;
if(discussionList.length === 0) { if(discussionList.length === 0) {
@ -131,19 +129,19 @@ define([
// Move newCommentElt // Move newCommentElt
if(currentContext && !currentContext.discussionIndex) { if(currentContext && !currentContext.discussionIndex) {
coordinates = selectionMgr.getCoordinates(currentContext.getDiscussion().selectionEnd); coordinates = selectionMgr.getCoordinates(currentContext.getDiscussion().selectionEnd);
setCommentEltCoordinates(newCommentElt, coordinates.y); setCommentEltCoordinates(newCommentElt, coordinates.y, true);
inputElt.scrollTop += parseInt(newCommentElt.style.top) - inputElt.scrollTop - inputElt.offsetHeight * 3 / 4; inputElt.scrollTop += parseInt(newCommentElt.style.top) - inputElt.scrollTop - inputElt.offsetHeight * 3 / 4;
movePopover(newCommentElt); movePopover(newCommentElt);
} }
sortedCommentEltList = _.sortBy(commentEltMap, function(commentElt) { sortedCommentEltList = _.sortBy(commentEltMap, function(commentElt) {
return commentElt.orderedIndex; return commentElt.selectionEnd;
}); });
$openDiscussionElt.toggleClass('some', sortedCommentEltList.length !== 0); $openDiscussionElt.toggleClass('some', sortedCommentEltList.length !== 0);
$openDiscussionElt.toggleClass('replied', someReplies); $openDiscussionElt.toggleClass('replied', someReplies);
$openDiscussionIconElt.toggleClass('icon-chat', sortedCommentEltList.length !== 0); $openDiscussionIconElt.toggleClass('icon-chat', sortedCommentEltList.length !== 0);
return; return;
} }
var discussion = discussionList.pop(); var discussion = discussionList.shift();
var commentElt = commentEltMap[discussion.discussionIndex]; var commentElt = commentEltMap[discussion.discussionIndex];
if(!commentElt) { if(!commentElt) {
commentElt = crel('a'); commentElt = crel('a');
@ -160,9 +158,9 @@ define([
className += isReplied ? ' replied' : ' added'; className += isReplied ? ' replied' : ' added';
commentElt.className = className; commentElt.className = className;
commentElt.discussionIndex = discussion.discussionIndex; commentElt.discussionIndex = discussion.discussionIndex;
commentElt.selectionEnd = discussion.selectionEnd;
coordinates = selectionMgr.getCoordinates(discussion.selectionEnd); coordinates = selectionMgr.getCoordinates(discussion.selectionEnd);
var lineIndex = setCommentEltCoordinates(commentElt, coordinates.y); setCommentEltCoordinates(commentElt, coordinates.y);
offsetMap[lineIndex] = (offsetMap[lineIndex] || 0) + 1;
marginElt.appendChild(commentElt); marginElt.appendChild(commentElt);
commentEltMap[discussion.discussionIndex] = commentElt; commentEltMap[discussion.discussionIndex] = commentElt;
@ -268,9 +266,10 @@ define([
inputElt = document.getElementById('wmd-input'); inputElt = document.getElementById('wmd-input');
marginElt = document.querySelector('#wmd-input > .editor-margin'); marginElt = document.querySelector('#wmd-input > .editor-margin');
marginElt.appendChild(newCommentElt); marginElt.appendChild(newCommentElt);
$(document.body).append(crel('div', { var $popoverContainer = $(crel('div', {
class: 'comments-popover' class: 'comments-popover'
})).on('click', function(evt) { }));
$(document.body).append($popoverContainer).on('click', function(evt) {
// Close on click outside the popover // Close on click outside the popover
if(currentContext && currentContext.$commentElt[0] !== evt.target) { if(currentContext && currentContext.$commentElt[0] !== evt.target) {
closeCurrentPopover(); closeCurrentPopover();
@ -300,7 +299,8 @@ define([
return content; return content;
}, },
selector: '#wmd-input > .editor-margin > .discussion' selector: '#wmd-input > .editor-margin > .discussion'
}).on('show.bs.popover', '#wmd-input > .editor-margin', function(evt) { });
$(marginElt).on('show.bs.popover', function(evt) {
closeCurrentPopover(); closeCurrentPopover();
var context = new Context(evt.target, currentFileDesc); var context = new Context(evt.target, currentFileDesc);
currentContext = context; currentContext = context;
@ -323,12 +323,12 @@ define([
}; };
currentFileDesc.newDiscussion = discussion; currentFileDesc.newDiscussion = discussion;
var coordinates = selectionMgr.getCoordinates(selectionStart); var coordinates = selectionMgr.getCoordinates(selectionStart);
setCommentEltCoordinates(newCommentElt, coordinates.y); setCommentEltCoordinates(newCommentElt, coordinates.y, true);
} }
context.selectionRange = selectionMgr.createRange(discussion.selectionStart, discussion.selectionEnd); context.selectionRange = selectionMgr.createRange(discussion.selectionStart, discussion.selectionEnd);
inputElt.scrollTop += parseInt(evt.target.style.top) - inputElt.scrollTop - inputElt.offsetHeight * 3 / 4; inputElt.scrollTop += parseInt(evt.target.style.top) - inputElt.scrollTop - inputElt.offsetHeight * 3 / 4;
}).on('shown.bs.popover', '#wmd-input > .editor-margin', function(evt) { }).on('shown.bs.popover', function(evt) {
var context = currentContext; var context = currentContext;
var popoverElt = context.getPopoverElt(); var popoverElt = context.getPopoverElt();
context.$authorInputElt = $(popoverElt.querySelector('.input-comment-author')).val(storage['author.name']); context.$authorInputElt = $(popoverElt.querySelector('.input-comment-author')).val(storage['author.name']);
@ -407,11 +407,6 @@ define([
$removeButton.hide(); $removeButton.hide();
} }
// Prevent from closing on click inside the popover
$(popoverElt).on('click', function(evt) {
evt.stopPropagation();
});
// Highlight selected text // Highlight selected text
context.rangyRange = rangy.createRange(); context.rangyRange = rangy.createRange();
context.rangyRange.setStart(context.selectionRange.startContainer, context.selectionRange.startOffset); context.rangyRange.setStart(context.selectionRange.startContainer, context.selectionRange.startOffset);
@ -424,7 +419,7 @@ define([
// Focus on textarea // Focus on textarea
context.$contentInputElt.focus().val(previousContent); context.$contentInputElt.focus().val(previousContent);
}).on('hide.bs.popover', '#wmd-input > .editor-margin', function() { }).on('hide.bs.popover', function() {
if(!currentContext) { if(!currentContext) {
return; return;
} }
@ -440,6 +435,12 @@ define([
delete currentFileDesc.newDiscussion; delete currentFileDesc.newDiscussion;
}); });
// Prevent from closing on click inside the popover
$popoverContainer.on('click', '.popover', function(evt) {
evt.stopPropagation();
});
var $newCommentElt = $(newCommentElt); var $newCommentElt = $(newCommentElt);
$openDiscussionElt = $('.button-open-discussion').click(function(evt) { $openDiscussionElt = $('.button-open-discussion').click(function(evt) {
var $commentElt = $newCommentElt; var $commentElt = $newCommentElt;

View File

@ -146,14 +146,16 @@ define([
var navbarInnerElt; var navbarInnerElt;
var navbarDropdownElt; var navbarDropdownElt;
var $navbarDropdownBtnElt; var $navbarDropdownBtnElt;
var navbarTitleElt; var navbarTitleContainerElt;
var $navbarTitleElt;
var navbarBtnGroups = []; var navbarBtnGroups = [];
var navbarBtnGroupsWidth = [80, 80, 160, 160, 80, 40].map(function(width) { var navbarBtnGroupsWidth = [80, 80, 160, 160, 80, 40].map(function(width) {
return width + 18; // Add margin return width + 18; // Add margin
}); });
var navbarMarginWidth = 18 * 2 + 25 + 25; var navbarMarginWidth = 18 * 2 + 25 + 25;
var buttonsDropdownWidth = 40; var buttonsDropdownWidth = 40;
var titleWidth = 18 + 350; var titleMinWidth = 200;
var workingIndicatorWidth = 18 + 70;
function onResize() { function onResize() {
var editorPadding = (editor.elt.offsetWidth - getMaxWidth()) / 2; var editorPadding = (editor.elt.offsetWidth - getMaxWidth()) / 2;
@ -172,7 +174,8 @@ define([
previewContentElt.style.paddingRight = previewPadding + 'px'; previewContentElt.style.paddingRight = previewPadding + 'px';
if(!window.viewerMode) { if(!window.viewerMode) {
var maxWidth = navbarMarginWidth + titleWidth + buttonsDropdownWidth; var maxWidth = navbarMarginWidth + workingIndicatorWidth + titleMinWidth + buttonsDropdownWidth;
var titleWidth = windowSize.width - maxWidth + titleMinWidth;
navbarBtnGroups.forEach(function(group, index) { navbarBtnGroups.forEach(function(group, index) {
maxWidth += group.width; maxWidth += group.width;
index === navbarBtnGroups.length - 1 && (maxWidth -= buttonsDropdownWidth); index === navbarBtnGroups.length - 1 && (maxWidth -= buttonsDropdownWidth);
@ -180,9 +183,13 @@ define([
navbarDropdownElt.appendChild(group.elt); navbarDropdownElt.appendChild(group.elt);
} }
else { else {
navbarInnerElt.insertBefore(group.elt, navbarTitleElt); navbarInnerElt.insertBefore(group.elt, navbarTitleContainerElt);
titleWidth = windowSize.width - maxWidth + titleMinWidth;
} }
}); });
$navbarTitleElt.css({
maxWidth: titleWidth
});
$navbarDropdownBtnElt.toggleClass('hide', navbarDropdownElt.children.length === 0); $navbarDropdownBtnElt.toggleClass('hide', navbarDropdownElt.children.length === 0);
} }
@ -323,7 +330,8 @@ define([
navbarInnerElt = navbar.elt.querySelector('.navbar-inner'); navbarInnerElt = navbar.elt.querySelector('.navbar-inner');
navbarDropdownElt = navbar.elt.querySelector('.buttons-dropdown .dropdown-menu'); navbarDropdownElt = navbar.elt.querySelector('.buttons-dropdown .dropdown-menu');
$navbarDropdownBtnElt = navbar.$elt.find('.buttons-dropdown'); $navbarDropdownBtnElt = navbar.$elt.find('.buttons-dropdown');
navbarTitleElt = navbar.elt.querySelector('.title-container'); navbarTitleContainerElt = navbar.elt.querySelector('.title-container');
$navbarTitleElt = navbar.$elt.find('.file-title-navbar, .input-file-title');
_.each(navbar.elt.querySelectorAll('.right-buttons'), function(btnGroupElt) { _.each(navbar.elt.querySelectorAll('.right-buttons'), function(btnGroupElt) {
navbarBtnGroups.push({ navbarBtnGroups.push({

View File

@ -255,7 +255,7 @@ Prism.languages.md = (function() {
strong: md.strong, strong: md.strong,
em: md.em, em: md.em,
strike: md.strike, strike: md.strike,
conflict: /\/\//g, conflict: //g,
comment: Prism.languages.markup.comment, comment: Prism.languages.markup.comment,
tag: Prism.languages.markup.tag, tag: Prism.languages.markup.tag,
entity: Prism.languages.markup.entity entity: Prism.languages.markup.entity
@ -275,7 +275,7 @@ Prism.languages.md = (function() {
fn: md.fn, fn: md.fn,
link: md.link, link: md.link,
linkref: md.linkref, linkref: md.linkref,
conflict: /\/\//g, conflict: //g,
}; };
md.strong.inside.rest = rest; md.strong.inside.rest = rest;
md.em.inside.rest = rest; md.em.inside.rest = rest;
@ -286,7 +286,7 @@ Prism.languages.md = (function() {
strong: md.strong, strong: md.strong,
em: md.em, em: md.em,
strike: md.strike, strike: md.strike,
conflict: /\/\//g, conflict: //g,
comment: Prism.languages.markup.comment, comment: Prism.languages.markup.comment,
tag: Prism.languages.markup.tag, tag: Prism.languages.markup.tag,
entity: Prism.languages.markup.entity entity: Prism.languages.markup.entity

View File

@ -50,7 +50,7 @@
@jgrowl-bg-color: fade(@modal-backdrop-bg, 90%); @jgrowl-bg-color: fade(@modal-backdrop-bg, 90%);
/* Sizes */ /* Sizes */
@file-title-width: 280px; @title-max-width: 400px;
@menu-panel-width: 280px; @menu-panel-width: 280px;
@document-panel-width: 320px; @document-panel-width: 320px;
@jgrowl-width: 260px; @jgrowl-width: 260px;
@ -487,7 +487,6 @@ a {
font-size: 1.5em; font-size: 1.5em;
line-height: 1.4em; line-height: 1.4em;
font-weight: 200; font-weight: 200;
max-width: @file-title-width;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
} }
@ -496,7 +495,7 @@ a {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
.input-file-title { .input-file-title {
width: @file-title-width; width: @title-max-width;
font-size: 16px; font-size: 16px;
height: @input-height-slim; height: @input-height-slim;
} }