var OPACITY_ANIMATION_HIDDING=-1;
var OPACITY_ANIMATION_SHOWING=1;
var OPACITY_ANIMATION_NONE=0;

function animateShow(elementId,timeInSecs) {
	var frames=timeInSecs*10;
	var step=1/frames;
	step=Math.round(step*1000)/1000
	var obj=document.getElementById(elementId);
	obj.style.visibility="visible";
	obj.opacityAnimation=OPACITY_ANIMATION_SHOWING;
	obj.opacityEnd=1;
	if (!obj.style.opacity)
		obj.style.opacity=0;
	___animator__animate_visibility(elementId,step,100);
}

function animateHide(elementId,timeInSecs) {
	var frames=timeInSecs*10;
	var step=1/frames;
	step=Math.round(step*1000)/1000
	var obj=document.getElementById(elementId);
	obj.style.visibility="visible";
	obj.opacityAnimation=OPACITY_ANIMATION_HIDDING;
	obj.opacityEnd=0;
	if (!obj.style.opacity)
		obj.style.opacity=1;
	___animator__animate_visibility(elementId,step,100);
}

function ___animator__animate_visibility(elementId, step, timeOut) {
	var obj=document.getElementById(elementId);
	if (obj==null || step==0 || obj.opacityAnimation==OPACITY_ANIMATION_NONE) 
		return;
	var initialOpacity=parseFloat(obj.style.opacity);
	initialOpacity=initialOpacity+obj.opacityAnimation*step;
	var last=false;
	if ((obj.opacityAnimation<0 && initialOpacity<obj.opacityEnd) 
		|| (obj.opacityAnimation>0 && initialOpacity>obj.opacityEnd)) {
		initialOpacity=obj.opacityEnd;
		last=true;
		//alert(obj.style.opacity);
	}
	obj.style.opacity=initialOpacity;
	obj.style.filter="alpha(opacity="+(initialOpacity*100)+")";
	if(last && obj.opacityEnd==0) {
		obj.style.visibility="hidden";
		obj.opacityAnimation=OPACITY_ANIMATION_NONE;
	}
	if (!last)
		setTimeout('___animator__animate_visibility("'+elementId+'", '+step+', '+timeOut+')',timeOut);
} 

function slideUsingLeftMargin(elementId, startMargin, endMargin, timeInSecs) {
	var length=endMargin-startMargin;
	var steps=timeInSecs*10;
	var stepSize=length/steps;
	//alert(stepSize);
	setTimeout('_____animator_slied_using_margin(true, "'+elementId+'", '+startMargin+', '+endMargin+', '+stepSize+', 100)',100);
}

function _____animator_slied_using_margin(left, elementId, currentMargin, endMargin, step, timeOut) {
	var obj=document.getElementById(elementId);
	if (obj==null || step==0) 
		return;
	//alert(currentMargin);
	currentMargin=currentMargin+step;
	var last=false;
	if ((step<0 && currentMargin<endMargin) || (step>0 && currentMargin>endMargin)) {
		currentMargin=endMargin;
		last=true;
	}
	if (left)
		obj.style.marginLeft=currentMargin;
		
	if (!last)
		setTimeout('_____animator_slied_using_margin('+left+', "'+elementId+'", '+currentMargin+', '+endMargin+', '+step+', '+timeOut+')',timeOut);
	
}

function GridAnimator(elementId) {
	this.elementId=elementId;
	this.animationType=0;
}

GridAnimator.prototype.ANIMATION_SLIDE_USING_RIGHT=0;
GridAnimator.prototype.ANIMATION_SLIDE_USING_LEFT=1;
GridAnimator.prototype.ANIMATION_SLIDE_USING_TOP=2;
GridAnimator.prototype.ANIMATION_SLIDE_USING_BOTTOM=3;

GridAnimator.prototype.calculateRowSize=true;
GridAnimator.prototype.calculateColSize=false;

GridAnimator.prototype.spacing=new Array(10,10); //Horizontal, Vertical
GridAnimator.prototype.insets=new Array(10,10,10,0); //top, right, bottom, left

