var QUOTES_NUMBER = 42;

 var SERVER = "http://" + window.location.hostname + ":" + window.location.port;

 var simulation;

 var gameoflife;

 $(document).ready(function() {   

     simulation = new Simulation(document.getElementById("sim"), 

                                 670, 50, 6, green, background);  

     var image = new Image();

     image.onload = init_logo;

     image.src = "images/logobase.png";

     $("#logo").click(handle_click);   

     $("#logo").hover(function(event) {

         $(this).css("cursor", "pointer");        

     }, function() {

         $(this).css("cursor", "auto");

     });

     $("#logo").mousemove(function(event) { handle_hover(event); });

     $("#logo").mouseout(function(event) { handle_mouse_out(event); });

     $("#sim").mousemove(function(event) { simulation.mouse_moved(mouse_pos(event, "#sim")); });

     var onEachFrame;

     if (window.webkitRequestAnimationFrame) {

         onEachFrame = function(cb) {

             var _cb = function() { cb(); webkitRequestAnimationFrame(_cb); }

             _cb();

         };

     } else if (window.mozRequestAnimationFrame) {

         onEachFrame = function(cb) {

             var _cb = function() { cb(); mozRequestAnimationFrame(_cb); }

             _cb();

         };

     } else {

         onEachFrame = function(cb) {

             setInterval(cb, 1000 / 30);

         }

     }    

     window.onEachFrame = onEachFrame;   

     window.onEachFrame(update);  

     var pos = document.location.href.lastIndexOf("/") + 1; 

     var page = document.location.href.substr(pos);

     if (page == "mandelbrot.html") {

         draw(0, 0, 0, 0, 0);

     } else if (page == "" || page == "index.html") {

         init_gameoflife("ME73");

     } else if (page == "gameoflife.html") {

         init_gameoflife("");

     }

 });

 $(document).keypress(function(event) {

     if (event.which == 13) {      

 	event.preventDefault();

         update_logo();	    

     }

 });

 var menu_width = 670;

 var menu_height = 100;

 var menu_splits = new Array(180, 350, 505);

 var click_events = new Array();

 click_events["logo"] = new Array();

 click_events["logo"][0] = new Object();

 click_events["logo"][0]["min_x"] = 0;

 click_events["logo"][0]["max_x"] = menu_splits[0];

 click_events["logo"][0]["min_y"] = 0;

 click_events["logo"][0]["max_y"] = menu_height;

 click_events["logo"][0]["func"] = switch_page;

 click_events["logo"][0]["args"] = new Array("personalwork.html");

 click_events["logo"][1] = new Object();

 click_events["logo"][1]["min_x"] = menu_splits[0] + 1;

 click_events["logo"][1]["max_x"] = menu_splits[1];

 click_events["logo"][1]["min_y"] = 0;

 click_events["logo"][1]["max_y"] = menu_height;

 click_events["logo"][1]["func"] = switch_page;

 click_events["logo"][1]["args"] = new Array("howiwork.html");

 click_events["logo"][2] = new Object();

 click_events["logo"][2]["min_x"] = menu_splits[1] + 1;

 click_events["logo"][2]["max_x"] = menu_splits[2];

 click_events["logo"][2]["min_y"] = 0;

 click_events["logo"][2]["max_y"] = menu_height;

 click_events["logo"][2]["func"] = switch_page;

 click_events["logo"][2]["args"] = new Array("books.html");

 click_events["logo"][3] = new Object();

 click_events["logo"][3]["min_x"] = menu_splits[2] + 1;

 click_events["logo"][3]["max_x"] = menu_width - 1;

 click_events["logo"][3]["min_y"] = 0;

 click_events["logo"][3]["max_y"] = menu_height;

 click_events["logo"][3]["func"] = switch_page;

 click_events["logo"][3]["args"] = new Array("links.html", "linksend.html");

 function mouse_pos(event, id) { 

     var offset = $(id).offset();   

     return new Array(event.pageX - offset.left, 

                      event.pageY - offset.top);

 }

 function handle_click(event) {

     var xy = mouse_pos(event, "#logo");

     var x = xy[0];

     var y = xy[1];

     for (var i in click_events[event.target.id]) {

         var ces = click_events[event.target.id][i];

         if (ces && x >= ces["min_x"] && x <= ces["max_x"]

             && y >= ces["min_y"] && y <= ces["max_y"]) {    

             ces["func"](event.target.id, ces);

             last_colours[0] = black;

             break;

         }

     }

 }

 function handle_hover(event) {

     var xy = mouse_pos(event, "#logo");

     var x = xy[0];

     var y = xy[1];

     for (var i in click_events[event.target.id]) {

         var ces = click_events[event.target.id][i];

         if (ces && x >= ces["min_x"] && x <= ces["max_x"]

             && y >= ces["min_y"] && y <= ces["max_y"]) {    

             highlight_menu(event.target.id, ces);

             break;

         }

     }

 }

 function handle_mouse_out(event) {

     highlight_menu(event.target.id, null);

 }

 function switch_page(id, params) {

     var page = params["args"][0];

     $("body").load(page);

     document.location.href = page;    

 }

 var last_highlight;

 var last_colours = new Array();

 function highlight_menu(id, p) {

     if (last_highlight == p) {

         return;

     }

     var canvas = document.getElementById("logo");

     var context = canvas.getContext("2d");    

     var image = context.getImageData(0, 0, menu_width, menu_height);

     if (last_highlight && last_colours && last_colours[0] && last_colours[1]) {        

         page = last_highlight["args"][0]; 

         min_x = last_highlight["min_x"];

         max_x = last_highlight["max_x"];

         min_y = last_highlight["min_y"];

         max_y = last_highlight["max_y"];

         colour_area(image, min_x + 10, max_x - 10, 0, 60, 

                     last_colours[0]);

         colour_area(image, min_x + 10, max_x - 10, 60, max_y - 10, 

                     last_colours[1]);

     }

     if (p) {    

         var page = p["args"][0]; 

         var min_x = p["min_x"];

         var max_x = p["max_x"];

         var min_y = p["min_y"];

         var max_y = p["max_y"];       

         last_colours[0] = colour_area(image, min_x + 10, max_x - 10, 0, 60, 

                                       orange);

         last_colours[1] = colour_area(image, min_x + 10, max_x - 10, 60, max_y - 10, 

                                       white);      

     }

     context.putImageData(image, 0, 0);

     last_highlight = p;

 }

 function colour_area(image, min_x, max_x, min_y, max_y, colour) {   

     var pixels = image.data;

     var old_colour;

     for (var y = min_y; y <= max_y; y += 1) {

         for (var x = min_x; x <= max_x; x += 1) {

             var pix_colour = getPixel(image, x, y);

             if (pix_colour.a > 0) {

                 colour.a = pix_colour.a;               

                 setPixel(image, x, y, colour); 

                 if (pix_colour.a == 255) {

                     old_colour = pix_colour;

                 }

             }

         }

     }

     return old_colour;

 }

 function init_logo(event) {

     var canvas = document.getElementById("logo");

     var context = canvas.getContext("2d");    

     canvas.width = menu_width;

     canvas.height = menu_height;

     context.drawImage(event.target, 0, 0);

     var image = context.getImageData(0, 0, menu_width, menu_height);    

     for (var i in click_events["logo"]) {

         var p = click_events["logo"][i]; 

         var min_x = p["min_x"];

         var max_x = p["max_x"];

         var min_y = p["min_y"];

         var max_y = p["max_y"];

         var pos = document.location.href.lastIndexOf("/") + 1; 

         var page = document.location.href.substr(pos);        

         for (var j in p["args"]) {

             if (page == p["args"][j]) {         

                 colour_area(image, min_x, max_x, 0, 60, blue);

                 colour_area(image, min_x, max_x, 60, max_y, white);

                 break;

             }

             else {

                 colour_area(image, min_x, max_x, 0, 60, white);

                 colour_area(image, min_x, max_x, 60, max_y,  orange);  

             }

         }       

     } 

     context.putImageData(image, 0, 0);      

     // context.fillStyle = green.str();

     // console.log((found["max_x"] - found["min_x"]) / 2 + found["min_x"] - 2);

     // context.fillRect((found["max_x"]-found["min_x"])/2+found["min_x"]-1, 95, 2, 5);  

     draw_menu_lines();   

 }

 function draw_menu_lines() {

     var canvas = document.getElementById("logo");

     var context = canvas.getContext("2d");  

     var image = context.getImageData(0, 0, menu_width, menu_height);

     var pixels = image.data;

     context.lineCap = "round";

     context.lineWidth = 1;

     var colour1a = new Colour(0, 0, 0, 0.1);

     context.beginPath();   

     context.moveTo(0, menu_height - 1);

     context.lineTo(menu_width - 1, menu_height - 1);   

     context.closePath();  

     context.strokeStyle = colour1a.str();

     context.stroke(); 

     var colour1e = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(70, menu_height - 1);

     context.lineTo(menu_width - 71, menu_height - 1);   

     context.closePath();  

     context.strokeStyle = colour1e.str();

     context.stroke();  

     var colour1b = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(50, menu_height - 1);

     context.lineTo(menu_width - 51, menu_height - 1);   

     context.closePath();  

     context.strokeStyle = colour1b.str();

     context.stroke();

     var colour1c = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(25, menu_height - 1);

     context.lineTo(menu_width - 26, menu_height - 1);   

     context.closePath();  

     context.strokeStyle = colour1c.str();

     context.stroke();

     var colour1d = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(10, menu_height - 1);

     context.lineTo(menu_width - 11, menu_height - 1);   

     context.closePath();  

     context.strokeStyle = colour1d.str();

     context.stroke();  

     var colour2 = new Colour(0, 0, 0, 0.2);

     context.beginPath();  

     context.moveTo(menu_splits[0], 0); 

     context.lineTo(menu_splits[0], menu_height - 1);

     context.moveTo(menu_splits[1], 0);

     context.lineTo(menu_splits[1], menu_height - 1);

     context.moveTo(menu_splits[2], 0);

     context.lineTo(menu_splits[2], menu_height - 1);

     context.closePath();

     context.strokeStyle = colour2.str();

     context.stroke();

     context.clearRect(menu_splits[0] - 1, menu_height - 1, 2, 2);

     context.clearRect(menu_splits[1] - 1, menu_height - 1, 2, 2);

     context.clearRect(menu_splits[2] - 1, menu_height - 1, 2, 2);

     context.clearRect(menu_splits[0] - 1, menu_height - 2, 1, 1);

     context.clearRect(menu_splits[1] - 1, menu_height - 2, 1, 1);

     context.clearRect(menu_splits[2] - 1, menu_height - 2, 1, 1);

 }

 function clearMenuLines() {

     var canvas = document.getElementById("logo");

     var context = canvas.getContext("2d");  

     var image = context.getImageData(0, 0, menu_width, menu_height);

     var pixels = image.data;

     context.clearRect(0, menu_height - 2, menu_width - 1, 2);

     context.clearRect(menu_splits[0] - 1, 0, 2, menu_height - 1);

     context.clearRect(menu_splits[1] - 1, 0, 2, menu_height - 1);

     context.clearRect(menu_splits[2] - 1, 0, 2, menu_height - 1);

 }

 function draw_sim_lines() {

     var w = 670;

     var h = 50;

     var canvas = document.getElementById("sim");

     var context = canvas.getContext("2d");  

     var image = context.getImageData(0, 0, w, h);

     var pixels = image.data;

     context.lineCap = "round";

     context.lineWidth = 1;

     var colour1a = new Colour(0, 0, 0, 0.1);

     context.beginPath();   

     context.moveTo(0, h - 1);

     context.lineTo(w - 1, h - 1);   

     context.closePath();  

     context.strokeStyle = colour1a.str();

     context.stroke(); 

     var colour1e = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(70, h - 1);

     context.lineTo(w - 71, h - 1);   

     context.closePath();  

     context.strokeStyle = colour1e.str();

     context.stroke();  

     var colour1b = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(50, h - 1);

     context.lineTo(w - 51, h - 1);   

     context.closePath();  

     context.strokeStyle = colour1b.str();

     context.stroke();

     var colour1c = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(25, h - 1);

     context.lineTo(w - 26, h - 1);   

     context.closePath();  

     context.strokeStyle = colour1c.str();

     context.stroke();

     var colour1d = new Colour(0, 0, 0, 0.05);  

     context.beginPath();   

     context.moveTo(10, h - 1);

     context.lineTo(w - 11, h - 1);   

     context.closePath();  

     context.strokeStyle = colour1d.str();

     context.stroke();   

 }

 function update_logo() {

     var canvas = document.getElementById("logo");

     var context = canvas.getContext("2d");  

     var image = context.getImageData(0, 0, menu_width, menu_height);

     var pixels = image.data;

     var white = new Colour(255, 255, 255);

     for (var y = 0; y < menu_height; y += 1) {

         for (var x = 0; x < menu_width; x += 1) {

             var pix_colour = getPixel(image, x, y);

             if (pix_colour.a > 0) {

                 setPixel(image, x, y, new Colour(90, 215, 21, pix_colour.a));

             }

         }

     }   

     context.putImageData(image, 0, 0);

 }

 var char_map = new Array();

 char_map["A"] = new Array(new Array(0, 4), new Array(1, 3),

                           new Array(2, 2), new Array(3, 1),

                           new Array(4, 0), new Array(5, 1),

                           new Array(6, 2), new Array(7, 3),

                           new Array(8, 4), new Array(2, 3),

                           new Array(3, 3), new Array(4, 3),

                           new Array(5, 3), new Array(6, 3));

 char_map["M"] = new Array(new Array(0, 4), new Array(0, 3),

                           new Array(0, 2), new Array(0, 1),

                           new Array(0, 0), new Array(0, 5),

                           new Array(5, 4), new Array(5, 3),

                           new Array(5, 2), new Array(5, 1),

                           new Array(5, 0), new Array(5, 5),

                           new Array(1, 1), new Array(2, 2), 

                           new Array(4, 2), new Array(5, 1),

                           new Array(3, 3));

 char_map["E"] = new Array(new Array(0, 4), new Array(0, 3),

                           new Array(0, 2), new Array(0, 1),

                           new Array(0, 0), new Array(0, 5),

                           new Array(1, 0), new Array(2, 0),

                           new Array(3, 0),

                           new Array(1, 3), new Array(2, 3),                       

                           new Array(1, 5), new Array(2, 5),

                           new Array(3, 5))

 char_map["7"] = new Array(new Array(0, 0), new Array(1, 0),

                           new Array(2, 0),

                           new Array(0, 5), new Array(0, 4),

                           new Array(1, 3), new Array(2, 2));

 char_map["3"] = new Array(new Array(2, 4), new Array(2, 3),

                           new Array(2, 2), new Array(2, 1),

                           new Array(0, 0), new Array(0, 5),

                           new Array(1, 0), new Array(2, 0),                         

                           new Array(1, 3), new Array(2, 3),                          

                           new Array(1, 5), new Array(2, 5))

 function init_gameoflife(text) {

     var canvas = document.getElementById("gameoflife");

     var cell_size = 16;

     if (canvas) {

         gameoflife = new Simulation(canvas, 670, 670, cell_size,

                                     green, black);

         $("#gameoflife").mousemove(function(event) { 

             gameoflife.mouse_moved(mouse_pos(event, "#gameoflife")); 

         });       

         var offset = new Array(13, 16);

         for (var c in text) {            

             var w = 0;

             for (p in char_map[text[c]]) {

                 var x = char_map[text[c]][p][0];

                 var y = char_map[text[c]][p][1];

                 w = Math.max(w, x);

                 var pos = new Array((x + offset[0]) * cell_size, 

                                     (y + offset[1]) * cell_size);

                 gameoflife.activate_cell(pos);

             }            

             offset[0] += w + 2;

         }       

     }    

 }

 function Colour(r, g, b, a) {

     this.r = r;

     this.g = g;

     this.b = b;

     this.a = a == undefined ? 255 : a;

 }

 Colour.prototype.equals = function(rhs) {

     for (p in this) {

         if (typeof(rhs[p]) == undefined

            || this[p] != rhs[p]) {           

             return false;

         }

     }

     return true;

 }

 Colour.prototype.str = function() {

     return "rgba(" + this.r + "," + this.g + "," + this.b + "," + this.a + ")";

 }

 var white = new Colour(255, 255, 255);

 var black = new Colour(0, 0, 0, 255);

 var orange = new Colour(201, 87, 35, 255);

 var green = new Colour(90, 215, 21, 255);

 var blue = new Colour(85, 170, 221, 255);

 var background = new Colour(34, 34, 34, 255);

 function setPixel(image, x, y, colour) {

     var index = 4 * (x + y * image.width);

     image.data[index] = colour.r;

     image.data[index + 1] = colour.g;

     image.data[index + 2] = colour.b;

     image.data[index + 3] = colour.a;

 }

 function getPixel(image, x, y) {   

     var index = 4 * (x + y * image.width);

     var r = image.data[index];

     var g = image.data[index + 1];

     var b = image.data[index + 2];

     var a = image.data[index + 3];

     return new Colour(r, g, b, a);

 }

 function load_random_quote() {

     var file = "/quotes/quote" + Math.floor(Math.random() * QUOTES_NUMBER + 1) + ".html";

     $.ajax({url: SERVER + file,

             success: write_quote});

 }

 function write_quote(data, status, xhr) {   

     $("#random_quote").html(data);

 }

 function load_footer()

 {

 	var file = "/footer.html";

 	var currentFile = self.location.hostname + self.location.pathname;		

 	var request = http_request_object();

 	var url  = "http://" + self.location.hostname + file;	

 	request.open("GET", url, false);

 	request.setRequestHeader("User-Agent", navigator.userAgent);

 	request.send(null)

 	// if (oRequest.status == 200) alert(oRequest.responseText);

 	// else alert("Error executing XMLHttpRequest call!");	

 	//document.write(url);

 	//document.write(request.responseText);

     document.getElementById('footer').innerHTML = request.responseText;

 }

 // Mandelbrot functions

 function Complex(real, imag) 

 {

 	this.real = real;

 	this.imag = imag;

 }

 var MIN_C = new Complex(-2.2, -1.4);

 var MAX_C = new Complex(1.0, 1.4);

 var min_c = MIN_C;

 var max_c = MAX_C;

 var MIN_ITER = 100;

 var max_iter = MIN_ITER;

 var zoom = 1.0;

 var resolution = 3;

 var bailout = 4.0;

 function Result(z, iter) 

 {

 	this.z = z;

 	this.iter = iter;

 }

 function complex_quad(c)

 {

 	return new Complex(Math.pow(c.real, 2) - Math.pow(c.imag, 2), 

 		2.0 * c.real * c.imag);

 }

 function complex_quad_value(c)

 {

 	return Math.pow(c.real, 2) + Math.pow(c.imag, 2);

 }

 function complex_add(c1, c2)

 {

 	return new Complex(c1.real + c2.real, c1.imag + c2.imag);

 }

 function complex_equal(c1, c2)

 {	

 	return (c1.real == c2.real) && (c1.imag == c2.imag);

 }

 function iterate(z, c) 

 {

 	z_quad = complex_quad(z);

 	return new Complex(z_quad.real + c.real, z_quad.imag + c.imag);

 }

 function test(c, max_iter) 

 {

 	var iter = 0;

 	var z = new Complex(0.0, 0.0);

 	var last_z = new Complex(-1.0, 0.0);

 	var quad_z = complex_quad_value(z);

 	while (iter < max_iter

 		&& !complex_equal(z, last_z)

 		&& quad_z <= bailout)

 	{

 		last_z = z;

 		z = iterate(z, c);

 		quad_z = complex_quad_value(z);

 		iter++;

 	}

 	return new Result(quad_z, iter);

 }

 function draw(diter, dx, dy, dz, dres)

 {  

 	var canvas = document.getElementById('mandelbrot'); 

 	if (canvas.getContext)

 	{  

 		zoom += dz;

 		var ctx = canvas.getContext('2d');

 		if (dres != 0)

 		{		

 			resolution = Math.max(1, resolution + dres);

 		}

 		if (diter != 0)

 		{

 			max_iter = Math.max(MIN_ITER, max_iter + diter);

 		}

 		var red = "rgb(255, 0, 0)";

 		var white = "rgb(255, 255, 255)";

 		var width = canvas.width;

 		var height = canvas.height;

 		var dim = Math.max(width, height);

 		var dim_ratio = Math.round(width / height);	

 		var diff_c = new Complex(max_c.real - min_c.real,

 			max_c.imag - min_c.imag);

 		dx_min = diff_c.real / 100 * (dx + dz);

 		dx_max = diff_c.real / 100 * (dx - dz);

 		dy_min = diff_c.imag / 100 * (dy + dz);

 		dy_max = diff_c.imag / 100 * (dy - dz);

 		var min_inc = new Complex(dx_min * dim_ratio / 2.0, dy_min);

 		var max_inc = new Complex(dx_max * dim_ratio / 2.0, dy_max);

 		min_c = complex_add(min_c, min_inc);

 		max_c = complex_add(max_c, max_inc);

 		diff_c = new Complex(max_c.real - min_c.real,

 			max_c.imag - min_c.imag);

 		for (var y = 0; y < height; y += resolution) 

 		{

 			for (var x = 0; x < width; x += resolution) 

 			{    			

 				var c = new Complex(min_c.real + diff_c.real / dim * x, 

 					min_c.imag + diff_c.imag / dim * y);  	

 			 	var result = test(c, max_iter);	

 		 		var r = Math.min(255, Math.pow(Math.max(0, 

 		 			(result.iter - max_iter / 20.0)), 2));

 				var g = Math.min(255, Math.pow(Math.max(0, 

 					(result.iter - max_iter / 25.0)), 2));			

 		 		var b = Math.min(255, Math.pow(Math.max(0, 

 					(result.iter - max_iter / 20.0)), 2));

 		 		var colour = "rgb(" + r + "," + g + "," + b + ")";

 		 		ctx.fillStyle = colour; 

 				ctx.fillRect(x, y, resolution, resolution);			

 			}

   		}

 	}  

 } 

 function getEventOffsetX(evt)

 {

 	if (evt.offsetX != null)

 		return evt.offsetX;

     var obj = evt.target || evt.srcElement;

    	setPageTopLeft(obj);

     return (evt.clientX - obj.pageLeft);

 }

 function getEventOffsetY(evt)

 {

 	if (evt.offsetY != null)

 		return evt.offsetY;

     var obj = evt.target || evt.srcElement;

    	setPageTopLeft(obj);

     return (evt.clientY - obj.pageTop);

 }

 function setPageTopLeft( o )

 {

     var top = 0,

     left = 0,

     obj = o;

     while (o.offsetParent)

      {

          left += o.offsetLeft ;

          top += o.offsetTop ;

          o = o.offsetParent ;

     };

     obj.pageTop = top;

     obj.pageLeft = left; 

 }

 function draw2(evt) {

     var iter = 0;

     var res = 0;

     var x = (getEventOffsetX(evt) - 335) / 167.5;

     var y = (getEventOffsetY(evt) - 140) / 70;

     var z = 0;

     draw(iter, x, y, z, res);

 }

 function update() {

     simulation.update();

     simulation.draw();

     if (gameoflife) {

         gameoflife.update();

         gameoflife.draw();

     }

 }

 function Grid(width, height, cell_size) {

     this.width = parseInt(width / cell_size + 0.5);

     this.height = parseInt(height / cell_size + 0.5);

     this.canvas_width = width;

     this.canvas_height = height;

     this.cell_size = cell_size;  

     this.cells = new Array();

     for (var y = 0; y < this.height; ++y) { 

         this.cells[y] = new Array();

         for (var x = 0; x < this.width; ++x) {

             this.cells[y][x] = new Cell(x, y, 0, this);

         }

     }

 }

 Grid.prototype.cell = function(x, y) {   

     return this.cells[y][x];

 }

 Grid.prototype.pick_cell = function(x, y) {

     var lx = parseInt(x / this.cell_size - 0.5);

     var ly = parseInt(y / this.cell_size - 0.5);  

     return this.cells[ly][lx];

 }

 function Cell(x, y, value, grid) {

     this.x = x;

     this.y = y;  

     this.canvas_x = x * grid.cell_size;

     this.canvas_y = y * grid.cell_size;

     this.value = value;

     this.grid = grid;

     this._neighbours = new Array();

     this.last_mod = 0;

 }

 Cell.prototype.hash = function() {

     return this.x + ", " + this.y;

 }

 Cell.prototype.set_value = function(value) {

     this.value = value;

     this.last_mod = $.now();

 }

 Cell.prototype.neighbours = function() {

     if (this._neighbours.length) {

         return this._neighbours;

     }

     if (this.x > 0) {

         this._neighbours.push(this.grid.cell(this.x-1, this.y));

         if (this.y > 0) {

             this._neighbours.push(this.grid.cell(this.x-1, this.y-1));

             this._neighbours.push(this.grid.cell(this.x, this.y-1));

         }

         if (this.y + 1 < this.grid.height) {

             this._neighbours.push(this.grid.cell(this.x-1, this.y+1));

         }

     }   

     if (this.x + 1 < this.grid.width) {

         this._neighbours.push(this.grid.cell(this.x+1, this.y));

         if (this.y + 1 < this.grid.height) {

             this._neighbours.push(this.grid.cell(this.x+1, this.y+1));

             this._neighbours.push(this.grid.cell(this.x, this.y+1));

         }

         if (this.y > 0) {

             this._neighbours.push(this.grid.cell(this.x+1, this.y-1));

         }

     }

     return this._neighbours;

 }

 Cell.prototype.density = function() {

     var d = 0;

     var neighbours = this.neighbours();

     for (var n in neighbours) {

         d += neighbours[n].value;

     }

     return d;

 }

 function Simulation(canvas, w, h, cell_size, life_colour, dead_colour) {

     this.last_update = $.now() + 3000;

     this.last_draw = 0;

     this.last_mouse_moved = 0;

     this.redraw = new Array();   

     this.canvas = canvas;

     this.canvas.width = w;

     this.canvas.height = h;

     this.context = canvas.getContext("2d");    

     this.pos_queue = new Array();

     this.cell_queue = new Array();  

     this.cell_size = cell_size;

     this.life_colour = life_colour;

     this.dead_colour = dead_colour;

     this.grid = new Grid(this.canvas.width, this.canvas.height, cell_size);

     draw_sim_lines();

 }

 Simulation.prototype.draw = function() {

     var now = $.now();

     if (this.redraw.length) {

         var cell = this.redraw[0];

         this.redraw.shift();

         this.context.fillStyle = cell.value == 1 ? 

             this.life_colour.str() : this.dead_colour.str();

         this.context.fillRect(cell.canvas_x, cell.canvas_y, 

                               this.grid.cell_size, this.grid.cell_size);

         this.last_draw = $.now();

     }

 }

 Simulation.prototype.update = function() {

     var now = $.now();

     while (this.pos_queue.length) {

         var pos = this.pos_queue.pop();       

         if (pos[0] < this.canvas.width

             && pos[1] < this.canvas.height) {

             var cell = this.grid.pick_cell(pos[0], pos[1]);

             cell.set_value(1);

             this.cell_queue.push(cell);

             this.cell_queue.concat(cell.neighbours()); 

             this.redraw.unshift(cell);          

         }

     }

     if (this.last_update + 1000 > now) {

         return;

     }

     var changed = new Array();

     var next_cell_queue = new Array();

     while (this.cell_queue.length) {

         var cell = this.cell_queue.pop();       

         if (changed[cell.hash()]) {           

             continue;

         }

         var d = cell.density();

         if (d == 3 && cell.value == 0) {           

             changed[cell.hash()] = cell;            

             next_cell_queue = next_cell_queue.concat(cell.neighbours());               

         } else if (cell.value == 1) {

             if (d < 2 || d > 3) {              

                 changed[cell.hash()] = cell;                

                 next_cell_queue = next_cell_queue.concat(cell.neighbours());               

             }

         }       

     }

     for (var pos in changed) {

         var cell = changed[pos];      

         cell.set_value(1 - cell.value);

         this.redraw.push(cell);

     }

     this.cell_queue = next_cell_queue;

     this.last_update = now;  

 }

 Simulation.prototype.activate_cell = function(pos) {

     this.pos_queue.push(pos);   

 }

 Simulation.prototype.mouse_moved = function(pos) {

     var now = $.now();    

     if (this.last_mouse_moved + 50 < now) {       

         this.pos_queue.push(pos);      

         this.last_mouse_moved = now;       

     }

 }