var zh_portfolio = new Class({
	initialize: function(element,data) 
	{
		this.element=element;
		this.data=data;
		
		this.mode='cycleAll';
		this.set=0;
		this.page=0;
		this.delay=4000;
		
		this.build();
		
		this.showNext();
		this.timer=this.showNext.periodical(this.delay,this);
	},
	
	build : function()
	{
		var PortCommand=new Element('div', {id: 'PortCommand'});
		var PortDisplay=new Element('div', {id: 'PortDisplay'});
		PortCommand.inject(this.element);
		PortDisplay.inject(this.element);
		//alert(portfolios.portfolios[0].el);
		var el="";var el2="";this.dataPile=Array();k=0;
		for(i=0;i<this.data.portfolios.length;i++)
		{
			el+="<tr><td></td></tr>";
			for(j=0;j<this.data.portfolios[i].content.length;j++)
			{
				this.dataPile[k]=new Object();this.dataPile[k].i=i;this.dataPile[k].j=j;k++;
				el2+="<div class='PortInner' ><a href='"+this.data.portfolios[i].url+"'>"+this.data.portfolios[i].content[j].data+"</a></div>";
			}
		}
		
		PortCommand.set('html','<table id="PortTable" cellspacing="0" cellpadding="0">'+el+'</table>');
		PortDisplay.set('html',el2);
			
		this.listTableTd=$(this.element).getElements('#PortTable td');
		this.listTableTd.each(function(element) {
			element.addEvents({
				'mouseover' : function(){if(!element.hasClass('thover2')) element.addClass('thover');},
				'mouseout' : function(){if(!element.hasClass('thover2')) element.removeClass('thover');},
				'click' : function(){if(!element.hasClass('thover2')) this.goInPort(element); else this.mode='cycleAll'; }.bind(this)
			})
		}.bind(this));
		this.listInner = $$('div.PortInner');	
		this.listInner.each(function(element) {
			element.setStyles({'opacity':0,'visibility':'visible','z-index':0});
		});
		
		
		//this.listInner[0].setStyle('opacity',1);
		
	},
	
	showNext : function()
	{
		var focusOn = $(this.element).getElements('div.focusOn');
		if(focusOn.length != 0) 
		{
			this.fxOut=new Fx.Morph(focusOn[0],{duration: 500});
			if(this.page != this.lastPage) this.fxOut.start({'opacity':0,'z-index':0});
			focusOn[0].removeClass('focusOn');
			if(this.lastSet != this.set) {this.listTableTd[this.lastSet].removeClass('thover');this.listTableTd[this.lastSet].removeClass('thover2');}

		};
		

		this.fxIn=new Fx.Morph(this.listInner[this.page],{duration: 500});
		this.fxIn.start({'opacity':1,'z-index':10});
		this.listInner[this.page].addClass('focusOn');
		this.listTableTd[this.set].addClass('thover');
		this.listTableTd[this.set].addClass('thover2');
		
		this.lastPage=this.page;
		this.lastSet=this.set;
		
		if(this.data.portfolios[this.set].content.length==1 && this.mode=='cycleOne') {$clear(this.timer);return false;};
		
		switch(this.mode)
		{
			case 'cycleAll' : 
				this.page = (this.page + 1 >= this.dataPile.length ? 0 : this.page+1 );
				this.set=this.dataPile[this.page].i;
			break;
			case 'cycleOne' : 
				var out2=0;if(this.set>0) {for(i=this.set-1;i>=0;i--){out2+=this.data.portfolios[i].content.length;}}
				this.page = (this.page + 1 >=  out2+this.data.portfolios[this.set].content.length ? out2 : this.page+1 );
			break;
		}
		
	},
	
	stop : function()
	{
		$clear(this.timer);
		if(this.fxIn) this.fxIn.cancel();
		if(this.fxOut) this.fxOut.cancel();
	},
	
	goInPort : function(td)
	{
		this.stop();	
		//on retrouve le numéro du set
		var out1=false;for(i=0;i<this.listTableTd.length;i++){if(this.listTableTd[i]==td) out1=(out1 == false ? i : out1);}
		//on retrouve le numéro de la page
		var out2=0;if(out1>0) {for(i=out1-1;i>=0;i--){out2+=this.data.portfolios[i].content.length;}}

		this.mode='cycleOne';
		this.set=out1;
		this.page=out2;
		this.showNext();
		this.timer=this.showNext.periodical(this.delay,this);
		
	}

	
	
	
})