/**
 * Initialize global objects and variables.
 *
 */
var numCols = 3;
var colLenght = new Array(numCols);
var offsetCol = new Array(numCols);

/**
 * Initialize columns that contain the ctGallery effect and fade the first 
 * elements of the element loop.
 *
 */
function loadCtgallery() {
	var col1 = document.getElementById('col1');
	var col2 = document.getElementById('col2');
	var col3 = document.getElementById('col3');
	
	if(col1 && col1.className.search('ctgallery') > 0) {
		galleryElements = getElementsByClass('ctCol','div',col1);
		colLenght['col1'] = galleryElements.length;
		offsetCol['col1'] = Math.floor(Math.random() * colLenght['col1']);
		for(i=0;i<galleryElements.length;i++) {
			galleryElements[i].setAttribute('id','col1element'+i);
		}
		ctgalleryNextElement('col1');
	}
	if(col2 && col2.className.search('ctgallery') > 0) {
		galleryElements = getElementsByClass('ctCol','div',col2);
		colLenght['col2'] = galleryElements.length;
		offsetCol['col2'] = Math.floor(Math.random() * colLenght['col2']);
		for(i=0;i<galleryElements.length;i++) {
			galleryElements[i].setAttribute('id','col2element'+i);
		}
		ctgalleryNextElement('col2');
	}
	if(col3 && col3.className.search('ctgallery') > 0) {
		col3.effectIsRunning = 1;
		galleryElements = getElementsByClass('ctCol','div',col3);
		colLenght['col3'] = galleryElements.length;
		offsetCol['col3'] = Math.floor(Math.random() * colLenght['col3']);
		for(i=0;i<galleryElements.length;i++) {
			galleryElements[i].setAttribute('id','col3element'+i);
		}
		ctgalleryNextElement('col3');
	}
}

/**
 * Fade to next element.
 *
 * @param: col - Column containing the looped elements.
 */
function ctgalleryNextElement(col) {
	selectedCol = document.getElementById(col);
	
	var nextElement = offsetCol[col]+1;
	var actElement = offsetCol[col];
	if(nextElement >= colLenght[col]) {
		nextElement = 0;
	}
	
	if(!document.getElementById(col+'element'+nextElement).effectIsRunning 
		&& !document.getElementById(col+'element'+actElement).effectIsRunning) {
	
		document.getElementById(col+'element'+nextElement).effectIsRunning = 1;
		new Effect.Appear(col+'element'+nextElement, {afterFinish: effect_done});
		
		document.getElementById(col+'element'+actElement).effectIsRunning = 1;
		new Effect.Fade(col+'element'+actElement, {afterFinish: effect_done});
		
		offsetCol[col] = nextElement;
	}
}

/**
 * Fade to previous element.
 *
 * @param: col - Column containing the looped elements.
 */
function ctgalleryPrevElement(col) {
	selectedCol = document.getElementById(col);
	
	var prevElement = offsetCol[col]-1;
	var actElement = offsetCol[col];
	if(prevElement < 0) {
		prevElement = colLenght[col]-1;
	}
	
	if(!document.getElementById(col+'element'+actElement).effectIsRunning 
		&& !document.getElementById(col+'element'+prevElement).effectIsRunning) {
	
		document.getElementById(col+'element'+actElement).effectIsRunning = 1;
		new Effect.Fade(col+'element'+actElement, {afterFinish: effect_done});
		
		document.getElementById(col+'element'+prevElement).effectIsRunning = 1;
		new Effect.Appear(col+'element'+prevElement, {afterFinish: effect_done});
		
		offsetCol[col] = prevElement;
	}
}

/**
 * Select tags by class name.
 *
 * @param: CssClassName - Subject class name.
 * @param: tagName - Name of tag that which is selected by 'CssClassName'.
 * @param: node - Startingpoint in the DOM tree.
 */
function getElementsByClass(CssClassName,tagName,node) {
	elements = node.getElementsByTagName(tagName);
	selection = new Array();
	for(i=0;i<elements.length;i++) {
		if(elements[i].className == CssClassName) {
			selection.push(elements[i]);
		}
	}
	return selection;
}

/**
 * set effect as stoped after effect is finished for this element
 * effect lock callback function.
 *
 * @param: effect - oject with effect attached.
 */
function effect_done(effect) {
	effect.element.effectIsRunning = 0;
}