function SelectSock(sockId)
{
	var id = sockId;
	var qty = GetSockQty(sockId); 
	var numOfSocksAdded = GetNumOfSocksAdded();
	var numOfSocksRemaining = 3 - numOfSocksAdded;
	
	if(isNaN(qty) || qty == "" || qty == " " || qty == 0 || qty == null)
	{
		DeselectSock(sockId);
		alert("please enter quantity");
		SelectQty(sockId);
		
	}
	else if(numOfSocksAdded > 3 || qty > numOfSocksRemaining)
	{
		DeselectSock(sockId);
		alert("Sorry, you’ve added more than 3 socks to your three pack.  Please try again");
	}
	else
	{
		UpdateSideBar();
	}
}


function DisableQuantityField(sockId)
{
	document.getElementById("qty_" + sockId).disabled = true;
}

function EnableQuantityField(sockId)
{
	document.getElementById("qty_" + sockId).disabled = false;
}

function GetSockName(sockId)
{
	var name = document.getElementById("name_" + sockId).innerHTML;
	return name;
}

function GetSockQty(sockId)
{
	var qty = document.getElementById("qty_" + sockId).value;
	return qty;
}

function GetSockImageUrl(sockId)
{
	var imageUrl = document.getElementById("image_" + sockId).src;
	return imageUrl;
}

function DeselectSock(sockId)
{
	document.getElementById("select_" + sockId).checked = false;
}

function ReselectSock(sockId)
{
	document.getElementById("select_" + sockId).checked = true;
}

function ClearImages()
{
	document.getElementById("sidebar").innerHTML = "";
}

function SelectQty(sockId)
{
	document.getElementById("qty_" + sockId).focus();
}
					
function UpdateSideBar()
{
	var numOfItemsOnPage = document.getElementById("itemlist").getElementsByTagName("input").length;
	var sockData = new Array();
	
	for(i=0; i<numOfItemsOnPage; i++)
	{
		var selectField = document.getElementById("itemlist").getElementsByTagName("input")[i].checked;
		
		if(selectField)
		{
			var sockId = document.getElementById("itemlist").getElementsByTagName("select")[i].name;
			var name = GetSockName(sockId);
			var qty = GetSockQty(sockId);
			var imageUrl = GetSockImageUrl(sockId);
			
			for(j=0; j<qty; j++)
			{
				sockData.push(sockId);
				sockData.push(name);
				sockData.push(qty);
				sockData.push(imageUrl);
			}
		}
	}
	
	AddSocks(sockData);
	

	var numOfSocksAdded = GetNumOfSocksAdded();
	var numOfSocksRemaining = 3 - numOfSocksAdded;
	
	DisplayNumOfSocksAdded(numOfSocksAdded);
	DisplayNumOfSocksRemaining(numOfSocksRemaining);
	
	if(numOfSocksAdded == 3)
	{
		DisplayModalWindow(sockData);
	}
}
				
function GetNumOfSocksAdded()
{
	var numOfImages = document.getElementById("sidebar").getElementsByTagName("a").length;
	return numOfImages;
}

function DisplayNumOfSocksAdded(totalNumOfSocks)
{
	switch(totalNumOfSocks)
	{
		case 0:
			document.getElementById("displayNumOfSocksAdded").innerHTML = "no socks selected";
			break;
		
		case 1:
			document.getElementById("displayNumOfSocksAdded").innerHTML = "1 sock added!";
			break;
		
		case 2:
			document.getElementById("displayNumOfSocksAdded").innerHTML = "2 socks added!";
			break;
			
		case 3:
			document.getElementById("displayNumOfSocksAdded").innerHTML = "3 socks added!";
			break;
	}
	
}

