caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tweaked scroll link to perform simultaneous synchronization

Browse Source
This commit is contained in:
benweet 2013-12-02 22:10:19 +00:00
parent ad435f0730
commit 180e98219e
1 changed files with 44 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
public/res/extensions/scrollLink.js
View File

@ -87,7 +87,8 @@ define([
var isScrollPreview = false; var isScrollPreview = false;
var isEditorMoving = false; var isEditorMoving = false;
var isPreviewMoving = false; var isPreviewMoving = false;
var doScrollLink = _.debounce(function() { var scrollingHelper = $('<div>');
var doScrollLink = _.throttle(function() {
if(mdSectionList.length === 0 || mdSectionList.length !== htmlSectionList.length) { if(mdSectionList.length === 0 || mdSectionList.length !== htmlSectionList.length) {
// Delay // Delay
doScrollLink(); doScrollLink();
@ -112,7 +113,10 @@ define([
} }
var destScrollTop; var destScrollTop;
// Perform the animation if diff > 9px // Perform the animation if diff > 9px
if(isScrollEditor === true && Math.abs(editorScrollTop - lastEditorScrollTop) > 9) { if(isScrollEditor === true) {
if(Math.abs(editorScrollTop - lastEditorScrollTop) <= 9) {
return;
}
isScrollEditor = false; isScrollEditor = false;
// Animate the preview // Animate the preview
lastEditorScrollTop = editorScrollTop; lastEditorScrollTop = editorScrollTop;
@ -124,25 +128,28 @@ define([
if(Math.abs(destScrollTop - previewScrollTop) <= 9) { if(Math.abs(destScrollTop - previewScrollTop) <= 9) {
// Skip the animation if diff is <= 9 // Skip the animation if diff is <= 9
lastPreviewScrollTop = previewScrollTop; lastPreviewScrollTop = previewScrollTop;
return;
} }
else { $previewElt.stop(true).animate({
isPreviewMoving = true;
$previewElt.animate({
scrollTop: destScrollTop scrollTop: destScrollTop
}, { }, {
easing: 'easeOutSine', easing: 'easeOutSine',
complete: function() { duration: 200,
lastPreviewScrollTop = destScrollTop; step: function(now) {
isPreviewMoving = true;
lastPreviewScrollTop = previewScrollTop + now;
}, },
always: function() { done: function() {
_.defer(function() { _.defer(function() {
isPreviewMoving = false; isPreviewMoving = false;
}); });
} },
}); });
} }
else if(isScrollPreview === true) {
if(Math.abs(previewScrollTop - lastPreviewScrollTop) <= 9) {
return;
} }
else if(isScrollPreview === true && Math.abs(previewScrollTop - lastPreviewScrollTop) > 9) {
isScrollPreview = false; isScrollPreview = false;
// Animate the editor // Animate the editor
lastPreviewScrollTop = previewScrollTop; lastPreviewScrollTop = previewScrollTop;
@ -156,28 +163,26 @@ define([
if(Math.abs(destScrollTop - editorScrollTop) <= 9) { if(Math.abs(destScrollTop - editorScrollTop) <= 9) {
// Skip the animation if diff is <= 9 // Skip the animation if diff is <= 9
lastEditorScrollTop = editorScrollTop; lastEditorScrollTop = editorScrollTop;
return;
} }
else { scrollingHelper.stop(true).css('value', 0).animate({
isEditorMoving = true;
$("<div>").animate({
value: destScrollTop - editorScrollTop value: destScrollTop - editorScrollTop
}, { }, {
easing: 'easeOutSine', easing: 'easeOutSine',
duration: 200,
step: function(now) { step: function(now) {
aceEditor.session.setScrollTop(editorScrollTop + now); isEditorMoving = true;
lastEditorScrollTop = editorScrollTop + now;
aceEditor.session.setScrollTop(lastEditorScrollTop);
}, },
complete: function() { done: function() {
lastEditorScrollTop = destScrollTop; setTimeout(function() {
},
always: function() {
_.defer(function() {
isEditorMoving = false; isEditorMoving = false;
}); });
} },
}); });
} }
} }, 100);
}, 500);
scrollLink.onLayoutResize = function() { scrollLink.onLayoutResize = function() {
isScrollEditor = true; isScrollEditor = true;