New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Touch-action isn't flexible enough for direction-specific behavior #6

Closed
RByers opened this Issue Apr 17, 2015 · 11 comments

Comments

Projects
None yet
4 participants

@RByers RByers self-assigned this Apr 17, 2015

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers Jun 16, 2015

Contributor

Landed in df02c70
Tweaked in 8548506

Let's keep the issue open until we have consensus that we feel this is ready to ship though. We owe the group some demos, etc.

Contributor

RByers commented Jun 16, 2015

Landed in df02c70
Tweaked in 8548506

Let's keep the issue open until we have consensus that we feel this is ready to ship though. We owe the group some demos, etc.

@patrickhlauke

This comment has been minimized.

Show comment
Hide comment
@patrickhlauke

patrickhlauke May 23, 2016

Member

We owe the group some demos

Is this actually implemented now? Or are we thinking theoretical demos?

Member

patrickhlauke commented May 23, 2016

We owe the group some demos

Is this actually implemented now? Or are we thinking theoretical demos?

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers May 25, 2016

Contributor

It's implemented in Chrome behind the enable-experimental-web-platform-features flag.

Contributor

RByers commented May 25, 2016

It's implemented in Chrome behind the enable-experimental-web-platform-features flag.

@RByers RByers removed their assignment May 25, 2016

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers May 25, 2016

Contributor

Next step here is to write a demo (eg. of the carousel case interacting reasonably with panning while pinch-zoomed). @dtapuska, @NavidZ any interest?

Contributor

RByers commented May 25, 2016

Next step here is to write a demo (eg. of the carousel case interacting reasonably with panning while pinch-zoomed). @dtapuska, @NavidZ any interest?

@dtapuska

This comment has been minimized.

Show comment
Hide comment
@dtapuska

dtapuska May 25, 2016

I had written a carousel before; I guess the viewport isn't scalable.

dtapuska commented May 25, 2016

I had written a carousel before; I guess the viewport isn't scalable.

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers May 25, 2016

Contributor

Oh I forgot you wrote that, sorry! I think it demonstrates the essential point here (a carousel inside something else that scrolls - doesn't really matter if that's a pinch viewport or some other scroller).

With pan-right/pan-left support you can swipe all the way to the end of the carousel (49), lift, then drag to scroll the container to the right. Without pan-right and pan-left I don't think there's really any way to make the composition scenario work with pointer events. You have to disallow horizontal panning of the container when over the carousel completely. This means that when pinch-zoomed in you may be trapped - unable to pan the viewport without zooming out.

@scottgonzalez I'm curious for your take on this sort of nested scrolling scenario. Seem important to you / jQuery? I know nested scrollers are generally an anti-pattern, but they happen all the time in pinch-zoom scenarios so can't be ignored completely IMHO.

@NavidZ / @mustaqahmed note that this carousel doesn't appear to work correctly in Chrome with pointer event support enabled - want to debug to see if it's a known compat issue?

Contributor

RByers commented May 25, 2016

Oh I forgot you wrote that, sorry! I think it demonstrates the essential point here (a carousel inside something else that scrolls - doesn't really matter if that's a pinch viewport or some other scroller).

With pan-right/pan-left support you can swipe all the way to the end of the carousel (49), lift, then drag to scroll the container to the right. Without pan-right and pan-left I don't think there's really any way to make the composition scenario work with pointer events. You have to disallow horizontal panning of the container when over the carousel completely. This means that when pinch-zoomed in you may be trapped - unable to pan the viewport without zooming out.

@scottgonzalez I'm curious for your take on this sort of nested scrolling scenario. Seem important to you / jQuery? I know nested scrollers are generally an anti-pattern, but they happen all the time in pinch-zoom scenarios so can't be ignored completely IMHO.

@NavidZ / @mustaqahmed note that this carousel doesn't appear to work correctly in Chrome with pointer event support enabled - want to debug to see if it's a known compat issue?

@scottgonzalez

This comment has been minimized.

Show comment
Hide comment
@scottgonzalez

scottgonzalez Jun 28, 2016

Member

We don't have any cases within jQuery UI where we would need these values, but I've discussed this with @arschmitz (jQuery Mobile lead) and we both think this would be a useful addition.

Member

scottgonzalez commented Jun 28, 2016

We don't have any cases within jQuery UI where we would need these values, but I've discussed this with @arschmitz (jQuery Mobile lead) and we both think this would be a useful addition.

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers Jul 6, 2016

Contributor

Here's a different demo designed to be a ultra-simplistic version of what twitter.com is doing for pull-to-refresh in Chrome via touch events. To do the same thing with pointer events, you really need touch-action: pan-down.

Video of the effect from twitter

Contributor

RByers commented Jul 6, 2016

Here's a different demo designed to be a ultra-simplistic version of what twitter.com is doing for pull-to-refresh in Chrome via touch events. To do the same thing with pointer events, you really need touch-action: pan-down.

Video of the effect from twitter

@RByers RByers added v2-blocking and removed help wanted labels Jul 13, 2016

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers Jul 27, 2016

Contributor

blink Intent-to-ship.

I think all that's left for this bug is to add some web platform tests to validate the behavior (both parsing and automated input). @dtapuska can you own, or find someone else to own that? It may be simpler to write some new more concise touch-action tests to replace the existing ones, or we can just continue to extend the pattern in the existing ones.

Contributor

RByers commented Jul 27, 2016

blink Intent-to-ship.

I think all that's left for this bug is to add some web platform tests to validate the behavior (both parsing and automated input). @dtapuska can you own, or find someone else to own that? It may be simpler to write some new more concise touch-action tests to replace the existing ones, or we can just continue to extend the pattern in the existing ones.

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers Jul 28, 2016

Contributor

Note that we discussed this feature at the hackathon. Although it'll probably be over a year before Edge can implement, they're OK with the design.

We noticed a subtle difference with what twitter.com does in Chrome today and what's possible with this feature: if you start at scrollTop=0, pan down, and then pan up you can get the p2r effect to trigger. It's not clear that that's any better UX than what will be possible via touch-action (where the effect will only trigger if you start by panning up) and it's fairly subtle so we're not worried about it.

Contributor

RByers commented Jul 28, 2016

Note that we discussed this feature at the hackathon. Although it'll probably be over a year before Edge can implement, they're OK with the design.

We noticed a subtle difference with what twitter.com does in Chrome today and what's possible with this feature: if you start at scrollTop=0, pan down, and then pan up you can get the p2r effect to trigger. It's not clear that that's any better UX than what will be possible via touch-action (where the effect will only trigger if you start by panning up) and it's fairly subtle so we're not worried about it.

@RByers

This comment has been minimized.

Show comment
Hide comment
@RByers

RByers Sep 8, 2016

Contributor

web-platform-test added in web-platform-tests/wpt@f690b6f, I think we can now call this done.

Contributor

RByers commented Sep 8, 2016

web-platform-test added in web-platform-tests/wpt@f690b6f, I think we can now call this done.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment