//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var GalleryAuto = new Class ({
//=====================================================================================================
	options: {
		target:null,
		duration:3000,
		wait:300,
		durationTransition:500,
		galleryWidth:300,
		galleryHeight:300,
		legend:'',
		galleryWidthConstaint:null,
		typeOfConstaint:null
	},
	//=====================================================================================================
	initialize: function(imgs,options){
		this.setOptions(options);
		if (this.target = $(this.options.target)){
			//
			if (this.options.galleryWidthConstaint){
				this.options.galleryHeight = Math.round(this.options.galleryHeight*(this.options.galleryWidthConstaint/this.options.galleryWidth));
				this.options.galleryWidth = this.options.galleryWidthConstaint;
			}
			//
			this.images = [];
			this.imageNbr = imgs.length;
			this.currentImg = 0;
			//
			this.hiddenPlace = new Element('div',{'id':'hiddenPlace'});
			this.hiddenPlace.setStyles({'position':'absolute','top':'-10px','overflow':'hidden','width':'1px','height':'1px'});
			this.hiddenPlace.inject(this.target);
			//
			this.target.setStyles({'position':'relative','width':this.options.galleryWidth+'px','height':this.options.galleryHeight+'px'});
			this.contImgTop = new Element('div',{'id':'contImgTop'});
			this.contImgBottom = new Element('div',{'id':'contImgBottom'});
			this.contImgTop.setStyles({'position':'absolute','top':0,'width':this.options.galleryWidth+'px','height':this.options.galleryHeight+'px'});
			this.contImgBottom.setStyles({'position':'absolute','top':0,'width':this.options.galleryWidth+'px','height':this.options.galleryHeight+'px'});
			this.contImgBottom.inject(this.target);
			this.contImgTop.inject(this.target);
			this.imgOn = this.contImgTop;
			var ref = this;
			this.fx = new Fx.Tween(this.contImgTop,{duration:this.options.durationTransition,onComplete:function(){ref.timer(ref.options.duration)}});
			this.fx.set('opacity',0);
			//
			for (i=0; i<this.imageNbr; i++) this.images[i] = {'img':imgs[i],'instance':null,'loaded':false};
			for (i=0; i<this.imageNbr; i++) this.loading(i);
			this.timer(this.options.wait);
		}
	},
//=====================================================================================================
	timer:function(duration){
		this.afficheImg.delay(duration,this);
	},
//=====================================================================================================
	afficheImg:function(){
		if (this.images[this.currentImg].loaded){
			if (this.imgOn == this.contImgTop){
				this.imgOn.empty();
				this.images[this.currentImg].instance.inject(this.imgOn);
				this.imgOn = this.contImgBottom;
				this.fx.start('opacity',1);
			}else{
				this.imgOn.empty();
				this.images[this.currentImg].instance.inject(this.imgOn);
				this.imgOn = this.contImgTop;
				this.fx.start('opacity',0);
			}
			this.currentImg=(this.currentImg < (this.imageNbr-1))?this.currentImg+1:0;
		}else{
			this.timer(this.options.wait);
		}
	},
//=====================================================================================================
	loading:function(i){
		var ref = this;
		this.images[i].instance = new Asset.image(this.images[i].img, {
					id: 'bandeau_img_'+i,
					onload: function(){ 
						ref.images[i].loaded = true;
						ref.images[i].instance.inject(ref.hiddenPlace);
						var size = ref.images[i].instance.getSize();
						if (ref.options.typeOfConstaint == 'crop'){
							var box = ref.resolveBoxCrop(ref.options.galleryWidth,ref.options.galleryHeight,size.x,size.y);
							var x = (ref.options.galleryWidth-box[0])/2;
							var y = (ref.options.galleryHeight-box[1])/2;
							ref.images[i].instance.setStyles({'width':box[0]+'px','height':box[1]+'px','margin-top':y+'px','margin-left':x+'px'});
						}else{
							var box = ref.resolveBox(ref.options.galleryWidth,ref.options.galleryHeight,size.x,size.y);
							var x = (ref.options.galleryWidth-box[0])/2;
							var y = (ref.options.galleryHeight-box[1])/2;
							ref.images[i].instance.setStyles({'width':box[0]+'px','height':box[1]+'px','margin-top':y+'px','margin-left':x+'px'});
						}
					}
				});
	},
