// JavaScript Document


/*-----------------------------------------------------------------------
-------------- JQuery Stuff ---------------------------------------------
-----------------------------------------------------------------------*/

//leave variables here to be set outside of jquery
var total_sub_menus = 0;
var current_sub_menu = "";
var i = 0;
var sub_menu_array = new Array();

$(function()
{
	//--------------------------------------------------
	//----------------- GALLERY STUFF ------------------
	//--------------------------------------------------
	
	var total_cols = $("#total_cols").text();
	var curr_col = $("#curr_col").text();
	var img_box_wide = $("#img_box_wide").text();
	var imgs_wide = $("#imgs_wide").text();
	
	$(".gal_link").click(function(event){ gal_img_clicked($(this).attr('image_id'),$(this).attr('product_id')); }); //add link to thumbs
	gal_img_clicked($("#gal_link0").attr('image_id'),$("#gal_link0").attr('product_id')); //move to first image
	for( i=0; i<total_cols;i++ ) {
		if( i > imgs_wide-1 )
		{
			$("#gal_div"+i).hide();
		}
	}
	$("#gal_right").hide();
	
	if ( parseInt(imgs_wide) >= parseInt(total_cols) )
	{
		$("#gal_left").hide();
	}
	
	$("#gal_left").click(function(event)
	{
		$("#gal_div"+curr_col).fadeOut(500); //hide left col
		curr_col++; //move to next col
		//loop until to end col
		curr_move_col = curr_col //col being moved (actual div name)
		curr_pos_pix = 35; //gets the current images "left" value to move to (35 = 10padding + 15left arrow + 10image spacing)
		curr_pos_img = 1; //the current image being moved (relative in the line of images)
		while ( curr_pos_img < imgs_wide )
		{
			$("#gal_div"+curr_move_col).animate({ left:curr_pos_pix+"px"}, 500); //move next col left
			curr_move_col++;
			curr_pos_img++;
			curr_pos_pix += parseInt(img_box_wide);
		}
		
		$("#gal_div"+(curr_col+parseInt(imgs_wide-1))).fadeIn(500);//show the next col on the right
		//check to see wether left/right arrows need to be shown/hidden
		if(curr_col == 1)
		{
			$("#gal_right").fadeIn(500);
		}
		
		if (curr_col == total_cols-imgs_wide)
		{
			$("#gal_left").fadeOut(500);
		}
	});
	
	$("#gal_right").click(function(event)
	{
		$("#gal_div"+(curr_col+parseInt(imgs_wide-1))).fadeOut(500); //hide right col
		curr_col--; //move to next col
		//loop until to end col
		curr_move_col = curr_col+1;
		curr_pos_pix = parseInt(img_box_wide)+35;
		curr_pos_img = 2;
		while ( curr_pos_img <= imgs_wide )
		{
			$("#gal_div"+curr_move_col).animate({ left:curr_pos_pix+"px"}, 500); //move next col right
			curr_move_col++;
			curr_pos_img++;
			curr_pos_pix += parseInt(img_box_wide);
		}
		$("#gal_div"+curr_col).fadeIn(500);//show the next col on the left
		//check to see wether left/right arrows need to be shown/hidden
		if (curr_col == 0)
		{
			$("#gal_right").fadeOut(500);
		}
		if (curr_col == (total_cols-imgs_wide-1))
		{
			$("#gal_left").fadeIn(500);
		}
	});
	
	//--------------------------------------------------
	//----------------- MENU STUFF ---------------------
	//--------------------------------------------------
	//get details of menu
	total_sub_menus = $("#total_sub_menus").text();
	current_sub_menu = $("#current_sub_menu").text();
	i=0;
	while (i < total_sub_menus)
	{
		sub_menu_array[i] = $("#sub_menu_"+i).text();
		i++;
	}
	
	//hide sub menus not needed and move bar to correct menu
	for( i=0; i<total_sub_menus;i++ ) {
		if( sub_menu_array[i] != current_sub_menu )
		{
			$('[group='+sub_menu_array[i]+']').hide();
		} else
		{
			$("#purple_bar").css({'left': $("#"+sub_menu_array[i]+"_main").attr('pos') + "px"});
		}
	}
	
	$(".main_menu_item").hover(function(){new_hover($(this).attr('pos'),$(this).attr('sub_menu'));});
});

//--------------------------------------------------
//----------------- GALLERY STUFF ------------------
//--------------------------------------------------

function gal_img_clicked(new_image_id,new_product_id)
{
	//using the image id, change the main image
	$("#main_gal_image").attr("src","includes/show_image.php?image_id="+new_image_id+"&image_type=full");
	//using the product id, change the link on the main image (only id product ID sent through)
	if (new_product_id > 0)
	{
		$("#main_gal_link").attr("href","index.php?page=products&sub_page=default&product_id="+new_product_id);
	}
}


//--------------------------------------------------
//----------------- MENU STUFF ---------------------
//--------------------------------------------------

function new_hover(to_pos,menu_name)
{
	$("#purple_bar").animate({ left:to_pos + "px"}, 500);
	if (current_sub_menu != menu_name)
	{
		$('[group='+current_sub_menu+']').fadeOut(500);
		$('[group='+menu_name+']').fadeIn(500);
		current_sub_menu = menu_name;
	}
}
