var addition_count = 0;
var requestSubmitted = false;
function toggle_enhancement(count, imgBase)
{
	// get the contents from both the original div, and added div
	// essentially we're just passing the content back and forth between divs
	var div_id="optional_"+count;
	var div_contents = $("#" + div_id).html();
	var div_contents_added = $("#" + div_id + "_added").html();
	// put the contents into the added div, toggle its view state
	$("#" + div_id + "_added").html(div_contents);
	$("#" + div_id + "_added").slideToggle("normal");
	// put the contents into the original div, toggle its view state
	$("#" + div_id).html(div_contents_added);
	$("#" + div_id).slideToggle("normal");
	// the effect of above is to toggle the divs, but you need to pass the contents back
	// and forth so that everything stays legit and continues to function
	
	if ($("#" + div_id + "_state").val() == "off")
	{
		
		// here we swap the plus image for the minus image, update the alt tag, and update the html under the image
		$("#" + div_id + "_image").attr("src",imgBase+"images/vitaminid/Minus.gif");
		$("#" + div_id + "_image").attr("onClick","javascript: changeCart("+count+",imagebase );");
		$("#" + div_id + "_image").attr("alt","Remove from daily Packet");
		$("#" + div_id + "_image_copy").html("Remove from daily Packet");
		$("#" + div_id + "_image_copy").attr("onClick","javascript: changeCart("+count+",imagebase );");
		
		addition_count++;
		$("#quantity_" + count ).attr("value","1");
		$("#" + div_id + "_state").val("on");
		// make the h2 a sifr again (IE)
		$("#" + div_id + "_added h2.sifr_grey_bg").removeClass("sIFR-replaced");
		sIFR.replaceElement("#" + div_id + "_added h2.sifr_grey_bg", imgBase+"javascript/sifr/avenirRoman.swf", "#007eb5", "#000000", "#FFFFFF", "#E8E7DD", 0, 0, 0, 0);	
		
		// increment this counter, so we know how many enhancements have been added, see bracket image
		
		// update the hidden input to state = "on" so that we can set the image later
		
	}
	else
	{
		// here we swap the minus image for the plus image, update the alt tag, and update the html under the image
		$("#" + div_id + "_image").attr("src",imgBase+"images/vitaminid/Plus.gif");
		$("#" + div_id + "_image").attr("onClick","javascript: changeCart("+count+",imagebase );");
		$("#" + div_id + "_image").attr("alt","Add to daily Packet");
		$("#" + div_id + "_image_copy").html("Add to daily Packet");
		$("#" + div_id + "_image_copy").attr("onclick","javascript: changeCart("+count+",imagebase );");
		addition_count--;
		// set the state to "off" so we know it's not currently added
		$("#quantity_" + count ).attr("value","0");
		$("#" + div_id + "_state").val("off");
		// make the h2 a sifr again (IE)
		$("#" + div_id + " h2.sifr_grey_bg").removeClass("sIFR-replaced");
		sIFR.replaceElement("#" + div_id + " h2.sifr_grey_bg", imgBase+"javascript/sifr/avenirRoman.swf", "#4C4B4B", "#000000", "#FFFFFF", "#E8E7DD", 0, 0, 0, 0);
		
		
		// decrement the number of enhancements added ... all done for the bracked image
		
	}
	
	
	//change_bracket(addition_count);
}

