var bubbles_container = "bubbles"; //id du conteneur qui va recevoir les bulles
var bubble_classes = 'couche'; //prefix des classes des div contenant les bulles
var bubble_prefix = "bubble_"; //prefix des ids des bulles

var bubbles_nbr = 40; //nombre de bulle
var bubble_max_class = 12; //nombre de "taille" de bulle
var max_delay = 1; //delai max entre 2 depart de bulle

var body_width = 960; //taille du conteneur souhait�
var max_img_size = 240; //taille max d'une bulle

var tab_time_out = new Array(); //tableau recevant les identifiants de timer

var max_zindex = 300; //style z-index maximum des bulles

var nbr_compteur = 0; //compteur bulle

var screen_dims = getClientSize(); //recuperation des dimensions du navigateur
var largeur_ecran = screen_dims[0];
var hauteur_ecran = screen_dims[1];

var min_y = Math.floor(5 / 100  * hauteur_ecran); //pourcentage de la hauteur d'ecran ou se concentre les bulles
var marge_width = (largeur_ecran - body_width) / 2; //largeur de la marge a respecter � gauche

//
// Note : � l'origine la classe des bulles devaient �tre exploit�e, mais c'est inutile (random � la g�n�ration et de la vitesse = suffisamment nice :)
//

function doRnd(max)
{
	//Fonction qui retourne un entier aleatoire de 0 au max pass� en param
	return Math.floor(Math.random()*max);
}

function getClientSize()
{
    /* http://www.howtocreate.co.uk/tutorials/javascript/browserwindow */
    return Array((document.documentElement && document.documentElement.clientWidth) || window.innerWidth || self.innerWidth || document.body.clientWidth,(document.documentElement && document.documentElement.clientHeight) || window.innerHeight || self.innerHeight || document.body.clientHeight);
}

function populate_bubbles()
{
	//Fonction de generation des bulles
	var i = 0;
	var random_class_number=0;
	var random_x=0;
	var random_y=0;

	for(i = 0; i <= bubbles_nbr; i++)
	{
		random_class_number = doRnd(bubble_max_class)
		random_x = Math.round(doRnd(body_width - max_img_size) + marge_width);
		random_y = doRnd(min_y) + hauteur_ecran + max_img_size;
		var bubble = document.createElement('div');
		bubble.id = bubble_prefix+i;
		
		var random_zindex = doRnd(max_zindex);//z-index aleatoire
	
		if (document.all && !window.opera) {
			bubble.setAttribute('className', bubble_classes+random_class_number);
			bubble.style.cssText = 'top:'+random_y+'px; left:'+random_x+'px;';
		}else{
			bubble.setAttribute('class', bubble_classes+random_class_number);
			bubble.setAttribute('style', 'top:'+random_y+'px; left:'+random_x+'px; z-index:'+random_zindex+";");
		}
		$(bubbles_container).appendChild(bubble);
	}
}

function move_bubble(bubl)
{
	//Fonction de creation du timeout qui fait partir l'effet
	var temps = doRnd(max_delay);
	var i = getBubbleID(bubl.id);
	
	var random_zindex = doRnd(max_zindex);
	bubl.style.zIndex = random_zindex;

	tab_time_out[i] = setTimeout(function () { do_move(bubl.id); }, temps);
	
	bubl.onclick=function()
	{
		new Effect.Opacity(bubl,{ from: 1.0, to: 0, duration: 0.2 ,
			afterFinish:function()
			{
				bubl.remove();
				//compteur de bulle	
				var CHPOST = "&type=ajout";
				new Ajax.Request(urltask, 
				{
					asynchronous: 'true',
					postBody: 'tache=demos/bubbles/compteurbulle'+CHPOST,
						onComplete: function(xhr)
						{
							var result = xhr.responseText.substr(13);
							if(result) { $('nbcompteur').update(result); }
						}
				});
			}
		});
		
	 }
}

function getBubbleID(bubl_id)
{
	//Fonction qui retourne l'identifiant de la bulle cr��e
	return $(bubl_id).id.replace(bubble_prefix,"");
}

