var $fadeImgHolder = null;
var fadeImgQueue = new Array;
var fadeImgCurrent = 0;

// Initiate and add new image object to the rotation queue
function fadeImageAdd(id){
	var $img = $(id);
	var prefix = $img.get('pictures_prefix');
	var sourceImages = $img.get('pictures').split('\n');

	// Insert new fade image into the rotation
	var newFadeImg = new Object;
	newFadeImg.id = id;
	newFadeImg.prefix = prefix;
	newFadeImg.pictures = new Array();
	newFadeImg.current = 0;
	fadeImgQueue.push(newFadeImg);

	// Preload all images from the list first
	for(var i=0; i<sourceImages.length; ++i){
		new Element('img', {
			'class': 'homepage_img',
			'src': prefix + sourceImages[i],
			'queue': fadeImgQueue.length - 1,
			'events': {
				'load': function(){
					fadeImgQueue[$(this).get('queue')].pictures.push(this.src);

					// Initiate timer for first load
					if($fadeImgHolder == null){
						$fadeImgHolder = $('fadeImgHolder');

						// Dynamic end-loop wait time, with range from 1s to 10s
						n = 10 - fadeImgQueue.length;
						setTimeout('fadeImgRotation()', (n < 2) ? 1000 : n * 1000);
					}
				}
			}
		});
	}
}

// Function dealing with rotation queue; Looping through it through time intervals
function fadeImgRotation(){
	var fadeImg = fadeImgQueue[fadeImgCurrent];
	if(fadeImg && (fadeImg.pictures.length > 0)){
		fadeImg.current = ++fadeImg.current % fadeImg.pictures.length;
		fadeImage(fadeImg.id, fadeImg.pictures[fadeImg.current]);
	}

	if(++fadeImgCurrent >= fadeImgQueue.length){
		fadeImgCurrent = 0;
		
		// Dynamic end-loop wait time, with range from 1s to 10s
		n = 10 - fadeImgQueue.length;
		setTimeout('fadeImgRotation()', (n < 2) ? 1000 : n * 1000);
	}else setTimeout('fadeImgRotation()', 1000);
}

// Fade image object <id> to provided source <src>
function fadeImage(id, src){
	var $img = $(id);
	var coordinate = $img.getCoordinates();
	$fadeImgHolder
		.setProperty('src', $img.src)
		.setStyles({
			opacity: 1,
			left: coordinate.left,
			top: coordinate.top,
			width: coordinate.width,
			height: coordinate.height
		});

	$img.src = src;
	$fadeImgHolder.tween('opacity', 0);
}

/***************************************************************************/

window.addEvent('domready', function(){
	$$('#menubar .menu:not([class$=current]) A')
		.addEvent('mouseover', function(el){
			$(this).morph({
				height: '84px',
				backgroundColor: '#2b3479',
				lineHeight: '84px'
			});
		})
		.addEvent('mouseout', function(el){
			$(this).morph({
				height: '42px',
				backgroundColor: '#abaec1',
				lineHeight: '42px'
			});
		});
	$$('.pic')
		.addEvent('mouseover', function(el){
			$(this).fade(0.5);
		})
		.addEvent('mouseout', function(el){
			$(this).fade(1);
		});
	$$('.block .menu A:not([class$=current])')
		.addEvent('mouseover', function(el){
			$(this).tween('background-color', '#abaec1', '#2b3479');
		})
		.addEvent('mouseout', function(el){
			$(this).tween('background-color', '#2b3479', '#abaec1');
		});
	$$('A.block-header:not([class$=current])')
		.addEvent('mouseover', function(el){
			$(this).morph('.block_button_over');
		})
		.addEvent('mouseout', function(el){
			$(this).morph('.block_button_norm');
		});
	$$('.block-header A:not([class$=current])')
		.addEvent('mouseover', function(el){
			$(this).tween('background-color', '#abaec1', '#2b3479');
		})
		.addEvent('mouseout', function(el){
			$(this).tween('background-color', '#2b3479', '#abaec1');
		});

	$$('IMG.rotation').each(function(item, index){
		fadeImageAdd(item.id);
	});
});