//=====================================================================================================
	resolveBox:function(boxW,boxH,elW,elH){
		boxW+=0;
		boxH+=0;
		elW+=0;
		elH+=0;
		var result;
		var boxRatio = (boxW < boxH)?boxW/boxH:boxH/boxW;
		var elRatio = (elW < elH)?elW/elH:elH/elW;
		//
		var biggestSideBox = (boxW > boxH) ? 0 : 1;
		var biggestSideEl = (elW > elH) ? 0 : 1;
		//
		if (biggestSideEl == biggestSideBox){
			if (elRatio < boxRatio){
				result = [
						((biggestSideEl==0)?boxW:Math.round(elW*(boxH/elH))),
						((biggestSideEl==0)?Math.round(elH*(boxW/elW)):boxH)
						];
			}else{
				result = [((biggestSideEl)?boxW:Math.round(elW*(boxH/elH))),((biggestSideEl)?Math.round(elH*(boxW/elW)):boxH)];
			}
		}else{
			if (biggestSideEl){
				result = [Math.round(elW*(boxH/elH)),boxH];
			}else{
				result = [boxW,Math.round(elH*(boxW/elW))];
			}
		}
		return result;
	},
//=====================================================================================================
	resolveBoxCrop:function(boxW,boxH,elW,elH){
		boxW+=0;
		boxH+=0;
		elW+=0;
		elH+=0;
		var result;
		var boxRatio = (boxW < boxH)?boxW/boxH:boxH/boxW;
		var elRatio = (elW < elH)?elW/elH:elH/elW;
		//
		var biggestSideBox = (boxW > boxH) ? 0 : 1;
		var biggestSideEl = (elW > elH) ? 0 : 1;
		//
		if (biggestSideEl == biggestSideBox){
			if (elRatio < boxRatio){
				result = [
						((!biggestSideEl)?Math.round(elW*(boxH/elH)):boxW),
						((!biggestSideEl)?boxH:Math.round(elH*(boxW/elW)))
						];
			}else{
				result = [
						((!biggestSideEl)?boxW:Math.round(elH*(boxW/elW))),
						((!biggestSideEl)?(Math.round(elH*(boxW/elW))):boxH)
						];
			}
		}else{
			
			if (biggestSideEl){
				result = [boxW,Math.round(elH*(boxW/elW))];
			}else{
				result = [Math.round(elW*(boxH/elH)),boxH];
			}
		}
		return result;
	}
