var LightBox = {};
$(document).ready(function(){
	LightBox = new (function(){
		// private members
		var me = this;
		var loadingHTML = '<div class="loading"><img src="/wcsstore/argos/en_US/images/lightbox/img/loading.gif" alt="loading"/></div>';
		var config = {tooltipText: "To close the stock availability tool box click on the 'Close X' link", closeOnOverlayClick: false, closeClass: "closeLightBox", opacity: "0.45"};
		var IE6 = ($.browser.msie && parseInt($.browser.version) == 6);
		var IE7 = ($.browser.msie && parseInt($.browser.version) == 7);
		var FF = ($.browser.mozilla); //needs work to not do it for FF3 etc
		var state = {showingOverlay: false,	showingDialogue: false,	yScrollPos: 0}
		var overlay = (function(){
			var o;
			o = document.createElement("div");
			o.id = "overlay";
			$(o).css({opacity: config.opacity});// for cross browser lovelyness
			if(IE6 || FF) {
				$(o).css({position: "absolute"});
			}			
			if (config.closeOnOverlayClick) {
				$(o).bind("click", hideOverlay);
				$(o).bind("click", hideLightBox);
			}
			document.body.appendChild(o);		
			return o;
		}());
		var dialogue = (function(){
			var o;
			o = document.createElement("div");
			o.id = "lightBox";
			document.body.appendChild(o);
			return o;
		}());	

		if(IE6 || FF) {
			$(window).resize(window_onResize);
			$(window).scroll(window_onScroll);
		}

		function window_onResize() {
			setIE6Style();
		}

		function window_onScroll() {
			setIE6Style();		
		}		

		function setOverlayTooltip(value) {
			$(overlay).attr("title", value);
		}

		/*
		 * 
		 */
		function showOverlay() {
			if(state.showingOverlay) return;
			if (IE6) {
				setSelectsVisibilityStyle(false);
				setIE6Style();
			}
			if (IE7 || IE6) {
				setFlashVisibilityStyle(false);
			}
			$(overlay).css({display: "block"});
			$(overlay).attr("title", config.tooltipText);
			state.showingOverlay = true;
		}

		/*
		 * hide the overlay
		 * IE6 has extra function calls
		 * @param void
		 * @return void
		 */
		function hideOverlay(){
			if (!state.showingOverlay) return;
			if (IE6) {
				setSelectsVisibilityStyle(true);
			}
			if (IE7 || IE6) {
				setFlashVisibilityStyle(true);
			}			
			$(overlay).css({display: "none"});
			state.showingOverlay = false;
		}
		
		/*
		 * show light box - restyles and shows
		 * @param void
		 * @return void
		 */
		function showLightBox() {
		
			styleLightBox();
				
		}
		
		/*
		 * hide light box
		 * @param void
		 * @return void
		 */
		function hideLightBox() {
			$(dialogue).css({left: "-99999em"});
		}

		/*
		 * style and position the light box
		 * @param void
		 * @return void
		 */
		function styleLightBox() {		
			var position = {};
			position.left = (function(){
				var x = (($(window).width()+ - $(dialogue).width()) / 2) + $(window).scrollLeft();
				if(x < 0) x = 0;
				return x+"px";
			}());
			
			position.top = (function(){
				var x = (($(window).height() - $(dialogue).height()) / 2) + $(window).scrollTop();
				if(x < 0) x = 0;
				return x+"px";
			}());
			
			
			$(dialogue).css({left:position.left,top:position.top});
			
			if(IE6) {
				setIE6Style();
				
				
			}
		}

		/*
		 * set the html for the lightbox
		 * @param html as string of html
		 * @return void
		 */
		function setHTML(html) {
			dialogue.innerHTML = html;
			setCloseEvent();
		}
		
		/*
		 * apply close event to close buttons
		 * @param void
		 * @return void
		 */
		function setCloseEvent() {
			
			var closeButton = $(dialogue).find("a."+config.closeClass)[0] || null;
			
			if(!closeButton) return;
			
			
			$(closeButton).bind("click",function(){
			
				hideLightBox();
				hideOverlay();
				return false;
			});
		}
		
		/*
		 * toggle <select> visibility to fix IE6 select zIndex issue
		 * @param toVisible as boolean
		 * @return void
		 */
		function setSelectsVisibilityStyle(toVisible) {
			var visibility = toVisible ? "visible" : "hidden";
			$("select").css({visibility: visibility});		
		}
		
		/*
		 * toggle <embed> or <object> visiiblity to fix IE6/IE7 zIndex issue
		 * @param toVisible as boolean
		 * @return void
		 */
		function setFlashVisibilityStyle(toVisible) {
			var visibility = toVisible ? "visible" : "hidden";
			$("embed, object").css({visibility: visibility});
		}		
		
		/*
		 * fixes overlay issue in IE6
		 * possible fix would be to calculate on resize/scroll new height and offset
		 * @param reset as boolean
		 * @return void
		 */
		function setIE6Style() {
			$(overlay).css({
				height: $(document).height()+"px",
				width: $(document).width()+"px"
			});
			
			
		}
		
		// public members
		this.showOverlay = showOverlay;
		this.hideOverlay = hideOverlay;
		this.showLightBox = showLightBox;
		this.hideLightBox = hideLightBox;
		this.setHTML = setHTML;
		this.setOverlayTooltip = setOverlayTooltip;
		this.loadingHTML = loadingHTML;
	});
});
