

/* Vars related to main category menu */
	var currentSubMenu = "";
	var lastMenu = "";
	var currentMenu = "";
	var menuHover = false;
	var hideMenu = false;
	var currentRootCategory = "";
	var leftMenu = "";
	var rightMenu = "";
	var isLeftMenu = false;
	var isRightMenu = false;
	var rd = false;
	var menuLoaded = new Object();
/* Vars related to main category menu */

function searchFormValidate(){
	var searchValue = (document.searchform.q.value=='Search');
	if (searchValue == false){
		document.searchform.action="http://search.franklinplanner.com/";
		document.searchform.submit();
	} 	
}


function showSearchBubble(boxid){
	var posX = findPositionX(document.getElementById("search_box"));
	var posY = findPositionY(document.getElementById("search_box"));
	document.searchform.action="http://search.franklinplanner.com/";
    if (document.searchform.q.value.length < 1) {
		document.getElementById(boxid).style.left=posX - 130;
		document.getElementById(boxid).style.top=posY - 75;
		document.getElementById(boxid).style.display="block";
		document.searchform.q.focus();
		return false;
	} else {   
	   document.searchform.submit();
	   return true;	 
	}
}

function hideSearchBubble(boxid){
   document.getElementById(boxid).style.display="none";
}	

function whatsThis(which,state,parent)
{
	//close all other open windows
	closeWhatsThis();
	
	var whatsThisDiv = document.getElementById("sub_menu_2_whats_this_"+which);
	if (whatsThisDiv) 
	{
		if (state=="block")
		{
			var whatsThisParent = document.getElementById("sub_menu_2_"+which);
			var menuParent = document.getElementById("subcat_"+parent);
			var parentCoords = getObjCoords(whatsThisParent);
			var menuCoords = getObjCoords(menuParent);
			//var newLeft=parentCoords.x - menuCoords.x + 110;
			//var newTop = parentCoords.y - menuCoords.y + 5;
			var newLeft = parentCoords.x+110;
			var newTop = parentCoords.y+5;
			whatsThisDiv.style.top=newTop+"px";
			whatsThisDiv.style.left=newLeft+"px";
		}
		whatsThisDiv.style.display=state;
	}
}

