Behold, the first game shared in an imageboard:
body{margin:0}window.onload = function() { document.body.addEventListener('keydown', keyDown, false); document.body.addEventListener('keyup', keyUp, false); can = {}; can.html = document.body.appendChild(document.createElement("canvas")); can.ctx = can.html.getContext("2d"); can.html.width = 600; can.html.height = 600; key = {}; player = { x:300, y:500, w:20, h:20, hp:10, reload:400, color:"#0ff", vel:0, shotvel:4, kill:false, shotTime:0 }; enemy = { x:300, y:100, w:20, h:20, hp:10, reload:350, color:"#ff0", vel:0, shotvel:4, kill:false, shotTime:0 }; gamestate = "Game on!"; bullets = []; update();}function collision(a, b) { if (b.kill || (a.origin === b) || ((a.y + a.h) = (b.y + b.h)) || ((a.x + a.w) = (b.x + b.w))) { return false; }}function drawMe(target){ can.ctx.fillStyle = target.color; can.ctx.fillRect(target.x, target.y, target.w, target.h); can.ctx.fillText(target.hp, target.x+target.w+5, target.y);}function update() { can.ctx.font = "14px Arial"; can.ctx.fillStyle = "#111"; can.ctx.fillRect(0, 0, 600, 600); if (!player.kill){ if (key.A) {player.vel = -4;} else if (key.D) {player.vel = 4;} else {player.vel = 0;} player.x = Math.min(570, Math.max(10, player.x+player.vel)); if (key.space && player.shotTime < Date.now()-player.reload) { bullets.push({x:player.x, y:player.y, w:10, h:10, vel:-player.shotvel, origin:player}); player.shotTime = Date.now(); } drawMe(player); } if (!enemy.kill){ enemy.vel += Math.min(3, Math.max(-3, Math.random()-0.5)); enemy.x += Math.min(1, Math.max(-1, enemy.vel))*2; if (enemy.x < 10) {enemy.vel = 2;} if (enemy.x > 570) {enemy.vel = -2;} if (enemy.shotTime < Date.now()-enemy.reload) { bullets.push({x:enemy.x, y:enemy.y, w:10, h:10, vel:enemy.shotvel, origin:enemy}); enemy.shotTime = Date.now(); } drawMe(enemy); } for (var b in bullets) { bullets[b].y += bullets[b].vel; can.ctx.fillStyle = bullets[b].origin.color; can.ctx.fillRect(bullets[b].x, bullets[b].y, 10, 10); if (collision(bullets[b], player) !== false) { player.hp --; bullets.splice(b, 1); if (player.hp < 1){ gamestate = "You suck, faggot."; player.kill = true; } } if (collision(bullets[b], enemy) !== false) { enemy.hp --; bullets.splice(b, 1); if (enemy.hp < 1){ gamestate = "You are the win!"; enemy.kill = true; } } if (collision(bullets[b], {x:0,y:0,w:600,h:600}) === false) { bullets.splice(b, 1); } } can.ctx.fillStyle = "#fff"; can.ctx.fillText("Bullets: " + bullets.length, 20, 60); can.ctx.font = "20px Arial"; can.ctx.fillText(gamestate, 20, 30); requestAnimationFrame(update);}function shoot(){ }function keyDown(e) { switch(e.keyCode) { case 32: key.space = true; break; case 65: key.A = true; break; case 68: key.D = true; break; case 83: key.S = true; break; case 87: key.W = true; break; default: break; }}function keyUp(e) { switch(e.keyCode) { case 32: key.space = false; break; case 65: key.A = false; break; case 68: key.D = false; break; case 83: key.S = false; break; case 87: key.W = false; break; default: break; }}
1. Copy paste into notepad
2. save as game.html
3. open in your browser