GridAnimator.prototype.lineAnimationStartInterval=500;
GridAnimator.prototype.elementAnimationStartInterval=250;
GridAnimator.prototype.opacityEffect=true;
GridAnimator.prototype.animationInterval=0.5;
GridAnimator.prototype.framesPerSecond=10;
GridAnimator.prototype.maxOpacity=1;
GridAnimator.prototype.minOpacity=0;

GridAnimator.prototype.createHGrid=function(cols) {
	var obj=document.getElementById(this.elementId);
	this.cols=cols;
	this.rows=0;
	this.objects=new Array();
	var childs=obj.childNodes;
	var rowPos=0;
	this.prefix="slide_"+new Date().getTime()+"_";
	var row=new Array();
	for (var i=0;i<childs.length;i++){
		var tmp=childs.item(i);
		if (tmp.nodeType==1) {
			if (rowPos==cols)
				rowPos=0;
			var id=this.prefix+i;
			tmp.id=id;
			tmp.setAttribute("id",id);
			row.push(tmp);
			if (++rowPos==cols) {
				this.objects.push(row);
				this.rows++;
				row=new Array();
			}
		}
	}
	if (rowPos<cols) {
		this.objects.push(row);
		this.rows++;
	}
	if (this.calculateRowSize) {
		for (var j=0;j<this.objects.length;j++) {
			var rowHeight=0;
			row=this.objects[j];
			for (var i=0;i<row.length;i++) {
				var tmp=row[i];
				if (rowHeight<tmp.scrollHeight)
					rowHeight=tmp.scrollHeight;
			}
			for (var i=0;i<row.length;i++) {
				var tmp=row[i];
				tmp.style.height=rowHeight+"px";
			}
		}
	}
	var gridWidth=0;
	var gridHeight=0;
	for (var j=0;j<this.objects.length;j++) {
		row=this.objects[j];
		if (row.length>0)
			gridHeight=gridHeight+row[0].clientHeight;
		else 
			gridHeight=gridHeight+0;
		var rowWidth=0;
		for (var i=0;i<row.length;i++) {
			var tmp=row[i];
			rowWidth=rowWidth+tmp.clientWidth;
		}
		if (rowWidth>gridWidth)
			gridWidth=rowWidth;
	}
	this.gridWidth=gridWidth+(this.spacing[0]*(cols-1));
	this.gridHeight=gridHeight+(this.spacing[1]*(this.objects.length-1));
	obj.style.width=(this.gridWidth+20+this.insets[1]+this.insets[3])+"px";
	obj.style.height=(this.gridHeight+20+this.insets[0]+this.insets[2])+"px";
}

GridAnimator.prototype.slideIn=function() {
	var lines;
	var left=this.insets[3];
	var top=this.insets[0];
	var obj=document.getElementById(this.elementId);
	var zoneWidth=obj.clientWidth;
	var zoneHeight=obj.clientHeight;
	var deltaLeft=0;
	var deltaTop=0;
	var deltaVisibility=this.maxOpacity-this.minOpacity;;
	//top, right, bottom, left
	switch(this.animationType) {
		case this.ANIMATION_SLIDE_USING_RIGHT: 
			lines=this.createRowLines();
			left=left+zoneWidth;
			deltaLeft=zoneWidth*(-1);
			break;
		case this.ANIMATION_SLIDE_USING_LEFT:
			lines=this.createRowLines();
			left=zoneWidth*(-1)-left;
			deltaLeft=zoneWidth;
			break;
		case this.ANIMATION_SLIDE_USING_TOP:
			lines=this.createColLines();
			top=zoneHeight*(-1)-top;
			deltaTop=zoneHeight;
			break;
		case this.ANIMATION_SLIDE_USING_BOTTOM:
			lines=this.createColLines();
			top=top+zoneHeight;
			deltaTop=zoneHeight*(-1);
			break;
	}
	this.prepareGrid(left,top);
	var timeout=1000/this.framesPerSecond;
	for (var i=0;i<lines.length;i++){
		var elementIds='new Array (';
		var line=lines[i];
		for (var j=0;j<line.length;j++) {
			if (j>0) 
				elementIds=elementIds+", ";
			if (line[j]==null) {
				elementIds=elementIds+"null";
			} else {
				elementIds=elementIds+'"'+line[j]+'"';
			}
		}
		elementIds=elementIds+")";
		var cmd='____GridAnimator_AnimateLine(false, '+elementIds+','+deltaLeft+', '+deltaTop+', '+deltaVisibility+', '+
		this.animationInterval+','+this.elementAnimationStartInterval+', '+timeout+')';
		setTimeout(cmd,this.lineAnimationStartInterval*i);
	}
}

