Jump to content

  • Log In with Google      Sign In   
  • Create Account

GnollAF

Member Since 27 May 2011
Offline Last Active Nov 14 2013 01:20 AM

#5106140 Coding horror experiment in HTML 5

Posted by GnollAF on 31 October 2013 - 09:11 PM

<html>
	<head>
		<title>Horror!</title>
	</head>
	<body>
		<div>
			<canvas id="canvas" width="800" height="600">
				Your browser does not support the canvas element
			</canvas>
		</div>
		<div style="display: none">
			<script>
				window.onload = function() {
					var canvas = document.getElementById("canvas");
					if(canvas.getContext) {
						var canvasWidth = canvas.offsetWidth;
						var canvasHeight = canvas.offsetHeight;
						var context = canvas.getContext("2d");
						var lastTime = 0;
						var keys = new Object();
						var delta = 0;
						
						context.fillStyle = "rgb(0, 0, 0)";
						context.fillRect(0, 0, canvasWidth, canvasHeight);
						
						var sprite = document.getElementById("sprite");
						var x = Math.random() * (canvasWidth - sprite.width);
						var y = Math.random() * (canvasHeight - sprite.height);
						
						function Draw() {
							if (Math.random() > 0.9)
							{
								var grad = context.createLinearGradient(0, 0, canvasWidth, canvasHeight);

								for (var i = 0; i < 2; i++)
									grad.addColorStop(i, "#" + Math.floor(Math.random()*9999999).toString(16));
								context.fillStyle = grad;
							}
							context.fillRect(0, 0, canvasWidth, canvasHeight);
							context.drawImage(sprite, x, y);
						}
						
						function keyDown(e) {
							e = e || window.event;

							if(e.keyCode == '87') {
								y += delta;
							} else if (e.keyCode == '83') {
								y -= delta;
							} else if (e.keyCode == '65') {
								x += delta;
							} else if (e.keyCode == '68') {
								x -= delta;
							}
						}
						
						function Update() {
							var now = Date.now();
							if(lastTime === 0) {
								lastTime = now;
							}
							delta = now - lastTime;
							lastTime = now;
						}
						
						var fps = 60;
						var intervalId = setInterval(function() {
							Update();
							Draw();
						}, 1000 / fps);
					
						document.onkeydown = keyDown;
					}
				}
			</script>
			<img id="sprite" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABp0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuMTFH80I3AAABDElEQVRYR8XOC27CMBBFUVbQNWVnzc4pZETGTk4+tiVa6UjtA9/p4/Xz/Gccv4njzjzPTdQ4wHGleAs1NzgudrHfn1t279AucFy0HD0y9A8o2EXtxDEo1kPtxDEo1kPtxDEo1kPtxDG0hVLbO45hGyn/PqO3xziGMjJC7cQxnMXu7uVnxtGhEboRODoyQjcCR0dG6Ebg6Ehp9PuJoyMjdCNwDAr1UDtxDIr1UDtxDIp9jHy3xjEo9qbPrr5/jGNQrIfaiWNSsIWaNY41he9Qa4+j6Yjo7TGOVh4oD2638s01jpVpmuL37cHS5rP1zTWOlXdsCZZHTqzfRws4VtYYjlH55hpH0zHRW3o8/wAvkCGGQzdTzQAAAABJRU5ErkJggg=="/>
		</div>
	</body>
</html>



#4976350 Snowballing and Turtling

Posted by GnollAF on 04 September 2012 - 03:21 AM

This sounds quite fun. I think removing fog of war is okay, check out the Starcraft maps Zone Control, and also Starcraft Evolves UMS. I imagine it playing out something like this, with a giant brawl, and position being everything (except coordination will be more difficult because you have individual players for each units, rather than controlling a single army)


PARTNERS