var t;
var running;
var arena;
var reddot;
var blob_middle;
var blob_small; 	 
var blob_large; 	 
var speed_level;
var lost;
var score = 0;
var arena = document.getElementById("arena");
var offset = {x: arena.offsetLeft, y: arena.offsetTop};
document.onmousemove = mouseMove; 

reset();

function reset(){
  speed_level = 5;
	lost = false;
	running = false;
  reddot = new dot(document.getElementById("reddot"));
  blob_middle = new blob(document.getElementById("blob_middle"),{x:100, y:400},{x:2,y:-2},100);
  blob_small = new blob(document.getElementById("blob_small"),{x:250, y: 50},{x:-3,y:3}, 50); 	 
  blob_large = new blob(document.getElementById("blob_large"),{x:400, y: 500},{x:-1,y:-1}, 150); 	 
  blob_middle.update();
  blob_small.update();
  blob_large.update();
	score = 0;
}

function blob(element, pos, speed, size){
  this.pos = pos;
  this.speed = speed;
  this.size = size;
  this.element = element;
  this.update = updateBlob;
  this.checkCollision = checkBlobCollision;
}

function updateBlob(){
  this.pos.x += this.speed.x * speed_level;
  this.pos.y += this.speed.y * speed_level;
  if ((this.pos.x < 0) || (this.pos.x > 500)) this.speed.x = -this.speed.x;
  if ((this.pos.y < 0) || (this.pos.y > 500)) this.speed.y = -this.speed.y;
  this.element.style.left = this.pos.x+"px";
  this.element.style.top = this.pos.y+"px";
}

function checkBlobCollision(){
  var offset = {x: this.pos.x - reddot.pos.x, y: this.pos.y - reddot.pos.y};
  var dist = offset.x * offset.x + offset.y * offset.y;
	var r = 25+this.size;
  if (dist < r*r){
		reddot.speed.x = this.speed.x;
		reddot.speed.y = this.speed.y;
	  die();
	}
}

function die(){
	reddot.element.style.background = "url(death.gif)";
	lost = true;
}

function dot(element){
  this.element = element;
  this.pos = {x: 250, y: 250};
	this.speed = {x:0, y:0};
	this.element.style.background = "url('dot.png')";
	this.element.style.left = this.pos.x+"px";
	this.element.style.top = this.pos.y+"px";
	this.update = dotupdate;
}

function dotupdate(){
  this.pos.x += this.speed.x;
	this.pos.y += this.speed.y;
	this.element.style.left = this.pos.x+"px";
  this.element.style.top = this.pos.y+"px";
}

function start(){
  if (running == false) {
    running = true;
    mainloop();
  }
}

function mainloop(){
  
	score += 0.08;
	document.getElementById("header").innerHTML = score.toFixed(2);

  blob_middle.update();
  blob_small.update();
  blob_large.update();

	if (!lost){ 
	  speed_level += 0.01;
		blob_middle.checkCollision();
		blob_small.checkCollision();
		blob_large.checkCollision();
		if ((reddot.pos.x<25) || (reddot.pos.x>475) || (reddot.pos.y<25) || (reddot.pos.y>475)) die();
	} else {
	  reddot.update(); 
	  if (speed_level > 0){ speed_level -= 0.5} else { 
	    document.getElementById("header").innerHTML = "You survived "+score.toFixed(0)+" seconds";
		  reset(); 
		}
  } 
  if (running) t=setTimeout('mainloop()',80);
}

function mouseMove(ev){ 
  if ((running) && (!lost)) {
		ev = ev || window.event;
		var mousePos;
		if(ev.pageX || ev.pageY){
			mousePos = {x: ev.pageX, y: ev.pageY}; 
		} else {
			mousePos = {x: ev.clientX + document.body.scrollLeft - document.body.clientLeft, 
											 y: ev.clientY + document.body.scrollTop  - document.body.clientTop};
		} 

		reddot.pos.x = mousePos.x - offset.x;
		reddot.pos.y = mousePos.y - offset.y;
		reddot.element.style.left = reddot.pos.x+"px";
		reddot.element.style.top = reddot.pos.y+"px";
	}
}