GridAnimator.prototype.slideOut=function() {
	var lines;
	var left=this.insets[3];
	var top=this.insets[0];
	var obj=document.getElementById(this.elementId);
	var zoneWidth=obj.clientWidth;
	var zoneHeight=obj.clientHeight;
	var deltaLeft=0;
	var deltaTop=0;
	var deltaVisibility=this.minOpacity-this.maxOpacity;;
	//top, right, bottom, left
	switch(this.animationType) {
		case this.ANIMATION_SLIDE_USING_RIGHT: 
			lines=this.createRowLines();
			deltaLeft=zoneWidth;
			break;
		case this.ANIMATION_SLIDE_USING_LEFT:
			lines=this.createRowLines();
			deltaLeft=zoneWidth*(-1);
			break;
		case this.ANIMATION_SLIDE_USING_TOP:
			lines=this.createColLines();
			deltaTop=zoneHeight*(-1);
			break;
		case this.ANIMATION_SLIDE_USING_BOTTOM:
			lines=this.createColLines();
			deltaTop=zoneHeight;
			break;
	}
	this.prepareGrid(left,top);
	var timeout=1000/this.framesPerSecond;
	for (var i=0;i<lines.length;i++){
		var elementIds='new Array (';
		var line=lines[i];
		for (var j=0;j<line.length;j++) {
			if (j>0) 
				elementIds=elementIds+", ";
			if (line[j]==null) {
				elementIds=elementIds+"null";
			} else {
				elementIds=elementIds+'"'+line[j]+'"';
			}
		}
		elementIds=elementIds+")";
		var cmd='____GridAnimator_AnimateLine(true, '+elementIds+','+deltaLeft+', '+deltaTop+', '+deltaVisibility+', '+
		this.animationInterval+','+this.elementAnimationStartInterval+', '+timeout+')';
		setTimeout(cmd,this.lineAnimationStartInterval*i);
	}
}

GridAnimator.prototype.prepareGrid=function(left,top) {
	var tmpTop=top;
	for (var j=0;j<this.objects.length;j++){
		var tmpLeft=left;
		var row=this.objects[j];
		var rowMax=0;
		for (var i=0;i<row.length;i++){
			var tmp=row[i];
			tmp.style.left=tmpLeft+"px";
			tmp.style.top=tmpTop+"px";
			tmpLeft=tmpLeft+tmp.clientWidth+this.spacing[0];
			var rowSize=tmp.clientHeight+this.spacing[1];
			if (rowSize>rowMax)
				rowMax=rowSize;
		}
		tmpTop=tmpTop+rowMax;
	}
}

GridAnimator.prototype.createColLines=function(){
	var lines=new Array(this.cols);
	for (var i=0;i<lines.length;i++)
		lines[i]=new Array(this.rows);
	for (var j=0;j<this.objects.length;j++){
		var row=this.objects[j];
		for (var i=0;i<row.length;i++){
			var linesX=i;
			var linesY=j;
			lines[linesY][linesX]=row[i].getAttribute("id");
		}
	}
	return lines;
}

