function appendHiddenFields(){
		
		var hiddenStr = new String;	
	
		$.each(selectionSet, function(n){
			var holder = new Object();
			// this contains the value
			if (this != 0) {
				
				var fabID = this;
				$.each(fabricList, function(n){
					if (this.id == fabID) {
						holder = this
					}
				});
				nPlus1 = 1 + n;
			hiddenStr 	+= '<input type="hidden" name="Fabric' + nPlus1
			hiddenStr	+=  '" value="' + holder.name + '">';
			}
		});
	$('form.sampleForm').append(hiddenStr);
	}
/*
 * function updateSelectionBox
 * removes selectionBox Content and replaces with new content based
 * on the values in the global selectionSet array
 */
function updateSelectionBox() {
	//var debug = new jQuery.debug();
	var replacementStr = '';
	var i = 0;
	for(i=0;i<5;i++) {
	
		if (selectionSet[i] == 0) {
		
			replacementStr += '<div class="selectImg">'
			replacementStr += '<img src="images/blank_fabric.gif" id="0" alt="Not Selected" width="100" height="80">'
		    replacementStr += '<div class="selectCaption">Empty</div></div>'			
		} else {
			
			
			// We have already set a fabric in that slot
						
		}
		$.each(fabricList, function(n){
			if (this.id == selectionSet[i]) {
				replacementStr += '<div class="selectImg ' + this.categories + '">'
				replacementStr += '<img src="' + this.thumbnailLocation + '" id="0"'
				replacementStr +=  'alt="' + this.id + '" width="100" height="80">'
		    	replacementStr += '<div class="selectCaption">'+ this.name + '</div></div>'
			}
		});
		
	}
	
$('.fabricSelectors').html(''); // clear out old
$('.fabricSelectors').append(replacementStr);
$('.selectImg > img').bind('click', function(n) {
			
			if(confirm("Do you want to delete this fabric from your selection?")) {
				removeFabric($(this).attr('alt'));
				}
			});
}
/*
 * function resortSelectionBox()
 * 
 * butts all the zeros to the end
 * 
 */
function resortSelectionBox() {
	var tempArray = new Array;
	var zeroArray = new Array;
	for(i=0;i<selectionSet.length;i++) {
		if (selectionSet[i] != 0) {
			tempArray.push(selectionSet[i]);
		} else {
			zeroArray.push(0);
		}
		
	}
	selectionSet = tempArray.concat(zeroArray);
	updateSelectionBox()
}
/*
 * function toggleFabric(fabricID)
 */
