From b5cbd895d6a56c40f7ccb10f94a54bc3aa29cdae Mon Sep 17 00:00:00 2001 From: "Alex A. Naanou" Date: Fri, 22 Feb 2013 02:34:11 +0400 Subject: [PATCH] fixed an navigator indicator bug... Signed-off-by: Alex A. Naanou --- TODO.otl | 5 +++-- index2.html | 2 -- layout.js | 4 ++-- lib/jli.js | 38 +++++++++++++++++++++++++++++--------- navigator.js | 4 +++- 5 files changed, 37 insertions(+), 16 deletions(-) diff --git a/TODO.otl b/TODO.otl index 336fb4a..9c9528d 100755 --- a/TODO.otl +++ b/TODO.otl @@ -1,6 +1,5 @@ [_] 37% Priority work - [_] 65% general todo - [X] JSON load/save + [_] 66% general todo [_] 0% Version 1.0 checklist (migration to layout.html) [_] page scaling for full page view [_] top/bottom toolbars @@ -174,6 +173,8 @@ [_] try using the scroll event to see of we reached the limit... | and move the limit accordingly [_] BUG: scrool seems to do odd things on refresh... + [X] JSON load/save + [X] BUG: navigator indicator does not scroll [X] check if scrollTo knows about element scaling... | if not update the code.... [X] Editor: make the editor switchable... diff --git a/index2.html b/index2.html index cf6bfcc..8b7e5fb 100755 --- a/index2.html +++ b/index2.html @@ -112,8 +112,6 @@ $(document).ready(function(){ }, function(k){console.log(k)})) - - // XXX make this a default setup in the lib... window.MagazineScroller = makeScrollHandler($('.viewer'), { hScroll: true, vScroll: false, diff --git a/layout.js b/layout.js index 8d84c15..b04a75a 100755 --- a/layout.js +++ b/layout.js @@ -170,12 +170,12 @@ function handleScrollRelease(evt, data){ } else { if(at > first){ setTransitionEasing(mag, 'ease-in') - setTransitionDuration(mag, DEFAULT_TRANSITION_DURATION) + setTransitionDuration(mag, DEFAULT_TRANSITION_DURATION/2) setElementTransform(mag, first) } else if(at < last){ setTransitionEasing(mag, 'ease-in') - setTransitionDuration(mag, DEFAULT_TRANSITION_DURATION) + setTransitionDuration(mag, DEFAULT_TRANSITION_DURATION/2) setElementTransform(mag, last) } } diff --git a/lib/jli.js b/lib/jli.js index b3b4441..600de2f 100755 --- a/lib/jli.js +++ b/lib/jli.js @@ -487,10 +487,14 @@ function makeKeyboardHandler(keybindings, unhandled){ // less than this, the whole event is considered a click and not a // drag/swipe... var CLICK_THRESHOLD = 10 + // if the amount of time to wait beween start and end is greater than this // the event is considered a long click. // NOTE: this will not auto-fire the event, the user MUST release first. var LONG_CLICK_THRESHOLD = 400 + +// the maximum amount of time between clicks to count them together. +// NOTE: if multi-clicks are disabled this has no effect. // NOTE: this is reset by the timeout explicitly set in the handler... // NOTE: this is the timeout between two consecutive clicks and not the total. // NOTE: if multiple clicks are enabled this will introduce a lag after @@ -498,6 +502,8 @@ var LONG_CLICK_THRESHOLD = 400 // as possible. var MULTI_CLICK_TIMEOUT = 200 +// the amount of time between finger releases. +// NOTE: when this is passed all the fingers released before are ignored. var MULTITOUCH_RELEASE_THRESHOLD = 100 // XXX add a resonable cancel scheme... @@ -510,6 +516,8 @@ var MULTITOUCH_RELEASE_THRESHOLD = 100 // XXX BUG: on landing a second finger while scrolling the things goes // haywhire... // ...check if this is gone... +// XXX add something like a scrollTo that would understand elements as +// well as explicit positions. // XXX split this into a seporate lib... function makeScrollHandler(root, config){ root = $(root) @@ -707,11 +715,12 @@ function makeScrollHandler(root, config){ var scroller = { - root: root, options: { // if one of these is false, it will restrict scrolling in // that direction. hScroll for horizontal and vScroll for // vertical. + // NOTE: to disable scroll completely use scrollDisabled, see + // below for details. hScroll: true, vScroll: true, @@ -728,12 +737,15 @@ function makeScrollHandler(root, config){ // items to be ignored by the scroller... // this is a jQuery compatible selector. - ignoreElements: '.noSwipe', - // this is the side of the rectangle if the user movees out of - // and then returns back to the action will get cancelled. + ignoreElements: '.noScroll', + // this is the side of the rectangle in px, if the user moves + // out of it, and then returns back, the action will get cancelled. // i.e. the callback will get called with the "cancelling" state. scrollCancelThreshold: 100, + // these control weather in-scroll events will get triggered. + // NOTE: these may impact performance, especially the scroll + // event, thus they need to enabled explicitly. enabelStartEvent: false, enableUserScrollEvent: false, enableEndEvent: false, @@ -744,11 +756,20 @@ function makeScrollHandler(root, config){ autoCancelEvents: false, eventBounds: 5, - + // callback to be called when the user lifts a finger/mouse. + // NOTE: this may happen before the scroll is done, for instance + // when one of several fingers participating in the action + // gets lifted. // NOTE: if this returns false explicitly, this will stop scrolling. callback: postScrollCallback, // These are used by the default callback... + // if true then doubleClick and multiClick events will get + // triggered. + // NOTE: this will introduce a lag needed to wait for next + // clicks in a group. + // NOTE: when this is false, shortClick is triggered for every + // single click separately. enableMultiClicks: false, // NOTE: if these are null, respective values from the env will // be used. @@ -759,6 +780,7 @@ function makeScrollHandler(root, config){ }, // NOTE: this is updated live but not used by the system in any way... state: 'stopped', + root: root, start: function(){ this.state = 'waiting' @@ -835,6 +857,7 @@ function makeScrollHandler(root, config){ // same field when it recieves the object. // XXX add generic snap // XXX add generic innertial scroll +// XXX test multiple touches... function postScrollCallback(data){ var scroller = data.scroller var options = scroller.options @@ -853,7 +876,6 @@ function postScrollCallback(data){ } // handle multiple touches... - // XXX needs testing... if(data.touches > 0){ var then = scroller._last_touch_release if(then == null || now - then < multitouchTimeout){ @@ -919,9 +941,7 @@ function postScrollCallback(data){ } // swipes... - // XXX make these less brain dead... - // ...when all is OK also call screenReleased (chain events) - // also would be nice to add a generic swipe event... + // XXX might be a good idea to chain these with swipe and screenReleased if(Math.abs(data.distance.x) > Math.abs(data.distance.y)){ if(data.distance.x <= -clickThreshold && root.data('events').swipeLeft){ return root.trigger('swipeLeft', data) diff --git a/navigator.js b/navigator.js index 8d9d581..764e412 100755 --- a/navigator.js +++ b/navigator.js @@ -77,8 +77,9 @@ function updateNavigator(n){ var pW = bar.width()/pn if(n == null){ + var left = getMagazineShift() // XXX this behaves erratically if the page is zoomed... - var res = (-parseFloat(mag.css('left'))/(mW-PW)) * (bW-pW) + var res = (Math.abs(left)/(mW-PW)) * (bW-pW) } else { res = pW*n } @@ -88,6 +89,7 @@ function updateNavigator(n){ res = res < (bW-pW) ? res: (bW-pW) // set indicator position... + console.log('>>>', res) pos.css({ left: res })