function do_move(bubl_id)
{
	//Fonction qui deplace une bulle
	var num_class = getBubbleID(bubl_id);
	var duree_s = (num_class * num_class) / bubbles_nbr;
	if(duree_s < 2){
		duree_s = doRnd(10);
	}
	
	var left_pos = 0;
	var top_pos = 0;

	if (document.all && !window.opera)
	{
		var val_top = $(bubl_id).style.top;
		var val_left = $(bubl_id).style.left;

		top_pos = val_top.replace("px","");
		left_pos = val_left.replace("px","");
		
		new Effect.Morph($(bubl_id), { style:"position:absolute; top: -"+top_pos+"px; left: "+left_pos+"px;",
			duration:duree_s,
			transition: Effect.Transitions.linear,
			afterFinish:function()
			{
				clearTimeout(tab_time_out[num_class]);
				retourbulles(num_class);
			}
	
		});
	}else{
		left_pos = $(bubl_id).style.left;

		new Effect.Move($(bubl_id), {  
			x: left_pos,
			y: -max_img_size, //hauteur max d'une bulle
			mode: 'absolute',
			duration:duree_s,
			transition: Effect.Transitions.linear,//les gouts et les couleurs
			afterFinish:function()
			{
				clearTimeout(tab_time_out[num_class]);
				retourbulles(num_class);
			}
		});
	}
	
	//alert("DO MOVE, x="+left_pos+", y="+max_img_size);
}

function retourbulles(num_class){	
	
	//retour des bulles
	random_class_number = doRnd(bubble_max_class)
	random_x = Math.round(doRnd(body_width -max_img_size) + marge_width);
	random_y = doRnd(min_y) + hauteur_ecran + max_img_size*4;
	
	if(num_class){
		bubble = $('bubble_'+num_class);
		
		if (document.all && !window.opera) {
			bubble.setAttribute('className', bubble_classes+random_class_number);
			bubble.style.cssText = 'top:'+random_y+'px; left:'+random_x+'px;';
		}else{
			bubble.setAttribute('class', bubble_classes+random_class_number);
			bubble.setAttribute('style', 'top:'+random_y+'px; left:'+random_x+'px;');
		}
		
		$(bubbles_container).appendChild(bubble);
		
		move_bubble(bubble);
	}
}

function rafraichitcompt(){ //demos bubbles
	if($("nbcompteur")){
		var CHPOST = "&type=rafraichit";
		new Ajax.Request(urltask, 
		{
			asynchronous: 'true',
			postBody: 'tache=demos/bubbles/compteurbulle'+CHPOST,
			onComplete: function(xhr)
			{
				var result = xhr.responseText.substr(13);
				if(result) { $('nbcompteur').update(result); }
			}
		});
		setTimeout(function () { rafraichitcompt(); }, temps);
	}
}

var myrules = {
		'body': function(bod)
		{
			//Si il n'y a rien dedans on declenche la generation des bulles
			if($(bubbles_container) && $(bubbles_container).innerHTML == '')
			{
				populate_bubbles();
				
				//On reapplique les regles pour envoyer les effets
				Behaviour.apply();
			}
		},
		
		'.couche0': function(c_0){move_bubble(c_0);},
		'.couche1': function(c_1){move_bubble(c_1);},
		'.couche2': function(c_2){move_bubble(c_2);},
		'.couche3': function(c_3){move_bubble(c_3);},
		'.couche4': function(c_4){move_bubble(c_4);},
		'.couche5': function(c_5){move_bubble(c_5);},
		'.couche6': function(c_6){},
		'.couche7': function(c_7){},
		'.couche8': function(c_8){},
		'.couche9': function(c_9){},
		'.couche10': function(c_10){},
		'.couche11': function(c_11){},	
		'.compteur' : function(compt)
		{
			 setTimeout(function () { rafraichitcompt(); }, temps);
		}
};
// Enregistrement des regles definies ci dessus dans Behaviour
Behaviour.register(myrules);