Use keypress with keycode?


#1

I was trying to use a very cheap bluetooth gamepad. It is not the standard type. so in this place https://codepen.io/miduga/pen/ujolf investigate what code send the buttons. (to then include it in my code). and the result were the codes. 96 97 98 and 99. Try executing this keyboard input code and i did replace key A by any of the codes.

var KeyboardHandler = pc.createScript('keyboardHandler');

KeyboardHandler.attributes.add('redMaterial', {
    type: 'asset',
    assetType: 'material'
});

KeyboardHandler.attributes.add('whiteMaterial', {
    type: 'asset',
    assetType: 'material'
});

// initialize code called once per entity
KeyboardHandler.prototype.initialize = function() {
    // Use on() to listen for events on the keyboard device.
    // Arguments are:
    // 1) The event name to listen for
    // 2) The callback function to call when the event fires
    // 3) (optional) The value to use for 'this' in the callback function

    this.app.keyboard.on(pc.EVENT_KEYDOWN, this.onKeyDown, this);
    this.app.keyboard.on(pc.EVENT_KEYUP, this.onKeyUp, this);
};

// update code called every frame
KeyboardHandler.prototype.update = function(dt) {
    /*
     * Notice in the demo that pressing and holding the arrow keys doesn't
     * make the block spin. wasPressed() is used to detect a
     * keypress that occurred since the last frame and will only be
     * called once even if the key is held down.
     */
    var angle = 0;
    if (this.app.keyboard.wasPressed(pc.KEY_LEFT)) {
        angle = -5;
    } else if (this.app.keyboard.wasPressed(pc.KEY_RIGHT)) {
        angle = 5;
    }

    /*
     * Notice that pressing and holding the space bar makes the block
     * continuously spin. isPressed() is used to detected if a
     * key is down right now. So it will be true every frame as long as
     * the key is still pressed.
     */
    if (this.app.keyboard.isPressed(pc.KEY_SPACE)) {
        angle = 1;
    }

    // Update the spinning cube
    this.entity.rotateLocal(0, angle, 0);
};

/*
* Event handler called when key is pressed
*/
KeyboardHandler.prototype.onKeyDown = function (event) {
    // Check event.key to detect which key has been pressed
    if (event.key === pc.KEY_A && this.redMaterial) {
        this.entity.model.meshInstances[0].material = this.redMaterial.resource;
    }

    // When the space bar is pressed this scrolls the window.
    // Calling preventDefault() on the original browser event stops this.
    event.event.preventDefault();
};

/*
* Event handler called when key is released
*/
KeyboardHandler.prototype.onKeyUp = function (event) {
    // Check event.key to detect which key has been pressed
    if (event.key === pc.KEY_A && this.whiteMaterial) {
        this.entity.model.meshInstances[0].material = this.whiteMaterial.resource;
    }
};

but as I supposed it does not work. obviously “key press” is not the right way. What is the right way. Does it have something to do with the use of charcode instead of keycode? I do not understand this…


#2

Can you check your game pad against this tester please? Does it show up? https://html5gamepad.com/


#3

Actually, it looks your gamepad is sending keyboard input. You should be able to use the keycode directly in the isPressed/wasPressed/etc function calls. Try this code in the update function:

    if (this.app.keyboard.wasPressed(96)) {
        // Do something
    }

To further explain this, each keycode represents a keyboard key as seen from this table: https://keycode.info/ (click table in the top right)

In PlayCanvas, all pc.KEY_* constants are just the keycode values as you can see here: https://github.com/playcanvas/engine/blob/fab9d05a711d0a075e719dd603e57278c212dfaa/src/input/input.js#L401


#4

Thanks. This Works fine now