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' || event.key == 'W') {
			context.params.keyboard.w = true;
		}
		if (event.key == 's' || event.key == 'S') {
			context.params.keyboard.s = true;
		}
		if (event.key == 'a' || event.key == 'A') {
			context.params.keyboard.a = true;
		}
		if (event.key == 'd' || event.key == 'D') {
			context.params.keyboard.d = true;
		}
		if (event.key == 'Shift') {
			context.params.keyboard.shift = true;
		}
		if (event.key == ' ') {
			context.params.keyboard.space = true;
		}
	});
	$(document).keyup((event) => {
		if (event.key == 'w' || event.key == 'W') {
			context.params.keyboard.w = false;
		}
		if (event.key == 's' || event.key == 'S') {
			context.params.keyboard.s = false;
		}
		if (event.key == 'a' || event.key == 'A') {
			context.params.keyboard.a = false;
		}
		if (event.key == 'd' || event.key == 'D') {
			context.params.keyboard.d = false;
		}
		if (event.key == 'Shift') {
			context.params.keyboard.shift = false;
		}
		if (event.key == ' ') {
			context.params.keyboard.space = false;
		}
	});
}
