/*

A dandelion particles script written for howmean.com by Joshua Koo

Inspired by the work at http://frank.vanpuffelen.net/2009/05/particle-systems-in-javascript.html
and 

v0.1
http://www.howmean.com/testcursor1.php
-> colors, html canvas
v0.2
http://www.howmean.com/testcursor2.php - faster wind
v0.3
http://www.howmean.com/testcursor3.php - more sizes, more balloon like
v0.4
http://www.howmean.com/testcursor4.php - more horizontal movement. 
v0.5
- detect edges
- jquery
- float from bottom
v0.6 
- effect flag
- packaged as js object

v0.7
- more edge fixes
- new mousescroll

v0.8 
- Encapulated in an object
*/

(function($) {
// Settings
var supportCanvas = false;

// Variables
var container;
var particles;
var where = {x:0,y:0, move:false, type:''};
var fx = true;

function createParticle(span) {
  return {
  	elm: span ? span : createParticleElement(),
    x: 0.0 + where.x,
    y: 0.0 + where.y,
    dx: Math.random() + 0.5,
    dy: - (Math.random()*0.8 + 0.3),
    ttl: Math.floor(Math.random()*50) + 50, // time to live in frames
    type: where.type
  }
}

function destoryParticle(span) {
  span.parentNode.removeChild(span);
}

function createParticleElement() {
	var elm ;
	if (supportCanvas) {
		var elm = document.createElement('canvas');
		
		//$(elm).css({border:'0px solid grey'});
		 
		  //elm.style.border = '1px solid rgb('+Math.random()*100+'%,'+Math.random()*100+'%,'+Math.random()*100+'%)';
		  
		  elm.style.position = 'absolute';
		  elm.style.width = elm.style.height = '5px';
		  elm.width = elm.height= 5;
		
		
		if (typeof(G_vmlCanvasManager) != 'undefined') G_vmlCanvasManager.initElement(elm);
		var ctx = elm.getContext("2d");
		
		
		  
		  
		  
		  
		  if (true || where.type=='b') {
			  ctx.fillStyle = 'rgba(168, 140, 37,'+((Math.random()*0.4)+0.4) +')';  
			  //ctx.strokeStyle = 'rgba(168, 140, 37,'+0.4+')'; 
			  var r = 1+ Math.random()*1.5;
			  ctx.arc(2.5,2.5,r,0,Math.PI*2, true);
		  } else {
		  	  elm.style.width = elm.style.height = '15px';
		  	   elm.width = elm.height= 15;
		  	  var balls  = [ 'red', 'yellow' ];
		  	  var col = balls[Math.floor(Math.random()*balls.length)];
		  	  ctx.fillStyle = col;  
			  ctx.strokeStyle = 'rgba(168, 140, 37,'+0.4+')';  
			  var r = 1+ Math.random()*5;
			  ctx.arc(r,r,r,0,Math.PI*2, true);
			
		  }
		  
		  ctx.fill();
	} else {
		 var elm = document.createElement('div');
		 elm.style.border = '1px solid rgb(168, 140, 37)';
		 // Random colors
		 //elm.style.border = '1px solid rgb('+Math.random()*100+'%,'+Math.random()*100+'%,'+Math.random()*100+'%)';
		  
		  elm.style.position = 'absolute';
		  elm.style.width = elm.style.height = '0px';
	}
	
	container.appendChild(elm);
  
  return elm;	
}

function update() {
	if (!fx) return;
	if (where.move) {
		if (where.type == 'b') {}
		
		if (($(window).height() - 15) > where.y) 
		particles.push(createParticle());
		
		where.type = '';
		 where.move = false;
	}
  for (var i=particles.length -1 ; i >=0; i--) {
  	  if  (particles[i] != null) {
	    particles[i].ttl = particles[i].ttl - 1;
	    
	    if (particles[i].ttl > 0) {
		if (particles[i].type=='b') {
			particles[i].dx += Math.random()*0.1-0.01;
			particles[i].dy += Math.random()*0.1-0.05;
		} else {
			particles[i].dx += Math.random()*0.1-0.05;
			particles[i].dy += Math.random()*0.1-0.075;
		}
		particles[i].x = particles[i].x + particles[i].dx;
		particles[i].y = particles[i].y + particles[i].dy;
		
		// If particles are out of bound, destory
		if ( (particles[i].x >  ($(window).width() - 20) )||(particles[i].y < 0 )|| ((particles[i].y > ($(window).height() - 15 )))) {
			
		      destoryParticle(particles[i].elm);;
		    particles[i] = null;
		    particles.splice(i, 1);
		} else {
		
		      particles[i].elm.style.left = Math.floor(particles[i].x) + 'px';
		      particles[i].elm.style.top = Math.floor(particles[i].y) + 'px';
		      
		      //particles[i].elm.style.width = particles[i].elm.style.height = (particles[i].ttl/100)+'%';
		      
		      particles[i].elm.style.opacity = (particles[i].ttl/50) ;
		      particles[i].elm.style.filter = 'alpha(opacity=' + (particles[i].ttl*2) + ')';
		}
	
	    } else { //TTL expired. Destory
		    destoryParticle(particles[i].elm);;
		    particles[i] = null;
		    particles.splice(i, 1);
	    }
  	}
  }
}

function displayfx() {
	if (fx) {
		$('#enablefx').css({fontWeight:"bold"});
		$('#disablefx').css({fontWeight:"normal"});
	} else {
		$('#disablefx').css({fontWeight:"bold"});
		$('#enablefx').css({fontWeight:"normal"});
	}
}

function fxui() {
	// Push to html document
	//'Effects: <span id="enablefx">On</span>/ <span id="disablefx" style="font-weight:bold; ">Off</span>';
	$('#enablefx').click(function() {
			 fx = true;
			 displayfx();

 		 }).mouseover(function() {
			 $(this).css({textDecoration:"underline"});

 		 }).mouseout(function() {
 		 	 $(this).css({textDecoration:"none"});
			 displayfx();

 		 });
 		 
 		 $('#enablefx').click();
 		 $('#disablefx').click(function() {
			 fx = false;
			 displayfx();

 		 }).mouseover(function() {
			 $(this).css({textDecoration:"underline"});

 		 }).mouseout(function() {
 		 	 $(this).css({textDecoration:"none"});
			 displayfx();
 		 });
}

 $(document).ready(function() {
	 var elm = document.createElement('canvas');
	 if (typeof(G_vmlCanvasManager) != 'undefined') G_vmlCanvasManager.initElement(elm);
	 if (elm.getContext) {
	 	 supportCanvas = true;
	 } else {
	 }

	 container = $('body')[0];
	particles = [];
	
	setInterval(update, 50); // Framerate
	
	
	
	
	
	$("body").css("overflow-y", "hidden");

	$('#footerContent').mousemove(function(e){
		if (!fx) return;
		trackMouse(e);
		where.type = 'b';
	});
	
	function trackMouse(e) {
		var movex = ((where.x != e.pageX));
		var movey = ((where.y != e.pageY));
		var moved = (movex || movey);
		if (moved) {
			where.x = e.pageX;
			where.y = e.pageY;
			where.move = true;
		} else {
			where.move = false;
		}
		
		
		//$('#debug').html(moved+' moved : ' + where.move +  ' y:' + e.pageY
		//	+'x : ' + where.x +  ' y:' + where.y + ' p:' + particles.length );
	}
	
	// For debuging
	//$('body').append('<div id="debug" >here</div>');
	
	$().mousewheel(function(e, delta){
		if (!fx) return;
		trackMouse(e);
		
		// Stop default behavior
		e.stopPropagation();
		e.preventDefault();
	});
	
 });
 
 
})(jQuery);

