var ViewBox = {};

ViewBox.Init = function () {

	var listArray = $('#eventsViewBox .viewBoxList');
	var navArray = $('#eventsViewBox .viewBoxNav a');
	
	$.each( listArray, function(indexInArray, valueOfElement) {
		$(this).children().not(':first').hide();
	});
	
	$('#eventsViewBox .viewBoxNav li a').mouseover(function() {
	
	    //Update to get the correct index. 
	    //Needs further attention. Quick hack that does the job
	    
	    var index = jQuery.inArray(this, navArray);
	    var cur = jQuery('.currentPage').html();
	    
	    if (typeof cur === 'string' && cur === '1'){
	        index = index;
	    }else if (typeof cur === 'string' && cur === '2'){
	        index = index + 5;
	    }else if (typeof cur === 'string' && cur === '3'){
	        index = index + 10;
	    }   
	    
		$(this).parent().addClass('active').siblings().removeClass('active');
		$('#eventsViewBox .viewBoxList .item').eq(index).show().addClass('active').siblings().hide().removeClass('active');
	});
} 

$(document).ready(function() { 
	ViewBox.Init();
});