frumbert/pew-pew.html

## pew-pew.html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>game</title>
</head>
<body>
<script>
hiscore = score = 1000;
player = {
	x: 100,
	y: 100,
	size: 30,
	speed: 15
};
mob = {
	x: 0,
	y: 0,
	items: [],
	size: 25,
	speed: 5
};

bullet = {
	x: 0,
	y: 0,
	items: [],
	size: 4,
	speed: 7
};
var _t;

window.onload = function() {
	canvas=document.createElement("canvas");
	canvas.width=640;
	canvas.height=480;
	document.body.appendChild(canvas);
	context=canvas.getContext("2d");
	setInterval(update, 1000 / 30);
	setInterval(spawn, 2000);
	document.addEventListener('keydown', keyPush);
}
function spawn() {
	mob.items.push({x:canvas.width, y:Math.random()*canvas.height});
}
function update() {
	context.fillStyle="black";
	context.fillRect(0, 0, canvas.width, canvas.height);
	context.fillStyle="white";
	context.fillRect(player.x-player.size / 2, player.y-player.size / 2, player.size, player.size);
	context.fillStyle="lime";
	for(var s=0;s<bullet.items.length;s++ ) {
		bullet.items[s].x  += bullet.size;
		context.fillRect(bullet.items[s].x - bullet.size / 2, bullet.items[s].y - bullet.size / 2, bullet.size, bullet.size);
		for(var e=mob.items.length-1; e>=0; e--) {
			var dx = Math.abs(mob.items[e].x - bullet.items[s].x);
			var dy = Math.abs(mob.items[e].y - bullet.items[s].y);
			var dist = Math.sqrt(dx*dx + dy*dy);
			if(dist < (bullet.size + mob.size) / 2) {
				bullet.items.splice(e, 1);
				mob.items.splice(e, 1);
				score += 10;
				mob.speed += 0.75;
			}
		}
	}
	context.fillStyle="red";
	for(var e=0;e<mob.items.length; e++ ) {
		mob.items[e].x -= mob.speed;
		if (mob.items[e].x < mob.size && mob.items[e].x > 0) { // missed
			if (_t) clearTimeout(_t);
			_t = setTimeout(function () { score -= 25}, 1000/30);
		}
		context.fillRect(mob.items[e].x - mob.size / 2, mob.items[e].y - mob.size / 2, mob.size, mob.size);
		var dx=Math.abs(mob.items[e].x - player.x);
		var dy=Math.abs(mob.items[e].y - player.y);
		var dist=Math.sqrt(dx*dx + dy*dy);
		if ((dist < (player.size + mob.size) / 2) || score < 0) {
			// game ends
			if (score > hiscore) hiscore = score;
			score = 1000;
			mob.speed = 5;
			bullet.items = [];
			mob.items = [];
			player.x = player.y = 100;
			break;
		}
	}
	context.font = "20pt Arial";
	context.fillStyle = "yellow";
	context.fillText("Score: " + score, 10, 30);
	context.fillText("High Score: " + hiscore, 400, 30);

}
function keyPush(evt) {
	switch(evt.keyCode) {
		case 32:
			bullet.items.push({x:player.x, y:player.y});
			score--;
			break;
		case 37:
			player.x -= player.speed;
			break;
		case 38:
			player.y -= player.speed;
			break;
		case 39:
			player.x += player.speed;
			break;
		case 40:
			player.y += player.speed;
			break;
	}
}
</script></body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>game</title>
	</head>
	<body>
	<script>
	hiscore = score = 1000;
	player = {
	x: 100,
	y: 100,
	size: 30,
	speed: 15
	};
	mob = {
	x: 0,
	y: 0,
	items: [],
	size: 25,
	speed: 5
	};

	bullet = {
	x: 0,
	y: 0,
	items: [],
	size: 4,
	speed: 7
	};
	var _t;

	window.onload = function() {
	canvas=document.createElement("canvas");
	canvas.width=640;
	canvas.height=480;
	document.body.appendChild(canvas);
	context=canvas.getContext("2d");
	setInterval(update, 1000 / 30);
	setInterval(spawn, 2000);
	document.addEventListener('keydown', keyPush);
	}
	function spawn() {
	mob.items.push({x:canvas.width, y:Math.random()*canvas.height});
	}
	function update() {
	context.fillStyle="black";
	context.fillRect(0, 0, canvas.width, canvas.height);
	context.fillStyle="white";
	context.fillRect(player.x-player.size / 2, player.y-player.size / 2, player.size, player.size);
	context.fillStyle="lime";
	for(var s=0;s<bullet.items.length;s++ ) {
	bullet.items[s].x += bullet.size;
	context.fillRect(bullet.items[s].x - bullet.size / 2, bullet.items[s].y - bullet.size / 2, bullet.size, bullet.size);
	for(var e=mob.items.length-1; e>=0; e--) {
	var dx = Math.abs(mob.items[e].x - bullet.items[s].x);
	var dy = Math.abs(mob.items[e].y - bullet.items[s].y);
	var dist = Math.sqrt(dxdx + dydy);
	if(dist < (bullet.size + mob.size) / 2) {
	bullet.items.splice(e, 1);
	mob.items.splice(e, 1);
	score += 10;
	mob.speed += 0.75;
	}
	}
	}
	context.fillStyle="red";
	for(var e=0;e<mob.items.length; e++ ) {
	mob.items[e].x -= mob.speed;
	if (mob.items[e].x < mob.size && mob.items[e].x > 0) { // missed
	if (_t) clearTimeout(_t);
	_t = setTimeout(function () { score -= 25}, 1000/30);
	}
	context.fillRect(mob.items[e].x - mob.size / 2, mob.items[e].y - mob.size / 2, mob.size, mob.size);
	var dx=Math.abs(mob.items[e].x - player.x);
	var dy=Math.abs(mob.items[e].y - player.y);
	var dist=Math.sqrt(dxdx + dydy);
	if ((dist < (player.size + mob.size) / 2) \|\| score < 0) {
	// game ends
	if (score > hiscore) hiscore = score;
	score = 1000;
	mob.speed = 5;
	bullet.items = [];
	mob.items = [];
	player.x = player.y = 100;
	break;
	}
	}
	context.font = "20pt Arial";
	context.fillStyle = "yellow";
	context.fillText("Score: " + score, 10, 30);
	context.fillText("High Score: " + hiscore, 400, 30);

	}
	function keyPush(evt) {
	switch(evt.keyCode) {
	case 32:
	bullet.items.push({x:player.x, y:player.y});
	score--;
	break;
	case 37:
	player.x -= player.speed;
	break;
	case 38:
	player.y -= player.speed;
	break;
	case 39:
	player.x += player.speed;
	break;
	case 40:
	player.y += player.speed;
	break;
	}
	}
	</script></body>
	</html>