Create initial keyboard handler, and start processing pan-zoom events

Nibriboard/ClientFiles/BoardWindow.js

@@ -41,6 +41,16 @@ class BoardWindow extends EventEmitter
 		// Our colour
 		this.Colour = "rgba(255, 255, 255, 0.3)";
 		
+		// The current state of the viewport.
+		this.viewport = {
+			// The x coordinate of the viewport.
+			x: 0,
+			// The y coordinate of the viewport.
+			y: 0,
+			// The zoom level of the viewport. 1 = normal.
+			zoomLevel: 1
+		};
+		
 		// --~~~--
 		
 		// Setup the canvas
@@ -214,8 +224,10 @@ class BoardWindow extends EventEmitter
 	handleCanvasMovement(event) {
 		// Store the viewport information for later
 		this.viewportState = event;
-		// Re-emit the movement information for interested parties
-		this.emit("movement", event);
+		
+		this.viewport.x += event.dx;
+		this.viewport.y += event.dy;
+		this.viewport.zoomLevel += event.dz;
 	}
 	
 	handleHandshakeResponse(message) {

Nibriboard/ClientFiles/Utilities/Keyboard.js

@@ -0,0 +1,25 @@
+"use strict";
+
+/**
+ * Makes handling keyboard input just that little bit easier.
+ */
+class Keyboard
+{
+	constructor()
+	{
+		this.DownKeys = [];
+		
+		document.addEventListener("keydown", this.handleKeyDown.bind(this));
+		document.addEventListener("keyup", this.handleKeyUp.bind(this));
+	}
+	
+	handleKeyDown(event) {
+		if(!this.DownKeys.contains(event.keyCode))
+			this.DownKeys.push(event.keyCode);
+	}
+	
+	handleKeyUp(event) {
+		if(this.DownKeys.indexOf(event.keyCode) !== -1)
+			this.DownKeys.splice(this.DownKeys.indexOf(event.keyCode), 1);
+	}
+}