///////////////// Lightbox-ish Gray Screen Stuff //////////////

var messageOffset = 55;  // used for centering the phone number
var mapOffset = 101;  // used for centering the fake map

var dialogGrayScreen, dialogWrapper, dialogMessage, dialogBox;  // the divs
var clickBubble = 0;

function initGrayScreen() {
	dialogGrayScreen = document.createElement("div");
	dialogGrayScreen.setAttribute('id','dialogGrayScreen');
	dialogGrayScreen.className = 'hidden';

	dialogWrapper = document.createElement("div");
	dialogWrapper.setAttribute('id','dialogWrapper');
	
	dialogMessage = document.createElement("div");
	dialogMessage.setAttribute('id','dialogMessage');
	dialogMessage.className = 'hidden';
	
	dialogBox = document.createElement("div");
	dialogBox.setAttribute('id','dialogBox');
	dialogBox.className = 'hidden';


	dialogWrapper.appendChild(dialogMessage);
	dialogWrapper.appendChild(dialogBox);
	dialogGrayScreen.appendChild(dialogWrapper);
	var bodies = document.getElementsByTagName('body');
	bodies[0].appendChild(dialogGrayScreen);
	
	dialogGrayScreen.onclick = hideBox;
	dialogBox.onclick = IncrementClickBubble;
}

function displayDialogMessage(text, size) {
	// alert('displayDialogMessage: '+displayDialogMessage.outerHTML);

	var pageScroll = getPageScroll();
    var pageSize = getPageSize();
    var viewSize = getViewSize();
	
	dialogMessage.innerHTML = text;
	
	if (size == 'small') {
		dialogMessage.className = 'dialogMessageSmall';
	} else if (size == 'medium') {
		dialogMessage.className = 'dialogMessageMedium';
	} else if (size == 'large') {
		dialogMessage.className = 'dialogMessageLarge';
	} else {
		// check for a small screen width
		if (viewSize[0] < 330) {
			dialogMessage.className = 'dialogMessageSmall';
		} else if (viewSize[0] < 685) {
			dialogMessage.className = 'dialogMessageMedium';
		} else {
			dialogMessage.className = 'dialogMessageLarge';
		}
	}
	paddingTop = Math.round(pageSize[3]/2) + pageScroll[1] - messageOffset;
	paddingBottom = pageSize[1] - (paddingTop + messageOffset);
	dialogMessage.style.paddingTop = paddingTop+'px';
	dialogMessage.style.paddingBottom = paddingBottom+'px';

	dialogGrayScreen.className = 'dialogGrayScreen';
	// if (navigator.userAgent.indexOf('Firefox') != -1 && pageSize[1] > viewSize[1]) {
	// 	// there's a scroll bar and we need to adjust for it with Firefox unless there is also a horizonal scroll bar
	// 	var windowWidth = viewSize[0] - 15;
	// } else {
	// 	var windowWidth = viewSize[0];
	// }
		
	dialogWrapper.style.left = pageScroll[0]+'px';
	dialogWrapper.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.height = pageSize[1]+'px';
}


function displayDialogBox(html, size) {
	var top_margin = 100;

	var pageScroll = getPageScroll();
    var pageSize = getPageSize();
    var viewSize = getViewSize();
	
	// this isn't working... argh
	var marginTop = top_margin + pageScroll[1]+'px';
	dialogBox.style.margin = marginTop+' auto';
	
	dialogBox.innerHTML = html;
	
	if (size == 'small') {
		dialogBox.className = 'dialogBoxSmall';
	} else if (size == 'large') {
		dialogBox.className = 'dialogBoxLarge';
	} else if (size == 'login') {
		dialogBox.className = 'dialogMessageLogin';
	} else {
		dialogBox.className = 'dialogBoxMedium';
	}

	dialogGrayScreen.className = 'dialogGrayScreen';
	// if (navigator.userAgent.indexOf('Firefox') != -1 && pageSize[1] > viewSize[1]) {
	// 	// there's a scroll bar and we need to adjust for it with Firefox unless there is also a horizonal scroll bar
	// 	var windowWidth = viewSize[0] - 15;
	// } else {
	// 	var windowWidth = viewSize[0];
	// }
		
	dialogWrapper.style.left = pageScroll[0]+'px';
	dialogWrapper.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.height = pageSize[1]+'px';
}

