Fixed scroll link

This commit is contained in:
benweet 2013-06-05 23:29:32 +01:00
parent 9ff6ea2101
commit ce16a3cc2e
2 changed files with 31 additions and 25 deletions

View File

@ -207,24 +207,37 @@ define([
fileDesc = fileDescParam; fileDesc = fileDescParam;
documentContent = undefined; documentContent = undefined;
var initDocumentContent = fileDesc.content; var initDocumentContent = fileDesc.content;
$("#wmd-input").val(initDocumentContent); var editorElt = $("#wmd-input");
editorElt.val(initDocumentContent);
if(editor !== undefined) { if(editor !== undefined) {
// If the editor is already created // If the editor is already created
undoManager.reinit(initDocumentContent, fileDesc.editorStart, fileDesc.editorEnd, fileDesc.editorScrollTop); undoManager.reinit(initDocumentContent, fileDesc.editorStart, fileDesc.editorEnd, fileDesc.editorScrollTop);
editor.refreshPreview(); editor.refreshPreview();
return; return;
} }
// Store scrollTop on scroll event var previewContainerElt = $(".preview-container");
$("#wmd-input").scroll(function() {
// Store editor scrollTop on scroll event
editorElt.scroll(function() {
if(documentContent !== undefined) { if(documentContent !== undefined) {
fileDesc.editorScrollTop = $(this).scrollTop(); fileDesc.editorScrollTop = $(this).scrollTop();
} }
}); });
$(".preview-container").scroll(function() { // Store editor selection on change
editorElt.bind("keyup mouseup", function() {
if(documentContent !== undefined) {
fileDesc.editorStart = this.selectionStart;
fileDesc.editorEnd = this.selectionEnd;
}
});
// Store preview scrollTop on scroll event
previewContainerElt.scroll(function() {
if(documentContent !== undefined) { if(documentContent !== undefined) {
fileDesc.previewScrollTop = $(this).scrollTop(); fileDesc.previewScrollTop = $(this).scrollTop();
} }
}); });
// Create the converter and the editor
var converter = new Markdown.Converter(); var converter = new Markdown.Converter();
editor = new Markdown.Editor(converter); editor = new Markdown.Editor(converter);
// Custom insert link dialog // Custom insert link dialog
@ -243,7 +256,7 @@ define([
}); });
function checkDocumentChanges() { function checkDocumentChanges() {
var newDocumentContent = $("#wmd-input").val(); var newDocumentContent = editorElt.val();
if(documentContent !== undefined && documentContent != newDocumentContent) { if(documentContent !== undefined && documentContent != newDocumentContent) {
fileDesc.content = newDocumentContent; fileDesc.content = newDocumentContent;
} }
@ -256,8 +269,8 @@ define([
return function() { return function() {
if(documentContent === undefined) { if(documentContent === undefined) {
makePreview(); makePreview();
$("#wmd-input").scrollTop(fileDesc.editorScrollTop); editorElt.scrollTop(fileDesc.editorScrollTop);
$(".preview-container").scrollTop(fileDesc.previewScrollTop); previewContainerElt.scrollTop(fileDesc.previewScrollTop);
} }
else { else {
debouncedMakePreview(); debouncedMakePreview();
@ -271,7 +284,7 @@ define([
return function() { return function() {
makePreview(); makePreview();
if(documentContent === undefined) { if(documentContent === undefined) {
$(".preview-container").scrollTop(fileDesc.previewScrollTop); previewContainerElt.scrollTop(fileDesc.previewScrollTop);
} }
checkDocumentChanges(); checkDocumentChanges();
}; };
@ -281,12 +294,6 @@ define([
editor.hooks.chain("onPreviewRefresh", extensionMgr.onAsyncPreview); editor.hooks.chain("onPreviewRefresh", extensionMgr.onAsyncPreview);
undoManager = editor.run(previewWrapper); undoManager = editor.run(previewWrapper);
undoManager.reinit(initDocumentContent, fileDesc.editorStart, fileDesc.editorEnd, fileDesc.editorScrollTop); undoManager.reinit(initDocumentContent, fileDesc.editorStart, fileDesc.editorEnd, fileDesc.editorScrollTop);
$("#wmd-input").bind("keydown click focus", function(event) {
if(documentContent !== undefined) {
fileDesc.editorStart = this.selectionStart;
fileDesc.editorEnd = this.selectionEnd;
}
});
// Hide default buttons // Hide default buttons
$(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)").addClass("btn").css("left", 0).find("span").hide(); $(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)").addClass("btn").css("left", 0).find("span").hide();

View File

@ -23,6 +23,8 @@ define([
function pxToFloat(px) { function pxToFloat(px) {
return parseFloat(px.substring(0, px.length - 2)); return parseFloat(px.substring(0, px.length - 2));
} }
var lastEditorScrollTop = undefined;
var lastPreviewScrollTop = undefined;
var buildSections = _.debounce(function() { var buildSections = _.debounce(function() {
// Try to find Markdown sections by looking for titles // Try to find Markdown sections by looking for titles
@ -30,9 +32,9 @@ define([
mdSectionList = []; mdSectionList = [];
// This textarea is used to measure sections height // This textarea is used to measure sections height
var textareaElt = $("#md-section-helper"); var textareaElt = $("#md-section-helper");
// It has to be the same width than wmd-input // It has to be the same width as wmd-input
textareaElt.width(editorElt.width()); textareaElt.width(editorElt.width());
// Consider wmd-input top padding // Consider wmd-input top padding (will be used for 1st and last section)
var padding = pxToFloat(editorElt.css('padding-top')); var padding = pxToFloat(editorElt.css('padding-top'));
var offset = 0, mdSectionOffset = 0; var offset = 0, mdSectionOffset = 0;
function addMdSection(sectionText) { function addMdSection(sectionText) {
@ -95,14 +97,11 @@ define([
}); });
// apply Scroll Link // apply Scroll Link
lastEditorScrollTop = -10; lastEditorScrollTop = editorElt.scrollTop();
lastPreviewScrollTop = -10; lastPreviewScrollTop = previewScrollTop;
runScrollLink(); runScrollLink();
}, 500); }, 500);
// -10 to be sure the gap is more than 9px
var lastEditorScrollTop = -10;
var lastPreviewScrollTop = -10;
var isScrollEditor = false; var isScrollEditor = false;
var isScrollPreview = false; var isScrollPreview = false;
var runScrollLink = _.debounce(function() { var runScrollLink = _.debounce(function() {
@ -122,7 +121,6 @@ define([
}); });
if(srcSection === undefined) { if(srcSection === undefined) {
// Something wrong in the algorithm... // Something wrong in the algorithm...
callback(-10);
return; return;
} }
var posInSection = (srcScrollTop - srcSection.startOffset) / srcSection.height; var posInSection = (srcScrollTop - srcSection.startOffset) / srcSection.height;
@ -170,12 +168,12 @@ define([
}; };
scrollLink.onLayoutCreated = function() { scrollLink.onLayoutCreated = function() {
$(".preview-container").bind("keydown click focus mousewheel", function() { $(".preview-container").bind("keyup mouseup mousewheel", function() {
isScrollPreview = true; isScrollPreview = true;
isScrollEditor = false; isScrollEditor = false;
runScrollLink(); runScrollLink();
}); });
$("#wmd-input").bind("keydown click focus mousewheel", function() { $("#wmd-input").bind("keyup mouseup mousewheel", function() {
isScrollEditor = true; isScrollEditor = true;
isScrollPreview = false; isScrollPreview = false;
runScrollLink(); runScrollLink();
@ -186,7 +184,8 @@ define([
editor.getConverter().hooks.chain("postConversion", function(text) { editor.getConverter().hooks.chain("postConversion", function(text) {
// To avoid losing scrolling position before elements are fully // To avoid losing scrolling position before elements are fully
// loaded // loaded
$("#wmd-preview").height($("#wmd-preview").height()); var previewElt = $("#wmd-preview");
previewElt.height(previewElt.height());
return text; return text;
}); });
}; };