View Full Version : YUI Help - KeyListener + Event

28 Dec 2006, 4:22 PM
I'm not entirely sure if this is appropriate - but I'd like to think that this could become a YUI help forum as well as a yui-ext resource. I'm not a fan of mailing lists.

What do you think to making a YUI forum for discussing and getting help on the non -ext part of the library. There's quite a wealth of YUI users here to provide expertise.

Secondly my question - I have an object containing the following code

var kl2 = new YAHOO.util.KeyListener(document, { keys:[74,175,170,171,172,174,176] },
{ fn:this.kp});//,
//correctScope:true } );

//this.kp is a function within the object which calls
kp : function(e){

YAHOO.log('pressed: ' + $E.getCharCode(e));

but the charCode is always 0. I'm stumped. 74 is a keypress for J.

31 Dec 2006, 2:37 AM
Try a yui-ext KeyMap.

// builds a KeyMap internally
var km = getEl(document).addKeyListener([74,175,170,171,172,174,176], this.kp, this);

// or
var km = getEl(document).addKeyMap({
key: [74,175,170,171,172,174,176],
fn: this.kp,
scope: this

// or
var km = new YAHOO.ext.KeyMap(document, {
key: [74,175,170,171,172,174,176],
fn: this.kp,
scope: this

FYI if you are doing chars, with the yui-ext keymap you can just pass in the chars:

var km = getEl(document).addKeyListener('abcdefg', this.kp, this);

There's some other examples in the docs.

If you still get 0, let me know.

1 Jan 2007, 3:04 PM
Thanks for the tip Jack.

From the mailing list I learned that YUI uses a custom event for the keypresses and this explains the problem I was having.

In slider.js you can find the code with which $E.getCharCode can be used - its something like onkeydown = (my function). The YUI keylistener works differently and the keypress can be found via one of the arguments.

//code when not using keylistener

Event.on(this.id, "keydown", this.handleKeyDown, this, true);

handleKeyPress: function(e) {
if (this.enableKeys) {
var Event = YAHOO.util.Event;
var kc = Event.getCharCode(e);
switch (kc) {
case 0x25: // left
case 0x26: // up
case 0x27: // right
case 0x28: // down
case 0x24: // home
case 0x23: // end

Hopefully this will help someone else ![/code]