// JavaScript Document
// Tab Class
function itemPanel(_ID, _CAT, _IMG_URL){
	this.HMTL_ID = _ID;
	this.CAT = _CAT;
	this.IMG_URL = _IMG_URL;
	this.checkCat = function(_CAT){
		return (_CAT=="")||(_CAT=="*")||(_CAT==this.CAT);
	}
	this.loadIMG = function(){
		if((this.IMG_URL==undefined)||(this.IMG_URL==null)){return;}
		if(HTML(this.HMTL_ID+'_IMG').src.toString().split(this.IMG_URL).length!=2){
			HTML(this.HMTL_ID+'_IMG').src = this.IMG_URL;
		}
	}
}
// RP ==> Reference Panel
var panels = new Array();
var iRP = 0;
function scroller(_width, _height,_widthItem){
	// Properties
	this.WIDTH = _width;
	this.HEIGHT = _height;
	this.ITEM_WIDTH = _widthItem;
	this.items_ARRAY = new Array();
	this.filter_ARRAY = new Array();
	this.oef = new INTERVAL(50);
	this.oef.addEventListener(IntervalEvent.onStep,"update",this);
	// RP ==> Reference Item
	this.i_RI = 0;
	this.x_RI = 0;
	// Items Per Page
	this.IPP = 4;
	// Functions
	this.addItem = HTML_SCROLLER.addItem;
	this.render = HTML_SCROLLER.render;
	this.nextItem = HTML_SCROLLER.nextItem;
	this.prevItem = HTML_SCROLLER.prevItem;
	this.nextPage = HTML_SCROLLER.nextPage;
	this.prevPage = HTML_SCROLLER.prevPage;
	this.filterCat = HTML_SCROLLER.filterCat;
	this.update = HTML_SCROLLER.update;
	this.estimateX = HTML_SCROLLER.estimateX;
	
	this.update();
}
function easing(startVal, endVal, speed, maxVal, minVal){
	if(startVal==endVal){ return 0;}
	minVal = isNaN(minVal)? 1 : minVal;
	var easingVal = (endVal-startVal)/speed;
	easingVal = (startVal<endVal)? Math.ceil(easingVal):Math.floor(easingVal);
	
	if(Math.abs(easingVal)<minVal){
		if(Math.abs(startVal-endVal)>minVal){
			return	(endVal>startVal)? minVal : -minVal;
		}else{
			return 	(endVal-startVal);
		}
	}
	return (startVal<endVal)? Math.min(easingVal,maxVal): Math.max(easingVal,-maxVal);
	//easingVal = Math.min(Math.abs(easingVal),maxVal);
	
}
var HTML_SCROLLER = {}
HTML_SCROLLER.render = function(){
	// Render Direction [ FW | BW ]
	var renderDir = "FW";
	var totalItems = this.filter_ARRAY.length;
	var refX = this.x_RI;
	var xEnd = refX+totalItems*this.ITEM_WIDTH;
	if(xEnd<this.WIDTH){
		refX+= (totalItems*this.ITEM_WIDTH);
	}
	if(totalItems<=this.IPP){refX=0;}
	// Index on the most right ITEM;
	var LI = null;
	for(var iItem=0; iItem<totalItems;iItem++){
		var iRef = (renderDir == "FW")? (this.i_RI+iItem):(this.i_RI+LI-iItem);
		iRef = (iRef+totalItems)%totalItems;
		
		var iRelX = (renderDir == "FW")? (iItem):((LI-iItem));
		var tmpX = refX+(iRelX)*this.ITEM_WIDTH;
		
		if((tmpX+this.ITEM_WIDTH)>=this.WIDTH){
			LI = (LI==null)? iItem:LI;
			renderDir = "BW";
		}
		try{
			HTML(this.filter_ARRAY[iRef].HMTL_ID).setX(tmpX);
			var itemVisibility = ((tmpX+this.ITEM_WIDTH)>0)&&(tmpX<this.WIDTH);
			if(itemVisibility){
				this.filter_ARRAY[iRef].loadIMG();
			}
		}catch(e){ alert(iRef+","+renderDir+"==>"+iRelX+" at "+tmpX+"px;\n"+(LI-iItem)+","+this.i_RI+";"+totalItems);}
	}
}
HTML_SCROLLER.filterCat = function(_CAT){
	this.filter_ARRAY = new Array();
	for(var iItem=0; iItem<this.items_ARRAY.length;iItem++){
		var tmpItem = this.items_ARRAY[iItem];
		if(tmpItem.checkCat(_CAT)){
			this.filter_ARRAY.push(tmpItem);
			HTML(tmpItem.HMTL_ID).show();
		}else{
			HTML(tmpItem.HMTL_ID).hide();
		}
	}
	this.i_RI = 0;
	this.x_RI = 0;
	this.render();
}
HTML_SCROLLER.update = function(){
	//this.render(); return;
	//alert("HTML_SCROLLER.update();");
	this.x_RI += easing(this.x_RI,0,10,50,5);
	this.render();
	//HTML('msg').innerHTML = 'this.x_RI:'+this.x_RI+","+easing(this.x_RI,0,10,50,5);
	//this.oef.stop();return;
	if(this.x_RI != 0){
		this.oef.start();
	}else{
		this.oef.stop();
	}
}
HTML_SCROLLER.nextItem = function(){
	var totalItems = this.filter_ARRAY.length;
	if(totalItems<=this.IPP){return;}
	this.i_RI = (this.i_RI+1)%totalItems;
	this.render();
}
HTML_SCROLLER.prevItem = function(){
	var totalItems = this.filter_ARRAY.length;
	if(totalItems<=this.IPP){return;}
	this.i_RI = (totalItems+this.i_RI-1)%totalItems;
	this.render();
}
HTML_SCROLLER.nextPage = function(){
	var totalItems = this.filter_ARRAY.length;
	if(totalItems<=this.IPP){return;}
	this.x_RI = this.estimateX((this.i_RI+this.IPP)%totalItems,1);
	this.i_RI = (this.i_RI+this.IPP)%totalItems;
	this.update();
}
HTML_SCROLLER.prevPage = function(){
	var totalItems = this.filter_ARRAY.length;
	if(totalItems<=this.IPP){return;}
	this.x_RI = this.estimateX((totalItems+this.i_RI-this.IPP)%totalItems,-1);
	this.i_RI = (totalItems+this.i_RI-this.IPP)%totalItems;
	this.update();
}
HTML_SCROLLER.estimateX = function(_iItem,dir){
	if(_iItem==this.i_RI){ return this.x_RI; }
	var totalItems = this.filter_ARRAY.length;
	var tmpX_Left = this.x_RI + ((_iItem<this.i_RI)?  (_iItem-this.i_RI)  :  ((_iItem-this.i_RI)-totalItems)   )*this.ITEM_WIDTH;
	var tmpX_Right = this.x_RI + ((_iItem>this.i_RI)?  (_iItem-this.i_RI)  :  (totalItems+_iItem-this.i_RI)    )*this.ITEM_WIDTH;
	// Limit Max Left and Right Pos so scroller doesnt show empty
	var totalItems_WIDTH = totalItems*this.ITEM_WIDTH;
	if((tmpX_Right-(totalItems_WIDTH-this.ITEM_WIDTH) )>0){
		tmpX_Right = (totalItems_WIDTH-this.ITEM_WIDTH);
	}
	// Since Gide item is left most have more tolerance
	if((tmpX_Left+totalItems_WIDTH+this.WIDTH)<this.WIDTH){
		tmpX_Left = this.WIDTH-totalItems_WIDTH;
	}
	if(!isNaN(dir)){
		return (dir==1)? tmpX_Right:tmpX_Left;
	}
	return (Math.abs(tmpX_Left)>Math.abs(tmpX_Right))? tmpX_Right: tmpX_Left;
}
HTML_SCROLLER.addItem = function(_ID, _CAT, _IMG_URL){
	this.items_ARRAY.push(new itemPanel(_ID, _CAT, _IMG_URL));
	this.filter_ARRAY.push(new itemPanel(_ID, _CAT, _IMG_URL));
}