Only grab key events on canvas

Give the canvas proper focus handling. This avoids messy logic that
needs to disable and enable event handling when we want to interact
with other UI elements.

It also makes sure we can properly inhibit the browser from triggering
local actions on key presses.
This commit is contained in:
Pierre Ossman
2016-10-05 10:21:17 +02:00
parent 69411b9ea3
commit 2afda54456
6 changed files with 31 additions and 43 deletions
+1 -11
View File
@@ -24,8 +24,7 @@ export default function Keyboard(defaults) {
this._pendingKey = null; // Key waiting for keypress
set_defaults(this, defaults, {
'target': document,
'focused': true
'target': null,
});
// keep these here so we can refer to them later
@@ -131,8 +130,6 @@ Keyboard.prototype = {
},
_handleKeyDown: function (e) {
if (!this._focused) { return; }
var code = this._getKeyCode(e);
var keysym = KeyboardUtil.getKeysym(e);
@@ -214,8 +211,6 @@ Keyboard.prototype = {
// Legacy event for browsers without code/key
_handleKeyPress: function (e) {
if (!this._focused) { return; }
stopEvent(e);
// Are we expecting a keypress?
@@ -244,8 +239,6 @@ Keyboard.prototype = {
this._sendKeyEvent(keysym, code, true);
},
_handleKeyPressTimeout: function (e) {
if (!this._focused) { return; }
// Did someone manage to sort out the key already?
if (this._pendingKey === null) {
return;
@@ -282,8 +275,6 @@ Keyboard.prototype = {
},
_handleKeyUp: function (e) {
if (!this._focused) { return; }
stopEvent(e);
var code = this._getKeyCode(e);
@@ -348,7 +339,6 @@ Keyboard.prototype = {
make_properties(Keyboard, [
['target', 'wo', 'dom'], // DOM element that captures keyboard input
['focused', 'rw', 'bool'], // Capture and send key events
['onKeyEvent', 'rw', 'func'] // Handler for key press/release
]);
+1 -9
View File
@@ -31,7 +31,6 @@ export default function Mouse(defaults) {
// Configuration attributes
set_defaults(this, defaults, {
'target': document,
'focused': true,
'touchButton': 1
});
@@ -52,8 +51,6 @@ Mouse.prototype = {
},
_handleMouseButton: function (e, down) {
if (!this._focused) { return; }
this._updateMousePosition(e);
var pos = this._pos;
@@ -156,7 +153,7 @@ Mouse.prototype = {
},
_handleMouseWheel: function (e) {
if (!this._focused || !this._onMouseButton) { return; }
if (!this._onMouseButton) { return; }
this._resetWheelStepTimers();
@@ -201,8 +198,6 @@ Mouse.prototype = {
},
_handleMouseMove: function (e) {
if (! this._focused) { return; }
this._updateMousePosition(e);
if (this._onMouseMove) {
this._onMouseMove(this._pos.x, this._pos.y);
@@ -211,8 +206,6 @@ Mouse.prototype = {
},
_handleMouseDisable: function (e) {
if (!this._focused) { return; }
/*
* Stop propagation if inside canvas area
* Note: This is only needed for the 'click' event as it fails
@@ -292,7 +285,6 @@ Mouse.prototype = {
make_properties(Mouse, [
['target', 'ro', 'dom'], // DOM element that captures mouse input
['focused', 'rw', 'bool'], // Capture and send mouse clicks/movement
['onMouseButton', 'rw', 'func'], // Handler for mouse button click/release
['onMouseMove', 'rw', 'func'], // Handler for mouse movement