function closeWhatsThis()
{
	var these = getElementsByClass("sub_menu_2_whats_this",null,"div");
	if (these!=null)
	{
		for (i=0; i<these.length; i++)
		{
			these[i].style.display="none";
		}
	}	
	
}
function buildMenu(url) {

   //$.ajaxSetup({
    //    global  : true,
    //    dataType: 'jsonp',
    //    jsonp   : 'jsoncallback',
    //    cache   : true
	//}); 
	// Due to there will be other type of ajax request on page, and the datatype isn't jsop, so comment out ajaxSetup, move it to ajax request.
  	var specialOffersSelected = false;
  	if (-1!=document.location.href.indexOf("promotions.jsp")) specialOffersSelected = true;
	
	// Get the categories with a JSON call
	menu = document.getElementById("menuDiv");	
	var tbl = document.createElement("table");
	tbl.style.width = "900px";
	tbl.setAttribute("id","topNavTbl");
	
	var tbdy = document.createElement("tbody");
	var trw = document.createElement("tr");
  		//contentType: "application/json",	
	$.ajax({
		type:"GET", cache:true, global:true,dataType:'jsonp',jsonp:'jsoncallback',processData:false, url:url,
    		success:function(jsonp) {
			var len = jsonp.categories.length;
			var isLast = false;
			var isFirst = false;
          
            if ( jsonp.status && jsonp.status == "success" && jsonp.categories ) {
				var domain = document.location.protocol + "//" + document.location.host;
				$.each(jsonp.categories, function(i,item){
                    if ( item.currentRootCategory != "" && currentRootCategory == "") {
                    	currentRootCategory = item.currentRootCategory;
                   	}
					var hasSubs = false;
					if ( item.subcategories && item.subcategories.length > 0 ) {
						hasSubs = true;
					}
                	var lr = "";
                	
					if ( i == 0 ) {
     					// Add the left round corner
     					lr = "l";
     					leftMenu = item.id;
     					var td = document.createElement("td");
     					td.style.height = "32px";
     					td.style.width = "6px";
     					if ((currentRootCategory && currentRootCategory == item.id)) {
     						//on
     						currentMenu = currentRootCategory;
     						td.innerHTML = "<img name='menuLeft' src='/static/site/common/nav_left_on.gif' border='0'/>";
     					} else {
     						//off
     						td.innerHTML = "<img name='menuLeft' src='/static/site/common/nav_left.gif' border='0'/>";
     					}
     					trw.appendChild(td);
   					}
   					if ( i+1 == len ) {
   						isLast = true;
   						lr = "r";
   						rightMenu = item.id;
   					}
   					var tda = document.createElement("td");
   					tda.style.fontSize = "11px";
  	 				tda.setAttribute("id", "td_" + item.id);
  	 				if ( (currentRootCategory && currentRootCategory == item.id && !isGC()) ||
  	 					 (item.id=="gift_cards" && isGC()) ||
  	 					 (item.id=="special_offers" && specialOffersSelected)
  	 				) {
  	 					if (currentRootCategory && !isGC()) currentMenu = currentRootCategory;
  	 					tda.className = 'menu_bg_on';	 					
  	 					if ( i == 0 ) {
  	 						//on
  	 						td.innerHTML = "<img name='menuLeft' src='/static/site/common/nav_left_on.gif' border='0'/>";
  	 					}
  	 				} else {
  	 					tda.className = 'menu_bg_off';
  	 				}
   					
     		    	//tda.style.backgroundRepeat = "repeat-x";
   		 
   					var catDiv = document.createElement("div");
   					catDiv.style.overflow = "hidden";
   					catDiv.style.height = "32px";
   					catDiv.style.textAlign = "center";
   					catDiv.style.color = "#ffffff";
   					catDiv.setAttribute("id","cat_" + item.id);
   				        if ( i == 0 ) {
   				        catDiv.innerHTML = "<img style='display:block;border:none;' src='/static/site/common/clear.gif' height='8px' border='0'/>" + 
  				  		"<a onMouseOut='isRightMenu=false;isLeftMenu=true;menuHover=false;hideMenu=true;' onMouseOver='menuHover=true;showSubMenu(\"" + item.id + "\",\"" + lr + "\");' class='topnav_link' href='" + item.templateUrl + "'>" + item.name + "</a>";
   				        } else if ( isLast ) {
   				        catDiv.innerHTML = "<img style='display:block;border:none;' src='/static/site/common/clear.gif' height='8px' border='0'/>" + 
  				  		"<a onMouseOut='isRightMenu=true;isLeftMenu=false;menuHover=false;hideMenu=true;' onMouseOver='menuHover=true;showSubMenu(\"" + item.id + "\",\"" + lr + "\");' class='topnav_link' href='" + item.templateUrl + "'>" + item.name + "</a>";
   				        } else {
   				        catDiv.innerHTML = "<img style='display:block;border:none;' src='/static/site/common/clear.gif' height='8px' border='0'/>" + 
  				  		"<a onMouseOut='isRightMenu=false;isLeftMenu=false;menuHover=false;hideMenu=true;' onMouseOver='menuHover=true;showSubMenu(\"" + item.id + "\",\"" + lr + "\");' class='topnav_link' href='" + item.templateUrl + "'>" + item.name + "</a>";
   				        }
   						
   				 
   		
   					// Loop through subcategories and build up the options
   					var subCatDiv = null;
   				
   					if ( hasSubs == true ) {
   						subCatDiv = document.createElement("div");
   						$(subCatDiv).hover(
   						  function () {
   						    menuHover = true;
   						  },
   					  	function () {
   					  		menuHover = false;
   					  	}
   						);
   						//subCatDiv.style.display = "none";
   						$(subCatDiv).hide();
   						
   				   	 	subCatDiv.className = "sub_menu_on";
   						subCatDiv.setAttribute("id","subcat_" + item.id);
   						subCatDiv.style.width=((item.subcategories.length*175)+15)+"px";
   						eval("menuLoaded."+item.id+" = false; ");
   				
   						$.each(item.subcategories, function(j,subitem){
   							var subDivMain = document.createElement("div");
   							subDivMain.className = "sub_menu_1";

	   						$.each(subitem, function(j,subitem2){
   								var subDiv = document.createElement("div");
   								subDiv.className = "sub_menu_2";
   								subDiv.id="sub_menu_2_"+subitem2.id;
   								subDiv.innerHTML = "<b>" + subitem2.name + "</b>";

								//looks for what's this:
								if (subitem2.whatsThis)
								{
									subDiv.innerHTML+="<a href=\"#\" onclick=\"whatsThis('"+subitem2.id+"', 'block', '"+item.id+"'); return false;\" class=\"whatsThis\">what's this?</a>";
									var subDivWhatsThis = document.createElement("div");
			   						$(subDivWhatsThis).hover(
			   						  function () {
			   						    menuHover = true;
			   						  },
			   					  	function () {
			   					  		menuHover = false;
			   					  	}
			   						);
									
									subDivWhatsThis.className="sub_menu_2_whats_this";
									subDivWhatsThis.id="sub_menu_2_whats_this_"+subitem2.id;
									subDivWhatsThis.innerHTML = subitem2.whatsThis;
									menu.appendChild(subDivWhatsThis);
								}
   								
   								if (subitem2.thirdcategories) {
		   						$.each(subitem2.thirdcategories, function(j,subitem3){
	   								var subDiv2 = document.createElement("div");
	   								subDiv2.className = "sub_menu_3";
	   								subDiv2.innerHTML = "<a class='unav_link' href=\"" + subitem3.templateUrl + "\">" + subitem3.name + "</a>";
	   								subDiv.appendChild(subDiv2);
	   							});
	   							}

	   							subDivMain.appendChild(subDiv);
   							});

   							subCatDiv.appendChild(subDivMain);

   				 		});
   				 		
   				 		//if ( isLast )
   							//subCatDiv.style.marginLeft = "-95px";
   					}
   				
   				
   					tda.appendChild(catDiv);
   			   	 	if ( subCatDiv != null )
   						tda.appendChild(subCatDiv);
   							
   					trw.appendChild(tda);
   					if ( isLast ) {
     					// Add the right rounded corner
     					var td = document.createElement("td");
     					td.style.height = "32px";
     					td.style.width = "6px";
     					if (currentRootCategory && currentRootCategory == item.id && !isGC()) {
     						currentMenu = currentRootCategory;
     						//on
     						td.innerHTML = "<img name='menuRight' src='/static/site/common/nav_right_on.gif' border='0'/>";
						} else if (specialOffersSelected) {
							//on
     						td.innerHTML = "<img name='menuRight' src='/static/site/common/nav_right_on.gif' border='0'/>";
     					} else {
     						//off
     						td.innerHTML = "<img name='menuRight' src='/static/site/common/nav_right.gif' border='0'/>";
     					}
     					trw.appendChild(td);
   					}
            	});
            } else {             
            	// The menu items are unavailable for some reason.
            	// Just show an empty bar with no options.
            	var tdl = document.createElement("td");
     			tdl.style.height = "32px";
     			tdl.style.width = "6px";
     			//off
   				tdl.innerHTML = "<img name='menuLeft' src='/static/site/common/nav_left.gif' border='0'/>";  
   					
   				var tda = document.createElement("td");  				
   				tda.innerHTML = "&nbsp;";  				
   				tda.className = 'menu_bg_off';				
   				var tdr = document.createElement("td");
     			tdr.style.height = "32px";
     			tdr.style.width = "6px";
     			//off
   				tdr.innerHTML = "<img name='menuRight' src='/static/site/common/nav_right.gif' border='0'/>";
   				trw.appendChild(tdl);
   				trw.appendChild(tda);
   				trw.appendChild(tdr);			
            }
            tbdy.appendChild(trw);
		    tbl.appendChild(tbdy);
		    if (document.getElementById('defaultTopNav')) document.getElementById('defaultTopNav').style.display="none";
   		    menu.appendChild(tbl);
        },
        error:function() {
        	// The menu items are unavailable for some reason.
            	// Just show an empty bar with no options.
            	var tdl = document.createElement("td");
     			tdl.style.height = "32px";
     			tdl.style.width = "6px";
     			//off
   				tdl.innerHTML = "<img name='menuLeft' src='/static/site/common/nav_left.gif' border='0'/>";  
   					
   				var tda = document.createElement("td");  				
   				tda.innerHTML = "&nbsp;";
   				tda.className = 'menu_bg_off';			
   				var tdr = document.createElement("td");
     			tdr.style.height = "32px";
     			tdr.style.width = "6px";
     			//off
   				tdr.innerHTML = "<img name='menuRight' src='/static/site/common/nav_right.gif' border='0'/>";
   				trw.appendChild(tdl);
   				trw.appendChild(tda);
   				trw.appendChild(tdr);	
   				tbdy.appendChild(trw);
		    	tbl.appendChild(tbdy);
			    if (document.getElementById('defaultTopNav')) document.getElementById('defaultTopNav').style.display="none";
   		   		menu.appendChild(tbl);	
        }
	});
}
function setPos(itemId)
{
	//DON't reset the position if it has already been set
	var isLoaded = eval("menuLoaded."+itemId);
	if (!isLoaded) 
	{
		//determine proper position for subNav elements
		var cell = document.getElementById("td_"+itemId);
		var submenu = document.getElementById("subcat_"+itemId);
		var topNavTbl = document.getElementById("topNavTbl");
		var menuDiv = document.getElementById("menuDiv");
		var cellLeft = getObjCoords(submenu);
		var menuLeft = getObjCoords(menuDiv);
		
		//get left position of highlighted menu option, relative to nav table.
		var pos = cellLeft.x - menuLeft.x;
		var navTableWidth=getDivWidth(topNavTbl);
		var topNavWidth=getDivWidth(cell);
		var subMenuWidth=getDivWidth(submenu);
		var relPos = pos+subMenuWidth;
		var relPos2 = relPos+topNavWidth;
		//if the submenu is wider than space available, then we'll need to adjust its x-coord
	
		/*//center the submenus under the top tops
		var center = subMenuWidth/2;
		var centerPx = (cellLeft.x+(topNavWidth/2))-center;
		//alert("cellPos: "+cellLeft.x+"\nsubMenuWidth: "+subMenuWidth+"\ncenteredPx: "+centerPx);
		if (centerPx < menuLeft.x+6) { centerPx = menuLeft.x+6; }
		else if (centerPx+subMenuWidth > menuLeft.x+navTableWidth) { 
			centerPx = menuLeft.x+navTableWidth-subMenuWidth-6; 
		}
		submenu.style.left= centerPx+"px";
		*/
		 
		var leftAlign=cellLeft.x+topNavWidth-subMenuWidth;		
		//right-align elements that are past center section of topNavTbl
		submenu.style.left= cellLeft.x-(topNavWidth/2);
		if (pos > navTableWidth/2)
		{
			if (leftAlign>menuLeft.x)
			{
				//align with right side of topNav button
				if(BrowserDetect.browser=="Explorer")
				{	
					submenu.style.left=leftAlign-(topNavWidth/2)+"px";
				}
				else
				{
					submenu.style.left=leftAlign+"px";
				}
			}
			else
			{
				submenu.style.left=menuLeft.x+6+"px";
			}
		}
		//alternate option, left-align submenu with top tab where possible
		else if (pos+subMenuWidth>navTableWidth)
		{
			//first see if we can just left-align the sub-menu, without it going past the leftCoord
			if (subMenuWidth<pos+subMenuWidth)
			{
				
				if (leftAlign>menuLeft.x)
				{
					//align with right side of topNav button
					//submenu.style.left=leftAlign+"px";
		
					//or rightAlign with right-most boundary of table
					submenu.style.left=(menuLeft.x+navTableWidth-subMenuWidth-6)+"px";
				}
				else
				{
					submenu.style.left=menuLeft.x+6+"px";
				}
				
			}
			//otherwise, just left-align it
			else
			{
				submenu.style.left=(cellLeft.x)+"px";
			}
			
		}
		eval("menuLoaded."+itemId+"=true");

	}
}