function toggleFabric(fabID){
	$.fn.colorbox.close(); //close the current colorbox;
	if (findFabricInSlot(fabID)) {
		if (confirm("You have already selected this fabric. Do you want to remove it from your current selection?")) 
		{
			removeFabric(fabID)
		}
	}
	else {
		// We add the fabric to the current selectionset in first zero slot
		addFabric(fabID);	
	}
}
	
	function addFabric(fabID){
		var i = 0;
		for (i = 0; i < selectionSet.length; i++) 
			if (selectionSet[i] == 0) {
				selectionSet[i] = fabID;
				updateSelectionBox();
				return true;
			}
		// if we get here we are full and need to alert the user to the fact
		if (confirm("You can only order 5 fabrics samples at one time.\n Do you want to add this material and drop the first sample from the list?")) {
			selectionSet[0] = 0;
			resortSelectionBox()
			selectionSet[selectionSet.length - 1] = fabID;
			updateSelectionBox();
		} // else we don't add it
	}
	
	function removeFabric(fabID){
		$.each(selectionSet, function(n) {
			if (this == fabID) { selectionSet[n] = 0; }			
			});
		resortSelectionBox();
		updateSelectionBox();
	}
	
	/*
	 * function resetColorbox(category)
	 * @category
	 */
	function resetColorbox(){
		$('dt > a').colorbox({ 
			transition: "fade",
			title: function(){
				var fabID = $(this).attr('title');
				var description = $(this).attr('alt');
				return description + ' <a href="javascript:toggleFabric(' + fabID + ')">ADD TO CART</a>'
			},
			current: "Fabric {current} of {total}"
		});
		
	}
	/*
	 * function filterFabrics(category)
	 * @category
	 */
	function filterFabrics(category){
	
		var filterCat = category || 'all'; // assume all if no category listed
		$('.scrollPane').html(''); // empty the current fabric Box.
		$('.scrollPane').append('<dl>')
		
		$.each(fabricList, function(fabric){
					
							
			if (this.categories.match(filterCat)) {	
				
				var fabricEntry = '<div id="fabric" class="categories ' + this.categories +
				'"><dt><a href="' +
				this.imageLocation +
				'" alt="' +
				this.name +
				'" title="' +
				this.id +
				'" rel="lightbox"><img src="' +
				this.thumbnailLocation +
				'" alt="' +
				this.name +
				'" title="' +
				this.id +
				'" width="150" height="107" /></dt></a><dd>' +
				this.name +
				'</dd></div>'
				
				
				$('.scrollPane').append(fabricEntry);
			};
					});
		$('.scrollPane').append('</dl>')
		// now we reset the colorbox rellink for the links
		resetColorbox();
	}
	
	
	function findFabricInSlot(fabID){
	
		var i = 0;
		for (i = 0; i < selectionSet.length; i++) {
			if (selectionSet[i] == fabID) {
				return true;
			}
		}
		return false;
	}
	
	/* Global Variable
	 *
	 */
	var selectionSet = [0, 0, 0, 0, 0];
	
	/* Dom ready */
	$(document).ready(function(){
	
	
	//	var debug = new jQuery.debug();
		/* Setup the Accordion for the selector
		 *
		 */
		$('div.accordionButton').click(function(){
			//$('div.accordionContent').slideUp('normal');
			filterFabrics(); // reset the fabrics filter	
			//$(this).next().slideDown('normal');
		});
		
		//HIDE THE DIVS ON PAGE LOAD	
		$("div.accordionContent").show();
		
		// Update the scrollpane with everything
		filterFabrics();
		
		
		$('.accordionContent > ul > li').bind('click', function(filterCat){
			filterFabrics($(this).text().toLowerCase());
		});
		
		// Now we recreate the selectionbox set
		
		updateSelectionBox();
		
	//	$('.selectionBox img').bind(click, function(n){
	//		alert("Image selected " + n);
	//	});
		//setup clear selection button click
		
		$('.clearButton').bind('click', function () {
			if ((confirm("Are you sure you want to clear the selection list?")))
			{
			selectionSet = [0,0,0,0,0];
			updateSelectionBox();
			$('#dialogBox').fadeOut('fast');
			$('.scrollPane').fadeIn('slow');
			
			$('.orderButton').show();	
			}
		});
		 $(".sampleForm").validate({
		 	debug: false,
			submitHandler: function(form) {
   				// we add the fabrics to the form as hidden values
			appendHiddenFields();
				
			//	}
				$('.sampleForm').ajaxSubmit(function (response) {
					$('#dialogBox').hide();
					$('#thankYou').show();
					});
				},
			success: function(success) {
		//		$('#dialogBox').hide();	
				}
			  		
   			});
	
		
		$('#dialogBox').hide();
		$('#thankYou').hide();
		
		
		$('#thankYou a').bind('click', function(n) {
			$('#thankYou').hide();
			selectionSet = [0,0,0,0,0];
			updateSelectionBox();
			$("div.accordionContent").hide();
			$('.scrollPane').fadeIn('slow');
			
		})
		$('.orderButton').bind('click', function(button) {
			$('.scrollPane').fadeOut('slow');
			$('#dialogBox').fadeIn('slow');
			$('.orderButton').hide();
			});
			
		
});