var tabArray = new Array;
var swatchArray = new Array;

$(function() {

	// build the tab functionality
	getTabNames(".a-tab");
	setTab(0);
	buildTabs(".a-tab","activeTab");

	// build swatch funcionality
	buildSwatches(".swatch-image", "#pImage");
	
	// update the dropdowns if only 1 item in dropdown
	$("#product-options-area select").each( function() {	
		$(this).change(function() { 
			//if its a color dropdown, update main image
		    if( $(this).attr("id").indexOf("Color") != -1 )
		    { updateMainImage( $(this).val() ); }	
		    else
		    { initializeMainImage();}
		});
	});
});

function shareWithFriend(obj) {
	var oldHREF = $(obj).attr("href");
	var tempHREF = $(obj).attr("href");
	var styleColor = $("#pImage").attr("src");
	styleColor = styleColor.substring( styleColor.lastIndexOf('/') + 1,styleColor.length - 1) 
	styleColor = styleColor.split('_')[0];
	tempHREF = tempHREF + "&stylecolor=" + styleColor + "&colorname=" + $("#pImage").attr("alt");		
	$(obj).attr("href",tempHREF);
	popupWindow(obj,'emailFriend','location=0,status=0,menubar=0,toolbar=0,resizable=0,width=550,height=525');
	$(obj).attr("href",oldHREF);
};

function updateMainImage(color) {
	$(".swatch-image").each(function(i){
		if( $(this).attr("alt") == color )
		{ 
			$("#pImage").attr("src",swatchArray[i]);
			$("#pImage").attr("alt",color);
		}
	});
};


function initializeMainImage() {
	setTimeout(function() {
	  $("#product-options-area select").each( function() {
	    //if its a color option
	    if( $(this).attr("id").indexOf("Color") != -1 )
	    {
	  	  //if only have one option select it
		  if( $("option",this).size() == 1 )
		  { updateMainImage( $("option",this).val() ) }
		  else
		  {
		  	if( $("option[@selected]",this).val() != "Select One" )
		  	{ updateMainImage( $("option[@selected]",this).val() ); }
		  }
	    }
	  });
	}, 1)
};

var buildSwatches = function(area, mainImage) {
	$(area).each(function(i) {
		swatchArray[i] = $(mainImage).attr("src").substring(0,$(mainImage).attr("src").lastIndexOf("/")+1) + $(this).attr("name");
		$(this).attr("name","");
		
		$(this).click(function() {
			$(mainImage).attr("src",swatchArray[i]);
			$(mainImage).attr("alt",$(this).attr("alt"));
		});
	});
};

var getTabNames = function(area) {
	$(area).each(function(i) {
		tabArray[i] = $(this).attr("src").substring(0,$(this).attr("src").lastIndexOf(".gif"));
	});	
};

var setTab = function(id) {
	$(".a-tab").each(function(i) {
		// remove old tab
		if($(this).attr("id") == "activeTab")
		{
			$(this).attr("src",tabArray[i]+".gif");
			$(this).attr("id","");
			$(".tab-content").eq(i).hide();
		}
		
		// new tab
		if(i == id)
		{
			$(this).attr("src",tabArray[i]+"-active.gif");
			$(this).attr("id","activeTab");
			$(".tab-content").eq(i).show();
		}
	}); 
};

var buildTabs = function(area,active) {
	$(area).each(function(i) {
		$(this).hover(
			function() { 
				if( $(this).attr("id") != active )
				{ $(this).attr("src",tabArray[i]+"-hover.gif"); }
			},			
			function() { 
			 	if( $(this).attr("id") != active )
				{ $(this).attr("src",tabArray[i]+".gif"); }
			}
		);
		
		$(this).click( function() {
			setTab(i);
		});
	});
};

function setAddTo(addToType) {
	document.productForm.addTo.value = addToType;
}

function setupAltImages() {
	setZoomImagePosition(10,10);
	$("#alt-images-right img").eq(0).addClass("active");
	
	$(".close-popup").unbind("click").click(function() { 
	
	$("#alt-images-popup").hide(); $("#alt-images-popup").remove(); 
		closeExternalPopup("alt-imags-popup");
	});
	
	$("#alt-images-right img").click(function() {
		$("#alt-images-left img#alt-image-large").attr("src", $(this).attr("name"));
		$("#alt-images-left img#alt-image-large").attr("alt", $(this).attr("alt"));
		$("#image-zoom img").attr("src", $(this).attr("zoomImg"));
	});
	
	addZoomEvents();
	checkImageXY();
};

var zoomFactor = 2.14; //2.14x 
var imgX = 0;
var imgY = 0;
var zInterval = undefined;
var zoomEvent;
var bodyW = 0;
var zoomViewerOffset = 110;

function addZoomEvents() {
	$("#alt-images-popup").unbind("mousemove").mousemove(function(ev) {
		zoomEvent = ev;
		if(typeof zInterval == "undefined")
		{ zInterval = setInterval( "checkCoords(zoomEvent)" , 10); }
	});
};

function removeZoomEvents() {
	$("#image-magnifier").hide(); 
	clearInterval(zInterval);
	zInterval = undefined;
};

function checkImageXY() {
	bodyW = $("body").width();
	imgX = bodyW / 2 - $("#alt-images-popup").width() / 2  + 23;
	imgY = parseInt($("#alt-images-popup").css("top")) + 18;
};

function checkCoords(ev) {
	// get cursor position in image.
	mouseX = getMouseCoord(ev)[0] - imgX;
	mouseY = getMouseCoord(ev)[1] - imgY;
	
	if( (mouseX < 420 && mouseX > 0) && ( mouseY > 0 && mouseY < 560) )
	{
		$("#image-magnifier").show(); 
		setZoomImagePosition(mouseX,mouseY);
		setMagnifierPosition(mouseX,mouseY);
	}
	else
	{ removeZoomEvents(); }
};

function setMagnifierPosition(x,y) {
	x = x - zoomViewerOffset;
	y = y - zoomViewerOffset;
	$("#image-magnifier").css("left",x+"px");
	$("#image-magnifier").css("top",y+"px");
};

function setZoomImagePosition(x,y) {
	// get center coordinate of image you want to view, then align it in the maginifer
	imageX = (x * zoomFactor * -1) + zoomViewerOffset;
	imageY = (y * zoomFactor * -1) + zoomViewerOffset;
	
	// set the new image position.
	$("#image-zoom img").css("left", imageX+"px");
	$("#image-zoom img").css("top", imageY+"px");
};