ajoslin / angular-scrolly

Fake transform-scrolling with angular-friendly utilities
http://ajoslin.github.io/angular-scrolly
65 stars 7 forks source link

feat(device): Support other input devices than touch #7

Closed tbosch closed 11 years ago

tbosch commented 11 years ago

Hi, it would be great to do the scrolling also with the mousewheel or with the keys. This would result in a better experience if mobile sites are viewed on desktop browsers without touch screen.

By the way, scrolling using the mouse right now (with click and move) is not working so well. Could you have a look into that?

Tobias

ajoslin commented 11 years ago

Perhaps just use normal overflow scroll on desktop?

tbosch commented 11 years ago

Yes, but it's not so easy to detect "desktop" browser. I thought adding this to your lib would make things easier...

ajoslin commented 11 years ago

Can't we just detect the presence of touch in document?

I could try it, but it may be hard to get it to work well. Although I think even on desktop with lists of 100-200+, fake scrolling is better performance. So it may be worth doing.

tbosch commented 11 years ago

Well, newer "desktops" have touch and mouse / touchpad support (e.g. Chrome Pixel)...

ajoslin commented 11 years ago

oh good point. OK, I will get mousewheel to work.

ajoslin commented 11 years ago

I tried mousewheel last night and failed to get it to work smoothly - the problem is that there is no 'mousewheelend' event - the best I could do is check if there has been no mousewheel event since 100ms ago or so - but no matter what I set for the ms it still looks bad.

My next attempt will be just to listen to the 'scroll' event and set the transform to whatever the scroll change was.

ajoslin commented 11 years ago

edit: not doing this approach

tbosch commented 11 years ago

Not bad. However, the fixed top toolbar is hoping up and down when I scroll using my mac touchpad... Aah, didn't think this was so complicated, but apparently it is!

ajoslin commented 11 years ago

If we are ok with no acceleration on desktop, I could go back to catching mousewheel event. That would be more reliable.

ajoslin commented 11 years ago

There are just so many though. mousewheel, arrow keys, spacebar, ...

tbosch commented 11 years ago

Yes, I think so too. At least it would be accessible on the desktop, which is already a good improvement.

ajoslin commented 11 years ago

OK, added desktopScroller service. It's landed in master. I tested it manually but didn't have time to add unit tests this morning for it. But it works a lot lot lot better now :-)

And there are unit tests for scroller.js now.

There's simply no boundary bouncing on desktop now, but that's a lot better than trying to fake it .. since none of the desktop scroll keys have "end" events, there's no way to fake it reliably.

@tigbro could you try it in angular-jqm and see if its good? I probably won't have time until late this week.

tbosch commented 11 years ago

Will look into it tomorrow.

tbosch commented 11 years ago

Great work, scrolling on the desktop works fine with both, scroll wheel and keys! You could also add a scrollbar, but I think that's just a detail.

So I think we could close this?