// JavaScript Document
/* Background image animation functions */
var imageTransId = 0 ;
var images ; // Array of frontpage Images
var navigationId = 'frontPageImageNav' ;
var navigationClassName = 'frontPageImageNavLink' ;
var navigationClassNameSelected = 'frontPageImageNavLinkSelected'  ;

var ImageTransitionlength = 0 ;

var animationIntervalID ;


function gotoImageTransition(el) {
	var idx = el.attr("rel");	
	idx = parseInt(idx);
	setImageIndex(idx);
	setActiveThumbLink(idx);
	clearInterval(animationIntervalID);
	// alert("Setting animation to: "+idx);
	jQuery(".imageTransitionInstance").each(function(){
		jQuery(this).removeClass('transitionActive');
		jQuery(this).removeClass('transitionNext');
	});
	startImageTransition();
}


function getImageIndex(){
	return imageTransId ;
}

function setImageIndex(index){
	imageTransId = index ;
}

function getNextTransitionId(i,length) {
	if (i==(length-1)) {
		return 0 ;
	} else {
		return i+1 ;
	}
		
}

function getAnimationRules() {
	animrules = {"opacity":0,"-moz-opacity":0,"-filter-alpha":0} ;
	return animrules ;
}

// function startImageTransition(divId,  images) {
function startImageTransition() {						
	
	// images = getImages();	
	// var length = images.length ;
	var length = ImageTransitionlength ;
	i = getImageIndex() ;
	
	jQuery("#imageTrans-"+i).addClass('transitionActive');
	jQuery("#imageTrans-"+getNextTransitionId(i,length)).addClass('transitionNext');
	
	animationIntervalID = setInterval(function(){

			current = getImageIndex() ;
			
			next = getNextTransitionId(current,length);						
			
			var jqCurrent = jQuery("#imageTrans-"+current);
			var jqNext = jQuery("#imageTrans-"+next);
					
			jqNext.addClass('transitionNext');
			
			jqCurrent.animate(getAnimationRules(),1000,"linear",function(){
				/* removing the Active step */
				jQuery(this).removeClass('transitionActive');
				
				// Restoring opacity.				
				jQuery(this).css('opacity',1);
				jQuery(this).css('-moz-opacity',1);				
				jQuery(this).css('-khtml-opacity',1);
				
				jQuery("#imageTrans-"+next).removeClass('transitionNext');
				jQuery("#imageTrans-"+next).addClass('transitionActive');
				
				nextNext = getNextTransitionId(next,length); 
				jQuery("#imageTrans-"+nextNext).addClass('transitionNext');
				setActiveThumbLink(next);
				
			}) ;
			
			i = getNextTransitionId(current,length);
			setImageIndex(i) ;
		
	},5000);
}

/*
function animateImage(index) {
	images = getImages();
	var nextImage = images[index];
	var nextDivName = getNextDiv();
	jQuery("#"+nextDivName).css("background-image","url("+nextImage+")") ;	
	jQuery("#"+getCurrentDiv()).animate({"opacity":0},1500,"linear",function(){endAnimation();}) ;
	
	setActiveThumbLink(index);
	
}
*/
function setActiveThumbLink(index) {
	jQuery("."+navigationClassName).each(function(){		
		var i = jQuery(this).attr("rel") ;
		if (index != i) {
			jQuery(this).removeClass(navigationClassNameSelected);		
		} else {		
			jQuery(this).addClass(navigationClassNameSelected);
		}				
	});
}


function initTransition(divId) {	
	
	ImageTransitionlength = jQuery(".imageTransitionInstance").length;
	
	if (ImageTransitionlength == 0) {

		var images ;
		cmd = {mod:"page-elements",action:"getimages"}; 
		jQuery.ajax({
				data:cmd,
				dataType: "json",
				success: function(data,status,htmlReq) {					
						images = data;
						setImages(images);
						
				},
				error:function(hreq,status,errorThrown) {
						alert("Error in getTransitionImages: status: "+status);
				},
				complete:function(){}
		});	
		
	} else {
		/* Set number of images/divs and start transition */
		setImageNavLinks();
		startImageTransition(); // Starting transition.
	}
	
}

function setImages(img) {
	images = img ;	
	// var images = new Array();
	/*
	var imgholder = new Image();
	for (i=0;i<img.length;i++) {
		imgholder.src=img[i] ;
	}
	*/
	ImageTransitionlength = img.length;
	addImageTransitionDivs(img);
	setImageNavLinks();
	startImageTransition();
}



function addImageTransitionDivs(images) {

	l = images.length; 
	for (i=0;i<l;i++) {
		jQuery(".frontPageImageTransitionImages").append('<div class="imageTransitionInstance" id="imageTrans-'+i+'"><img src="'+images[i]+'" border="0" /></div>')	
	}
	
}


function getImages() {
	return images; 
}



function setImageNavLinks() {
	/*
	images = getImages() ;
	var length = images.length ;
	*/
	var length = ImageTransitionlength ;
	
	for (i = 0; i < length ; i++) {
		var classNames = navigationClassName;
		if (i == 0) {
			classNames = navigationClassName+ " "+ navigationClassNameSelected; 
		}
		jQuery("#"+navigationId).append('<a href="#" class="'+classNames+'" rel="'+i+'" id="img-'+i+'"></a>');
	}
	
	jQuery("."+navigationClassName).click(function(){
		gotoImageTransition(jQuery(this)); 
	});
	
}