/******************************************************************************************************************
 * @file : window.js***********************************************************************************************
 * @autor : romain lenzotti (Rom makita)***************************************************************************
 * @date : 14/10/2009**********************************************************************************************
 * @version : 0.3**************************************************************************************************
 ******************************************************************************************************************/
var PortFolio = Class.create();
var PF = '';
PortFolio.prototype = {
	win:	'',
	sidebar:'',
	sidebarMask:'',
	visio:	'',
	loader:'',
	menu:	'',
	title: 	'PortFolio',
	link:	'',
	className: 'PortFolio-window',
	Diaporama:'',
	//statut--------------------------------------------------------------------------------------------------
	isLoading: false,
	galeries:[],
	data:[],
	//--------------------------------------------------------------------------------------------------------
	//Constructeur--------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	initialize: function(mybody, link, obj){
		if(Object.isUndefined(mybody)) mybody = document.getElementsByTagName('body')[0];
		this.win = new slidewindow (mybody);
			
		this.link = link;
		
		if(!Object.isUndefined(obj.menu)) 		this.menu = obj.menu;
		
		if(!Object.isUndefined(obj.title)) 		this.title = obj.title;
		
		//creation des liens sur les boutons référencé par le nom de classe portfolio-btn
		var elem = document.getElementsByClassName('portfolio-btn');
		for(i = 0; i < elem.length; i++){
			elem[i].observe('click', function(evt){evt.stop();this.show()}.bind(this));	
		}
		
	},
	//--------------------------------------------------------------------------------------------------------
	//Methods-------------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	/** 
	 * @brief : cache le portfolio
	 */
	hide: function(){
		
		this.win.hide();
		this.galeries = [];
		this.data = [];
		try{
			Event.stopObserving(document, 'mousemove', this.onmouse_move_bind);
		}catch(er){
			
		}
		this.Diaporama.remove();
		
	},
	/**
	 * @brief : apparition du portfolio
	 */
	show: function(){
		
		//assignement du titre de la page
		this.win.setTitle(this.title);
		this.setMenu(this.menu);
		var loader = $(Builder.node('div', {className:'portfolio-loader'}));
		
		this.win.appendChild(loader);
		this.loader = loader;
		
		this.win.setFooterElement(this.menu);
		this.win.setAfterShow(function(){
									  	
												
													new Ajax.Request(this.link,	{
																				method:'post',
																				parameters: 'op=get_list_galeries',
																				onComplete: this.onCompleteLoadingList.bind(this),
																			});
												
										
										
									   }.bind(this));
		this.win.setAfterHide(function(){this.hide();}.bind(this));
		this.win.className(this.className);
		this.win.show();
	},

	//--------------------------------------------------------------------------------------------------------
	//Events--------------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------	
	/**
	 * 
	 */
	onCompleteLoadingList: function(result){

		this.galeries = [];
		this.data = [];
		this.isLoading = true;
		
		this.win.removeChild(this.loader);
		
		this.sidebarMask = 	$(Builder.node('div',{className:'portfolio-sidebar-mask'}));
		this.sidebar = 		$(Builder.node('div', {className:'portfolio-sidebar'}));
		this.visio =		$(Builder.node('div', {className:'portfolio-visio'}));
				
		this.sidebarMask.appendChild(this.sidebar);
		this.win.appendChild(this.sidebarMask);
		this.win.appendChild(this.visio);
		
		this.visio.setStyle({width: (this.win.div_corps.getWidth() - this.visio.cumulativeOffset().left - 15) +"px"});
		
		this.Diaporama = new Diaporama(this.visio);

		try{
			var obj = result.responseText.evalJSON();
		}catch(er){
			Alert.setOnReset(function(){this.hide();}.bind(this));
			
			Alert.show('Erreur...', 'Une erreur est survenue lors du chargement de la liste des galeries.', 'CLOSE');
			return;
		}

		for(var i = 0; i < obj.length; i++){
			if(!obj[i].pictures.length) continue;
			
			var galery = new Galery();
			galery.setTitle(obj[i].title);
			
			galery.observe('click', this.onClick_Galery.bind(this));

			galery.setPictures(obj[i].pictures);

			this.sidebar.appendChild(galery.toElement());
			galery.id = 'galery-'+this.galeries.length;
			this.galeries.push(galery);
			
			this.data.push(obj[i].pictures);
			
			galery.appear(i);
		}

		if(!this.galeries[0].isLoading) this.galeries[0].observe('complete', function(){this.Diaporama.setPictures(this.data[0]);}.bind(this));
		else this.Diaporama.setPictures(this.data[0]);
		
		
		if(this.sidebar.getHeight() > this.sidebarMask.getHeight()){

			this.offset_bottom = this.sidebar.getHeight() - this.sidebarMask.getHeight();
			this.onmouse_move_bind = this.onMouseMove_sidebar.bind(this);
			Event.observe(this.sidebarMask, 'mousemove', this.onmouse_move_bind);
			
		}
		
	},
	
	onClick_Galery: function(evt, galery){
		this.Diaporama.setPictures(this.data[galery.id.replace("galery-","")]);
	},
	
	onMouseMove_sidebar: function(evt){

		var MouseY = Event.pointerY(evt) - this.sidebarMask.positionedOffset().top;
		
		if(MouseY < 0) return;
		if(MouseY > this.sidebarMask.getHeight()) return;

		var ratio = (this.sidebarMask.getHeight() / this.sidebar.getHeight());
		var decaltop = (-(MouseY) * ratio) + 20;
		if(decaltop >= 0) decaltop = 0;
		
		this.sidebar.setStyle({top: decaltop+'px'});
	},
	//--------------------------------------------------------------------------------------------------------
	//Setteurs && Getteurs------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	setMenu: function(id){
		
		//récuperation du menu
		try{
			
			var a_items = $(id).getElementsByTagName('a');
			this.menu = Builder.node('div', {className:'portfolio-menu'});
			
			for(var i = 0; i < a_items.length; i++){
				var a_tmp = Builder.node('a', {href:a_items[i].href});
				a_tmp.innerHTML = a_items[i].innerHTML;
				this.menu.appendChild(a_tmp);
			}
			
		}catch(er){

		}

	}
}

