Implementing mouse and keyboard input

This commit is contained in:
Dennis Eichhorn 2016-05-13 23:51:06 +02:00
parent dc2870889c
commit 3072b20d2a
5 changed files with 144 additions and 38 deletions

View File

@ -4,10 +4,16 @@
jsOMS.UI.Input.InputManager = function ()
{
this.keyBoardManager = new jsOMS.UI.Input.Keyboard.KeyboardManager();
this.mouseManager = new jsOMS.UI.Input.Mouse.MouseManager();
};
jsOMS.UI.Input.InputManager.prototype.getKeyboardManager = function()
{
return this.keyBoardManager;
};
jsOMS.UI.Input.InputManager.prototype.getMouseManager = function()
{
return this.mouseManager;
};
}(window.jsOMS = window.jsOMS || {}));

View File

@ -1,22 +1,71 @@
(function (jsOMS, undefined) {
(function (jsOMS, undefined)
{
jsOMS.Autoloader.defineNamespace('jsOMS.UI.Input.Keyboard');
jsOMS.UI.Input.Keyboard.KeyboardManager = function ()
jsOMS.UI.Input.Keyboard.KeyboardManager = function ()
{
this.elements = {};
this.down = [];
};
jsOMS.UI.Input.Keyboard.KeyboardManager.prototype.bind = function (element, keys, callback)
jsOMS.UI.Input.Keyboard.KeyboardManager.prototype.add = function (element, keys, callback)
{
element.addEventListener('keyup', function keyBind(event) {
if(event.keyCode === keys.keyCode) {
callback();
}
if (typeof this.elements[element] === 'undefined') {
this.elements[element] = [];
this.bind(element);
}
this.elements[element].push({keys: keys, callback: callback});
};
jsOMS.UI.Input.Keyboard.KeyboardManager.prototype.bind = function (element)
{
let self = this;
// todo: implement keyboard for selected elements right now only global hotkeys possible
document.addEventListener('keydown', function keyBind(event)
{
self.down.push(event.keyCode);
});
document.addEventListener('keyup', function keyBind(event)
{
if(self.down.length > 0) {
self.run(element, event);
self.down = [];
}
});
};
jsOMS.UI.Input.Keyboard.KeyboardManager.prototype.unbind = function (element)
jsOMS.UI.Input.Keyboard.KeyboardManager.prototype.run = function (element, event)
{
element.removeEventListener('keyup', keyBind, false);
if (typeof this.elements[element] === 'undefined') {
throw 'Unexpected elmenet!';
}
let actions = this.elements[element],
length = actions.length,
keyLength = this.down.length,
match = false;
for (let i = 0; i < length; i++) {
for (let j = 0; j < keyLength; j++) {
if (actions[i].keys.indexOf(this.down[j]) === -1) {
match = false;
break;
} else {
match = true;
}
}
if(match) {
jsOMS.preventAll(event);
actions[i].callback();
break;
}
}
};
}(window.jsOMS = window.jsOMS || {}));

View File

@ -1,5 +1,19 @@
var MouseClickType = Object.freeze({
LEFT: 1,
MIDDLE: 2,
RIGHT: 3
});
/**
* Click type.
*
* @author OMS Development Team <dev@oms.com>
* @author Dennis Eichhorn <d.eichhorn@oms.com>
* @copyright 2013 Dennis Eichhorn
* @license OMS License 1.0
* @version 1.0.0 * @since 1.0.0
*/
(function (jsOMS, undefined)
{
jsOMS.Autoloader.defineNamespace('jsOMS.UI.Input.Mouse');
jsOMS.UI.Input.Mouse.ClickType = Object.freeze({
LEFT: 0,
MIDDLE: 1,
RIGHT: 2
});
}(window.jsOMS = window.jsOMS || {}));

View File

@ -1,11 +1,50 @@
(function (jsOMS, undefined) {
jsOMS.MouseManager = function ()
(function (jsOMS, undefined)
{
jsOMS.Autoloader.defineNamespace('jsOMS.UI.Input.Mouse');
jsOMS.UI.Input.Mouse.MouseManager = function ()
{
this.elements = {};
this.down = [];
};
jsOMS.MouseManager.prototype.attach = function (clickType, element, callback) {
jsOMS.UI.Input.Mouse.MouseManager.prototype.add = function (element, callback, exact)
{
if (typeof this.elements[element] === 'undefined') {
this.elements[element] = [];
this.bind(element);
}
this.elements[element].push({callback: callback, exact: exact});
};
jsOMS.MouseManager.prototype.detach = function (eventId) {
jsOMS.UI.Input.Mouse.MouseManager.prototype.bind = function (element)
{
let self = this;
document.getElementById(element).addEventListener('contextmenu', function (event)
{
self.run(element, event);
}, false);
};
jsOMS.UI.Input.Mouse.MouseManager.prototype.run = function (element, event)
{
if (typeof this.elements[element] === 'undefined') {
throw 'Unexpected elmenet!';
}
let actions = this.elements[element],
length = actions.length;
console.log();
for (let i = 0; i < length; i++) {
if(!actions[i].exact || event.target.getAttribute('id') === element) {
jsOMS.preventAll(event);
actions[i].callback();
}
}
};
}(window.jsOMS = window.jsOMS || {}));

View File

@ -19,9 +19,7 @@
*/
jsOMS.UI.Input.Touch.SwipeManager = function (app)
{
this.app = app;
this.surface = {};
this.app = app;
this.activeSwipe = {};
this.resetSwipe();
};
@ -31,15 +29,10 @@
this.activeSwipe = {'startX': null, 'startY': null, 'time': null};
};
jsOMS.UI.Input.Touch.SwipeManager.prototype.add = function (surface, id, cUp, cRight, cDown, cLeft)
jsOMS.UI.Input.Touch.SwipeManager.prototype.add = function ()
{
cUp = typeof cUp === 'undefined' ? null : cUp;
cRight = typeof cRight === 'undefined' ? null : cRight;
cDown = typeof cDown === 'undefined' ? null : cDown;
cLeft = typeof cLeft === 'undefined' ? null : cLeft;
let self = this;
let e = document.getElementById(surface),
self = this;
e.addEventListener('touchstart', function (event)
{
let touch = this.changedTouches[0];
@ -64,14 +57,20 @@
elapsedTime = new Date().getTime() - self.activeSwipe.time;
if (elapsedTime < 500) {
if (distY > 100 && cUp !== null) {
cUp();
} else if (distX > 100 && cRight !== null) {
cRight();
} else if (distY < -100 && cDown !== null) {
cDown();
} else if (distX < -100 && cLeft !== null) {
cLeft();
let e = new Event('keyup');
if (distY > 100) {
e.keyCode = 38;
document.dispatchEvent(e);
} else if (distX > 100) {
e.keyCode = 39;
document.dispatchEvent(e);
} else if (distY < -100) {
e.keyCode = 40;
document.dispatchEvent(e);
} else if (distX < -100) {
e.keyCode = 37;
document.dispatchEvent(e);
}
}
@ -81,5 +80,4 @@
});
};
}(window.jsOMS = window.jsOMS || {}));