More enhancements to listview animations

Now we've got navigation scrolling back

core/modules/macros/scrollable.js

@@ -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;
+	}
 };
 
 })();