Add keyboard scrolling support

[vitch]

So that when the pane is focused the keyboard can be used to scroll it

[vitch]

Implemented (thanks to aFarkas) in vitch/jScrollPane@dd4c5bbca27658b898dd083d4c8f892235221704 - however, doesn't work correctly in Firefox (doesn't repeat as expected).

I tried to switch to keypress event (in vitch/jScrollPane@f48c45a821278c5ebb5d73dcf0388f8dfdc45490) but unfortunately the arrow keys don't seem to work with this event in webkit (I've posted a message to the jquery forum about this, hopefully there is a workaround).

So leaving this ticket open until an all-round satisfactory solution is found...

[vitch]

The reason that keypress doesn't work in Safari (also read the comments):

http://ejohn.org/blog/keypress-in-safari-31/

My post on the jQuery group about this problem:

http://forum.jquery.com/topic/keypress-event-arrow-keys-and-webkit

Looks like it will be a case of reverting back to keydown events and looking for a way to make them work correctly in firefox...

[aFarkas]

I wanted to look into this issue, but for me seems to work on firefox. Did made something here? I have added some keyboad tweaks to my fork:

1. if the user uses mousedown, the script blurs the tabindex-area (no outline)
2. keyboard handling also inside of the jscroll-area, but not on form elements

Haven't testet this code much, but should work.

regards alex

[vitch]

Thanks for this :) I'm still seeing the weird behaviour on firefox (3.6.10/ OSX) with your latest code. To explain the problem further, I am seeing it on the basic.html demo by doing the following:

• Click in the top scrollpane to focus it.
• Press and hold the down arrow key.

What happens for me is that the scrollpane moves down by one jump. Then the scrollpane stops moving and instead the whole page starts scrolling.

Can you replicate this in Firefox? It works great for me in Chrome and other browsers (haven't tested Windows/IE yet).

Above you can see the link to the commit where I switched to keypress which works correctly in Firefox (and reduces the code a little because it fires repeats automatically internally) but this doesn't (and can't) work in webkit browsers.

I guess maybe a combination of the two approaches unless you can think of a better approach?

Thanks again for your help with this functionality :)

[aFarkas]

Ok, now I can reproduce this bug on my Mac. I have testet and developed this with my PC. It seems it is a FF/Mac only issue. I will look into this.

[aivopaas]

Keyboard scrolling is working fine in my latest. Or isn't it?

[vitch]

There are still issues in Firefox/ OSX :(

If the page is long enough that the body needs to scroll and you focus a scroll pane and then hold down the down arrow then after the initial jump both the body and the scrollpane scroll. As per the description above. Other browsers seem to work OK (I haven't tested all of them but I believe this is specifically related to FF on OSX)...

Can you replicate the problem on OSX? As I say above, switching to keypress works well for FF/OSX - maybe the only solution will be two paths?

[aivopaas]

If I only had an OSX in virtual machine.. I hope there is a simple way to fix that. Maybe suppress keypress while having a key registered as down through keydown/up?

[vitch]

There is some interesting further information about keys here: http://unixpapa.com/js/key.html

It seems that on Gecko Mac the only repeating key event is keypress (the problem is that an arrow key is a "special key" and so on IE and Webkit only a keydown event is fired).

From this it seems that adding a listener for keypress which returns false while a key is registered as down should work... I'll have a play and update once it's implemented...

[vitch]

Fixed in 852b42294ee866c6060cbe5d9435090f1d8bb609, 7b239fa756ea80ba798ba5d3be12443202f685a3, f7a8238488e342fe8e88844625aca88c6f64058b and f3c46c7b059ce2fdc1b2d8a10d76bf19eb728555 - tested in latest versions of FF, Safari and Chrome on OSX and in FF and IE6, 7 & 8 on XP...