Add Hammver V2 swipe gestures.

[danielolivaresd]

Add capability to detect swipes (left and right) for changing pages. Use new Hammer v2 API syntax.

[danielweck]

Hello, thanks for the PR! In the past there were some issues with Hammer's event sub-system, and user-select / touch-action CSS overrides (e.g. delete Hammer.defaults.cssProps.userSelect) resulting in interferences with the iframes that Readium uses to host EPUB content documents (HTML / SVG files), in addition to problems related to the start and end point of touch swipe gestures (across the iframe boundaries ... in fixed-layout two-page-spread mode it even gets worse due to 2x contiguous iframes).

That's the main reservation against merging this right now. I think we need more thorough testing on different touch-enabled platforms (iOS, Android, and Windows 10 primarily?).

FYI, here's some experimental code that was used to debunk touch-related issues on Windows 10 / Edge, it's not pretty: https://github.com/readium/readium-js-viewer/compare/develop...danielweck:feature/touchSwipe#diff-99568d36162fffa1ff6e34886e38ed1e (note how Hammer is initialized, further down in the code diff)

[toshiakikoike]

Hi Daniel,

I am trying to test readium-js-viewer's Touch UI on my Android phone, but swipe features are not working. I used the codes in "develop" branch.

Should I adjust any configuration in develop codes, or use another branch?

[danielweck]

Hello @toshiakikoike Well, looking at the code now, I see that "gesture handling" is totally disabled (i.e. touch support, finger swipe interactions for "previous/next page" commands): https://github.com/readium/readium-js-viewer/blob/66e8d21f0d10361326d098e413abedd8515d42e6/src/js/gestures.js#L19

I believe the rationale for disabling the "gesture handler" was that it was causing problems in the cloud reader on the various available web browsers at the time (on desktop and mobile platforms). The recommendation was to upgrade to a more recent version of Hammer (new API), and test on multiple platforms.

This Pull Request by Daniel Olivares is proposing a change, but this would need to be reviewed and tested based on the latest revision (head of the develop branch) of the cloud reader.

https://github.com/K1N5L4Y3R/readium-js-viewer/commit/11d61d86eeecad13f2ac9f8e2abf4e0826198079

I think the feature/touchSwipe branch in this repository is obsolete: https://github.com/readium/readium-js-viewer/compare/develop...feature/touchSwipe (better use this PR as a reference)

Feel free to run some tests and please let us know how it goes! :)

Kind regards, Daniel

[toshiakikoike]

Thank you. I'll try.

[toshiakikoike]

Progress report: I'd replace "src/js/gestures.js" in dev(2.30.0-alpha) to "K1N5L4Y3R/readium-js-viewer@11d61d8" and "npm run dist".

Result; "Swipe action" work well on virtual android/iOS by user-agent-switcher on Firefox. On iOS, it looks like well. But not work on real android device(Android 8.0.0/Chrome 64.0.3282.137).

I'll continue to try it.

[coler-j]

@toshiakikoike any update to this?

[toshiakikoike]

@toshiakikoike any update to this?

Sorry, no update this.

[coler-j]

Is there a bounty system where I could pay someone to resolve this issue?

[llemeurfr]

bug bounty, this should be discussed on the Readium Slack, this is not a bad idea IMO.

[coler-j]

Where is the readium slack? I am very motivated to get this issue resolved (as well as a few others) and have a budget to do so.

[llemeurfr]

here you go ... https://readium-slack.herokuapp.com/