//--------------------------------------------------------------------------------------------------------
//Galery (gestion des galeries partie droite du portfolio-------------------------------------------------
//--------------------------------------------------------------------------------------------------------
var Galery = Class.create();
Galery.prototype = {
	element:		'',
	title:			'',
	pictures:		'',
	sizePicture:	0,
	marginRight:	0,
	borderWidth:	2,
	width:			0,
	nbLoad:			0,
	isLoading:		false,
	limits:			10,
	//--------------------------------------------------------------------------------------------------------
	//Contructeur---------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	initialize: function(){
		
		this.title = 		$(Builder.node('h1', {className:'galeries-title'}));
		this.pictures = 	$(Builder.node('div', {className:''}));
		this.maskPictures = $(Builder.node('h1', {className:'galeries-content-pic'}, [this.pictures]));
		this.element = 		$(Builder.node('div', {className:'portfolio-galery'}, [this.title, this.maskPictures]));
		
		this.hide();
	},
	//--------------------------------------------------------------------------------------------------------
	//Methods-------------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	appear:function(){
		this.element.show();
	},
	hide:function(){
		this.element.hide();
	},
	toElement: function(){
		return this.element;
	},
	
	observe: function(eventName, handler){
		
		eventName = eventName.toLowerCase();

		switch(eventName){
			case 'complete': 
				this.oncomplete_call = handler;
				break;
			case 'click':
				this.onclick_call = handler;
				this.element.observe('click', function(evt){this.onclick_call.call(this, evt, this)}.bind(this));
				break;
			case 'mouseover':
				break;
		}
		
	},
	//--------------------------------------------------------------------------------------------------------
	//Events--------------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	onLoadPicture: function(picture){
		if(!this.sizePicture) this.sizePicture = this.maskPictures.getHeight();
		
		//redimenssionnement des images
		var dim = picture.resize(this.sizePicture - this.borderWidth * 2, this.sizePicture - this.borderWidth * 2);
		picture.setStyle({marginTop : ((this.sizePicture - this.borderWidth*2 - dim.height) /2) +'px'});
		
		this.pictures.appendChild(picture.getElement());
		
		this.width += dim.width;
		
		if(this.maskPictures.getWidth() < this.width) picture.setOpacity(0);
		else picture.setOpacity(0.9 - (this.width / this.maskPictures.getWidth()));
		
		this.nbLoad++;
						
		if(this.nbLoad == this.nbPictures){
			isLoading = true;
			if(Object.isFunction(this.oncomplete_call)) {this.oncomplete_call.call(this);}
			
			//this.width += (this.nbLoad -1) * this.marginRight;

			if(this.maskPictures.getWidth() < this.width){
				this.pictures.setStyle({width: this.width+'px'});
			}
		}
		

	},
	
	//--------------------------------------------------------------------------------------------------------
	//Setteurs && Getteurs------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	
	setTitle: function(t){
		$(this.title).innerHTML = t;
	},
	
	
	setPictures: function(array){
		
		this.nbPictures = array.length;
		
		for(var i = 0; i < array.length; i++){

try{
			var pict = new Picture();
			pict.setTitle(array[i].title);

			var sender = this;

			pict.observe('complete', function(evt){sender.onLoadPicture(this)});	
			pict.setUrl(array[i].link);
}catch(er){alert(er); return};
		}
		
	}
}


