window.addEvent('domready', function(){
	
	
	
	
	/* A SUPRIMER JUSTE POUR DONNER UNE AUTEUR VARIABLE AU DIV 
	
		var Objets = document.getElements('div[class=Box]');
		
		Objets.each(function(obj){
			obj.setStyles({'height': $random(20, 150)+'px'});
		});
		
	 FIN A SUPPRIMER */
	
	
	
	
	var margin 		= $$('.Box').getStyle('margin-left');
	margin = margin[0].toInt();
	var boxWidth 	= $$('.Box').getStyle('width');
	boxWidth = boxWidth[0].toInt();
	
	var NbCollone = 0;
	var Main = $('Main');

	var Objets = Main.getElements('div[class=Box]');
	var nbObjet = Objets.length;
	
	var lesswidth = margin;
	
	function replace(){
		var width = (window.getWidth()-lesswidth)/(boxWidth+margin);
		var nbr = width.toInt();
		
//		minimum de 2 div par colonnes
//		(nbr>nbObjet/2) ? nbr = (nbObjet/2).toInt() : nbr = nbr;
		
		if (nbr != NbCollone ){
			NbCollone = nbr;
			
//			Main.setStyles({'width':NbCollone*(boxWidth+margin)+'px'});

			for (var i = 1; i<NbCollone+1; i++){
				var column = new Element('div',{id:'Main_Column_'+i,'class': 'Main_Column'}).injectInside(Main);
			}
			var id = 1;
			Objets.each(function(obj){
				obj.injectInside($('Main_Column_'+id));
				if (id==NbCollone){ id = 1 } else { id++; }
			});
			
			
			// Agire sur le dernier des div de chaque collonnes pour enlever un element de separation entre eux exemple hr
			/*
			$$('.Main_Column').each(function(column){
				var allhr = column.getElements('hr');
				allhr.setStyles({'display':'block'});
				var last = column.getLast('div[class=Box]');
				var hr = last.getElement('hr');
				try {hr.setStyles({'display':'none'})} catch(e){}
			});
			*/
			
		}
	}

	replace();
	
	window.addEvent('resize', function(){
		replace();
	});
});