I want reel to stop propagate touch event about reel

[pisi]

Hello Jirawat,

the propagation of the touch events is being stopped immediatelly after the slide handler executes as the mousemove binding returns false a ceices the event. There is one exception though - Reel detects direction of the touch move and if the direction is rather vertical, it allows the propagation of the event to allow page scrolling. This wa a very legitimate request from iPhone users, where the Reel instance tends to fill significant portion of the screen and makes scrolling the page quite annoying. This exception also doesn't apply to multi-row or orbital setups, where the event is prevented in any case.

Can you maybe show me your setup? I might be able to asses your problem deeper if I have a chance to interact with it directly on my iPad. You can use my e-mail (petr at vostrel dot cz) if you can not share it here publicly.

.pisi

[SimonEast]

Yes, I was just attempting the same thing. On the iPad, you don't really want the viewport to be scrolled when you're 'reeling' the image, and sometimes this happens accidentally (maybe something to do with the direction detection not being strict enough). But I found the fix...

Find this line in the plugin...

 .bind(_touchmove_, function(e){ t.trigger('slide', [finger(e).clientX, finger(e).clientY, true]); return !(opt.rows > 1 || opt.orbital || get(_reeling_)) })

Change to

 .bind(_touchmove_, function(e){ t.trigger('slide', [finger(e).clientX, finger(e).clientY, true]); return !(true || opt.rows > 1 || opt.orbital || get(_reeling_)) }) 

You're basically inserting true || into the return statement so that it always returns false and does not bubble up the event list.

Simon.

[danjirawat]

Thanks Simon.

I also found at the Start function.

Change ....

.bind(touchstart, function(e){ t.trigger('down', [finger(e).clientX, finger(e).clientY, true]); })

To ....

.bind(touchstart, function(e){ t.trigger('down', [finger(e).clientX, finger(e).clientY, true]); return false })

By adding False, it's solve my problem.

[pisi]

Although Simon's solution does the job, Dan's solution appears to be better and cleaner in terms of what he wants to do. In the touchstart binding the return false is intentionally ommited, so that Reel can eventually let the underlaying system handle the touch sequence when it is detected to be rather vertical than horizontal. So returning false in the binding completely steals the touch interaction and the viewport won't be scrolled in any circumstance.

Maybe you are right and the direction detection should be fine adjusted. Right now it calculates an angle from the touchstart position and 45° is the threshold.

[SimonEast]

OK, thanks for the feedback pisi. I might use that code instead then. Probably better to do it on touchstart than on touchmove.