mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-10-28 14:17:39 +00:00
Code Issues Releases Wiki Activity

More enhancements to listview animations

Browse Source 
Now we've got navigation scrolling back
This commit is contained in:
Jeremy Ruston
2012-11-03 16:14:00 +00:00
parent 5443c8243a
commit 3d747499cb
9 changed files with 82 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
core/modules/macros/list/listviews/classic.js
View File

@@ -25,20 +25,8 @@ ClassicListView.prototype.navigateTo = function(historyInfo) {
var listElementIndex = this.listMacro.findListElementByTitle(0,historyInfo.title),
listElementNode = this.listMacro.listFrame.children[listElementIndex],
targetElement = listElementNode.domNode;
// Get the current height of the element
var currHeight = targetElement.offsetHeight;
// Compute the start and end positions of the target element
var srcRect = historyInfo.fromPageRect;
if(!srcRect) {
srcRect = {left: 0, top: 0, width: window.innerWidth, height: window.innerHeight};
};
var dstRect = targetElement.getBoundingClientRect();
// $tw.sprite.fly(srcRect,dstRect,{
// text: "Flying along at the speed of pixels\n\n\nBoo",
// style: "background:red;"
// });
// Scroll the target element into view
// $tw.scroller.scrollIntoView(dstRect);
// Scroll the node into view
$tw.scroller.scrollIntoView(targetElement);
};
ClassicListView.prototype.insert = function(index) {

8
core/modules/macros/list/listviews/sideways.js
View File

@@ -27,6 +27,14 @@ function SidewaysListView(listMacro) {
}
}
SidewaysListView.prototype.navigateTo = function(historyInfo) {
var listElementIndex = this.listMacro.findListElementByTitle(0,historyInfo.title),
listElementNode = this.listMacro.listFrame.children[listElementIndex],
targetElement = listElementNode.domNode;
// Scroll the node into view
$tw.scroller.scrollIntoView(targetElement);
};
SidewaysListView.prototype.insert = function(index) {
var listElementNode = this.listMacro.listFrame.children[index],
targetElement = listElementNode.domNode,

39
core/modules/macros/scrollable.js
View File

@@ -35,6 +35,7 @@ exports.executeMacro = function() {
"class": outerClasses,
style: {
overflow: "scroll",
webkitOverflowScrolling: "touch",
"white-space": "nowrap"
}
};
@@ -57,6 +58,44 @@ exports.executeMacro = function() {
};
exports.postRenderInDom = function() {
// Attach a scrollTo() method to the outer wrapper
var self = this;
this.child.children[0].domNode.scrollTo = function(bounds) {
self.scrollTo.call(self,bounds);
};
};
var slowInSlowOut = function(t) {
return (1 - ((Math.cos(t * Math.PI) + 1) / 2));
};
exports.scrollTo = function(bounds) {
this.cancelScroll();
this.startTime = new Date();
this.startX = this.child.domNode.scrollLeft;
this.startY = this.child.domNode.scrollTop;
this.endX = bounds.left;
this.endY = bounds.top;
if((this.endX < this.startX) || (this.endX > (this.startX + this.child.domNode.offsetWidth)) || (this.endY < this.startY) || (this.endY > (this.startY + this.child.domNode.offsetHeight))) {
var self = this;
this.scrollTimerId = window.setInterval(function() {
var t = ((new Date()) - self.startTime) / $tw.config.preferences.animationDuration;
if(t >= 1) {
self.cancelScroll();
t = 1;
}
t = slowInSlowOut(t);
self.child.domNode.scrollLeft = self.startX + (self.endX - self.startX) * t
self.child.domNode.scrollTop = self.startY + (self.endY - self.startY) * t;
}, 10);
}
};
exports.cancelScroll = function() {
if(this.scrollTimerId) {
window.clearInterval(this.scrollTimerId);
this.scrollTimerId = null;
}
};
})();