import $ from 'jquery'; /** * UI block to update object * @param {any} context the program context * @param {any} canvas the HTML canvas */ export function initUX(context: any, canvas: any) { window.addEventListener('mousemove', (e) => { if (document.pointerLockElement === canvas) { context.params.camRot.x += 0.01 * e.movementY; context.params.camRot.y += 0.01 * e.movementX; context.params.camRot.x = Math.max(-Math.PI * 0.5, Math.min(context.params.camRot.x, Math.PI * 0.5)); context.params.camRot.y += context.params.camRot.y > Math.PI ? -Math.PI * 2 : context.params.camRot.y < -Math.PI ? Math.PI * 2 : 0; } }); $('#glCanvas').click(() => { if (document.pointerLockElement === canvas) { document.exitPointerLock(); } else { canvas.requestPointerLock(); } }); $(document).keydown((event) => { if (event.key == 'w') { context.params.keyboard.w = true; } if (event.key == 's') { context.params.keyboard.s = true; } if (event.key == 'a') { context.params.keyboard.a = true; } if (event.key == 'd') { context.params.keyboard.d = true; } if (event.key == 'Control') { context.params.keyboard.control = true; } if (event.key == ' ') { context.params.keyboard.space = true; } }); $(document).keyup((event) => { if (event.key == 'w') { context.params.keyboard.w = false; } if (event.key == 's') { context.params.keyboard.s = false; } if (event.key == 'a') { context.params.keyboard.a = false; } if (event.key == 'd') { context.params.keyboard.d = false; } if (event.key == 'Control') { context.params.keyboard.control = false; } if (event.key == ' ') { context.params.keyboard.space = false; } }); }