Support touch events

whiteboard.js

@@ -16,28 +16,37 @@
 	}
 
 	function setUpCanvasEvents(){
-		drawingArea.onmousedown = function (event) {
-			isDrawing = true;
-		}
+		drawingArea.onmousedown = startDraw;
+		drawingArea.ontouchstart = startDraw;
 
-		drawingArea.onmousemove = function (event) {
-			if (!isDrawing) {
-				return;
-			}
+		drawingArea.onmousemove = draw;
+		drawingArea.ontouchmove = draw;
 
-			var rect = drawingArea.getBoundingClientRect();
-			var point = {
-				x: event.clientX - rect.left,
-				y: event.clientY - rect.top
-			};
+		drawingArea.onmouseup = endDraw;
+		drawingArea.ontouchend = endDraw;
+	}
 
-			drawPoint(point, penColor);
-			sendPointToPeers(point, penColor);
-		}
+	function startDraw(event) {
+		isDrawing = true;
+	}
 
-		drawingArea.onmouseup = function (event) {
-			isDrawing = false;
+	function draw(event) {
+		if (!isDrawing) {
+			return;
 		}
+
+		var rect = drawingArea.getBoundingClientRect();
+		var point = {
+			x: event.clientX - rect.left,
+			y: event.clientY - rect.top
+		};
+
+		drawPoint(point, penColor);
+		sendPointToPeers(point, penColor);
+	}
+
+	function endDraw(event) {
+		isDrawing = false;
 	}
 
 	function sendPointToPeers(point, color) {