/* Options:

divprinc - Le container pour tous les autres
nav-fleches - Fleches de navigation pour le scroller de mini photo, true ou false
slides - le nombre d'ecran de mini photos
path - Le chemin d'acces aux photos, petites et grandes

*/


var showInfo = new Class({	

	Implements: [Options, Events],

		options: {
			divprinc: "show-cheval",
			navfleches: true,
			slides: 2,
			path: "img/pensionnaires/",
			fleched: "#droite",
			flecheg: "#gauche"
		},

	initialize: function(options){
		this.setOptions(options);
		if(this.options.navfleches) this.creer_scroller(this.options.divprinc,this.options.slides,this.options.fleched,this.options.flecheg);
		this.regle_opacity(this.options.divprinc);
		this.regle_miniatures(this.options.divprinc,this.options.path);
	}, 

	creer_scroller : function(divprinc,slide,fleched,flecheg){

		var fenetre = $(divprinc).getElement('.fenetre');
		var gauch = $(divprinc).getElement(flecheg);
		var droit = $(divprinc).getElement(fleched);
		var currentslide = 1;
		var pos = 0;
		var offset = 576;

		// Rotation des miniatures

		var imgscroll = new Fx.Scroll2(fenetre, { 
   				offset: {'x': 0, 'y': 0},
   				transition: Fx.Transitions.Cubic.easeOut
			}).toLeft();

		// Action des fleches

		gauch.addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide == 1) return;
			currentslide--;
			pos += -(offset);
			imgscroll.start(pos);
		});

		droit.addEvent('click', function(event) { event = new Event(event).stop();
			if(currentslide >= slide) return;
			currentslide++;
			pos += offset;
			imgscroll.start(pos);
		});

	},

	regle_opacity : function(divprinc){

		var miniphotos = $(divprinc).getElements('.mini');
		var fenetreinfo = $(divprinc).getElement('.infocheval');
		var desc = $(divprinc).getElements('.desc');
		var photogroupe = $(divprinc).getElement('.photo-groupe');
		var fenetre = $(divprinc).getElement('.fenetre');

		miniphotos.setStyle('opacity', .5);
		fenetreinfo.setStyle('opacity', 0);
		desc.setStyle('opacity', 0);

		photogroupe.set('morph', {link : 'cancel'});

		fenetre.addEvents({

 			'mouseenter':function() { 
   				photogroupe.morph({
					'opacity' : 0
   				 });
   	  	 	},	

   			'mouseleave' : function() {
				photogroupe.morph({
					'opacity' : 1
    				});
			}
		});
	},

// Ajouter events aux miniatures

	regle_miniatures : function(divprinc,path){

		var miniphotos = $(divprinc).getElements('.mini');
		var fenetreinfo = $(divprinc).getElement('.infocheval');
		
		miniphotos.each(function(el) {
			el.set('morph', {link : 'cancel'});
			el.addEvents({

   				'mouseenter':function() { 
      					el.setStyle('opacity', 1);
      					
   						var ref = path + el.id + '-g.jpg';
						var photo = new Element('img', { 'src': ref });
   						var description = el.getElement('div');

   						fenetreinfo.empty();
   						photo.inject(fenetreinfo);
   						
						var desc = new Element('div').set('html', description.get('html')).inject(fenetreinfo);

   						fenetreinfo.morph({
     						'opacity' : 1
   						 });
  				 	},

  				 'mouseleave' : function() {
					el.setStyle('opacity', .5); 

					fenetreinfo.morph({
    						'opacity' : 0
    					});
   				} 
			  });
 		});

	}
});