// JavaScript Document
var ThumbsContainer = false;
var ThumbsMaster = false;
var ThumbDetails = false;
var ThumbPopContainer = false;

function add_header_thumbs(){
	if( !thumbs )
		return false;
	ThumbsContainer = $('HeaderThumbsContainer');
	ThumbsMaster = $('HeaderThumbs');
	ThumbsMaster.addEvent('mouseleave', function(){ unload_thumb_details(); });
	if( !ThumbsContainer )
		return false;
	var counterX = 0;
	var counterY = 0;
	for( x=0;x<36;x++ ){
		if( thumbs[x][0] != '/' ){
			var container = new Element('a', {'href' : thumbs[x][3], 
											  'class' : 'item', 
											  'style' : 'top:' + counterY*100 + 'px; left:' + counterX*100 + 'px;' });
			container.store('thumbID', x);
			container.addEvent('mouseenter', function(){ load_thumb_details(this.retrieve('thumbID')); });
			var thumb = new Element('img', {'src' : thumbs[x][0], 'height' : 99, 'width' : 99});
			thumb.injectInside(container);
			container.injectInside(ThumbsContainer);
			thumbs[x][5] = counterX;
			thumbs[x][6] = counterY;
		}//end if thumbs[x]
		counterX++;
		if( counterX == 9 ){
			counterX = 0;
			counterY++;
		}
	}//end for
}

function load_thumb_details(id){
	if( thumbs[id][0] == '/' )
		return false;
	unload_thumb_details();
	ThumbDetails = new Element('div', {'class' : 'ThumbDetails'});
	if( thumbs[id][4] ){
		var obj = new Element('img', {'src' : thumbs[id][4]});
		obj.injectInside(ThumbDetails);
	}
	obj = new Element('p');
	obj2 = new Element('strong');
	obj2.innerHTML = thumbs[id][1];
	obj2.injectInside(obj);
	obj.injectInside(ThumbDetails);
	obj = new Element('p');
	obj.innerHTML = thumbs[id][2];
	obj.injectInside(ThumbDetails);
	obj = new Element('div', {'class' : thumbs[id][5] <= 6 ? 'ArrowLeft' : 'ArrowRight'});
	obj.injectInside(ThumbDetails);
	ThumbDetails.style.top = (thumbs[id][6]*100) - 27 + 'px';
	if( thumbs[id][5] <= 6 )
		ThumbDetails.style.left = (thumbs[id][5]*100) + 115 + 'px';
	else
		ThumbDetails.style.left = (thumbs[id][5]*100) - 346 + 'px';
	
	//Adding a new non-faded thumb
	ThumbPopContainer = new Element('a', {'href' : thumbs[id][3], 
									  'class' : 'item active', 
									  'style' : 'top:' + ((thumbs[id][6]*100)-2) + 'px; left:' + ((thumbs[id][5]*100)-2) + 'px;' });
	ThumbPopContainer.store('thumbID', x);
	ThumbPopContainer.addEvent('mouseleave', function(){ unload_thumb_details(); });
	var thumb = new Element('img', {'src' : thumbs[id][0], 'height' : 99, 'width' : 99});
	thumb.injectInside(ThumbPopContainer);
	ThumbPopContainer.injectInside(ThumbsMaster);
	
	ThumbDetails.injectInside(ThumbsMaster);
	ThumbsContainer.fade(0.2);
}
function unload_thumb_details(){
	if( ThumbDetails )
		ThumbDetails.dispose();
	if( ThumbPopContainer )
		ThumbPopContainer.dispose();
	ThumbsContainer.fade(1);
}

add_header_thumbs();