/** Fit Guide Javascript File */
/*  */
/* Author: Katie Bateman */
/* Date  : August 18, 2010 */
/*  */
/* Purpose: JS for use on Fit Guide page. */
/*  
CHANGE LOG

KAB 20100818 - created.

JDP 20101005 - the "shop this fit" link needs to pass the seq# of the product listing page.  If a seq# is not passed, wgprodlist redirects 
				to the landing page.  Thus, I added the "view all" vars to the top of the document, which are the seq# to the denim>view all
				product listing page.  When a user clicks the link, it checks the task parameter, and based on the value, sends the user to 
				the appropraite (men's or women's) page.  I also added the getParm() function to wgw.js.

*/


//JDP 20101005 added "view all" sequence values
/* DEV values:
var mensViewAllSeq = "1_330_406";
var womensViewAllSeq = "2_346_403";
*/

/* TEST values:
var mensViewAllSeq = "1_330_406";
var womensViewAllSeq = "2_346_403";
*/

/* PROD VALUES: */
var mensViewAllSeq = "1_330_406";
var womensViewAllSeq = "2_346_403";

jQuery(document).ready(function ()
{
	// initialize scrolling style selector - set number if items displayed at a time using "numitems" variable
	numitems = 8;
	if (jQuery("#styleselector > .items > a").length > numitems) {
		jQuery("#styleselector").scrollable({size: numitems, 
			onSeek: function()  { 
				prevnextlink("styleselector", this.getStatus().index, numitems, this.getStatus().total);
			}   
		}); 
	}

	// show the "next" button if necessary
	if (jQuery("#styleselector > div:first > .__scrollable > a:gt(" + numitems + ") > img").attr("src"))
	{
		jQuery("#styleselector > .next").css("visibility", "visible");
	}

	// show the style selector now that it is initialized
	jQuery('#styleselector').show();

	// attach Style Selector image hover behaviour to swap images
	jQuery('#styleselector a:not(.next, .prev)').hover(function()
	{
		// ** mouseenter event handler

		// set the image source to the hover image
		jQuery(this).find('img').attr('src', jQuery(this).attr('hover'));

	}, function () 
	{
		// ** mouseleave event handler

		// set the image source to the original image
		jQuery(this).find('img').attr('src', jQuery(this).attr('normal'));
	
	});


	// attach Style Selector image link behaviour
	jQuery('#styleselector a:not(.next, .prev)').click(function()
	{
		// take away the cursor highlighting of the link 
		jQuery(this).blur();

		// get SKU and only continue if it is populated
		var sku = jQuery(this).attr('sku');
		if (sku == '') return;

		// if the details aren't showing yet (ie: this is the first time the user has picked a style to view) move the 
		//	style selector to the top  of the page
		if (jQuery('#selectorcontainer').hasClass('initialload'))
		{
			jQuery('#selectorcontainer').animate({
				'top': '40px'
			}, 1000, function () 
			{
				// after the animation has finished, load the details and then display them
				jQuery('#selectorcontainer').removeClass('initialload');
				jQuery('#selectorcontainer').css('top', '0px')
				
				loaddetails(sku);
			});
		}
		// if the style selector has already been moved to the top of the page, just load the details
		else
		{
			// hide the Alternate Views left/right buttons
			jQuery("#alternates > .next, #alternates > .prev").css("visibility", "hidden");

			loaddetails(sku);
		}
		
		// return false so the link href is not followed
		return false;
	});


	// Shop This Fit link
	jQuery('#shoplink').click(function()
	{
		//JDP 20101005 added logic to check the task param, and include the seq#
		var viewAll;
		var style = jQuery(this).attr('stylecode');
		
		var task = getParm("task");
		
		if (task == null || task.toLowerCase() == "womens")
		{
			//alert("1womens");
			viewAll = womensViewAllSeq;
		}
		else
		{
			//alert ("1mens");
			viewAll = mensViewAllSeq;
		}
		
		document.location = 'wgprodlist.pgm?style=' + style + "&seq=" + viewAll;
	});


});

// load the style details
function loaddetails(sku)
{
	// load the details with the correct item
	//alert("sku: "+sku);
	jQuery.ajax({
		url: 'wgftgde.pgm',
		type: 'GET',
		cache: false,
		dataType: 'json',
		data: ({
			fgsku: sku,
			task: 'getdetails'
		}),
		success: function(returnobj)
		{
		
			// set the active link for styling - remove "active" class from all links,
			//	then add to the one we want
			jQuery('#styleselector .items a').removeClass('active');
			jQuery('#styleselector .items a[sku="' + sku + '"]').addClass('active');

			// load the product name and blurb
			jQuery('#name').text(returnobj.FGSTYNAME);
			jQuery('#desc').text(returnobj.FGDESC);
			
			// load the main image
			jQuery('#activeimage img').attr('src', returnobj.imgpath);

			// load the alternate images
			jQuery('#alternates .items').html(returnobj.altimgshtml);

			// set the stylecode (substring of SKU for searching product listings)
			jQuery('#shoplink').attr('stylecode', returnobj.stylecode);

			// display the details (if they weren't already)
			jQuery('#styledetail').show();


			// initialize scrolling Alternate Views selector
			numitems = 3;
			if (jQuery("#alternates > .items > a").length > numitems) {
				jQuery("#alternates").scrollable({size: numitems, 
					onSeek: function()  { 
						prevnextlink("alternates", this.getStatus().index, numitems, this.getStatus().total);
					}   
				}); 
			}

			// show the "next" button if necessary
			if (jQuery("#alternates > div:first > .__scrollable > a:gt(" + numitems + ") > img").attr("src"))
			{
				jQuery("#alternates > .next").css("visibility", "visible");
			}

			// show the Alternate Views selector now that it is initialized
			jQuery('#alternates').show();


			// attach Alternate Views image link behaviour
			jQuery('#alternates a').click(function ()
			{
				return chgimg(this);
			});


		}
	});
}

// change the currently viewed image from the front/backg/side image selections
// KAB 20100818 - copied from products.css
function chgimg(aobj)
{
	
	var imgm = jQuery(aobj).attr("imgm");

	//set the new source of the image
	if (imgm != "")
	{
		jQuery("#activeimage img").attr("src", imgm);
	}

	return false;
}



/*
	when scrolling through the images, this functin is called to check if the last or first image is displayed
	to hide or display the previous or next link
*/
// KAB 20100818 - copied from products.js
function prevnextlink(id, index, size, total)
{
	//the index is set by the scrolling function. it's always the number of the first image in the row.
	//at the beginning the index is 0, to check if the last image is displayed, add the size (number of images
	//in the div) to the index and compare that to the total number of images in the scrolling div
	
	//if we are at the beginning of the list
	if (index == 0)
	{
		//hide the previous link
		jQuery("#"+id).children(".prev").css("visibility", "hidden");

		//display the next link
		jQuery("#"+id).children(".next").css("visibility", "visible");
	}
	else
	{
		//if the index of the first visible image is not 0
		//display the previous link
		jQuery("#"+id).children(".prev").css("visibility", "visible");

		//hide the next link
		jQuery("#"+id).children(".next").css("visibility", "hidden");

		//is the current index + the visible number of images less then the total number of images, display
		//the next link. 
		//e.g. current index: 2 (the third image is at the beginning of the scrolling visible
		//e.g. size (number of images visible): 3
		//e.g. total number of images in the div:6 
		//the result of these numbers display the next link. 
		if ((index + size) < total)
		{
			jQuery("#"+id).children(".next").css("visibility", "visible");
		}
	}
}