function isGC()
{
  	var gcSelected = false;
  	if (-1!=window.location.search.indexOf("prod290002")) gcSelected = true;
	return gcSelected;
}

function Point(x, y) {
    this.x = x;
    this.y = y;
}

function getObjCoords(o) {
    var oX = 0;
    var oY = 0;
    if (o.offsetParent) {
        while (1) {
            oX+=o.offsetLeft;
            oY+=o.offsetTop;
                if (!o.offsetParent) {
                    break;
                }
            o=o.offsetParent;
        }
    } else if (o.x) {
        oX+=o.x;
        oY+=o.y;
    }
    //alert(oX + ":" + oY);
    return new Point(oX, oY);
}

function hideAllSubs(pCheckCurrent)
{
  // Turn off all other menus - if any are on
  	var menuNode= document.getElementById('topNavTbl');
  	var subMenus = getElementsByClass("sub_menu_on", menuNode, "div");
  	if (null!=subMenus && ""!=subMenus)
  	{
  		for (i=0; i<subMenus.length; i++)
  		{
  			if ( pCheckCurrent && menuHover == true && currentSubMenu != "" && currentSubMenu==subMenus[i].id )
  			{ /*do not hide this submenu*/ }
  			else
  			{
			  	$(subMenus[i]).hide();
			}
  		}
  	}
}

