mui_app_rails 0.0.1 → 0.0.2

data/app/assets/javascripts/mui_app_rails/mui.class.scroll.js

@@ -1,894 +0,0 @@
-(function($, window, document, undefined) {
-	var CLASS_SCROLLBAR = $.className('scrollbar');
-	var CLASS_INDICATOR = $.className('scrollbar-indicator');
-	var CLASS_SCROLLBAR_VERTICAL = CLASS_SCROLLBAR + '-vertical';
-	var CLASS_SCROLLBAR_HORIZONTAL = CLASS_SCROLLBAR + '-horizontal';
-
-	var CLASS_ACTIVE = $.className('active');
-
-	var ease = {
-		quadratic: {
-			style: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)',
-			fn: function(k) {
-				return k * (2 - k);
-			}
-		},
-		circular: {
-			style: 'cubic-bezier(0.1, 0.57, 0.1, 1)',
-			fn: function(k) {
-				return Math.sqrt(1 - (--k * k));
-			}
-		}
-	}
-	var Scroll = $.Class.extend({
-		init: function(element, options) {
-			this.wrapper = this.element = element;
-			this.scroller = this.wrapper.children[0];
-			this.scrollerStyle = this.scroller && this.scroller.style;
-			this.stopped = false;
-
-			this.options = $.extend(true, {
-				scrollY: true,
-				scrollX: false,
-				startX: 0,
-				startY: 0,
-				indicators: true,
-				stopPropagation: false,
-				hardwareAccelerated: true,
-				fixedBadAndorid: false,
-				preventDefaultException: {
-					tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT)$/
-				},
-				momentum: true,
-
-				snap: false,
-
-				bounce: true,
-				bounceTime: 300,
-				bounceEasing: ease.circular.style,
-
-				directionLockThreshold: 5,
-
-				parallaxElement: false,
-				parallaxRatio: 0.5
-			}, options);
-
-			this.x = 0;
-			this.y = 0;
-			this.translateZ = this.options.hardwareAccelerated ? ' translateZ(0)' : '';
-
-			this._init();
-			if (this.scroller) {
-				this.refresh();
-				//				if (this.options.startX !== 0 || this.options.startY !== 0) { //需要判断吗？后续根据实际情况再看看
-				this.scrollTo(this.options.startX, this.options.startY);
-				//				}
-			}
-		},
-		_init: function() {
-			this._initParallax();
-			this._initIndicators();
-			this._initEvent();
-		},
-		_initParallax: function() {
-			if (this.options.parallaxElement) {
-				this.parallaxElement = document.querySelector(this.options.parallaxElement);
-				this.parallaxStyle = this.parallaxElement.style;
-				this.parallaxHeight = this.parallaxElement.offsetHeight;
-				this.parallaxImgStyle = this.parallaxElement.querySelector('img').style;
-			}
-		},
-		_initIndicators: function() {
-			var self = this;
-			self.indicators = [];
-			if (!this.options.indicators) {
-				return;
-			}
-			var indicators = [],
-				indicator;
-
-			// Vertical scrollbar
-			if (self.options.scrollY) {
-				indicator = {
-					el: this._createScrollBar(CLASS_SCROLLBAR_VERTICAL),
-					listenX: false
-				};
-
-				this.wrapper.appendChild(indicator.el);
-				indicators.push(indicator);
-			}
-
-			// Horizontal scrollbar
-			if (this.options.scrollX) {
-				indicator = {
-					el: this._createScrollBar(CLASS_SCROLLBAR_HORIZONTAL),
-					listenY: false
-				};
-
-				this.wrapper.appendChild(indicator.el);
-				indicators.push(indicator);
-			}
-
-			for (var i = indicators.length; i--;) {
-				this.indicators.push(new Indicator(this, indicators[i]));
-			}
-
-			this.wrapper.addEventListener('scrollend', function() {
-				self.indicators.map(function(indicator) {
-					indicator.fade();
-				});
-			});
-
-			this.wrapper.addEventListener('scrollstart', function() {
-				self.indicators.map(function(indicator) {
-					indicator.fade(1);
-				});
-			});
-
-			//			this.wrapper.addEventListener('beforescrollstart', function() {
-			//				self.indicators.map(function(indicator) {
-			//					indicator.fade(1, true);
-			//				});
-			//			});
-
-			this.wrapper.addEventListener('refresh', function() {
-				self.indicators.map(function(indicator) {
-					indicator.refresh();
-				});
-			});
-		},
-		_initSnap: function() {
-			this.currentPage = {};
-			this.pages = [];
-			var snaps = this.snaps;
-			var length = snaps.length;
-			var m = 0;
-			var n = -1;
-			var x = 0;
-			var cx = 0;
-			for (var i = 0; i < length; i++) {
-				var snap = snaps[i];
-				var offsetLeft = snap.offsetLeft;
-				var offsetWidth = snap.offsetWidth;
-				if (i === 0 || offsetLeft <= snaps[i - 1].offsetLeft) {
-					m = 0;
-					n++;
-				}
-				if (!this.pages[m]) {
-					this.pages[m] = [];
-				}
-				x = this._getSnapX(offsetLeft);
-				cx = x - Math.round((offsetWidth) / 2);
-				this.pages[m][n] = {
-					x: x,
-					cx: cx,
-					pageX: m,
-					element: snap
-				}
-				if (snap.classList.contains(CLASS_ACTIVE)) {
-					this.currentPage = this.pages[m][0];
-				}
-				if (x >= this.maxScrollX) {
-					m++;
-				}
-			}
-			this.options.startX = this.currentPage.x || 0;
-		},
-		_getSnapX: function(offsetLeft) {
-			return Math.max(Math.min(0, -offsetLeft + (this.wrapperWidth / 2)), this.maxScrollX);
-		},
-		_gotoPage: function(index) {
-			this.currentPage = this.pages[Math.min(index, this.pages.length - 1)][0];
-			for (var i = 0, len = this.snaps.length; i < len; i++) {
-				if (i === index) {
-					this.snaps[i].classList.add(CLASS_ACTIVE);
-				} else {
-					this.snaps[i].classList.remove(CLASS_ACTIVE);
-				}
-			}
-			this.scrollTo(this.currentPage.x, 0, this.options.bounceTime);
-		},
-		_nearestSnap: function(x) {
-			if (!this.pages.length) {
-				return {
-					x: 0,
-					pageX: 0
-				};
-			}
-			var i = 0;
-			var length = this.pages.length;
-
-			if (x > 0) {
-				x = 0;
-			} else if (x < this.maxScrollX) {
-				x = this.maxScrollX;
-			}
-
-			for (; i < length; i++) {
-				if (x >= this.pages[i][0].cx) {
-					return this.pages[i][0];
-				}
-			}
-			return {
-				x: 0,
-				pageX: 0
-			};
-		},
-		_initEvent: function() {
-			window.addEventListener('orientationchange', this);
-			window.addEventListener('resize', this);
-
-			this.scroller.addEventListener('webkitTransitionEnd', this);
-
-			this.wrapper.addEventListener('touchstart', this);
-			this.wrapper.addEventListener('touchcancel', this);
-			this.wrapper.addEventListener('touchend', this);
-			this.wrapper.addEventListener('drag', this);
-			this.wrapper.addEventListener('dragend', this);
-			this.wrapper.addEventListener('flick', this);
-			this.wrapper.addEventListener('scrollend', this);
-			if (this.options.scrollX) {
-				this.wrapper.addEventListener('swiperight', this);
-			}
-			var segmentedControl = this.wrapper.querySelector($.classSelector('.segmented-control'));
-			if (segmentedControl) { //靠，这个bug排查了一下午，阻止hash跳转，一旦hash跳转会导致可拖拽选项卡的tab不见
-				mui(segmentedControl).on('click', 'a', $.preventDefault);
-			}
-		},
-		handleEvent: function(e) {
-			if (this.stopped) {
-				this.resetPosition();
-				return;
-			}
-
-			switch (e.type) {
-				case 'touchstart':
-					this._start(e);
-					break;
-				case 'drag':
-					this.options.stopPropagation && e.stopPropagation();
-					this._drag(e);
-					break;
-				case 'dragend':
-				case 'flick':
-					this.options.stopPropagation && e.stopPropagation();
-					this._flick(e);
-					break;
-				case 'touchcancel':
-				case 'touchend':
-					this._end(e);
-					break;
-				case 'webkitTransitionEnd':
-					this._transitionEnd(e);
-					break;
-				case 'scrollend':
-					this._scrollend(e);
-					e.stopPropagation();
-					break;
-				case 'orientationchange':
-				case 'resize':
-					this._resize();
-					break;
-				case 'swiperight':
-					e.stopPropagation();
-					break;
-
-			}
-		},
-		_start: function(e) {
-			this.moved = this.needReset = false;
-			this._transitionTime();
-			if (this.isInTransition) {
-				this.needReset = true;
-				this.isInTransition = false;
-				var pos = $.parseTranslateMatrix($.getStyles(this.scroller, 'webkitTransform'));
-				this.setTranslate(Math.round(pos.x), Math.round(pos.y));
-				this.resetPosition(); //reset
-				$.trigger(this.scroller, 'scrollend', this);
-				//				e.stopPropagation();
-				e.preventDefault();
-			}
-			this.reLayout();
-			$.trigger(this.scroller, 'beforescrollstart', this);
-		},
-		_getDirectionByAngle: function(angle) {
-			if (angle < -80 && angle > -100) {
-				return 'up';
-			} else if (angle >= 80 && angle < 100) {
-				return 'down';
-			} else if (angle >= 170 || angle <= -170) {
-				return 'left';
-			} else if (angle >= -35 && angle <= 10) {
-				return 'right';
-			}
-			return null;
-		},
-		_drag: function(e) {
-			//			if (this.needReset) {
-			//				e.stopPropagation(); //disable parent drag(nested scroller)
-			//				return;
-			//			}
-			var detail = e.detail;
-			if (this.options.scrollY || detail.direction === 'up' || detail.direction === 'down') { //如果是竖向滚动或手势方向是上或下
-				//ios8 hack
-				if ($.os.ios && parseFloat($.os.version) >= 8) { //多webview时，离开当前webview会导致后续touch事件不触发
-					var clientY = detail.gesture.touches[0].clientY;
-					//下拉刷新 or 上拉加载
-					if ((clientY + 10) > window.innerHeight || clientY < 10) {
-						this.resetPosition(this.options.bounceTime);
-						return;
-					}
-				}
-			}
-			var isPreventDefault = isReturn = false;
-			var direction = this._getDirectionByAngle(detail.angle);
-			if (detail.direction === 'left' || detail.direction === 'right') {
-				if (this.options.scrollX) {
-					isPreventDefault = true;
-					if (!this.moved) { //识别角度(该角度导致轮播不灵敏)
-						//						if (direction !== 'left' && direction !== 'right') {
-						//							isReturn = true;
-						//						} else {
-						$.gestures.touch.lockDirection = true; //锁定方向
-						$.gestures.touch.startDirection = detail.direction;
-						//						}
-					}
-				} else if (this.options.scrollY && !this.moved) {
-					isReturn = true;
-				}
-			} else if (detail.direction === 'up' || detail.direction === 'down') {
-				if (this.options.scrollY) {
-					isPreventDefault = true;
-					//					if (!this.moved) { //识别角度,竖向滚动似乎没必要进行小角度验证
-					//						if (direction !== 'up' && direction !== 'down') {
-					//							isReturn = true;
-					//						}
-					//					}
-					if (!this.moved) {
-						$.gestures.touch.lockDirection = true; //锁定方向
-						$.gestures.touch.startDirection = detail.direction;
-					}
-				} else if (this.options.scrollX && !this.moved) {
-					isReturn = true;
-				}
-			} else {
-				isReturn = true;
-			}
-			if (isPreventDefault) {
-				e.stopPropagation(); //阻止冒泡(scroll类嵌套)
-				detail.gesture && detail.gesture.preventDefault();
-			}
-			if (isReturn) { //禁止非法方向滚动
-				return;
-			}
-			if (!this.moved) {
-				$.trigger(this.scroller, 'scrollstart', this);
-			} else {
-				e.stopPropagation(); //move期间阻止冒泡(scroll嵌套)
-			}
-			var deltaX = 0;
-			var deltaY = 0;
-			if (!this.moved) { //start
-				deltaX = detail.deltaX;
-				deltaY = detail.deltaY;
-			} else { //move
-				deltaX = detail.deltaX - detail.lastDeltaX;
-				deltaY = detail.deltaY - detail.lastDeltaY;
-			}
-			var absDeltaX = Math.abs(detail.deltaX);
-			var absDeltaY = Math.abs(detail.deltaY);
-			if (absDeltaX > absDeltaY + this.options.directionLockThreshold) {
-				deltaY = 0;
-			} else if (absDeltaY >= absDeltaX + this.options.directionLockThreshold) {
-				deltaX = 0;
-			}
-
-			deltaX = this.hasHorizontalScroll ? deltaX : 0;
-			deltaY = this.hasVerticalScroll ? deltaY : 0;
-			var newX = this.x + deltaX;
-			var newY = this.y + deltaY;
-			// Slow down if outside of the boundaries
-			if (newX > 0 || newX < this.maxScrollX) {
-				newX = this.options.bounce ? this.x + deltaX / 3 : newX > 0 ? 0 : this.maxScrollX;
-			}
-			if (newY > 0 || newY < this.maxScrollY) {
-				newY = this.options.bounce ? this.y + deltaY / 3 : newY > 0 ? 0 : this.maxScrollY;
-			}
-
-			if (!this.requestAnimationFrame) {
-				this._updateTranslate();
-			}
-
-			this.moved = true;
-			this.x = newX;
-			this.y = newY;
-			$.trigger(this.scroller, 'scroll', this);
-		},
-		_flick: function(e) {
-			//			if (!this.moved || this.needReset) {
-			//				return;
-			//			}
-			if (!this.moved) {
-				return;
-			}
-			e.stopPropagation();
-			var detail = e.detail;
-			this._clearRequestAnimationFrame();
-			if (e.type === 'dragend' && detail.flick) { //dragend
-				return;
-			}
-
-			var newX = Math.round(this.x);
-			var newY = Math.round(this.y);
-
-			this.isInTransition = false;
-			// reset if we are outside of the boundaries
-			if (this.resetPosition(this.options.bounceTime)) {
-				return;
-			}
-
-			this.scrollTo(newX, newY); // ensures that the last position is rounded
-
-			if (e.type === 'dragend') { //dragend
-				$.trigger(this.scroller, 'scrollend', this);
-				return;
-			}
-			var time = 0;
-			var easing = '';
-			// start momentum animation if needed
-			if (this.options.momentum && detail.flickTime < 300) {
-				momentumX = this.hasHorizontalScroll ? this._momentum(this.x, detail.flickDistanceX, detail.flickTime, this.maxScrollX, this.options.bounce ? this.wrapperWidth : 0, this.options.deceleration) : {
-					destination: newX,
-					duration: 0
-				};
-				momentumY = this.hasVerticalScroll ? this._momentum(this.y, detail.flickDistanceY, detail.flickTime, this.maxScrollY, this.options.bounce ? this.wrapperHeight : 0, this.options.deceleration) : {
-					destination: newY,
-					duration: 0
-				};
-				newX = momentumX.destination;
-				newY = momentumY.destination;
-				time = Math.max(momentumX.duration, momentumY.duration);
-				this.isInTransition = true;
-			}
-
-			if (newX != this.x || newY != this.y) {
-				if (newX > 0 || newX < this.maxScrollX || newY > 0 || newY < this.maxScrollY) {
-					easing = ease.quadratic;
-				}
-				this.scrollTo(newX, newY, time, easing);
-				return;
-			}
-
-			$.trigger(this.scroller, 'scrollend', this);
-			//			e.stopPropagation();
-		},
-		_end: function(e) {
-			this.needReset = false;
-			if ((!this.moved && this.needReset) || e.type === 'touchcancel') {
-				this.resetPosition();
-			}
-		},
-		_transitionEnd: function(e) {
-			if (e.target != this.scroller || !this.isInTransition) {
-				return;
-			}
-			this._transitionTime();
-			if (!this.resetPosition(this.options.bounceTime)) {
-				this.isInTransition = false;
-				$.trigger(this.scroller, 'scrollend', this);
-			}
-		},
-		_scrollend: function(e) {
-			if (Math.abs(this.y) > 0 && this.y <= this.maxScrollY) {
-				$.trigger(this.scroller, 'scrollbottom', this);
-			}
-		},
-		_resize: function() {
-			var that = this;
-			clearTimeout(that.resizeTimeout);
-			that.resizeTimeout = setTimeout(function() {
-				that.refresh();
-			}, that.options.resizePolling);
-		},
-		_transitionTime: function(time) {
-			time = time || 0;
-			this.scrollerStyle['webkitTransitionDuration'] = time + 'ms';
-			if (this.parallaxElement && this.options.scrollY) { //目前仅支持竖向视差效果
-				this.parallaxStyle['webkitTransitionDuration'] = time + 'ms';
-			}
-			if (this.options.fixedBadAndorid && !time && $.os.isBadAndroid) {
-				this.scrollerStyle['webkitTransitionDuration'] = '0.001s';
-				if (this.parallaxElement && this.options.scrollY) { //目前仅支持竖向视差效果
-					this.parallaxStyle['webkitTransitionDuration'] = '0.001s';
-				}
-			}
-			if (this.indicators) {
-				for (var i = this.indicators.length; i--;) {
-					this.indicators[i].transitionTime(time);
-				}
-			}
-		},
-		_transitionTimingFunction: function(easing) {
-			this.scrollerStyle['webkitTransitionTimingFunction'] = easing;
-			if (this.parallaxElement && this.options.scrollY) { //目前仅支持竖向视差效果
-				this.parallaxStyle['webkitTransitionDuration'] = easing;
-			}
-			if (this.indicators) {
-				for (var i = this.indicators.length; i--;) {
-					this.indicators[i].transitionTimingFunction(easing);
-				}
-			}
-		},
-		_translate: function(x, y) {
-			this.x = x;
-			this.y = y;
-		},
-		_clearRequestAnimationFrame: function() {
-			if (this.requestAnimationFrame) {
-				cancelAnimationFrame(this.requestAnimationFrame);
-				this.requestAnimationFrame = null;
-			}
-		},
-		_updateTranslate: function() {
-			var self = this;
-			if (self.x !== self.lastX || self.y !== self.lastY) {
-				self.setTranslate(self.x, self.y);
-			}
-			self.requestAnimationFrame = requestAnimationFrame(function() {
-				self._updateTranslate();
-			});
-		},
-		_createScrollBar: function(clazz) {
-			var scrollbar = document.createElement('div');
-			var indicator = document.createElement('div');
-			scrollbar.className = CLASS_SCROLLBAR + ' ' + clazz;
-			indicator.className = CLASS_INDICATOR;
-			scrollbar.appendChild(indicator);
-			if (clazz === CLASS_SCROLLBAR_VERTICAL) {
-				this.scrollbarY = scrollbar;
-				this.scrollbarIndicatorY = indicator;
-			} else if (clazz === CLASS_SCROLLBAR_HORIZONTAL) {
-				this.scrollbarX = scrollbar;
-				this.scrollbarIndicatorX = indicator;
-			}
-			this.wrapper.appendChild(scrollbar);
-			return scrollbar;
-		},
-		_preventDefaultException: function(el, exceptions) {
-			for (var i in exceptions) {
-				if (exceptions[i].test(el[i])) {
-					return true;
-				}
-			}
-			return false;
-		},
-		_reLayout: function() {
-			if (!this.hasHorizontalScroll) {
-				this.maxScrollX = 0;
-				this.scrollerWidth = this.wrapperWidth;
-			}
-
-			if (!this.hasVerticalScroll) {
-				this.maxScrollY = 0;
-				this.scrollerHeight = this.wrapperHeight;
-			}
-
-			this.indicators.map(function(indicator) {
-				indicator.refresh();
-			});
-
-			//以防slider类嵌套使用
-			if (this.options.snap && typeof this.options.snap === 'string') {
-				var items = this.scroller.querySelectorAll(this.options.snap);
-				this.itemLength = 0;
-				this.snaps = [];
-				for (var i = 0, len = items.length; i < len; i++) {
-					var item = items[i];
-					if (item.parentNode === this.scroller) {
-						this.itemLength++;
-						this.snaps.push(item);
-					}
-				}
-				this._initSnap(); //需要每次都_initSnap么。其实init的时候执行一次，后续resize的时候执行一次就行了吧.先这么做吧，如果影响性能，再调整
-			}
-		},
-		_momentum: function(current, distance, time, lowerMargin, wrapperSize, deceleration) {
-			var speed = parseFloat(Math.abs(distance) / time),
-				destination,
-				duration;
-
-			deceleration = deceleration === undefined ? 0.0006 : deceleration;
-			destination = current + (speed * speed) / (2 * deceleration) * (distance < 0 ? -1 : 1);
-			duration = speed / deceleration;
-			if (destination < lowerMargin) {
-				destination = wrapperSize ? lowerMargin - (wrapperSize / 2.5 * (speed / 8)) : lowerMargin;
-				distance = Math.abs(destination - current);
-				duration = distance / speed;
-			} else if (destination > 0) {
-				destination = wrapperSize ? wrapperSize / 2.5 * (speed / 8) : 0;
-				distance = Math.abs(current) + destination;
-				duration = distance / speed;
-			}
-
-			return {
-				destination: Math.round(destination),
-				duration: duration
-			};
-		},
-		_getTranslateStr: function(x, y) {
-			if (this.options.hardwareAccelerated) {
-				return 'translate3d(' + x + 'px,' + y + 'px,0px) ' + this.translateZ;
-			}
-			return 'translate(' + x + 'px,' + y + 'px) ';
-		},
-		//API
-		setStopped: function(stopped) {
-			this.stopped = !!stopped;
-		},
-		setTranslate: function(x, y) {
-			this.x = x;
-			this.y = y;
-			this.scrollerStyle['webkitTransform'] = this._getTranslateStr(x, y);
-			if (this.parallaxElement && this.options.scrollY) { //目前仅支持竖向视差效果
-				var parallaxY = y * this.options.parallaxRatio;
-				var scale = 1 + parallaxY / ((this.parallaxHeight - parallaxY) / 2);
-				if (scale > 1) {
-					this.parallaxImgStyle['opacity'] = 1 - parallaxY / 100 * this.options.parallaxRatio;
-					this.parallaxStyle['webkitTransform'] = this._getTranslateStr(0, -parallaxY) + ' scale(' + scale + ',' + scale + ')';
-				} else {
-					this.parallaxImgStyle['opacity'] = 1;
-					this.parallaxStyle['webkitTransform'] = this._getTranslateStr(0, -1) + ' scale(1,1)';
-				}
-			}
-			if (this.indicators) {
-				for (var i = this.indicators.length; i--;) {
-					this.indicators[i].updatePosition();
-				}
-			}
-			this.lastX = this.x;
-			this.lastY = this.y;
-		},
-		reLayout: function() {
-			this.wrapper.offsetHeight;
-
-			var paddingLeft = parseFloat($.getStyles(this.wrapper, 'padding-left')) || 0;
-			var paddingRight = parseFloat($.getStyles(this.wrapper, 'padding-right')) || 0;
-			var paddingTop = parseFloat($.getStyles(this.wrapper, 'padding-top')) || 0;
-			var paddingBottom = parseFloat($.getStyles(this.wrapper, 'padding-bottom')) || 0;
-
-			var clientWidth = this.wrapper.clientWidth;
-			var clientHeight = this.wrapper.clientHeight;
-
-			this.scrollerWidth = this.scroller.offsetWidth;
-			this.scrollerHeight = this.scroller.offsetHeight;
-
-			this.wrapperWidth = clientWidth - paddingLeft - paddingRight;
-			this.wrapperHeight = clientHeight - paddingTop - paddingBottom;
-
-			this.maxScrollX = Math.min(this.wrapperWidth - this.scrollerWidth, 0);
-			this.maxScrollY = Math.min(this.wrapperHeight - this.scrollerHeight, 0);
-			this.hasHorizontalScroll = this.options.scrollX && this.maxScrollX < 0;
-			this.hasVerticalScroll = this.options.scrollY && this.maxScrollY < 0;
-			this._reLayout();
-		},
-		resetPosition: function(time) {
-			var x = this.x,
-				y = this.y;
-
-			time = time || 0;
-			if (!this.hasHorizontalScroll || this.x > 0) {
-				x = 0;
-			} else if (this.x < this.maxScrollX) {
-				x = this.maxScrollX;
-			}
-
-			if (!this.hasVerticalScroll || this.y > 0) {
-				y = 0;
-			} else if (this.y < this.maxScrollY) {
-				y = this.maxScrollY;
-			}
-
-			if (x == this.x && y == this.y) {
-				return false;
-			}
-			this.scrollTo(x, y, time, this.options.bounceEasing);
-
-			return true;
-		},
-		refresh: function() {
-			this.reLayout();
-			$.trigger(this.scroller, 'refresh', this);
-			this.resetPosition();
-		},
-		scrollTo: function(x, y, time, easing) {
-			var easing = easing || ease.circular;
-			this.isInTransition = time > 0 && (this.lastX != x || this.lastY != y);
-			if (this.isInTransition) {
-				this._clearRequestAnimationFrame();
-				this._transitionTimingFunction(easing.style);
-				this._transitionTime(time);
-				this.setTranslate(x, y);
-			} else {
-				this.setTranslate(x, y);
-			}
-
-		},
-		scrollToBottom: function(time, easing) {
-			time = time || this.options.bounceTime;
-			this.scrollTo(0, this.maxScrollY, time, easing);
-		},
-		gotoPage: function(index) {
-			this._gotoPage(index);
-		}
-	});
-	//Indicator
-	var Indicator = function(scroller, options) {
-		this.wrapper = typeof options.el == 'string' ? document.querySelector(options.el) : options.el;
-		this.wrapperStyle = this.wrapper.style;
-		this.indicator = this.wrapper.children[0];
-		this.indicatorStyle = this.indicator.style;
-		this.scroller = scroller;
-
-		this.options = $.extend({
-			listenX: true,
-			listenY: true,
-			fade: false,
-			speedRatioX: 0,
-			speedRatioY: 0
-		}, options);
-
-
-		this.sizeRatioX = 1;
-		this.sizeRatioY = 1;
-		this.maxPosX = 0;
-		this.maxPosY = 0;
-
-		if (this.options.fade) {
-			this.wrapperStyle['webkitTransform'] = this.scroller.translateZ;
-			this.wrapperStyle['webkitTransitionDuration'] = this.options.fixedBadAndorid && $.os.isBadAndroid ? '0.001s' : '0ms';
-			this.wrapperStyle.opacity = '0';
-		}
-	}
-	Indicator.prototype = {
-		handleEvent: function(e) {
-
-		},
-		transitionTime: function(time) {
-			time = time || 0;
-			this.indicatorStyle['webkitTransitionDuration'] = time + 'ms';
-			if (this.scroller.options.fixedBadAndorid && !time && $.os.isBadAndroid) {
-				this.indicatorStyle['webkitTransitionDuration'] = '0.001s';
-			}
-		},
-		transitionTimingFunction: function(easing) {
-			this.indicatorStyle['webkitTransitionTimingFunction'] = easing;
-		},
-		refresh: function() {
-			this.transitionTime();
-
-			if (this.options.listenX && !this.options.listenY) {
-				this.indicatorStyle.display = this.scroller.hasHorizontalScroll ? 'block' : 'none';
-			} else if (this.options.listenY && !this.options.listenX) {
-				this.indicatorStyle.display = this.scroller.hasVerticalScroll ? 'block' : 'none';
-			} else {
-				this.indicatorStyle.display = this.scroller.hasHorizontalScroll || this.scroller.hasVerticalScroll ? 'block' : 'none';
-			}
-
-			this.wrapper.offsetHeight; // force refresh
-
-			if (this.options.listenX) {
-				this.wrapperWidth = this.wrapper.clientWidth;
-				this.indicatorWidth = Math.max(Math.round(this.wrapperWidth * this.wrapperWidth / (this.scroller.scrollerWidth || this.wrapperWidth || 1)), 8);
-				this.indicatorStyle.width = this.indicatorWidth + 'px';
-
-				this.maxPosX = this.wrapperWidth - this.indicatorWidth;
-
-				this.minBoundaryX = 0;
-				this.maxBoundaryX = this.maxPosX;
-
-				this.sizeRatioX = this.options.speedRatioX || (this.scroller.maxScrollX && (this.maxPosX / this.scroller.maxScrollX));
-			}
-
-			if (this.options.listenY) {
-				this.wrapperHeight = this.wrapper.clientHeight;
-				this.indicatorHeight = Math.max(Math.round(this.wrapperHeight * this.wrapperHeight / (this.scroller.scrollerHeight || this.wrapperHeight || 1)), 8);
-				this.indicatorStyle.height = this.indicatorHeight + 'px';
-
-				this.maxPosY = this.wrapperHeight - this.indicatorHeight;
-
-				this.minBoundaryY = 0;
-				this.maxBoundaryY = this.maxPosY;
-
-				this.sizeRatioY = this.options.speedRatioY || (this.scroller.maxScrollY && (this.maxPosY / this.scroller.maxScrollY));
-			}
-
-			this.updatePosition();
-		},
-
-		updatePosition: function() {
-			var x = this.options.listenX && Math.round(this.sizeRatioX * this.scroller.x) || 0,
-				y = this.options.listenY && Math.round(this.sizeRatioY * this.scroller.y) || 0;
-
-			if (x < this.minBoundaryX) {
-				this.width = Math.max(this.indicatorWidth + x, 8);
-				this.indicatorStyle.width = this.width + 'px';
-				x = this.minBoundaryX;
-			} else if (x > this.maxBoundaryX) {
-				this.width = Math.max(this.indicatorWidth - (x - this.maxPosX), 8);
-				this.indicatorStyle.width = this.width + 'px';
-				x = this.maxPosX + this.indicatorWidth - this.width;
-			} else if (this.width != this.indicatorWidth) {
-				this.width = this.indicatorWidth;
-				this.indicatorStyle.width = this.width + 'px';
-			}
-
-			if (y < this.minBoundaryY) {
-				this.height = Math.max(this.indicatorHeight + y * 3, 8);
-				this.indicatorStyle.height = this.height + 'px';
-				y = this.minBoundaryY;
-			} else if (y > this.maxBoundaryY) {
-				this.height = Math.max(this.indicatorHeight - (y - this.maxPosY) * 3, 8);
-				this.indicatorStyle.height = this.height + 'px';
-				y = this.maxPosY + this.indicatorHeight - this.height;
-			} else if (this.height != this.indicatorHeight) {
-				this.height = this.indicatorHeight;
-				this.indicatorStyle.height = this.height + 'px';
-			}
-
-			this.x = x;
-			this.y = y;
-
-			this.indicatorStyle['webkitTransform'] = this.scroller._getTranslateStr(x, y);
-
-		},
-		fade: function(val, hold) {
-			if (hold && !this.visible) {
-				return;
-			}
-
-			clearTimeout(this.fadeTimeout);
-			this.fadeTimeout = null;
-
-			var time = val ? 250 : 500,
-				delay = val ? 0 : 300;
-
-			val = val ? '1' : '0';
-
-			this.wrapperStyle['webkitTransitionDuration'] = time + 'ms';
-
-			this.fadeTimeout = setTimeout((function(val) {
-				this.wrapperStyle.opacity = val;
-				this.visible = +val;
-			}).bind(this, val), delay);
-		}
-	};
-
-	$.Scroll = Scroll;
-
-	$.fn.scroll = function(options) {
-		var scrollApis = [];
-		this.each(function() {
-			var scrollApi = null;
-			var self = this;
-			var id = self.getAttribute('data-scroll');
-			if (!id) {
-				id = ++$.uuid;
-				var _options = $.extend({}, options);
-				if (self.classList.contains($.className('segmented-control'))) {
-					_options = $.extend(_options, {
-						scrollY: false,
-						scrollX: true,
-						indicators: false,
-						snap: $.classSelector('.control-item')
-					});
-				}
-				$.data[id] = scrollApi = new Scroll(self, _options);
-				self.setAttribute('data-scroll', id);
-			} else {
-				scrollApi = $.data[id];
-			}
-			scrollApis.push(scrollApi);
-		});
-		return scrollApis.length === 1 ? scrollApis[0] : scrollApis;
-	};
-})(mui, window, document);