basic game functionality

1 files changed, 201 insertions, 4 deletions

diff --git a/snek.js b/snek.js
index 3f969da..49d14b3 100644
--- a/snek.js
+++ b/snek.js
@@ -1,7 +1,14 @@
 
+let cursor = {
+	'x' : 0,
+	'y' : 0
+};
+
 let canvas;
 let context;
+
 let mice;
+let explosions;
 
 let drawInterval=20/1000;
 
@@ -10,7 +17,22 @@ let micePerSecond=0.3;
 let normalMouseSpeed=3;
 let normalMouseSize=1;
 
+let maxNumberOfExplosionParticles=20;
+let minNumberOfExplosionParticles=5;
+let maxParticleSize=50;
+let maxExplosionAge=100;
+
 let lastTimeStamp;
+
+let snake = { 
+	'x':window.innerWidth/2,
+	'y':window.innerHeight/2 
+};
+
+let health=10;
+
+let frameId;
+
 function draw(timeStamp)
 {
 	let timeElapsed;
@@ -26,23 +48,26 @@ function draw(timeStamp)
 
 	context.clearRect(0, 0, canvas.width, canvas.height);
 
+	drawExplosions(timeElapsed);
 	drawMice(timeElapsed);
+	drawSnake(timeElapsed);
 
-	window.requestAnimationFrame(draw);
+	frameId=window.requestAnimationFrame(draw);
 }
 
 function createMouse(x,y,direction,speed,size)
 {
-	return { 'x':x, 'y':y, 'direction':direction, 'speed':speed,'size':size ,'tailLag':0, 'animation':0, 'animationCounter':0 };
+	return { 'x':x, 'y':y, 'direction':direction, 'speed':speed,'size':size ,'tailLag':0, 'animation':0, 'animationCounter':0, 'hitbox':size*90 };
 }
 
 
 function main()
 {
 	initialise();
-	window.requestAnimationFrame(draw);
+	frameId=window.requestAnimationFrame(draw);
 	setInterval(spawnMouse,1000/micePerSecond);
 	setInterval(cleanUpMice,100);
+	setInterval(cleanUpBlood,maxExplosionAge);
 }
 
 function spawnMouse()
@@ -56,9 +81,11 @@ function initialise()
 	canvas=document.getElementById("canvas1");
 	context=canvas.getContext("2d");
 
+	canvas.addEventListener('mousemove', e => { cursor.x=e.offsetX; cursor.y=e.offsetY; });
 	mice=[];
 	mice.push(createMouse(200,100,1,normalMouseSpeed,normalMouseSize));
 
+	explosions=[];
 
 }
 function cleanUpMice()
@@ -69,7 +96,137 @@ function cleanUpMice()
 		if(mice[i].y<-200 || mice[i].y>window.innerHeight+300 || mice[i].x<-100 || mice[i].x>window.innerWidth+300)
 		{
 			mice.splice(i,1);
+			--health;
+			if(health==0)
+			{
+				window.cancelAnimationFrame(frameId);
+				alert("Too many of the filthy rats escaped! Your snake died of despair.");
+			}
 		}
