Skip to content

Commit

Permalink
more snap fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
Matteo Spinelli committed Jun 12, 2013
1 parent 1454c72 commit af0bd61
Show file tree
Hide file tree
Showing 14 changed files with 202 additions and 65 deletions.
2 changes: 1 addition & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# iScroll 5 beta 2
# iScroll 5

Documentation soon to come. In the meantime please reference to the examples in the demos directory.

Expand Down
20 changes: 13 additions & 7 deletions build/iscroll-lite.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! iScroll v5.0.0-beta.2 ~ (c) 2008-2013 Matteo Spinelli ~ http://cubiq.org/license */
/*! iScroll v5.0.0 ~ (c) 2008-2013 Matteo Spinelli ~ http://cubiq.org/license */
var IScroll = (function (window, document, Math) {

var rAF = window.requestAnimationFrame ||
Expand Down Expand Up @@ -293,7 +293,7 @@ function IScroll (el, options) {
}

IScroll.prototype = {
version: '5.0.0-beta.2',
version: '5.0.0',

_init: function () {
this._initEvents();
Expand Down Expand Up @@ -466,6 +466,8 @@ IScroll.prototype = {
duration = utils.getTime() - this.startTime,
newX = Math.round(this.x),
newY = Math.round(this.y),
distanceX = Math.abs(newX - this.startX),
distanceY = Math.abs(newY - this.startY),
time = 0,
easing = '';

Expand Down Expand Up @@ -493,6 +495,11 @@ IScroll.prototype = {
return;
}

if ( this._events.flick && duration < 200 && distanceX < 100 && distanceY < 100 ) {
this._execEvent('flick');
return;
}

// start momentum animation if needed
if ( this.options.momentum && duration < 300 ) {
momentumX = this.hasHorizontalScroll ? utils.momentum(this.x, this.startX, duration, this.maxScrollX, this.options.bounce ? this.wrapperWidth : 0) : { destination: newX, duration: 0 };
Expand All @@ -509,11 +516,10 @@ IScroll.prototype = {
newX = snap.x;
newY = snap.y;
time = this.options.snapSpeed || Math.max(
Math.max(
Math.min(Math.abs(newX - this.x), 1000),
Math.min(Math.abs(newY - this.y), 1000)
),
300);
Math.max(
Math.min(distanceX, 1000),
Math.min(distanceX, 1000)
), 300);

easing = this.options.bounceEasing;
}
Expand Down
57 changes: 45 additions & 12 deletions build/iscroll-probe.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! iScroll v5.0.0-beta.2 ~ (c) 2008-2013 Matteo Spinelli ~ http://cubiq.org/license */
/*! iScroll v5.0.0 ~ (c) 2008-2013 Matteo Spinelli ~ http://cubiq.org/license */
var IScroll = (function (window, document, Math) {

var rAF = window.requestAnimationFrame ||
Expand Down Expand Up @@ -232,7 +232,7 @@ function IScroll (el, options) {

resizeIndicator: true,

snapThreshold: 10,
snapThreshold: 0.334,

// INSERT POINT: OPTIONS

Expand Down Expand Up @@ -302,7 +302,7 @@ function IScroll (el, options) {
}

IScroll.prototype = {
version: '5.0.0-beta.2',
version: '5.0.0',

_init: function () {
this._initEvents();
Expand Down Expand Up @@ -497,6 +497,8 @@ IScroll.prototype = {
duration = utils.getTime() - this.startTime,
newX = Math.round(this.x),
newY = Math.round(this.y),
distanceX = Math.abs(newX - this.startX),
distanceY = Math.abs(newY - this.startY),
time = 0,
easing = '';

Expand Down Expand Up @@ -524,6 +526,11 @@ IScroll.prototype = {
return;
}

if ( this._events.flick && duration < 200 && distanceX < 100 && distanceY < 100 ) {
this._execEvent('flick');
return;
}

// start momentum animation if needed
if ( this.options.momentum && duration < 300 ) {
momentumX = this.hasHorizontalScroll ? utils.momentum(this.x, this.startX, duration, this.maxScrollX, this.options.bounce ? this.wrapperWidth : 0) : { destination: newX, duration: 0 };
Expand All @@ -540,11 +547,10 @@ IScroll.prototype = {
newX = snap.x;
newY = snap.y;
time = this.options.snapSpeed || Math.max(
Math.max(
Math.min(Math.abs(newX - this.x), 1000),
Math.min(Math.abs(newY - this.y), 1000)
),
300);
Math.max(
Math.min(distanceX, 1000),
Math.min(distanceX, 1000)
), 300);

easing = this.options.bounceEasing;
}
Expand Down Expand Up @@ -1000,6 +1006,8 @@ IScroll.prototype = {
this.pages[i][l] = {
x: Math.max(x, this.maxScrollX),
y: Math.max(y, this.maxScrollY),
width: stepX,
height: stepY,
cx: x - cx,
cy: y - cy
};
Expand Down Expand Up @@ -1034,6 +1042,8 @@ IScroll.prototype = {
this.pages[m][n] = {
x: x,
y: y,
width: el[i].offsetWidth,
height: el[i].offsetHeight,
cx: cx,
cy: cy
};
Expand All @@ -1049,6 +1059,28 @@ IScroll.prototype = {
pageY: 0
};

// Update snap threshold if needed
if ( this.options.snapThreshold % 1 === 0 ) {
this.snapThresholdX = this.options.snapThreshold;
this.snapThresholdY = this.options.snapThreshold;
} else {
this.snapThresholdX = Math.round(this.pages[this.currentPage.pageX][this.currentPage.pageY].width * this.options.snapThreshold);
this.snapThresholdY = Math.round(this.pages[this.currentPage.pageX][this.currentPage.pageY].height * this.options.snapThreshold);
}
});

this.on('flick', function () {
var time = this.options.snapSpeed || Math.max(
Math.max(
Math.min(Math.abs(this.x - this.startX), 1000),
Math.min(Math.abs(this.y - this.startY), 1000)
), 300);

this.goToPage(
this.currentPage.pageX + this.directionX,
this.currentPage.pageY + this.directionY,
time
);
});
},

Expand All @@ -1057,8 +1089,8 @@ IScroll.prototype = {
l = this.pages.length,
m = 0;

if ( Math.abs(x - this.absStartX) < this.options.snapThreshold &&
Math.abs(y - this.absStartY) < this.options.snapThreshold ) {
if ( Math.abs(x - this.absStartX) < this.snapThresholdX &&
Math.abs(y - this.absStartY) < this.snapThresholdY ) {
return this.currentPage;
}

Expand Down Expand Up @@ -1123,6 +1155,8 @@ IScroll.prototype = {
},

goToPage: function (x, y, time, easing) {
easing = easing || this.options.bounceEasing;

if ( x >= this.pages.length ) {
x = this.pages.length - 1;
} else if ( x < 0 ) {
Expand All @@ -1142,8 +1176,7 @@ IScroll.prototype = {
Math.max(
Math.min(Math.abs(posX - this.x), 1000),
Math.min(Math.abs(posY - this.y), 1000)
),
300);
), 300);

this.currentPage = {
x: posX,
Expand Down
57 changes: 45 additions & 12 deletions build/iscroll-zoom.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! iScroll v5.0.0-beta.2 ~ (c) 2008-2013 Matteo Spinelli ~ http://cubiq.org/license */
/*! iScroll v5.0.0 ~ (c) 2008-2013 Matteo Spinelli ~ http://cubiq.org/license */
var IScroll = (function (window, document, Math) {

var rAF = window.requestAnimationFrame ||
Expand Down Expand Up @@ -235,7 +235,7 @@ function IScroll (el, options) {

resizeIndicator: true,

snapThreshold: 10,
snapThreshold: 0.334,

// INSERT POINT: OPTIONS

Expand Down Expand Up @@ -304,7 +304,7 @@ function IScroll (el, options) {
}

IScroll.prototype = {
version: '5.0.0-beta.2',
version: '5.0.0',

_init: function () {
this._initEvents();
Expand Down Expand Up @@ -497,6 +497,8 @@ IScroll.prototype = {
duration = utils.getTime() - this.startTime,
newX = Math.round(this.x),
newY = Math.round(this.y),
distanceX = Math.abs(newX - this.startX),
distanceY = Math.abs(newY - this.startY),
time = 0,
easing = '';

Expand Down Expand Up @@ -524,6 +526,11 @@ IScroll.prototype = {
return;
}

if ( this._events.flick && duration < 200 && distanceX < 100 && distanceY < 100 ) {
this._execEvent('flick');
return;
}

// start momentum animation if needed
if ( this.options.momentum && duration < 300 ) {
momentumX = this.hasHorizontalScroll ? utils.momentum(this.x, this.startX, duration, this.maxScrollX, this.options.bounce ? this.wrapperWidth : 0) : { destination: newX, duration: 0 };
Expand All @@ -540,11 +547,10 @@ IScroll.prototype = {
newX = snap.x;
newY = snap.y;
time = this.options.snapSpeed || Math.max(
Math.max(
Math.min(Math.abs(newX - this.x), 1000),
Math.min(Math.abs(newY - this.y), 1000)
),
300);
Math.max(
Math.min(distanceX, 1000),
Math.min(distanceX, 1000)
), 300);

easing = this.options.bounceEasing;
}
Expand Down Expand Up @@ -1151,6 +1157,8 @@ IScroll.prototype = {
this.pages[i][l] = {
x: Math.max(x, this.maxScrollX),
y: Math.max(y, this.maxScrollY),
width: stepX,
height: stepY,
cx: x - cx,
cy: y - cy
};
Expand Down Expand Up @@ -1185,6 +1193,8 @@ IScroll.prototype = {
this.pages[m][n] = {
x: x,
y: y,
width: el[i].offsetWidth,
height: el[i].offsetHeight,
cx: cx,
cy: cy
};
Expand All @@ -1200,6 +1210,28 @@ IScroll.prototype = {
pageY: 0
};

// Update snap threshold if needed
if ( this.options.snapThreshold % 1 === 0 ) {
this.snapThresholdX = this.options.snapThreshold;
this.snapThresholdY = this.options.snapThreshold;
} else {
this.snapThresholdX = Math.round(this.pages[this.currentPage.pageX][this.currentPage.pageY].width * this.options.snapThreshold);
this.snapThresholdY = Math.round(this.pages[this.currentPage.pageX][this.currentPage.pageY].height * this.options.snapThreshold);
}
});

this.on('flick', function () {
var time = this.options.snapSpeed || Math.max(
Math.max(
Math.min(Math.abs(this.x - this.startX), 1000),
Math.min(Math.abs(this.y - this.startY), 1000)
), 300);

this.goToPage(
this.currentPage.pageX + this.directionX,
this.currentPage.pageY + this.directionY,
time
);
});
},

Expand All @@ -1208,8 +1240,8 @@ IScroll.prototype = {
l = this.pages.length,
m = 0;

if ( Math.abs(x - this.absStartX) < this.options.snapThreshold &&
Math.abs(y - this.absStartY) < this.options.snapThreshold ) {
if ( Math.abs(x - this.absStartX) < this.snapThresholdX &&
Math.abs(y - this.absStartY) < this.snapThresholdY ) {
return this.currentPage;
}

Expand Down Expand Up @@ -1274,6 +1306,8 @@ IScroll.prototype = {
},

goToPage: function (x, y, time, easing) {
easing = easing || this.options.bounceEasing;

if ( x >= this.pages.length ) {
x = this.pages.length - 1;
} else if ( x < 0 ) {
Expand All @@ -1293,8 +1327,7 @@ IScroll.prototype = {
Math.max(
Math.min(Math.abs(posX - this.x), 1000),
Math.min(Math.abs(posY - this.y), 1000)
),
300);
), 300);

this.currentPage = {
x: posX,
Expand Down
Loading

0 comments on commit af0bd61

Please sign in to comment.