var focusBlock = new Class({
	Implements: [Options, Events],
	options: {
		fxStyle : {
			duration: 300,
			fps:20,
			wait:true,
			transition: Fx.Transitions.Circ.easeInOut
			},
		imgsTarget: 'mainImg',
		blocsTextesTarget: 'div.blockFocus .focusText',
		unitsTarget: 'div.blockFocus .togglingFocus .vignetteFocus',
		vignettes:{},
		blocsTextes:{},
		imgs:{}
	},
	maxHeight: 0,
	initialize: function(options){		
		this.options.vignettes = document.getElements(this.options.unitsTarget);
		this.options.blocsTextes = document.getElement(this.options.blocsTextesTarget).getChildren();
		this.options.imgs = $(this.options.imgsTarget).getElements('img');
		
		// Mise en place du background pardéfaut.
		var defaultBackground = this.options.imgs[0].getAttribute('src');
		this.options.imgs.getParent(".elementImg").getParent(".mainImg").setStyle('background','url('+defaultBackground+') no-repeat left top');
		
		this.options.vignettes.each(function(unit,i){
			this.imageActions(unit, i);
		}.bind(this));
		
		// Si on veut uniformiser les tailles des vignettes décommenter la ligne suivante
		// this.options.vignettes.setStyle('height', this.maxHeight);
	},
	imageActions: function(unit, index){
		var hauteurVignette = unit.offsetHeight;
		this.options.vignettes[index].setStyle("cursor","pointer");
		unit.addEvent("mouseover",function(e){
			this.options.vignettes.removeClass("hover");
			this.options.vignettes[index].addClass("hover");
		}.bind(this));
		unit.addEvent("mouseout",function(e){
			this.options.vignettes.removeClass("hover");
		}.bind(this));
		unit.addEvent("click", function(e){
			e = new Event(e).stop();
			this.changeTexts(index);
			this.changeImage(index);
		}.bind(this));
	},
	changeTexts:function(cible){
		//console.log("changeTexte ",cible);
		this.options.blocsTextes.addClass("hidden");
		this.options.blocsTextes[cible].removeClass("hidden");
	},
	changeImage: function(cible){
		//console.log("changeImage ",cible);
		this.options.imgs.getParent(".elementImg").addClass('hidden');
		// lancer opacity si fxStyle ^^
		var actualImageTOFade = $(this.options.imgs[cible]);
		var parentImageToFade = actualImageTOFade.getParent(".elementImg");
		parentImageToFade.setStyle('opacity',0);
		actualImageTOFade.removeClass('hidden');
		parentImageToFade.removeClass('hidden');
		parentImageToFade.effect('opacity', this.options.fxStyle).start(1).chain(function(){
			
			var newBackground = actualImageTOFade.getAttribute('src');
			parentImageToFade.getParent(".mainImg").setStyle('background','url('+newBackground+') no-repeat left top');
			
		});
	}
});
/*
function changeText() {
	// variables generales
	var units = document.getElements('div.blockFocus .togglingFocus .mediaFullSize');
	var fxStyle = {duration: 300,fps:20,wait:true,transition: Fx.Transitions.Circ.easeInOut};
	
	var blocsTextes = document.getElement('div.blockFocus .focusText').getChildren();
	
	// variables pour l effet image
	var imgs = $('mainImg').getElements('img');
	imgs[0].getParent().setStyle('backgroundImage','url('+imgs[0].src+')');
	
	// effets onclick
	var maxHeight = 0;
	units.each(function(unit, i){
		var height = unit.offsetHeight;
		if(i<units.length){
			units[i].style.cursor="pointer";
			units[i].onclick = function(e){
				e = new Event(e).stop();
				blocsTextes.addClass('hidden');
				blocsTextes[i].removeClass('hidden');
				imgs.addClass('hidden');
				imgs[i].setStyle('opacity',0);
				imgs[i].removeClass('hidden');
				imgs[i].effect('opacity', fxStyle).start(1).chain(function(){
					imgs[i].getParent().setStyle('backgroundImage','url('+imgs[i].src+')');
				});
			};
		}
		// resize automatique des li vides
		maxHeight = maxHeight>height ? maxHeight : height;
	});
	units.setStyle('height', maxHeight);
};*/
window.addEvent('domready',function(){
	if($$('div.blockFocus').length != 0 )
	new focusBlock();
});