function displayConfirmBox(html, action, buttonValue, size, jsFunction, cancelButton) {
	var buttonValue = buttonValue || 'Yes';
	var cancelButton = cancelButton || 'Cancel';
	var jsFunction = jsFunction || '';
	var top_margin = 100;

	var pageScroll = getPageScroll();
    var pageSize = getPageSize();
    var viewSize = getViewSize();
	
	// this isn't working... argh
	var marginTop = top_margin + pageScroll[1]+'px';
	dialogBox.style.margin = marginTop+' auto';
	
	if (typeof jsFunction != 'undefined' && jsFunction != '') {
		var form = "<form method='post' action='"+action+"'><input type='submit' name='SUBMIT' value='"+cancelButton+"' onclick='hideBox(); return false';> &nbsp; <input type='submit' name='SUBMIT' value='"+buttonValue+"'></form>";
	} else {
		var form = "<form method='post'><input type='button' name='SUBMIT' value='"+cancelButton+"' onclick='hideBox(); return false'> &nbsp; <input type='button' id='confirmAction' name='SUBMIT' value='"+buttonValue+"' ></form>";
	}
	
	dialogBox.innerHTML = html+form;
	
	if (size == 'small') {
		dialogBox.className = 'dialogBoxSmall';
	} else if (size == 'large') {
		dialogBox.className = 'dialogBoxLarge';
	} else {
		dialogBox.className = 'dialogBoxMedium';
	}

	dialogGrayScreen.className = 'dialogGrayScreen';
	// if (navigator.userAgent.indexOf('Firefox') != -1 && pageSize[1] > viewSize[1]) {
	// 	// there's a scroll bar and we need to adjust for it with Firefox unless there is also a horizonal scroll bar
	// 	var windowWidth = viewSize[0] - 15;
	// } else {
	// 	var windowWidth = viewSize[0];
	// }
		
	dialogWrapper.style.left = pageScroll[0]+'px';
	dialogWrapper.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.height = pageSize[1]+'px';
	
	$('#confirmAction').click(function() {
		alert('asdf');
		jsFunction();
		hideBox();
		return false;
	});
}

function displayShoppingCart(html) {
	var top_margin = 50;

	var pageScroll = getPageScroll();
    var pageSize = getPageSize();
    var viewSize = getViewSize();
	
	// this isn't working... argh
	var marginTop = top_margin + pageScroll[1]+'px';
	dialogBox.style.margin = marginTop+' auto';
	
	dialogBox.innerHTML = html;
	dialogBox.className = 'dialogShoppingCart';

	dialogGrayScreen.className = 'dialogGrayScreen';
	// if (navigator.userAgent.indexOf('Firefox') != -1 && pageSize[1] > viewSize[1]) {
	// 	// there's a scroll bar and we need to adjust for it with Firefox unless there is also a horizonal scroll bar
	// 	var windowWidth = viewSize[0] - 15;
	// } else {
	// 	var windowWidth = viewSize[0];
	// }
		
	dialogWrapper.style.left = pageScroll[0]+'px';
	dialogWrapper.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.height = pageSize[1]+'px';
	
	// Orders placed before 2PM today can be picked up tomorrow (usually)
	var minDate = new Date();
	if(minDate.getHours() < 14) {
		// order for tomorrow by default
		minDate.setDate(minDate.getDate() + 1);
	} else {
		// day after tomorrow
		minDate.setDate(minDate.getDate() + 2);
	}
	$('#pickdate').datepicker({minDate:minDate});
	$('#deliverydate').datepicker({minDate:minDate});
	
	$('#pickup').click(function() {
		if($('#deliveryInfo').css('display') == 'block') {
			$('#deliveryInfo').slideUp(function() {
				$('#pickupInfo').slideDown();
			});
		} else {
			$('#pickupInfo').slideDown();
		}
		updateDateTime("pickup");
	});
	$('#delivery').click(function() {
		if($('#pickupInfo').css('display') == 'block') {
			$('#pickupInfo').slideUp(function() {
				$('#deliveryInfo').slideDown();
			});
		} else {
			$('#deliveryInfo').slideDown();
		}
		updateDateTime("delivery");
	});
}