function DisplayNumOfSocksRemaining(numOfSocksRemaining)
{
	switch(numOfSocksRemaining)
	{
		case 0:
			document.getElementById("displayNumOfSocksRemaining").innerHTML = "your personal 3-pack is complete!";
			break;
		
		case 1:
			document.getElementById("displayNumOfSocksRemaining").innerHTML = "pick 1 more to complete your pack!";
			break;
		
		case 2:
			document.getElementById("displayNumOfSocksRemaining").innerHTML = "pick 2 more to complete your pack!";
			break;
			
		case 3:
			document.getElementById("displayNumOfSocksRemaining").innerHTML = "pick 3 socks to complete your pack!";
			break;
	}
	
}

function AddSocks(sockData)
{
	var numOfSocks = sockData.length/4;
	var html = "";
	
	document.getElementById("sidebar").innerHTML = "";
		
	for(i=0; i<numOfSocks; i++)
	{
		html = document.getElementById("sidebar").innerHTML;
		document.getElementById("sidebar").innerHTML = html + "<img src=\"" + sockData[(i*4)+3] + "\" width=\"75\"><a></a>";
	}
}

function Reset()
{
	var numOfInputElementsOnPage = document.getElementById("itemlist").getElementsByTagName("input").length;
	
	for(i=0; i<numOfInputElementsOnPage; i+=2)
	{

		document.getElementById("itemlist").getElementsByTagName("input")[i].checked = false;
		document.getElementById("itemlist").getElementsByTagName("input")[Math.abs(i-1)].value = "";
	}
	
	document.getElementById("sidebar").innerHTML = "<img src=\"https://system.netsuite.com/c.605801/default_socks.jpg\">";
	DisplayNumOfSocksAdded(0);
	DisplayNumOfSocksRemaining(3);
	document.getElementById("modalWindow").style.display = "none";
	window.location = window.location;
}

function DisplayModalWindow(sockData)
{
			
	document.getElementById("modalWindow").style.display = "block";
	
	var newdiv = document.createElement("div");

	newdiv.innerHTML ="<table>"
						+ "	<tr>"
						+ "		<td>"
						+ "			<table>"
						+ "				<tr>"
						+ "					<td align=center class=\"orangeRelated\"><img src=\"" + sockData[3] + "\" width=100><br />" + sockData[1] + "</td>"
						+ "					<td align=center valign=middle><img src=\"/icon_plus.jpg\"></td>"
						+ "					<td align=center class=\"orangeRelated\"><img src=\"" + sockData[7] + "\" width=100><br />" + sockData[5] + "</td>"
						+ "					<td align=center valign=middle><img src=\"/icon_plus.jpg\"></td>"
						+ "					<td align=center class=\"orangeRelated\"><img src=\"" + sockData[11] + "\" width=100><br />" + sockData[9] + "</td>"
						+ "					<td align=center valign=middle><img src=\"/icon_equal.jpg\"></td>"
						+ "					<td align=center valign=middle><img src=\"/8pack.jpg\" width=100></td>"
						+ "				</tr>"
						+ "			</table>"
						+ "		</td>"
						+ "	</tr>"
						+ "	<tr>"
						+ "		<td>"
						+ "			<table width=100%>"
						+ "				<tr>"
						+ "					<td align=left><img src=\"/btn_reset.jpg\" onclick=\"Reset();\"></td>"
						+ "					<td align=right><img src=\"/btn_add.jpg\" onclick=\"AddToCart('" + sockData[1] + "-" + sockData[0] + "','" + sockData[5] + "-" + sockData[4] + "','" + sockData[9] + "-" + sockData[8] + "');\"></td>"
						+ "				</tr>"
						+ "			</table>"
						+ "		</td>"
						+ "	</tr>"
						+ "	<tr>"
						//+ "		<td>Want more? Upgrade to a 9-pack spin-o-rama and get 36 possible combinations!</td>"
						+ "	</tr>"
						+ "</table>";
														
	var container = document.getElementById("modalWindow");
	container.appendChild(newdiv);
	window.scroll(0,0);
}

function AddToCart(sock1, sock2, sock3)
{
	document.getElementById("custcol_sock_bundle").value = sock1 + "," + sock2 + "," + sock3;
	document.form6284.submit();
}