diff --git a/index.html b/index.html
index 0c99a4e..29fa75e 100755
--- a/index.html
+++ b/index.html
@@ -13,11 +13,20 @@ $(document).ready(function(){
$(window).resize(function() {
fitNPages(PAGES_VISIBLE)
})
+
$('.viewer')
.swipe({
//swipeLeft: nextPage,
//swipeRight: prevPage,
swipeStatus: swipeUpdate,
+ //swipeStatus: unanimated($('.magazine'), swipeUpdate),
+ /*
+ swipeStatus: function(evt, phase, direction, distance){
+ doWithoutTransitions(
+ $('.magazine'),
+ function(){swipeUpdate(evt, phase, direction, distance)})
+ },
+ */
// XXX change this to pinch...
swipeUp: function(){
PAGES_VISIBLE = 6
@@ -54,9 +63,7 @@ function swipeUpdate(evt, phase, direction, distance){
var mag = $('.magazine')
if( phase=='move' && (direction=='left' || direction=='right') ){
- // XXX set the transition time to 0...
- var orig_duration = mag.css('-webkit-transition-duration')
- mag.css({'-webkit-transition-duration': 0})
+ mag.addClass('unanimated')
if (direction == 'left'){
//$('.magazine').css({left: -n*cur.width()-distance/scale})
$('.magazine').css({left: -n*800-distance/scale})
@@ -64,7 +71,7 @@ function swipeUpdate(evt, phase, direction, distance){
//$('.magazine').css({left: -n*cur.width()+distance/scale})
$('.magazine').css({left: -n*800+distance/scale})
}
- mag.css({'-webkit-transition-duration': orig_duration})
+ setTimeout(function(){mag.removeClass('unanimated')}, 5)
} else if ( phase == 'cancel') {
setCurrentPage()
@@ -84,6 +91,31 @@ function swipeUpdate(evt, phase, direction, distance){
}
+// XXX might be good to use apply here...
+function doWithoutTransitions(obj, func, time){
+ if(time == null){
+ time = 5
+ }
+ obj.addClass('unanimated')
+ var res = func()
+ setTimeout(function(){obj.removeClass('unanimated')}, time)
+ return res
+}
+
+function unanimated(obj, func, time){
+ return function(){
+ if(time == null){
+ time = 5
+ }
+ obj.addClass('unanimated')
+ var res = func.apply(func, arguments)
+ setTimeout(function(){obj.removeClass('unanimated')}, time)
+ return res
+ }
+}
+
+
+
function setCurrentPage(n){
if(n == null){
var cur = $('.current.page')
@@ -98,7 +130,8 @@ function setCurrentPage(n){
$('.current.page').removeClass('current')
cur.addClass('current')
- $('.magazine').css({left: -n*cur.width()})
+ var mag = $('.magazine')
+ mag.css({left: -n*cur.width()})
return cur
}
diff --git a/magazine.css b/magazine.css
index ff27031..8cd269c 100755
--- a/magazine.css
+++ b/magazine.css
@@ -103,3 +103,12 @@ body {
background: silver;
}
+
+
+.unanimated {
+ -webkit-transition: none;
+ -moz-transition: none;
+ -o-transition: all 0 ease;
+ -ms-transition: none;
+ transition: none;
+}