/* A workaround for IE issues in mootools 1.2.1
* - Recreates FX.Scroll() but utilises 1.2.0's getPosition/getOffset routines.
*/
 
Fx.Scroll2 = new Class({
 
    'Extends': Fx.Scroll,
 
    'styleString': Element.getComputedStyle,
    'styleNumber': function(element, style) {
        return this.styleString(element, style).toInt() || 0;
    },
    'borderBox': function(element) {
        return this.styleString(element, '-moz-box-sizing') == 'border-box';
    },
    'topBorder': function(element) {
        return this.styleNumber(element, 'border-top-width');
    },
    'leftBorder': function(element) {
        return this.styleNumber(element, 'border-left-width');
    },
    'isBody': function(element) {
        return (/^(?:body|html)$/i).test(element.tagName);
    }, 
    'toElement': function(el) {
        var offset   = {x: 0, y: 0};
        var element  = $(el);
       
        if (this.isBody(element)) {
            return offset;
        }
        var scroll = element.getScrolls();
               
        while (element && !this.isBody(element)){
            offset.x += element.offsetLeft;
            offset.y += element.offsetTop;
           
            if (Browser.Engine.gecko){
                if (!this.borderBox(element)){
                    offset.x += this.leftBorder(element);
                    offset.y += this.topBorder(element);
                }
                var parent = element.parentNode;
                if (parent && this.styleString(parent, 'overflow') != 'visible'){
                    offset.x += this.leftBorder(parent);
                    offset.y += this.topBorder(parent);
                }
            } else if (Browser.Engine.trident || Browser.Engine.webkit){
                offset.x += this.leftBorder(element);
                offset.y += this.topBorder(element);
            }
 
            element = element.offsetParent;
            if (Browser.Engine.trident) {
                while (element && !element.currentStyle.hasLayout) {
                    element = element.offsetParent;
                }
            }
        }
        if (Browser.Engine.gecko && !this.borderBox(element)){
            offset.x -= this.leftBorder(element);
            offset.y -= this.topBorder(element);
        }
       
        var relative = this.element;
        var relativePosition = (relative && (relative = $(relative))) ? relative.getPosition() : {x: 0, y: 0};
        var position = {x: offset.x - scroll.x, y: offset.y - scroll.y};
       
        return this.start(position.x - relativePosition.x, position.y - relativePosition.y);
    }
});

/* 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 showPhoto = new Class({	

	Implements: [Options, Events],

		options: {
			divprinc: "show-photo",
			navfleches: true,
			slides: 3,
			path: "img/camps2010-photos/"
		},

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

	creer_scroller : function(divprinc,slide){

		var fenetre = $(divprinc).getElement('.fenetre');
		var gauch = $(divprinc).getElement('#gauche');
		var droit = $(divprinc).getElement('#droite');
		var currentslide = 1;
		var pos = 0;
		var offset = 655;

		// 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('.photocamps');
		var photogroupe = $(divprinc).getElement('.photo-groupe');
		var fenetre = $(divprinc).getElement('.fenetre');

		miniphotos.setStyle('opacity', .5);
		fenetreinfo.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('.photocamps');
		
		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 });

   						fenetreinfo.empty();
   						photo.inject(fenetreinfo);

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

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

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

	}
});