/*********************************************************************************************************************
**********************************************************************************************************************
**********************************************************************************************************************/
var Diaporama = Class.create();

Diaporama.prototype = {
	cadre:		'',
	mask:		'',
	miniature:	'',
	
	width:		0,
	height:		0,
	borderWidth:2,
	paddingRight:5,
	
	widthMask:	0,
	timer:		'',
	duration: 	10,
	array:'',
	current_picture: 0,
	count_diapo:1,
	stage:		0,
	
	//--------------------------------------------------------------------------------------------------------
	//Constructeurs-------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	initialize: function(myBody){
		
		this.content_pict = $(Builder.node('div', {className:'diapo-picture-one'}));
		this.title_pict	=	$(Builder.node('div', {className:'diapo-title-picture'}));
		this.btn_next	=	$(Builder.node('div', {className:'diapo-btn-next'}));
		this.btn_previous=	$(Builder.node('div', {className:'diapo-btn-previous'}));
		
		this.cadre =		$(Builder.node('div', {className:'diapo-main-frame'},[this.content_pict, this.title_pict, this.btn_next, this.btn_previous]));
		this.miniature = 	$(Builder.node('div', {className:'diapo-main-bar'}));
		this.mask = 		$(Builder.node('div', {className:'diapo-mask-miniature'}, this.miniature));

		this.mask.appendChild(this.miniature);
		myBody.appendChild(this.cadre);
		myBody.appendChild(this.mask);
		
		this.height = $(this.mask).getHeight();
		this.width = (2/3) * this.height;
		
		this.btn_next.observe('click', this.onClick_Next.bind(this));
		this.btn_previous.observe('click', this.onClick_Previous.bind(this));
		
		this.widthMask = this.mask.getWidth();
		this.maxPictures = this.widthMask % (this.width + this.borderWidth * 2 + this.paddingRight);
		
		
		//creation du timer
		this.timer = new Timer(this.onTick_Timer.bind(this), this.duration);
	},
	//--------------------------------------------------------------------------------------------------------
	//Methods-------------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	/**
	 * @brief: affichage de l'image courrante à partir de son ID interne
	 * @param[in] id : identifiant de l'image
	 */
	printPictureID: function(id){
		if(Object.isUndefined(id)) id = 0;
		if(!this.stage) this.stage = this.cadre.getDimensions();
		
		
		if(id < 0  || id >= this.array.length){
			//if(this.array.length > 1) this.timer = new PeriodicalExecuter(this.onTick_Timer.bind(this), this.duration);
			return false;
		}
		
		//arret du timer le temps de l'execution
		this.timer.stop();
		
		this.content_pict.innerHTML ='';

		var picture = new Picture();

		picture.hide();
		
		function onComplete(pict){

				
				if(!(pict.width < this.stage.width && pict.height < this.stage.height)) {
					
					var dim = pict.resize(this.stage.width, this.stage.height);
					pict.setStyle({marginTop: ((this.stage.height - dim.height)/2) + 'px'});
				}
				else pict.setStyle({marginTop: ((this.stage.height - pict.height)/2) + 'px'});
				
				this.content_pict.appendChild(pict.getElement());
				
				picture.show();
				pict.isResize = true;
				
				if(this.array.length > 1){

					this.timer.start();
					
					//ajustement de la sidebar
					var position = this.array[this.current_picture].getElement().cumulativeOffset().left - this.miniature.cumulativeOffset().left;
					var left = this.mask.positionedOffset().left - this.miniature.positionedOffset().left;
					var right = left + this.widthMask;
		
					if(right < position + this.width){
						this.miniature.setStyle({left: (-position + this.widthMask - (this.width + this.borderWidth * 2 + this.paddingRight) * 2.5 + this.borderWidth)+'px'});
					}
		
					if(position < left){
						position = -position + this.width + this.borderWidth * 2.5 + this.paddingRight;
						if(position > 0) position= 0;
						this.miniature.setStyle({left: (position)+'px'});
					}
				}
											
		}
		
		picture.observe('complete', onComplete.bind(this));	
		
		picture.setUrl(this.array[id].getUrl());

		//changemement de classe
		this.array[this.current_picture].setClassName('');
		this.array[id].setClassName('pict-selected');
		this.current_picture = id;
		
		var title = this.array[id].getTitle().split('.');
		this.title_pict.innerHTML = this.array[id].getTitle().replace("."+title[title.length - 1],'');
		
		return true;
	},
	/**
	 * @brief : reinitialisation de la diapo
	 */
	remove: function(){
		this.miniature.innerHTML = '';
		this.content_pict.innerHTML = '';
		this.array = [];
		this.current_picture = 0;
		
		try{
			this.timer.stop();
		}catch(er){}
	},
	//--------------------------------------------------------------------------------------------------------
	//Events--------------------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	onClick_Previous: function(evt){
		
		this.printPictureID((this.current_picture - 1) % this.array.length);
		this.count_diapo = this.current_picture;
		this.count_diapo++;
	},
	onClick_Next: function(evt){
		this.printPictureID((new Number(this.current_picture) +1) % this.array.length);
		this.count_diapo = new Number(this.current_picture) + 1;
	},
	onClick_Image: function(evt, picture){
		this.printPictureID(picture.getId().replace('pict-',''));
		this.count_diapo = picture.getId().replace('pict-','').toNumber();
		this.count_diapo++;
	},	
	
	onTick_Timer:function(timer){

		this.printPictureID(this.count_diapo % this.array.length);
		this.count_diapo++;
		
	},
	//--------------------------------------------------------------------------------------------------------
	//Setteurs && getteurs------------------------------------------------------------------------------------
	//--------------------------------------------------------------------------------------------------------
	setPictures:function(array){
		if(!array.length) return;
		
		//réinitalisation des var;
		this.remove();
		this.current_picture = 0;
		//ajout des images
		function onComplete(picture){
			
			dim = picture.resize(this.width, this.height - 4);
			picture.setStyle({marginTop: ((this.height -4 - dim.height)/2) +'px'});
			picture.show();
		}
		
		for(var i = 0; i < array.length; i++){
			
			var pict = new Picture();
			
			pict.setTitle(array[i].title);
			pict.setId('pict-'+i);
			pict.hide();
			pict.observe('complete', onComplete.bind(this));
			pict.observe('click', this.onClick_Image.bind(this));	
			
			pict.setUrl(array[i].link);
			
			this.array.push(pict);
		
			this.miniature.appendChild(pict.getElement());
		}
		
		this.miniature.setStyle({width: i * (this.width + 15) +'px'});
		
		//chargement de la première image
		this.printPictureID();
		
	}
		
}