+		else if(mice[i].x-mice[i].hitbox<snake.x && mice[i].x+mice[i].hitbox>snake.x && mice[i].y+mice[i].hitbox>snake.y && mice[i].y-mice[i].hitbox<snake.y)
+			explosions.push( makeExplosion(mice.splice(i,1)[0]));
+	}
+}
+function cleanUpBlood()
+{
+	let i=0;
+	for(i;i<explosions.length;++i)
+	{
+		if(explosions[i].animation>maxExplosionAge)
+			explosions.splice(i,1);
+	}
+}
+/*it is clear that I am bad at geometry :P*/
+function drawSnake(timeElapsed)
+{
+	let distance;
+	let vx;
+	let vy;
+	let wx;
+	let wy;
+
+	distance=Math.sqrt(Math.pow(window.innerWidth/2-snake.x,2) + Math.pow(window.innerHeight/2-snake.y,2));
+	vx=(window.innerWidth/2-snake.x)/distance;
+	vy=(window.innerHeight/2-snake.y)/distance;
+
+	gravitate(snake,cursor,true,10000*(timeElapsed/drawInterval),100);
+
+
+	/*body*/
+	context.beginPath();
+	context.strokeStyle="#00FF00";
+	context.moveTo(window.innerWidth/2,-10);
+	context.bezierCurveTo(
+				window.innerWidth/2,
+				window.innerHeight/4,
+				snake.x+vx*300,
+				snake.y+vy*100,
+				snake.x,
+				snake.y
+			);
+	context.lineWidth=40;
+	context.stroke();
+	context.closePath();
+
+
+	/*head*/
+	distance=Math.sqrt(Math.pow(vx*300,2) + Math.pow(vy*100,2));
+	wx=(vx*300)/distance;
+	wy=(vy*100)/distance;
+
+	context.save();
+
+
+	context.translate(snake.x,snake.y);
+	if(wx>0)
+	{
+		context.rotate(Math.PI-Math.acos(wy));
+	}else
+	{
+		context.rotate(Math.PI+Math.acos(wy));
+	}
+
+	context.beginPath();
+	context.ellipse(0,50,30,70,0,0,3*Math.PI);
+	context.fillStyle = "#00FF00";
+	context.fill();
+	context.stroke();
+	context.closePath();
+
+	/*right eye*/
+	context.beginPath();
+	context.fillStyle="#FF0000"
+	context.moveTo(20,80);
+	context.lineTo(30,80);
+	context.lineTo(15,100);
+	context.fill();
+	context.closePath();
+
+	/*right eye*/
+	context.beginPath();
+	context.fillStyle="#FF0000"
+	context.moveTo(-20,80);
+	context.lineTo(-30,80);
+	context.lineTo(-15,100);
+	context.fill();
+	context.closePath();
+
+
+	context.restore();
+
+}
+
+function drawExplosions(timeElapsed)
+{
+	let i=0;
+	for(i;i<explosions.length;++i)
+	{
+		drawExplosion(explosions[i],timeElapsed);
+	}
+}
+function drawExplosion(explosion,timeElapsed)
+{
+	let i=0;
+	explosion.animation+=timeElapsed/drawInterval;
+	for(i;i<explosion.particles.length;++i)
+	{
+		explosion.particles[i].x+=(1000/explosion.animation)*0.1*Math.cos(explosion.particles[i].direction);
+		explosion.particles[i].y+=(1000/explosion.animation)*0.1*Math.sin(explosion.particles[i].direction);
+
+
+		context.fillStyle=`rgb(
+					255,
+					${Math.floor(255*(explosion.animation/(maxExplosionAge+30)))},
+					${Math.floor(255*(explosion.animation/(maxExplosionAge+30)))}
+
+				)`;
+		context.rect(
+				explosion.particles[i].x,
+				explosion.particles[i].y,
+				maxParticleSize*explosion.particles[i].size,
+				maxParticleSize*explosion.particles[i].size,
+				);
+		context.fill();
 	}
 }
 function drawMice(timeElapsed)
@@ -85,7 +242,7 @@ function drawMouse(mouse,timeElapsed)
 	mouse.animationCounter+=drawInterval;
 	mouse.x+=mouse.speed*(timeElapsed/drawInterval)*Math.cos(mouse.direction);
 	mouse.y+=mouse.speed*(timeElapsed/drawInterval)*Math.sin(mouse.direction);
-	mouse.animation+=0.8*(timeElapsed/drawInterval);
+	mouse.animation+=0.4*(timeElapsed/drawInterval);
 
 	/*
 	mouse.direction+=0.1;
@@ -165,3 +322,43 @@ function drawMouse(mouse,timeElapsed)
 	context.restore();
 }
 
+function gravitate(subject,gravitas,doesItPull,pullStrength,nearDistance)
+{
+	let distance=Math.sqrt( (subject.x-gravitas.x)*(subject.x-gravitas.x) + (subject.y-gravitas.y)*(subject.y-gravitas.y));
+
+	if(distance==0)
+	{
+		return ;
+	}
+
+	if(doesItPull==false)
+	{
+		subject.x+=(((subject.x-gravitas.x)*pullStrength)/(distance*distance));
+		subject.y+=(((subject.y-gravitas.y)*pullStrength)/(distance*distance));
+	}else
+	{
+		if(distance<=nearDistance)
+		{
+			subject.x=gravitas.x;
+			subject.y=gravitas.y;
+		}else
+		{
+			subject.x-=(((subject.x-gravitas.x)*pullStrength)/(distance*distance));
+			subject.y-=(((subject.y-gravitas.y)*pullStrength)/(distance*distance));
+		}
+
+	}
+}
+function makeExplosion(mouse)
+{
+	let ret={ 'mouse': mouse, 'animation':0, 'particles':[] };
+	let numberOfParticles=Math.floor(Math.random()*(maxNumberOfExplosionParticles-minNumberOfExplosionParticles))+minNumberOfExplosionParticles;
+	let i=0;
+
+	for(i;i<numberOfParticles;++i)
+	{
+		ret.particles.push({ 'x':mouse.x , 'y':mouse.y, 'direction':Math.random()*2*Math.PI, 'size':Math.random() });
+	}
+
+	return ret;
+}