diff options
Diffstat (limited to 'public')
| -rw-r--r-- | public/assets/js/app.js | 4 | ||||
| -rw-r--r-- | public/assets/js/lib/HeaderView.js | 1 | ||||
| -rw-r--r-- | public/assets/js/lib/ProjectView.js | 2 | ||||
| -rw-r--r-- | public/assets/js/lib/Scroller.js | 39 | ||||
| -rw-r--r-- | public/assets/ok.css | 3 |
5 files changed, 39 insertions, 10 deletions
diff --git a/public/assets/js/app.js b/public/assets/js/app.js index 91ccdaf..5ae0c99 100644 --- a/public/assets/js/app.js +++ b/public/assets/js/app.js @@ -1,7 +1,7 @@ var app = (function() { var app = {} - app.navigation_delay = 200 + app.navigation_delay = 150 app.iscroll_options = { mouseWheel: true, @@ -100,7 +100,7 @@ var app = (function() { var windowHeight = window.innerHeight if (is_iphone) { - windowHeight -= 44 // account for lower bar + windowHeight -= 22 // account for lower bar window.scrollTo(0,0) } diff --git a/public/assets/js/lib/HeaderView.js b/public/assets/js/lib/HeaderView.js index 374f84c..59ca255 100644 --- a/public/assets/js/lib/HeaderView.js +++ b/public/assets/js/lib/HeaderView.js @@ -26,7 +26,6 @@ var HeaderView = View.extend({ }, updateSlideCount: function(n){ - console.log(n) if (n > 1) { if (n < 10) n = "0" + n this.$figText.show() diff --git a/public/assets/js/lib/ProjectView.js b/public/assets/js/lib/ProjectView.js index 7e38d2a..4b1c994 100644 --- a/public/assets/js/lib/ProjectView.js +++ b/public/assets/js/lib/ProjectView.js @@ -123,11 +123,13 @@ var ProjectView = View.extend({ }, previous: function(e){ + if (is_mobile) return; e.stopPropagation() app.nav.previous() }, next: function(e){ + if (is_mobile) return; e.stopPropagation() app.nav.next() }, diff --git a/public/assets/js/lib/Scroller.js b/public/assets/js/lib/Scroller.js index 3bebce7..4b4c95b 100644 --- a/public/assets/js/lib/Scroller.js +++ b/public/assets/js/lib/Scroller.js @@ -11,9 +11,9 @@ var Scroller = (function(){ left = opt.left right = opt.right if (is_mobile) { -// document.body.addEventListener("touchstart", touchstart) -// document.body.addEventListener("touchmove", touchmove) -// document.body.addEventListener("touchend", touchend) + document.body.addEventListener("touchstart", touchstart) + document.body.addEventListener("touchmove", touchmove) + document.body.addEventListener("touchend", touchend) } else { document.body.addEventListener("wheel", wheelDelta) @@ -22,10 +22,14 @@ var Scroller = (function(){ } var touching = false, touchStartTime, touchStartY, touchEndY, touchDist, touchScrollTop + var touchAdvanceDistance = 60 + var touchFadeDistance = 60 + var $items = $("#items")[0] function touchstart (e) { touching = true touchStartTime = +(new Date) touchStartY = touchEndY = e.touches ? e.touches[0].pageY : e.pageY +// $items.className = "no-tween" } function touchmove (e) { if (! touching) return @@ -34,6 +38,15 @@ var Scroller = (function(){ var duration = timestamp - touchStartTime touchEndY = e.touches ? e.touches[0].pageY : e.pageY touchDist = touchStartY - touchEndY + var touchAbs = Math.abs(touchDist) + if (touchAbs > touchAdvanceDistance) { +// touchend(e) + // touchAbs -= 9 + // $items.style.opacity = clamp(1-touchAbs / (touchFadeDistance * 2), 0, 1) + // touchAbs *= -sign(touchDist) + // touchAbs /= 2 + // $items.style[transformProp] = "translateZ(0) translateY(" + touchAbs + "px)" + } } function touchend (e) { if (! touching) return @@ -42,12 +55,24 @@ var Scroller = (function(){ var timestamp = +(new Date) var duration = timestamp - touchStartTime touchDist = touchStartY - touchEndY - if (Math.abs(touchDist) < 10 || duration < 100) { - step(1) - } - else { + console.log("DURATION >>", duration, touchDist) + if ( (duration < 120 && Math.abs(touchDist) < 10) || Math.abs(touchDist) >= touchAdvanceDistance) { touchDist > 0 ? step(1) : step(-1) } + +// $items.className = "" +// setTimeout(function(){ +// $items.style[transformProp] = "translateZ(0) translateY(0)" +// if (Math.abs(touchDist) >= touchAdvanceDistance) { +// $items.style.opacity = 0 +// setTimeout(function(){ +// $items.style.opacity = 1 +// }, 200) +// } +// else { +// $items.style.opacity = 1 +// } +// }, 0) } function wheelDelta (e){ diff --git a/public/assets/ok.css b/public/assets/ok.css index b8e0ff6..25392e5 100644 --- a/public/assets/ok.css +++ b/public/assets/ok.css @@ -278,6 +278,9 @@ span { display: block; float: none; } +#items.notween { + transition: opacity 0, transform 0; +} .item { height: 100vh; |