function showSubMenu(catId,lr) {
  //alert(currentRootCategory);
	var currTd = document.getElementById('td_' + currentMenu);
	var catTd =  document.getElementById('td_' + catId);
  	var specialOffersSelected = false;
  	if (-1!=document.location.href.indexOf("promotions.jsp")) specialOffersSelected = true;

    closeWhatsThis();
    hideAllSubs(false);
	
  if ( currentSubMenu != "" ) {
  	$(currentSubMenu).hide();
  	//document.getElementById(currentSubMenu).style.display = "none";
  }
  if ( currentMenu != "") {
  	if (
  		(currentMenu == currentRootCategory && !isGC()) ||  
  		(specialOffersSelected && currentMenu=="special_offers") ||
  		(isGC() && currentMenu=="gift_cards")
  	) 
  	{
  		//do nothing
  	}
  	else
	{
		currTd.className = 'menu_bg_off';
	}
  }
  
  if ( lr != "" ) {
  	if ( lr == "l" ) 
  		document['menuLeft'].src = "/static/site/common/nav_left_on.gif"; //on
  	if ( lr == "r" ) 
  		document['menuRight'].src = "/static/site/common/nav_right_on.gif";    //on
  } else {
    if ( currentMenu != "" && currentMenu != currentRootCategory && !specialOffersSelected) {
  		document['menuRight'].src = "/static/site/common/nav_right.gif";  //off
  		document['menuLeft'].src = "/static/site/common/nav_left.gif";  //off
  	}
  }
  if ( currentRootCategory != "" && leftMenu == currentRootCategory ) {
  	document['menuLeft'].src = "/static/site/common/nav_left_on.gif";  //on
  }
  if ( currentRootCategory != "" && rightMenu == currentRootCategory ) {
  	document['menuRight'].src = "/static/site/common/nav_right_on.gif"; //on
  }
  catTd.className = 'menu_bg_on';
  
  if (   document.getElementById('subcat_' + catId) ) {
  	var sub = document.getElementById('subcat_' + catId);

	//div must be set to 0 opacity & display = block in order to get the values for the submenu width and position
	changeOpac(0, 'subcat_'+catId);
  	sub.style.display = "block";
  	//set proper pos of submenu
  	setPos(catId);
  	sub.style.display="none";
	changeOpac(100, 'subcat_'+catId);
	currentSubMenu = "subcat_" + catId;
	
	//$(sub).slideDown(200);
	
	$(sub).show();
	//sub.style.display="block";
	hideAllSubs(true);
  	lastMenu = currentMenu;
  	currentMenu = catId;
  }
  currentMenu = catId;
}

