if ($_hh) {
	
	$_hh.hl = {
		
		cache: {},
		relIdx: {},
		
		overlay: null,
		
		'showG': function (id) {
			$("#glossary-entry-holder .glossaryData").empty();
			var el = $("#glossary-entry-holder");
			el.get(0).glossaryEntry = id;
			el.attr("overlay", true);
			if ($_hh.hl.cache[id]) {
				el.html($_hh.hl.cache[id]);
				$_hh.hl.fillSeeAlso(null, id);
			} else {
				el.html('<div class="loading"><span>loading..</span></div>');
				$.get("/ajax/glossary/"+id+".html", function(data) {
						data = '<div class="glossaryFrame">' + data + '</div>';
						$_hh.hl.cache[id] = data;
						el.html(data);
						$_hh.hl.fillSeeAlso(null, id);
					});
			}
		},
		
		'newSeeAlso': function (id, name, rel) {
			rel = rel || $("#glossary-entry-holder").get(0).glossaryEntry;
			
			if (!rel) return;
			
			if (!this.relIdx[rel]) {
				this.relIdx[rel] = {};
			}
			this.relIdx[rel][id] = name;
		},
		
		'getSeeAlso': function (id, name) {
			return '<a href="#'+id+'" rel="'+id+'" class="glossaryEntry">' + name + '</a>';
		},
		
		'fillSeeAlso': function(what, skip) {
			what = what || $("#glossary-overlay").get(0).glossarySource;
			skip = skip || 0;
			var rel = $("#glossary-entry-holder").get(0).glossaryEntry;
			$("#glossary-overlay .seeAlso span:first").html("");
			var seeAlso = [];
			for (var o in what.tipList) {
				if (o != skip) {
					seeAlso.push($_hh.hl.getSeeAlso(o, what.tipList[o]));
				}
			}
			if (this.relIdx[rel]) {
				for (var o in this.relIdx[rel]) {
					if (o != skip) {
						if (!what.tipList[o]) {
							seeAlso.push($_hh.hl.getSeeAlso(o, this.relIdx[rel][o]));
						}
					}
				}
			}
			if (seeAlso.length) {
				$("#glossary-overlay .seeAlso span:first").append(seeAlso.join(", "));
			} else {
				$("#glossary-overlay .seeAlso").hide();
			}
			
			
			$("#glossary-overlay a.glossaryEntry").bind("click", function(e) {
				$_hh.hl.showG($(this).attr("rel")); 
				e.stopPropagation();
				return e.preventDefault();
			});
		},
		
		'showTT': function () {
			
			var text = '<div id="glossary-entry-holder"></div><div class="seeAlso">See also <span>';
			text += '</span></div>';
			text += '<div class="glossaryDisclaimer"><strong>Disclaimer:</strong> Our food glossary provides generic reference information only. The actual product may vary.</div>';
			
			// close button
			text += '<div class="close"></div>';
			
			$("#glossary-overlay").get(0).glossarySource = this;
			$_hh.hl.overlay.target = this;
			
			$("#glossary-overlay #glossary-content").html(text);
			
			$("#glossary-overlay .close").bind("click.overlay", function() { 
				$_hh.hl.overlay.close();  
			});
			
			$_hh.hl.overlay.load();
		},
		
		'bind':	function() {
			var ext = $.browser.msie ? 'gif' : 'png';
			var directory = 'images/design/fancyzoom';
			if (!$_hh.hl.overlay) {
				$("body").append(' \
			<div id="glossary-overlay"> \
				<table id="zoom_table" style="border-collapse:collapse; width:100%; height:100%;"> \
                    <tbody> \
                      <tr> \
                        <td class="tl" style="background:url(' + directory + '/tl.' + ext + ') 0 0 no-repeat; width:20px; height:20px; overflow:hidden;" /> \
                        <td class="tm" style="background:url(' + directory + '/tm.' + ext + ') 0 0 repeat-x; height:20px; overflow:hidden;" /> \
                        <td class="tr" style="background:url(' + directory + '/tr.' + ext + ') 100% 0 no-repeat; width:20px; height:20px; overflow:hidden;" /> \
                      </tr> \
                      <tr> \
                        <td class="ml" style="background:url(' + directory + '/ml.' + ext + ') 0 0 repeat-y; width:20px; overflow:hidden;" /> \
                        <td class="mm" style="background:#fff; vertical-align:top; padding:10px;"> \
                          <div id="glossary-content"> \
                          </div> \
                        </td> \
                        <td class="mr" style="background:url(' + directory + '/mr.' + ext + ') 100% 0 repeat-y;  width:20px; overflow:hidden;" /> \
                      </tr> \
                      <tr> \
                        <td class="bl" style="background:url(' + directory + '/bl.' + ext + ') 0 100% no-repeat; width:20px; height:20px; overflow:hidden;" /> \
                        <td class="bm" style="background:url(' + directory + '/bm.' + ext + ') 0 100% repeat-x; height:20px; overflow:hidden;" /> \
                        <td class="br" style="background:url(' + directory + '/br.' + ext + ') 100% 100% no-repeat; width:20px; height:20px; overflow:hidden;" /> \
					  </tr> \
                    </tbody> \
                  </table> \
				</div>');
				$("#glossary-overlay").hide();
				try {
					$_hh.hl.overlay = $("#glossary-overlay").overlay({
						api: true,
						// disable this for modal dialog-type of overlays 
					    closeOnClick: true,
						top: "center",
						fadeInSpeed: 0,
						speed:1,
						expose: {color: '#fafafa', loadSpeed:0}
					});
				} catch(e) {alert(e)}
			}
			
			//Old way
			if($('#menu_div').length){
				$("span.hl", this).each(function() {
					
					var $rel = $(this).attr("rel");
					if (!$rel) return;
					var $tr = $(this).parents("tr").eq(0);
					if ($tr) {
						var $nameholder = $tr.hasClass("menuitem_hl") ? $tr : $tr.prev("tr.menuitem_hl");
	
						if ($nameholder.length) {
							var $tipholder = $nameholder.find("td:first");
							// skipping toolip if title doesn't contains any items to highlight
							if ($tipholder.find("span.hl").length) {
								if (!$tipholder.find("span.glossary").length) {
									$tipholder.append('<span class="glossary"><img src="images/icons/help_popup.gif" /></span>');
									var $tip = $tipholder.find("span.glossary").eq(0);
									
									$tip.bind("click", function(e) {
										$_hh.hl.showTT.call(this);
										$_hh.hl.fillSeeAlso(this);
										$("#glossary-overlay a.glossaryEntry:first").click();
									});
									
								} else {
									var $tip = $tipholder.find("span.glossary").eq(0);
								}
								
								var tipSpan = $tip.get(0);
								if (!tipSpan.tipList) {
									tipSpan.tipList = {};
								}
								var $term = this.innerHTML;
								
								if (!tipSpan.tipList[$rel]) {
									tipSpan.tipList[$rel] = $term;
								}
							}
						}
					}
					
				});
			}
			//New way
			if($('#rest-menu-main').length){
				$("span.hl", this).each(function() {
					
					var $rel = $(this).attr("rel");
					if (!$rel) return;
					var $tr = $(this).parents("tr").eq(0);
					if ($tr) {
						var $nameholder = $tr.hasClass("menuItem") ? $tr : $tr.prev("tr.menuItem");
	
						if ($nameholder.length) {
							var $tipholder = $nameholder.find("div.menuItemName:first");
							// skipping toolip if title doesn't contains any items to highlight
							if ($tipholder.find("span.hl").length) {
								if (!$tipholder.find("span.glossary").length) {
									$tipholder.append('<span class="glossary"><img src="images/icons/help_popup.gif" /></span>');
									var $tip = $tipholder.find("span.glossary").eq(0);
									
									$tip.bind("click", function(e) {
										$_hh.hl.showTT.call(this);
										$_hh.hl.fillSeeAlso(this);
										$("#glossary-overlay a.glossaryEntry:first").click();
									});
									
								} else {
									var $tip = $tipholder.find("span.glossary").eq(0);
								}
								
								var tipSpan = $tip.get(0);
								if (!tipSpan.tipList) {
									tipSpan.tipList = {};
								}
								var $term = this.innerHTML;
								
								if (!tipSpan.tipList[$rel]) {
									tipSpan.tipList[$rel] = $term;
								}
							}
						}
					}
					
				});
			}
			
			
		}
		
	}
}