hold modifiers on mouse click

This commit is contained in:
Devaev Maxim
2018-07-26 02:26:31 +03:00
parent 940fe28a9f
commit bb180b6bf8
4 changed files with 86 additions and 33 deletions

View File

@@ -1,9 +1,19 @@
var keyboard = new function() {
var __ws = null;
var __modifiers = [];
this.init = function() {
document.onkeydown = (event) => __keyHandler(event, true);
document.onkeyup = (event) => __keyHandler(event, false);
document.onkeydown = (event) => __keyboardHandler(event, true);
document.onkeyup = (event) => __keyboardHandler(event, false);
Array.prototype.forEach.call(document.getElementsByClassName("key"), function(el_key) {
el_key.onmousedown = () => __clickHandler(el_key, true);
el_key.onmouseup = () => __clickHandler(el_key, false);
});
Array.prototype.forEach.call(document.getElementsByClassName("modifier"), function(el_key) {
el_key.onmousedown = () => __toggleModifierHandler(el_key);
__modifiers.push(el_key);
});
};
this.setSocket = function(ws) {
@@ -11,29 +21,62 @@ var keyboard = new function() {
$("hid-keyboard-led").className = (ws ? "led-on" : "led-off");
};
var __keyHandler = function(event, state) {
// https://github.com/wesbos/keycodes/blob/gh-pages/scripts.js
var __keyboardHandler = function(event, state) {
event.preventDefault();
el_key = $(event.code);
if (el_key) {
event.preventDefault();
__commonHandler(el_key, state, "pressed");
__unholdModifiers();
}
};
tools.debug("Key", (state ? "pressed:" : "released:"), event);
var __clickHandler = function(el_key, state) {
__commonHandler(el_key, state, "pressed");
__unholdModifiers();
};
if (state) {
el_key.style.boxShadow = "none";
el_key.style.color = "var(--fg-color-selected)";
el_key.style.backgroundColor = "var(--bg-color-dark)";
} else {
el_key.removeAttribute("style");
var __toggleModifierHandler = function(el_key) {
__commonHandler(el_key, !__isActive(el_key), "holded");
};
var __unholdModifiers = function() {
__modifiers.forEach(function(el_key) {
if (__isHolded(el_key)) {
el_key.classList.remove("pressed");
el_key.classList.remove("holded");
__sendKey(el_key.id, false);
}
});
};
if (__ws) {
__ws.send(JSON.stringify({
event_type: "key",
key: event.code,
state: state,
}));
}
var __commonHandler = function(el_key, state, cls) {
if (state && !__isActive(el_key)) {
el_key.classList.remove("holded");
el_key.classList.add(cls);
__sendKey(el_key.id, true);
} else {
el_key.classList.remove("pressed");
el_key.classList.remove("holded");
__sendKey(el_key.id, false);
}
};
var __isHolded = function(el_key) {
return el_key.classList.contains("holded");
};
var __isActive = function(el_key) {
return (el_key.classList.contains("pressed") || __isHolded(el_key));
};
var __sendKey = function(code, state) {
tools.debug("Key", (state ? "pressed:" : "released:"), code);
if (__ws) {
__ws.send(JSON.stringify({
event_type: "key",
key: code,
state: state,
}));
}
};
};