GridAnimator.prototype.createRowLines=function() {
	var lines=new Array(this.rows);
	for (var i=0;i<lines.length;i++)
		lines[i]=new Array(this.cols);
	for (var j=0;j<this.objects.length;j++){
		var row=this.objects[j];
		for (var i=0;i<row.length;i++){
			var linesX=j;
			var linesY=i;
			lines[linesX][linesY]=row[i].getAttribute("id");
		}
	}
	return lines;
}

function ____GridAnimator_AnimateLine(inv, elementIds,deltaLeft, deltaTop, deltaVisibility, time,startDelay, timeOut){
	var stepLeft=____GridAnimator_GetStepSize(deltaLeft,time, timeOut);
	var stepTop=____GridAnimator_GetStepSize(deltaTop,time, timeOut);
	var stepVisibility=____GridAnimator_GetStepSize(deltaVisibility,time, timeOut);
	for (var i=0;i<elementIds.length;i++) {
		var index=inv?elementIds.length-i-1:i;
		var elementId=elementIds[index];
		if (elementId!=null) { 
			var obj=document.getElementById(elementId);
			if (obj!=null) {
				var currentLeft=obj.offsetLeft;
				var endLeft=currentLeft+deltaLeft;
			
				var currentTop=obj.offsetTop;
				var endTop=currentTop+deltaTop;
			
				var currentVisibility=obj.style.opacity;
				if (currentVisibility==null || currentVisibility=="")
					currentVisibility=0;
			//if (isNaN(currentVisibility))
				currentVisibility=parseFloat(currentVisibility);
				
				var endVisibility=currentVisibility+deltaVisibility;
	
				var cmd='____GridAnimator_AnimateElement("'+elementId+'", '+
						''+currentLeft+', '+endLeft+', '+stepLeft+', '+
						''+currentTop+', '+endTop+', '+stepTop+', '+
						''+currentVisibility+', '+endVisibility+', '+stepVisibility+', '+
						''+timeOut+')';
				setTimeout(cmd,startDelay*i);
			}
		}
	}
}

function ____GridAnimator_GetStepSize(delta, time, timeOut){
	var frames=time*(1000/timeOut);
	var steps=delta/frames;
	return steps;
}

function ____GridAnimator_AnimateElement(elementId, 
	currentLeft, endLeft, stepLeft, 
	currentTop, endTop, stepTop, 
	currentVisibility, endVisibility, stepVisibility,
	timeOut) {
	var startFTime=new Date().getTime();
	var lastStep=true;
	var obj=document.getElementById(elementId);
	if (obj==null) return;
	if (stepLeft!=0) {
		currentLeft=____GridAnimator_CalculateCurrent(currentLeft, endLeft, stepLeft);
		if (currentLeft!=endLeft)
			lastStep=false;
		obj.style.left=currentLeft+"px";
	}
	if (stepTop!=0) {
		currentTop=____GridAnimator_CalculateCurrent(currentTop, endTop, stepTop);
		if (currentTop!=endTop)
			lastStep=false;
		obj.style.top=currentTop+"px";
	}
	if (stepVisibility!=0) {
		currentVisibility=____GridAnimator_CalculateCurrent(currentVisibility, endVisibility, stepVisibility);
		if (currentVisibility!=endVisibility)
			lastStep=false;
		obj.style.opacity=currentVisibility;
		obj.style.filter="alpha(opacity="+(currentVisibility*100)+")";
	}
	if (!lastStep) {
		var cmd='____GridAnimator_AnimateElement("'+elementId+'", '+
					''+currentLeft+', '+endLeft+', '+stepLeft+', '+
					''+currentTop+', '+endTop+', '+stepTop+', '+
					''+currentVisibility+', '+endVisibility+', '+stepVisibility+', '+
					''+timeOut+')';
		var deltaT=new Date().getTime()-startFTime;
		var nTime=timeOut-deltaT;
		if (nTime<0)
			nTime=0;
		setTimeout(cmd,nTime);
	}
}

function  ____GridAnimator_CalculateCurrent(current, end, step){
	var ret=current+step;
	if ((step<0 && ret<end) || (step>0 && ret>end)) {
		ret=end;
	}
	return ret;
}