//=====================================================================================================
});
GalleryAuto.implement(new Options);
//////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var Gallery = new Class({
	//=====================================================================================================
	options: {
		contenaire :null,
		script:null,
		screen:null,
		images : [],
		contTnDirection: 'horizontal',
		contTnWidth:0,
		contTnHeight:0,
		contWidth:0,
		contHeight:0,
		galleryWidth:300,
		galleryHeight:300,
		legend:null,
		constraint:null
	},
	//=====================================================================================================
	initialize: function(options){
		this.setOptions(options);
		//
		if (this.options.galleryWidthConstaint){
			this.options.galleryHeight = Math.round(this.options.galleryHeight*(this.options.galleryWidthConstaint/this.options.galleryWidth));
			this.options.galleryWidth = this.options.galleryWidthConstaint;
		}
		//
		this.contenaire = $(this.options.contenaire);
		if (!this.options.screen){
			this.screen = new Element('div',{'class':'gallery-screen'});
			this.screen.inject(this.contenaire);
		}else{
			this.screen = $(this.options.screen);
		}
		//
		this.screen.setStyles({'width':this.options.galleryWidth+'px','height':this.options.galleryHeight+'px'});
		//
		this.legend = new Element('div',{'class':'gallery-legend'});
		this.legendBack = new Element('div',{'style':'position:absolute;background-color:#FFF;'});
		this.legendBack.inject(this.screen);
		this.legend.inject(this.screen);
		var pl = this.legend.getStyle('padding-left');
		var pr= this.legend.getStyle('padding-right');
		var ww = this.options.galleryWidth-pl.toInt()-pr.toInt();
		this.legend.setStyles({'width':ww+'px'});
		this.legendBack.setStyles({'width':this.options.galleryWidth+'px','opacity':0.7});
		//
		this.tnWarper = new Element('div',{'class':'gallery-tn-warper'});
		this.tnCont = new Element('div',{'class':'gallery-tn-cont'});
		this.btPrev = new Element('a',{'class':'gallery-bt-prev'});
		this.btNext = new Element('a',{'class':'gallery-bt-next'});
		//
		this.img1 = new Element('div',{'class':'gallery-img'});
		this.img2 = new Element('div',{'class':'gallery-img'});
		this.img1.inject(this.screen);
		this.img2.inject(this.screen);
		this.btPrev.set('text','Precedente');
		this.btNext.set('text','Suivante');
		this.btPrev.inject(this.tnWarper);
		this.btNext.inject(this.tnWarper);
		this.tnCont.inject(this.tnWarper);
		//
		this.tnWarper.inject(this.contenaire);
		this.tnWarper.setStyles({'width':this.options.galleryWidth+'px'});
		this.buildMenu();
	},
	//---------------------------------------------------------------------------------------
	buildMenu:function(){
		this.tn = [];
		this.contWidth =this.options.galleryWidth;
		this.contHeight =this.options.galleryHeight;
		decalage=0;
		for (var i=0; i<this.options.images.length;i++){
			this.tn[i] = new Element('a',{'class':'gallery-tn','rel':i});
			src = this.options.images[i].path+ this.options.images[i].image+'/'+ this.options.images[i].tn;
			tn = new Element('img',{'src':src,'class':'gallery-tn-img','rel':i});
			tn.inject(this.tn[i]);
			this.tn[i].inject(this.tnCont);
			if (this.options.contTnDirection == 'vertical'){
				this.tn[i].set('styles',{'top':decalage+'px'});
				decalage+=this.tn[i].getSize().y+this.tn[i].getStyle('margin-top').toInt()+this.tn[i].getStyle('margin-bottom').toInt();
			}else{
				this.tn[i].set('styles',{'left':decalage+'px'});
				decalage+=this.tn[i].getSize().x+this.tn[i].getStyle('margin-left').toInt()+this.tn[i].getStyle('margin-right').toInt();
			}
			this.tn[i].addEvent('click',this.loadImage.bindWithEvent(this));
		}
		if (this.options.contTnDirection == 'vertical'){
				this.tnCont.setStyle('height',decalage+'px');
			}else{
				this.tnCont.setStyle('width',decalage+'px');
			}
		this.tailleContTn = (this.options.contTnDirection == 'vertical') ? this.tnCont.getSize().y : this.tnCont.getSize().x;
		this.tailleWarperTn = (this.options.contTnDirection == 'vertical') ? this.tnWarper.getSize().y : this.tnWarper.getSize().x;
		if (this.tailleContTn > this.tailleWarperTn){
			//-------------------------------------------------------------------
			this.btPrev.set('styles',{'display':'block'});
			this.btNext.set('styles',{'display':'block'});
			if (this.options.contTnDirection == 'vertical'){
				this.moveFX= new Fx.Tween(this.tnCont, {property: 'top', duration: 1000});
			}else{
				this.moveFX= new Fx.Tween(this.tnCont, {property: 'left', duration: 5000});
			}	
			this.btPrev.addEvent('mouseover',this.movePrev.bindWithEvent(this));
			this.btNext.addEvent('mouseover',this.moveNext.bindWithEvent(this));
			this.btPrev.addEvent('mouseout',this.stopMove.bindWithEvent(this));
			this.btNext.addEvent('mouseout',this.stopMove.bindWithEvent(this));
			
			if (this.options.contTnDirection == 'vertical'){
				this.origine = this.btPrev.getSize().y;
				this.tnCont.setStyle('top',this.origine);
			}else{
				this.origine = this.btPrev.getSize().x;
				this.tnCont.setStyle('left',this.origine);
			}
			border = (this.options.contTnDirection == 'vertical')?this.tnWarper.getStyle('border-bottom-width').toInt()+this.tnWarper.getStyle('border-top-width').toInt():this.tnWarper.getStyle('border-left-width').toInt()+this.tnWarper.getStyle('border-right-width').toInt();
			this.limiteNext = (this.tailleWarperTn-(border+this.tailleContTn))-this.origine;
			this.limitePrev =  this.origine;
			//-------------------------------------------------------------------
		}else{
			this.btPrev.set('styles',{'display':'none'});
			this.btNext.set('styles',{'display':'none'});
		}
	this.loadImageRequest(0);
	},
	//---------------------------------------------------------------------------------------
	loadImage:function(e){
		im = e.target.getProperty('rel');
		this.loadImageRequest(im);
	}
	,
	//---------------------------------------------------------------------------------------
	loadImageRequest:function(im){
		img = this.options.images[im];
		this.currentLegend = this.options.legend[im];
		paramImg = '&path='+this.options.images[im].path+'&image='+this.options.images[im].image;
		paramImg += '&width='+this.options.galleryWidth+'&height='+this.options.galleryHeight;
		if(this.options.script){
			//
			if(this.request)this.request.cancel();
			if(!Browser.Engine.trident){
				if(this.safe)this.safe.destroy();
				this.safe = new SafeLoading(this.screen,{alpha:0.5,background_color:'#000'});
			 }
			//
			if (!this.currentImg){
				this.currentImg = this.img1;
			}
			this.currentImg.empty();
			//
			this.request = new Request.HTML ({
				url:this.options.script,
				data:'constraint='+this.options.constraint+'&galerie_id='+this.options.gallery_id+paramImg,
				method:'post',
				evalScripts:true,
				update:this.currentImg,
				onComplete:function(){this.preloadImage();}.bind(this)
				}).send();
		}
	},
	//---------------------------------------------------------------------------------------
	preloadImage:function(){
		im = this.currentImg.getElements('img')[0].getProperty('src');
		var myImages = new Asset.images([im], {
			onComplete: function(){this.afficheImg();}.bind(this)
		});
	},
	//---------------------------------------------------------------------------------------
	afficheImg:function(){
		if(!Browser.Engine.trident) this.safe.destroy();
		var size=this.currentImg.getSize();
		var top = Math.round((this.contHeight-size.y)/2)+this.screen.getStyle('padding-top').toInt();
		var left= Math.round((this.contWidth-size.x)/2)+this.screen.getStyle('padding-left').toInt();
		this.currentImg.setStyles({'top':top+'px','left':left+'px'});
		this.img1.setStyle('z-index',10);
		this.img2.setStyle('z-index',10);
		this.currentImg.setStyle('z-index',11);
		new Fx.Tween(this.currentImg, {property: 'opacity', duration: 1000}).start(1);;
		this.currentImg = (this.currentImg == this.img1)?this.img2:this.img1;
		new Fx.Tween(this.currentImg, {property: 'opacity', duration: 1000}).start(0);
		//
		this.legend.empty();
		var leg = this.currentLegend.split('::');
		if (leg.length > 1){
			var l = '<strong>'+leg[0]+'</strong>'
			l += '<span>'+leg[1]+'</span>'
		}else{
			var l = '<span>'+leg[0]+'</span>'
		}
		this.legend.set('html',l);
		this.legend.setStyle('z-index',15);
		var hh = this.legend.getSize().y.toInt();
		this.legendBack.setStyles({'height':hh+'px','z-index':14,'bottom':0});
	},
	//---------------------------------------------------------------------------------------
	stopMove:function(e){
		this.moveFX.cancel();
	},
	//---------------------------------------------------------------------------------------
	moveNext:function(e){
		pos = (this.options.contTnDirection == 'vertical')? this.tnCont.getPosition(this.tnWarper).y:this.tnCont.getPosition(this.tnWarper).x;
		distance = this.limiteNext - (pos);
		this.moveFX.options.duration= Math.abs(distance) * 3;
		this.moveFX.start(this.limiteNext);
	},
	//---------------------------------------------------------------------------------------
	movePrev:function(e){
		pos = (this.options.contTnDirection == 'vertical')? this.tnCont.getPosition(this.tnWarper).y:this.tnCont.getPosition(this.tnWarper).x;
		distance = this.limitePrev + (pos);
		this.moveFX.options.duration= Math.abs(distance) * 3;
		this.moveFX.start(this.limitePrev);
	}
	//---------------------------------------------------------------------------------------
});
Gallery.implement(new Options);
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////






