var canvas = document.getElementById("gameCanvas");
var context = canvas.getContext("2d");

var keys = [];

var width = 500, height = 400, speed = 5

var robot = {
	x: 10,
	y: 10,
	width: 20,
	height: 20,
	draw: function(){
		context.fillStyle = "black"
		context.fillRect(this.x, this.y, this.width, this.height)
	},
	update: function(){
		if(keys[38]) this.y-=speed;
		if(keys[40]) this.y+=speed;
		if(keys[37]) this.x-=speed;
		if(keys[39]) this.x+=speed;

		if(this.x < 0) this.x = 0;
		if(this.y < 0) this.y = 0;
		if(this.x > width-this.width) this.x = width-this.width;
		if(this.y > height-this.height) this.y = height-this.height;
	}
};

var box = {
	x: Math.random() * width,
	y: Math.random() * height,
	width: 20,
	height: 20,
	draw: function(){
		context.fillStyle = "blue"
		context.fillRect(this.x, this.y, this.width, this.height)
	}
};

window.addEventListener("keydown", function(e){
	keys[e.keyCode] = true;
}, false);

window.addEventListener("keyup", function(e){
	delete keys[e.keyCode];
}, false);


function game(){
	update();
	render();
}

function update(){
	robot.update();
}

function render(){
	context.clearRect(0, 0, width, height);
	robot.draw();
	box.draw();
}

setInterval(function(){
	game();
}, 1000/60)
@@ -840,16 +840,203 @@
 height)%0A
+%09%7D,%0A%09touching: function(other)%7B%0A%09%09return !(this.x %3E other.x + other.width %7C%7C%0A%09%09%09this.x + this.width %3C other.x %7C%7C%0A%09%09%09this.y %3E other.y + other.height %7C%7C%0A%09%09%09this.y + this.height %3C other.y);%0A
 %09%7D%0A%7D;%0A%0Aw
@@ -1277,24 +1277,122 @@
 t.update();%0A
+%09if (box.touching(robot)) %7B%0A%09%09box.x = Math.random() * width;%0A%09%09box.y = Math.random() * height;%0A%09%7D%0A
 %7D%0A%0Afunction 

add collision detection