function displayWelcomeBox(html) {
	var top_margin = 50;

	var pageScroll = getPageScroll();
    var pageSize = getPageSize();
    var viewSize = getViewSize();
	
	// this isn't working... argh
	var marginTop = top_margin + pageScroll[1]+'px';
	dialogBox.style.margin = marginTop+' auto';
	
	dialogBox.innerHTML = html;
	dialogBox.className = 'dialogShoppingCart';

	dialogGrayScreen.className = 'dialogGrayScreen';
	// if (navigator.userAgent.indexOf('Firefox') != -1 && pageSize[1] > viewSize[1]) {
	// 	// there's a scroll bar and we need to adjust for it with Firefox unless there is also a horizonal scroll bar
	// 	var windowWidth = viewSize[0] - 15;
	// } else {
	// 	var windowWidth = viewSize[0];
	// }
		
	dialogWrapper.style.left = pageScroll[0]+'px';
	dialogWrapper.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.width = viewSize[0]+'px';
	dialogGrayScreen.style.height = pageSize[1]+'px';
	
	// alert(pageSize[1]+" "+pageScroll[1]);
}



function hideBox(effect) {
	var effect = effect || '';
	var divIds = new Array('dialogGrayScreen'); //,'dialogWrapper','dialogMessage','dialogBox');

	switch(effect) {
		case 'fade':
			for(var i=0; i<divIds.length; i++) {
				var div = document.getElementById(divIds[i]);
				if(div.className != 'hidden') {
					opacity(divIds[i],100,0,500);
					// setTimeout
				}
			}
			break;
		default:
			if (clickBubble > 0) {
				clickBubble = 0;	
			} else {
				dialogMessage.className = 'hidden';
				dialogBox.className = 'hidden';
				dialogGrayScreen.className = 'hidden';
			}
	}
}



///////////////////  For fading and/or removing elements /////////////
function fadeAway(id, opacStart, opacEnd, millisec) {
	setTimeout("deleteDiv('"+id+"')",millisec+100);
	opacity(id, opacStart, opacEnd, millisec);
}

function deleteDiv(divId) {
	var div = document.getElementById(divId);
	div.parentNode.removeChild(div);
}

function opacity(id, opacStart, opacEnd, millisec) { 
    	//speed for each frame 
    	var speed = Math.round(millisec / 100); 
    	var timer = 0; 
	
	//determine the direction for the blending, if start and end are the same nothing happens 
	if(opacStart > opacEnd) {
		for(i = opacStart; i >= opacEnd; i--) { 
	 		setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
	      		timer++;
	 	} 
	    } else if(opacStart < opacEnd) { 
        	for(i = opacStart; i <= opacEnd; i++) { 
	            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
    		    timer++; 
    	    } 
   	}
} 

//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 + ")"; 
}
/////////////////////////////////////////////////////////////////


//
// getPageScroll()
// Returns array with x,y page scroll values.
// Core code from - quirksmode.org
//
function getPageScroll(){

	// var yScroll;
	// var xScroll;
	// 
	// if (self.pageYOffset) {
	// 	yScroll = self.pageYOffset;
	// } else if (document.documentElement && document.documentElement.scrollTop){	 // Explorer 6 Strict
	// 	yScroll = document.documentElement.scrollTop;
	// } else if (document.body) {// all other Explorers
	// 	yScroll = document.body.scrollTop;
	// }
	// 
	// if (self.pageXOffset) {
	// 	xScroll = self.pageXOffset;
	// } else if (document.documentElement && document.documentElement.scrollLeft){	 // Explorer 6 Strict
	// 	xScroll = document.documentElement.scrollLeft;
	// } else if (document.body) {// all other Explorers
	// 	xScroll = document.body.scrollLeft;
	// }
	// 
	// arrayPageScroll = new Array(xScroll,yScroll) 
	arrayPageScroll = new Array($(document).scrollLeft(),$(document).scrollTop()); 
	return arrayPageScroll;
}


function getPageSize(){
	// jQuery helped this code go away
	arrayPageSize = new Array($(document).width(),$(document).height(),$(window).width(),$(document).height());
	return arrayPageSize;
}


//
function getViewSize() {
	// var x,y;
	// if (self.innerHeight) { // all except Explorer
	// 	x = self.innerWidth;
	// 	y = self.innerHeight;
	// } else if (document.documentElement && document.documentElement.clientHeight) {
	// 	// Explorer 6 Strict Mode
	// 	x = document.documentElement.clientWidth;
	// 	y = document.documentElement.clientHeight;
	// } else if (document.body) {
	// 	// other Explorers
	// 	x = document.body.clientWidth;
	// 	y = document.body.clientHeight;
	// }
	// var viewSize = new Array(x,y);
	var viewSize = new Array($(window).width(),$(window).height());
	return viewSize;
}

function IncrementClickBubble() {
	clickBubble++;
}

////////////// end gray screen ///////////