function hideSubMenu() {
  	var specialOffersSelected = false;
  	var currTd = document.getElementById('td_' + currentMenu);
  	if (-1!=document.location.href.indexOf("promotions.jsp")) specialOffersSelected = true;

	

  if ( document.getElementById(currentSubMenu) ) 
  {
    //document.getElementById(currentSubMenu).style.display = "none";   
    $(currentSubMenu).hide();
    closeWhatsThis();
  }

  if ( document.getElementById("td_" + currentMenu))
  {
  	if (
  		(currentMenu == currentRootCategory && !isGC()) ||  
  		(specialOffersSelected && currentMenu=="special_offers") ||
  		(isGC() && currentMenu=="gift_cards")
  	) 
  	{
  		//do nothing
  	}
  	else
  	{
  		currTd.className = 'menu_bg_off';
  	}
  }
  
  if ( document['menuLeft'] ) {
  	if ( currentRootCategory != "" && leftMenu == currentRootCategory ) {
  		document['menuLeft'].src = "/static/site/common/nav_left_on.gif"; //on
 	 } else {
 	   	if ( isLeftMenu ) {
  			document['menuLeft'].src = "/static/site/common/nav_left.gif"; //off
  			isLeftMenu = false;
  		}
  	}
  }
  
  if ( document['menuRight'] ) {
  	if (( currentRootCategory != "" && rightMenu == currentRootCategory) || specialOffersSelected ) {
  		document['menuRight'].src = "/static/site/common/nav_right_on.gif";  //on
  	} else {
  	    if ( isRightMenu ) {
  		document['menuRight'].src = "/static/site/common/nav_right.gif";  //off
  			rightMenu = false;
  		}
  	}
  }
  hideAllSubs(true);
}

