key-boxes.js (2139B)
1 const m = require("mithril"); 2 const input = require("../modules/input.js"); 3 4 /* inputCallback: expects one argument: char to input 5 * keyCallback: can be used for event handling of other pressed keys 6 */ 7 module.exports = (vnode) => { 8 let icb = vnode.attrs.inputCallback; 9 let kcb = vnode.attrs.keyCallback; 10 let active = [false, false, false]; 11 // contains indizes of pressed key in the order in which they were pressed 12 let pressed = []; 13 // if there was a point in time during this gesture where all keys were 14 // pressed simultaneously 15 let full = false; 16 // gestures that are not processed yet 17 let gestures = []; 18 return { 19 oncreate: () => { 20 document.onkeydown = (e) => { 21 let index = input.keys.indexOf(e.key); 22 if (!e.repeat) { 23 if (kcb) kcb(e); 24 if (index != -1) { 25 active[index] = true; 26 if (active.every(e => e)) full = true; 27 pressed.push(index); 28 m.redraw(); 29 } 30 } 31 } 32 document.onkeyup = (e) => { 33 let index = input.keys.indexOf(e.key); 34 if (index != -1) { 35 active[index] = false; 36 if (active.every(e => !e)) { 37 gestures.push(input.pressed2gesture(pressed, full)); 38 pressed = []; 39 full = false; 40 let charMaybe = input.gestures2char(gestures); 41 if (charMaybe) { 42 icb(charMaybe); 43 gestures = []; 44 } 45 } 46 m.redraw(); 47 } 48 } 49 }, 50 view: () => m(".keyBoxWrapWrap", 51 m(".keyBoxWrap", [0, 1, 2].map( 52 i => m(".keyBox", { 53 class: active[i] ? "keyBoxHighlight" : "" 54 }) 55 )), 56 m(".keyBoxHint", gestures.map(e => "G" + e).join(" ")) 57 ) 58 } 59 };