var currPanel = Array();
currPanel[1] = 0;
var totalPanels = Array()
totalPanels[1] = 0;

$(document).ready(function() {
	InitPanel(1);

	$("a#introSWF").fancybox({
		'overlayShow':	true,
		'overlayOpacity':0.5,
		'speedIn':	0, 
		'speedOut':	0,
		'width':800,
		'height':450,
		'type':'swf'
	});


	$(".menuBox_main_list li").mouseover(function(){
		var id = $(this).attr('id').substr(5);
		if(parseInt(id)){
			var new_id = parseInt(id)-1;
			$('#menu_'+id).css('backgroundImage', 'url('+base_url+'images/menu-arrow-hover.png)');
			$('#menu_'+new_id).css('backgroundImage', 'url('+base_url+'images/menu-arrow-previous.png)');
		}
	}).mouseout(function(){
		var id = $(this).attr('id').substr(5);
		if(parseInt(id)){
			var new_id = parseInt(id)-1;
			$('#menu_'+id).css('backgroundImage', '');
			$('#menu_'+new_id).css('backgroundImage', '');
		}
	});
	
	$("a#introSWF").click();

});

function InitPanel(i) {	
    //Get the height of the first item   
    $('#mask'+i).css({'height':$('#panel'+i+'_0').height()});     
       
    //Calculate the total width - sum of all sub-panels width   
    //Width is generated according to the width of #mask * total of sub-panels   
    $('#panel'+i).width(parseInt($('#mask'+i).width() * $('#panel'+i+' div').length));   
       
	// Get max num of panels
	totalPanels[i] = $('#panel'+i+' div').length-1;
	
	if(totalPanels[i]>=0){

		//Set the sub-panel width according to the #mask width (width of #mask and sub-panel must be same)   
		$('#panel'+i+' div').width($('#mask'+i).width());   
		   
		//Get all the links with rel as panel   
		$('#next'+i).click(function () {
			if (totalPanels[i] > currPanel[i]) {
				currPanel[i]++;
			} else {
				currPanel[i]=0;
			}
			goToPanel(i);
		});
		
		$('#prev'+i).click(function () {
			if (currPanel[i] != 0) {
				currPanel[i]--;
			} else {
				currPanel[i]=totalPanels[i];
			}
			goToPanel(i);
		});
		
		goToPanel(i, true);	
	}
}

function goToPanel(i, notfirst) {	
	// Links
	if (currPanel[i] == totalPanels[i]) {
		//$('#next'+i).fadeOut("fast");
	} else {
		//$('#next'+i).fadeIn("fast");
	}
	if (currPanel[i] == 0) {
		//$('#prev'+i).fadeOut("fast", function() {
		//	$('#mask'+i).css('margin-left',30);
		//});
	} else {
		//$('#mask'+i).css('margin-left',0);
		//$('#prev'+i).fadeIn("fast");
	}

	// Panel
	var p = '#panel'+i+'_'+currPanel[i];
	
	//Get the height of the sub-panel
	var panelheight = $(p).height();
	
	//set data
	$('#panel'+i+'_value').val($(p).attr('title'));

//Resize the height
	$('#mask'+i).animate({'height':panelheight},{queue:false, duration:500});			
	
	//Scroll to the correct panel, the panel id is grabbed from the href attribute of the anchor
	$('#mask'+i).scrollTo(p, 800);	
	
	if(notfirst){
		if($(p+' a.active')){
			viewphoto($('.wdmBox a.active').attr('id').substr(5));
		} else {
			viewphoto($(p+' a:first').attr('id').substr(5));
		}
	} else {
		viewphoto($(p+' a:first').attr('id').substr(5));
	}
}

function viewphoto(id){
	
	$('.wdmBox').find('a.active').removeClass('active');
	var count=0;
	var found=false;
	$('.wdmBox a').each(function(){
		if(!found){
			count++;
		}
		if($(this).attr('id')=='photo'+id){
			found = true;
		}
	 });
	
	$('span#count').html(count);

	$('a#photo'+id).addClass('active');
	$.post(base_url+'ajax/photo.php', { id:id, tv:tv, type:'foto' }, function(src){
		if(src){
			$('#photolarge').attr('src',src);
			$('#photolarge').show();
		} else {
			$('#photolarge').hide();
		}
	});
	$.post(base_url+'ajax/photo.php', { id:id, tv:tv, type:'detail' }, function(data){
		$('#photodetail').html(data);
	});
	$.post(base_url+'ajax/photo.php', { id:id, tv:tv, type:'permalink' }, function(data){
		$('#permalink').val(data);
	});
	
	$('#photoid').val(id);

	goto_page('1', id);
}