/**
 *@brief : Gestion des diapositives d'une galerie photo. Projet original : diapositif JS
 * réécrit pour l'utilisation en mono
 *@autor : lenzotti romain
 *@date : debut du dev -> 26/09/08 | fin -> 25/11/08 | UP -> 18/05/09
 *@ver : 0.1
 */
var DiapoLite = Class.create();

DiapoLite.prototype = {
	//conteneur
	element:'',
	timer: '',				//Contient le pointeur du timer
	cadres:'',
	mask:'',
	data:'',
	link:'',
	current_item:0,
	duration:20,
	//---------------------------------------------------------------------------------
	//initialisation-------------------------------------------------------------------
	//---------------------------------------------------------------------------------
	initialize: function(myBody, link, nbCadres, obj){
		this.element = $(myBody);
		
		this.cadres = new Array();
		
		for(var i = 0; i < nbCadres; i++) {
			this.cadres.push({element: $(Builder.node('div', {className:'diapo-lite-cadres cadres-'+i}))});
			myBody.appendChild(this.cadres[i].element);
			this.cadres[i].dimensions = $(this.cadres[i].element).getDimensions();
		}
		this.mask = $(Builder.node('div', {className:'diapo-lite-mask'}));	
		myBody.appendChild(this.mask);
		
		new Ajax.Request(link,{
						 				method:'post',
										parameters:'op=get_list_pictures',
										onComplete:(this.onCompleteLoadingList).bind(this)
									});
		

		if(!Object.isUndefined(obj.onclick)) this.element.observe('click', obj.onclick);
		
		this.timer = new Timer(this.onTick_nextItem.bind(this), this.duration);
	},
	//---------------------------------------------------------------------------------
	//Event----------------------------------------------------------------------------
	//---------------------------------------------------------------------------------
	
	onCompleteLoadingList: function(result){

		try{
			var obj = result.responseText.evalJSON();
		}catch(er){
			Alert.setOnReset(function(){this.hide();}.bind(this));
			
			Alert.show('Erreur...', 'Une erreur est survenue lors du chargement de la liste des galeries.', 'CLOSE');
			return;
		}
		

		this.data = new Array();
		for(var i = 0; i < obj.length; i++){	 
			this.data.push(new Picture());
			this.data[i].setClassName('pictlite-'+i);
			this.data[i].observe('complete', this.onCompleteLoading_Picture.bind(this));
			this.data[i].setUrl(obj[i].link);
		}
	},
	
	nbLoading:0,
	isInit:false,
	onCompleteLoading_Picture: function(picture){

		//var current_id = new Number(picture.className.replace('pictlite-',''));
		
		if(this.nbLoading >= this.cadres.length){

			if(!this.isInit){
				this.timer.start();
				this.isInit = true;
			}
			return;
		}
		this.cadres[this.nbLoading].element.appendChild(picture.getElement());
		var dim = picture.resize(this.cadres[this.nbLoading].dimensions.width, this.cadres[this.nbLoading].dimensions.height);
		if(dim.height < this.cadres[this.nbLoading].dimensions.height) picture.setStyle({marginTop: ((this.cadres[this.nbLoading].dimensions.height - dim.height - 2)/2)+'px'});
		this.nbLoading++;
	},
	
	onTick_nextItem:function(pe){

		this.timer.stop();
		
		this.current_item++;
		this.current_item %= (this.data.length-1);

		
		for(var i = 0; i < this.cadres.length; i++){
			
			var picture = this.data[(this.current_item + i) % (this.data.length-1)];
			this.cadres[i].element.innerHTML = '';
			
			this.cadres[i].element.appendChild(picture.getElement());

			var dim = picture.resize(this.cadres[i].dimensions.width, this.cadres[i].dimensions.height);
			if(dim.height < this.cadres[i].dimensions.height) picture.setStyle({marginTop: ((this.cadres[i].dimensions.height - dim.height - 2)/2)+'px'});
			
		}
		
		this.timer.start();

	}
	
}