
  // Browser Compatibility Testing
  window.onerror=null; // Error Trapping
  var nn4=(document.layers)?1:0;
  var ie=(document.all)?1:0;
  var dom=(document.getElementById)?1:0;
  
    
  // START OF CUSTOMIZED INFORMATION
  //Miscellaneous variables for defining the pop-up boxes
  var boxDelay="1.2"; // Delay time (in seconds) to keep the box displayed, default is "1.5" if not greater than "0".
  var borderColor="#ffefbb"; // color of the border (IE only)
  var borderLight="#ffefbb"; // color of the light shaded part of the border (IE only)
  var borderDark="#ffefbb"; // color of the dark shaded part of the border (IE only)
  var backGround="#ffefbb"; // color of the background of the pop-ups (All Browsers)
  var boxFontSize="11"; //size of font (in px) for the style class boxes needs to be equal in order to work properly
  var maximumMenuSize="400"; //max size the menu widths can be, if no max size desired set equal to null
  var pixelImage = "images/pixel.gif";	//type in the location of this image
  var hoverImage = "images/hover.gif";	//type in the location of this image
  
  
  // page level in the site
  var pageLevel;
  function checkPageLevel(templateLevel) //function sets the variable to the proper level in the site so pages are referenced correctly
  {					//This function needs to be called before the function boxGen(boxArray) is called by the page using this code.
	pageLevel = templateLevel;

	var levelImgLinkRef = "";
	for(var i=1; i < pageLevel; i++)//sets the links to the correct referenced level
  	{
		levelImgLinkRef+="../"
	}
	var temp = levelImgLinkRef;
	temp += pixelImage;
	pixelImage = temp;
	temp = levelImgLinkRef;
	temp += hoverImage;
	hoverImage = temp;

	// Image PreLoader for RollOvers
	if (nn4 || ie || dom){ // Use this box for defining all secondary images of rollovers, first two are for the pop-up boxes
	x0=new Image(); x0.src= pixelImage; // Default Bullet (transparent)
	x1=new Image(); x1.src= hoverImage; // Hover arrow (visible)
	// x2=new Image(); x2.src="imagepath/imagename"; // add your own images using this format
  	}//-- End of PreLoader
  }


  // Pop-Up Box Arrays
  // First element of each box contains the title of the pop-up and an opening statement.
  // Remaining elements of each box contain a link name and the associated URL.
  
  
  
  Abox=new Array();
  Abox.id="boxA";
  Abox.imgname="A";
  Abox[0]=new boxLink("","");
  Abox[1]=new boxLink("Herstory","Herstory.shtml");
  Abox[2]=new boxLink("Contact Me","contact.shtml");
  
  Bbox=new Array();
  Bbox.id="boxB";
  Bbox.imgname="B";
  Bbox[0]=new boxLink("Get cooking","");
  Bbox[1]=new boxLink("New cookbook, Food From the Farmlet, order now","Farmlet.shtml");
  Bbox[2]=new boxLink("Recipe Forum - Exchange recipes","phpBB/index.php");
  Bbox[3]=new boxLink("Tomato Tortellini Soup","Tomato_TORTELLINI_SOUP.shtml");
  Bbox[4]=new boxLink("Vinaigrette Salad Dressing","VinaigretteDressing.shtml");
  Bbox[5]=new boxLink("Contact Me","contact.shtml");

  Cbox=new Array();
  Cbox.id="boxC";
  Cbox.imgname="C";
  Cbox[0]=new boxLink("Send money","");
  Cbox[1]=new boxLink("Order my cookbook","Order.shtml");
  Cbox[2]=new boxLink("Contact Me","contact.shtml");


 
  // To use HTML code in the description line, item [0], you MUST preceed all < and " with a \ as in \<
  // You also cannot use carriage returns, the enter key. This content must be all on one line.
  // Add more arrays as needed following pattern used for previous boxes
  // End of Pop-Up Box Arrays
  // END OF CUSTOMIZED INFORMATION
  
  // Pop-Up variables
  var boxStart=0;
  var boxStay=null;
  var onLayer;
  
  if (nn4){ // Navigator Layer Changer
   layerStyleRef="layer.";
   layerRef="document.layers";
   styleSwitch="";
  }
  if (ie){ // Explorer Layer Changer
   layerStyleRef="layer.style.";
   layerRef="document.all";
   styleSwitch=".style";
  }

  
  function showLayer(layerName,shownOnMouse){ // Display Box
   if(nn4 && !shownOnMouse) return;
   if(dom || ie || nn4){
	   if (boxStay != null){
		 clearTimeout(boxStay);
		 hideLayer(onLayer);
		}
	   
	   if (dom || ie){
		var layerElement = document.getElementById(layerName);
		layerElement.style.visibility = "visible";
		onLayer=layerName;
	
		//sets the focus to the main menu item (always visible) to help prevent errors
		if(ie && shownOnMouse){
			var setFocusElement;
			var elementID = layerName.charAt(3);
			setFocusElement = document.getElementById((elementID));
			setFocusElement.focus();
			}
		 
	   }
	   else{//nn4
		eval(layerRef+"[\""+layerName+"\"]"+styleSwitch+".visibility=\"visible\"");
		onLayer=layerName;
		}
	}//end if dom ie nn4
  }
  
  function setMenuFocus(layerName)
  { //tabIndex currently only works with IE
    if (ie){
		var FirstMenuItemElement;
		var layerElement = document.getElementById(layerName);
		var layerStatus = layerElement.style.visibility;
		//if layer is visible then set the focus, else do nothing.  
		if(layerStatus == "visible"){
		FirstMenuItemElement = document.getElementById((layerName+"FirstMenuItem"));
		FirstMenuItemElement.focus();
		}
	}
	else hideLayer(layerName);
  }
  
  function hideLayer(layerName){ // Hide Box
   if ((dom || ie) && (boxStart == 0)) {
     var layerElement = document.getElementById(layerName);
     layerElement.style.visibility = "hidden";
   }
   else if (nn4 && (boxStart == 0)) eval(layerRef+"[\""+layerName+"\"]"+styleSwitch+".visibility=\"hidden\"");
  }
   
  if (boxDelay <= 0) boxDelay="1.5";
  
  function boxTimer(){  // Source MouseOut Delay
   boxStay=setTimeout("btnOut()",boxDelay*1000);
  }
  
  function btnOut(layerName){ // Source MouseOut
   if (boxStart == 0){hideLayer(onLayer);}
  }
  
  function boxOver(itemName){ // Box MouseOver Image
   clearTimeout(boxStay);
   boxStart=1;
  if(ie || dom)document.images[itemName].src = x1.src;
  else if(nn4) eval("document."+itemName+".src=\""+x1.src+"\"");

		

  }
  
  function boxOut(itemName){ // Box MouseOut Image
   boxStart=0;
   if(ie || dom) document.images[itemName].src = x0.src;	
   else if(nn4) eval("document."+itemName+".src=\""+x0.src+"\"");
   boxStay=setTimeout("hideLayer(onLayer)", 1500);
  }
  
  function boxLink(title, url){ // Box Elements
   this.title=title;
   this.url=url;
  }
  
  function findBoxLength(boxArray)
  {	var longestTitle = 0;
  	var boxSize;
  	var strTitle;
	var strTitleLgth;
	for(var i = 0; i < eval(boxArray+".length"); i++)
	{	strTitle = eval(boxArray+"[" + i + "].title");
		strTitleLgth = strTitle.length;
		for(var j = 0; j < strTitle.length; j++)
		{	if(strTitle.charAt(j) == "i" ||
				strTitle.charAt(j) == "l" ||
				strTitle.charAt(j) == "." ||
				strTitle.charAt(j) == "," ||
				strTitle.charAt(j) == ":" ||
				strTitle.charAt(j) == "j" ||
				strTitle.charAt(j) == " " 
			    )
				{	strTitleLgth = strTitleLgth - 1;
				}
		}	
		if(longestTitle < strTitleLgth)
		{	longestTitle = strTitleLgth;
		}
	}
	//fix.  SB a way to render the string and query it's pixel size.
	longestTitle = (boxFontSize * longestTitle) ;
	longestTitle *= .90;
	if(maximumMenuSize == null)return longestTitle;
	if(longestTitle < maximumMenuSize)
		return longestTitle;
	else return maximumMenuSize;

  }
  
  function boxGen(boxArray){ // Build the Pop-Up Box
  var elementName;
  var boxWidth;
  var levelLinkRef= "";

  for(var i=1; i < pageLevel; i++)//sets the links to the correct referenced level
  {
	levelLinkRef+="../"
  }

   N=eval(boxArray+".length")-1;
   
   var boxWidth = findBoxLength(boxArray); //finds the longest title length in order to determine box width
   
   n="\<DIV id=\""+eval(boxArray+".id")+"\">\<TABLE ID=\"TableBox\" border=0 cellspacing=0 cellpadding=0 bgcolor=\""+borderColor+"\"";
    if (boxWidth != "") n+=" width=\""+boxWidth+"\"";
   n+=">\<TR>\<TD>\<TABLE ID=\"TableBox1\" border=2 cellspacing=0 cellpadding=3 ";
   if (boxWidth != "") n+="width=\"100%\"";
   n+=" bordercolor=\""+borderColor+"\" bordercolorlight=\""+borderLight+"\" bordercolordark=\""+borderDark+"\" bgcolor=\""+backGround+"\">\<TR>\<TD>";
   if (eval(boxArray+"[0].title") != "") n+="\<a class=\"MenuHeading\" ID=\""+eval(boxArray+".id")+"FirstMenuItem\" tabIndex=0>"+eval(boxArray+"[0].title")+"\<\/a>\<BR>";
   if (eval(boxArray+"[0].url") != "") n+="\<SMALL>"+eval(boxArray + "[0].url")+"\<\/SMALL>\<BR>";

   for (var i=1; i <= N; i++){

    if (eval(boxArray + "[" + i + "].url") == "") 
	{
	  if (eval(boxArray+"[" + i + "].title") != "") n+="\<a class=\"MenuSubHeading\">"+eval(boxArray+"[" + i + "].title")+"\<\/a>\<\/BR>";
	}else
		{
      n+="\<IMG src=\""+pixelImage+"\" width=7 height=8 border=\"none\" \" name=\""+eval(boxArray+".imgname")+i+"\" alt=\"o\"> ";
      n+="\<A class=\"bxlnk\" href=\""+levelLinkRef+eval(boxArray+"["+i+"].url")+"\" tabIndex=0 onMouseOver=\"boxOver('"+eval(boxArray+".imgname")+i+"')\"";
	  if(i == N)n+=" onBlur=\"hideLayer('"+eval(boxArray+".id")+"')\"";
	  n+=" onMouseOut=\"boxOut('"+eval(boxArray+".imgname")+i+"')\" class=\"bxlnk\">"+eval(boxArray + "[" +i+ "].title")+"\<\/A>\<BR>";
    	}
		
   }
   
   n+="\<\/TD>\<\/TR>\<\/TABLE>\<\/TD>\<\/TR>\<\/TABLE>\<\/DIV>";
   return n;
  }
 


