window.addEvent('load', function() {	
	
	var wrap = $(document.body).getElement('ul.latest_pics li');
	var th_title = $(document.body).getElement('ul.latest_pics li h3');
	var w_wrap = wrap.getStyle('width').toInt();
	var h_wrap = wrap.getStyle('height').toInt() - th_title.getStyle('height').toInt();
	var thumbs = $(document.body).getElements('ul.latest_pics li img');
	var wrap_border = 1;
	var clip_bound = 3;
	var left_bound = 0;
	var top_bound = 0;
	
	thumbs.each(function(item, index){
		var w_th = item.getStyle('width').toInt();
		var h_th = item.getStyle('height').toInt();
		
		if(w_th > h_th){	//thumb orizzontale
			item.setStyle('height',(h_wrap + 2 * wrap_border) + "px");
			width = item.getStyle('width').toInt();
			item.setStyle('width',width + "px");
			left_bound = -((width - w_wrap)/2).toInt();
			top_bound = 0;
			//clip image
			var p_1 = clip_bound.toInt();
			var p_2 = (-left_bound + w_wrap - clip_bound).toInt();
			var p_3 = (top_bound + h_wrap - clip_bound).toInt();
			var p_4 = (-left_bound + clip_bound).toInt();
		}else if(w_th < h_th){	//thumb verticale
			item.setStyle('width',(w_wrap + 2 * wrap_border) + "px");
			height = item.getStyle('height').toInt();
			item.setStyle('height',height + "px");
			top_bound = -((height - h_wrap)/2).toInt();
			left_bound = 0;
			//clip image
			var p_1 = (-top_bound + clip_bound).toInt();
			var p_2 = (w_wrap - clip_bound).toInt();
			var p_3 = (-top_bound + h_wrap - clip_bound).toInt();
			var p_4 = (-left_bound + clip_bound).toInt();
		}else{
			//thumb quadrata
			item.setStyle('width',w_wrap + "px");
			item.setStyle('height',h_wrap + "px");
			top_bound = 0;
			left_bound = 0;
		}
		
		//absolute positioning
		item.setStyle('left', left_bound + "px");
		item.setStyle('top', top_bound + "px");
		
		//apply clip
		p_1 = p_1.toString() + "px";
		p_2 = p_2.toString() + "px";
		p_3 = p_3.toString() + "px";
		p_4 = p_4.toString() + "px";
		item.setStyle('clip', 'rect(' + p_1 + ',' + p_2 + ',' + p_3 + ',' + p_4 + ')');
	});
	
	
});