/**
* This gets called when a `Button` has focus and `keydown` is triggered via a key
* press.
*
* @param {EventTarget~Event} event
* The event that caused this function to get called.
*
* @listens keydown
*/
handleKeyPress(event) {
// Ignore Space or Enter key operation, which is handled by the browser for a button.
if (!(keycode.isEventKey(event, 'Space') || keycode.isEventKey(event, 'Enter'))) {
// Pass keypress handling up for unsupported keys
super.handleKeyPress(event);
}
}
/**
* Keydown handler. Attached when modal is focused.
*
* @listens keydown
*/
handleKeyDown(event) {
// exit early if it isn't a tab key
if (!keycode.isEventKey(event, 'Tab')) {
return;
}
const focusableEls = this.focusableEls_();
const activeEl = this.el_.querySelector(':focus');
let focusIndex;
for (let i = 0; i < focusableEls.length; i++) {
if (activeEl === focusableEls[i]) {
focusIndex = i;
break;
}
}
if (document.activeElement === this.el_) {
focusIndex = 0;
}
if (event.shiftKey && focusIndex === 0) {
focusableEls[focusableEls.length - 1].focus();
event.preventDefault();
} else if (!event.shiftKey && focusIndex === focusableEls.length - 1) {
focusableEls[0].focus();
event.preventDefault();
}
}
/**
* Handle a `keydown` event on this menu. This listener is added in the constructor.
*
* @param {EventTarget~Event} event
* A `keydown` event that happened on the menu.
*
* @listens keydown
*/
handleKeyPress(event) {
// Left and Down Arrows
if (keycode.isEventKey(event, 'Left') || keycode.isEventKey(event, 'Down')) {
event.preventDefault();
this.stepForward();
// Up and Right Arrows
} else if (keycode.isEventKey(event, 'Right') || keycode.isEventKey(event, 'Up')) {
event.preventDefault();
this.stepBack();
} else {
// NOTE: This is a special case where we don't pass unhandled
// keypress events up to the Component handler, because this
// is just adding a keypress handler on top of the MenuItem's
// existing keypress handler, which already handles passing keypress
// events up.
}
}
/**
* Called when this SeekBar has focus and a key gets pressed down.
* Supports the following keys:
*
* Space or Enter key fire a click event
* Home key moves to start of the timeline
* End key moves to end of the timeline
* Digit "0" through "9" keys move to 0%, 10% ... 80%, 90% of the timeline
* PageDown key moves back a larger step than ArrowDown
* PageUp key moves forward a large step
*
* @param {EventTarget~Event} event
* The `keydown` event that caused this function to be called.
*
* @listens keydown
*/
handleKeyPress(event) {
if (keycode.isEventKey(event, 'Space') || keycode.isEventKey(event, 'Enter')) {
event.preventDefault();
this.handleAction(event);
} else if (keycode.isEventKey(event, 'Home')) {
event.preventDefault();
this.player_.currentTime(0);
} else if (keycode.isEventKey(event, 'End')) {
event.preventDefault();
this.player_.currentTime(this.player_.duration());
} else if (/^[0-9]$/.test(keycode(event))) {
event.preventDefault();
const gotoFraction = (keycode.codes[keycode(event)] - keycode.codes['0']) * 10.0 / 100.0;
this.player_.currentTime(this.player_.duration() * gotoFraction);
} else if (keycode.isEventKey(event, 'PgDn')) {
event.preventDefault();
this.player_.currentTime(this.player_.currentTime() - (STEP_SECONDS * PAGE_KEY_MULTIPLIER));
} else if (keycode.isEventKey(event, 'PgUp')) {
event.preventDefault();
this.player_.currentTime(this.player_.currentTime() + (STEP_SECONDS * PAGE_KEY_MULTIPLIER));
} else {
// Pass keypress handling up for unsupported keys
super.handleKeyPress(event);
}
}
/**
* Handles `keydown` events on the document, looking for ESC, which closes
* the modal.
*
* @param {EventTarget~Event} event
* The keypress that triggered this event.
*
* @listens keydown
*/
handleKeyPress(event) {
if (keycode.isEventKey(event, 'Escape') && this.closeable()) {
this.close();
}
}
it('should not break when invalid key codes are entered, instead false should be returned', function() {
var event = { which: -1, keyCode: -1, charCode: -1 };
assert.strictEqual(keycode.isEventKey(event, 'enter'), false);
assert.strictEqual(keycode.isEventKey(event, 'down'), false);
});
it('should allow to compare events to their keyCodes)', function() {
var event = { which: 13, keyCode: 13, charCode: 13 };
assert.strictEqual(keycode.isEventKey(event, 13), true);
assert.strictEqual(keycode.isEventKey(event, 14), false);
});
it('should return false if a ', function() {
var event = { which: 13, keyCode: 13, charCode: 13 };
assert.strictEqual(keycode.isEventKey(event, 'eNtER'), true);
assert.strictEqual(keycode.isEventKey(event, 'dOWN'), false);
});
it('should allow to compare events to their names (case insensitive)', function() {
var event = { which: 13, keyCode: 13, charCode: 13 };
assert.strictEqual(keycode.isEventKey(event, 'eNtER'), true);
assert.strictEqual(keycode.isEventKey(event, 'dOWN'), false);
});
it('should allow to compare events to their names', function() {
var event = { which: 13, keyCode: 13, charCode: 13 };
assert.strictEqual(keycode.isEventKey(event, 'enter'), true);
assert.strictEqual(keycode.isEventKey(event, 'down'), false);
});