function change_bracket(added_count)
{
	// here we're essentially seeing how many enhancements have been added, and show the appropriate bracket
	// technically this is hard coded for 2 enhancements, no more no less, but this should be updated perhaps to except more or less than that
	if (added_count == 1)
	{
		// show the bracked for one enhancement added. Change the image, top margin and top margin on the text
	//	$("#bracket").html('<img width="32" height="402" alt="" src='+imgBase+'"images/vitaminid/Bracket_Medium.gif" alt="" />');
	//	$("#bracket").css("margin-top","4px");
	//	$("#bracket_text").css("margin-top","185px");
		
		// since there are only 2 total things to add, when one is gone, make this singular ... then fix sIFR
		$("#optional_header").html('<h2 class="sifr_grey">Optional Enhancement</h2>');
		// show the optional header if it was hidden
		$("#optional_header").show();
		// remove the sIFR class
		$("#optional_header h2.sifr_grey").removeClass("sIFR-replaced");
		// and call sIFR again to make it look right
		sIFR.replaceElement("#optional_header h2.sifr_grey", imgBase+"javascript/sifr/avenirRoman.swf", "#4C4B4B", "#000000", "#FFFFFF", "#FFFFFF", 0, 0, 0, 0);
		// hide the divider between the enhancements
		$("#optional_divs_spacer").hide();
	}
	else if (added_count == 2)
	{
		// show the bracked for two enhancement added. Change the image, top margin and top margin on the text
	//	$("#bracket").html('<img width="32" height="567" alt="" src='+imgBase+'"images/vitaminid/Bracket_Large.gif" alt="" />');
	//	$("#bracket").css("margin-top","7px");
	//	$("#bracket_text").css("margin-top","265px");	
		
		// since there are only 2 total things to add, when both is gone, hide this div
		$("#optional_header").hide();
		// hide the divider between the enhancements, if not done above (for some reason)
		$("#optional_divs_spacer").hide();
	}
	else
	{
		// show the bracked for no enhancement added. Change the image, top margin and top margin on the text
	//	$("#bracket").html('<img width="32" height="235" alt="" src='+imgBase+'"images/vitaminid/Bracket_Small.gif" alt="" />');
	//	$("#bracket").css("margin-top","0px");
	//	$("#bracket_text").css("margin-top","95px");
		
		// since there are only 2 total things to add, when none are added, make it plural ... and fix sIFR
		$("#optional_header").html('<h2 class="sifr_grey">Optional Enhancements</h2>');
		// show the optional header if it was hidden
		$("#optional_header").show();
		// remove sIFR class
		$("#optional_header h2.sifr_grey").removeClass("sIFR-replaced");
		// add sIFR again
		sIFR.replaceElement("#optional_header h2.sifr_grey", imgBase+"javascript/sifr/avenirRoman.swf", "#4C4B4B", "#000000", "#FFFFFF", "#FFFFFF", 0, 0, 0, 0);
		// show the divider between the enhancements
		$("#optional_divs_spacer").show();
	}
}

// toggles our info div per each vitamin / pill, etc.
// see actual container div of each vitamin to see onmouseover / onmouseout code call
// we have to do it this because IE cannot have an absolute div over a relative div, uh oh?!
function show_info_div(div_id, caller_id)
{
	if ($("#info_" + div_id).css("display") == "none")
	{
		$(caller_id).css("position","relative");
	}
	else
	{
		$(caller_id).css("position","static");
	}

	$("#info_" + div_id).toggle();
}

// add item to shopping cart by call ajax command

function changeCart(id,imgBase){
			
			toggle_enhancement(id,imgBase);
			
			
		//	var params=$("OpPackAddForm_"+id).serialize();
			
		
            
            
              
			//orderUpdateAjax(params,url)
		}
function packAddFornsubmit(form,action){
if (!requestSubmitted ) {
			requestSubmitted  = true;
	cleanCatentry();
//	$("#orderItemAddForm").attr("action","OrderItemAdd");
//	$("#orderItemAddForm").submit();

	form.action =action;
	//form.URL.value='PersonalizeDisplay';//OrderCalculate?URL=PersonalizeDisplay?partNumber*=&quantity*=';
	if(action=='ReOrderUpdate'){
		if(confirm("Please confirm your changes before proceed.")) form.submit();
	}else 	form.submit();
	}
}
function cleanCatentry(){
$("#orderItemAddForm input").each( function(id){
		var qString= this.id.substring(0,8);
		
		if(qString=='quantity' && this.value==0){
			//alert(qString+" removed!");
			var number =this.id.substring(9);
			$("#catEntryId_"+number).remove();
			$("#productId_"+number).remove();
			$("#partNumber_"+number).remove();
			$(this).remove();
		}
	});
	
}
function orderUpdateAjax(params,url){
	
	
	$.ajax({
	async: true,
	type:"POST",
	url:url,
	data: params,
	dataType: "xml",
	error: function (XMLHttpRequest, textStatus, errorThrown) {
	alert("request content: "+XMLHttpRequest.responseText);

	}
	
	});
}