Capturing gamepad input key events in Wii-U web browser

Question

The Internet Browser - Extended Functionality page for the Wii-U browser indicates that the A button and the control pad should send key events to the browser. Using the sample code below I was able to receive events for the A button but the directional pad seems to just want to scroll around the page and no events are triggered.

How can I properly receive notification of these events?

<script>
  document.body.onkeypress = function (event) {
    var pad = ["LEFT", "UP", "RIGHT", "DOWN"];
    var div = document.getElementById("text");
    // handle the A button
    if (event.keyCode == 13) {
      div.innerText = "A";
    }
    // handle the control pad - this doesn't seem to work
    if (event.keyCode >= 37 && event.keyCode <= 40) {
      div.innerText = pad[event.keyCode - 37];
    }
  };
</script>

I would rather avoid polling the window.wiiu.gamepad object as I only need the input that should be provided through the Control Pad and A button key events.

Answer 1

Turns out the A button can be captured by any of the the keydown, keyup or keypress events but the eight way digital pad can only be captured through the keydown and keyup events. You can also cancel the event to prevent the normal browser handling of moving between links on a page with preventDefault().

Sample code:

document.body.onkeyup = function (event) {
    var pad = ["LEFT", "UP", "RIGHT", "DOWN"];
    var div = document.getElementById("text");
    // handle the A button
    if (event.keyCode == 13) {
        div.innerText = "A - KEYUP";
    }
    // handle the control pad
    if (event.keyCode >= 37 && event.keyCode <= 40) {
        div.innerText = pad[event.keyCode - 37] + " - KEYUP";
    }
    // prevent the Wii U browser from processing the event further
    event.preventDefault();
    return false;
};

document.body.onkeydown = function (event) {
    var pad = ["LEFT", "UP", "RIGHT", "DOWN"];
    var div = document.getElementById("text");
    // handle the A button
    if (event.keyCode == 13) {
        div.innerText = "A - KEYDOWN";
    }
    // handle the control pad
    if (event.keyCode >= 37 && event.keyCode <= 40) {
        div.innerText = pad[event.keyCode - 37] + " - KEYDOWN";
    }
    // prevent the Wii U browser from processing the event further
    event.preventDefault();
    return false;
};

document.body.onkeypress = function (event) {
    var div = document.getElementById("text");
    // handle the A button
    if (event.keyCode == 13) {
        div.innerText = "A";
    }
};