function findPositionX(obj) {
    var curleft = 0;
    if (obj.offsetParent) {
        while (1) {
            curleft+=obj.offsetLeft;
            if (!obj.offsetParent) {
                break;
            }
            obj=obj.offsetParent;
        }
    } else if (obj.x) {
        curleft+=obj.x;
    }
    return curleft;
}
function findPositionY(obj) {
    var curtop = 0;
    if (obj.offsetParent) {
        while (1) {
            curtop+=obj.offsetTop;
            if (!obj.offsetParent) {
                break;
            }
            obj=obj.offsetParent;
        }
    } else if (obj.y) {
        curtop+=obj.y;
    }
    return curtop;
}

function getElementsByClass(searchClass,node,tag) {
	var classElements = new Array();
	if ( node == null )
		node = document;
	if ( tag == null )
		tag = '*';
	var els = node.getElementsByTagName(tag);
	var elsLen = els.length;
	var pattern = new RegExp('(^|\\s)'+searchClass+'(\\s|$)');
	for (i = 0, j = 0; i < elsLen; i++) {
		if (els[i].className && els[i].className.match(pattern)) {
			classElements[j] = els[i];
			j++;
		}
	}
	return classElements;
}

function getNodeElementsByName(searchClass,node,tag) {
	var classElements = new Array();
	if ( node == null )
		node = document;
	if ( tag == null )
		tag = '*';
	var els = node.getElementsByTagName(tag);
	var elsLen = els.length;
	var pattern = new RegExp('(^|\\s)'+searchClass+'(\\s|$)');
	for (i = 0, j = 0; i < elsLen; i++) {
		if (els[i].name && els[i].name.match(pattern)) {
			classElements[j] = els[i];
			j++;
		}
	}
	return classElements;
}


//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 

function getDivHeight(pNode)
{ 
	return pNode.innerHeight?pNode.innerHeight:pNode.offsetHeight+document.body.offsetTop; 
}
function getDivWidth(pNode)
{ 
	return pNode.innerWidth?pNode.innerWidth:pNode.offsetWidth; 
}



