window.LBi = window.LBi || {};

LBi.dropdown_products = {
	dropDownPanels: function () {
		LBi.dropdown_products.dropDownPanels.isOpen = false;
		var closeFn = function (e) {
			var thisObj = $(".close", $(".has_drop_down")).get(0);
			thisObj.className = "drop_down";
			thisObj.innerHTML = "Open";
			thisObj.title = "Open";
			ddLink.find('a').removeClass("selected");
			ddWindow.css({
				display: "none"
			});
			ddLink.css({
				zIndex: 0
			});
			bgPanel.css({
				display: "none"
			});
			LBi.dropdown_products.dropDownPanels.isOpen = false;
			$("#header ul li").css({
				borderBottom: "none"
			});
			// blurring as now we have focus styles it looked crap when closing out
			thisObj.blur();
			document.onkeydown = null;
		};
		var ddPanels = $(".has_drop_down .drop_down");
		var bgPanel = $("#bgPanel");
		bgPanel.click(closeFn);
		for (i = 0, j = ddPanels.length; i < j; i++) {
			ddLink = $(ddPanels[i].parentNode);
			ddWindow = $('<div class="ddWindow"></div>').appendTo($("body"));
			$(ddPanels[i]).click(function () {
				$(ddWindow).html($("#dropdown_links").html());
				this.className = "close";
				this.title = "Close";
				this.innerHTML = "Close";
				if (ddLink.className != "selected") {
					ddLink.find('a').addClass("selected");
				}
				$("#header ul li").css({
					borderBottom: "1px solid #cccccc"
				});
				$("#header ul li.openedDropDown").css({
					borderBottom: "1px solid white"
				});
				var ddClose = $(".close", ddWindow);
				if (LBi.dropdown_products.dropDownPanels.isOpen) {
					closeFn();
					return false;
				} else {
					LBi.dropdown_products.dropDownPanels.isOpen = true;
					ddClose.click(closeFn);
					var mainContent = $(".ngaCoreContainer").get(0);
					var refX = (document.all) ? mainContent.offsetParent.offsetLeft : mainContent.offsetLeft;
					refX = refX - 6;
					var refY = mainContent.offsetTop;
					ddWindow.css({
						display: "block",
						zIndex: 100,
						position: "absolute",
						left: refX,
						top: refY
					});
					LBi.dropdown_products.dropDownPanels.setUpDD(this, bgPanel);
					document.onkeydown = function (e) {
						if (e == null) {
							keycode = event.keyCode;
						} else {
							keycode = e.which;
						}
						if (keycode == 27) {
							closeFn();
						}
					};
				}
				return false;
			});
		};
		LBi.dropdown_products.dropDownPanels.setUpDD = function (ddLink, bgPanel) {
			ddLink = ddLink.parentNode.parentNode;
			var pageHeight = $("#layWrp1").get(0).offsetHeight;
			var topOffset = ddLink.offsetTop + ddLink.offsetHeight + 1;
			bgPanel.css({
				height: pageHeight - topOffset + "px",
				top: topOffset + "px",
				display: "block",
				zIndex: 99
			});
		};
		LBi.dropdown_products.dropDownPanels.repositionDropDown = function() {
			if (LBi.dropdown_products.dropDownPanels.isOpen) {
				var ddPanel = $(".has_drop_down .close").get(0);
				var ddPanelParent = ddPanel.parentNode;
				var mainContentArea = $(".ngaCoreContainer").get(0);
				var ddContentWindow = $(".ddWindow").get(0);
				var refX = (document.all) ? mainContentArea.offsetParent.offsetLeft : mainContentArea.offsetLeft;
				refX = refX - 6;
				var refY = mainContentArea.offsetTop;
				$(ddContentWindow).css({
					left: refX,
					top: refY
				});
			}
		};
	}
};

LBi.dropdown_products.dropDownPanels();
$(window).resize(function() {
	LBi.dropdown_products.dropDownPanels.repositionDropDown();
});