/**
 * Controls interaction with the Find a Doctor and Find a Location form
 */
 
 if (typeof(console) === 'undefined') {
	console = {
		dir: function(){},
		log: function(){}
	};
}
 
(function() {
	
		//----------------------------------------------------------------------
		// STATIC PROPERTIES
		//----------------------------------------------------------------------
		
	var IDS = {
		CITY:				'city',
		DOCTOR_FORM:		'form_find_a_doctor',
		LOCATION:			'location',
		LOCATION_FORM:		'form_find_a_location',
		NAME:				'last_name',
		REGION:				'region',
		SPECIALTY:			'specialty'
	};
	
	
	var NAV_TABLE_ID =			'widgets';
	var POPUP_CLASS = 			'popup_button';
	
	var MINNEAPOLIS_REGION_VALUE = 	'Minneapolis';
	var STPAUL_REGION_VALUE = 		'St Paul';
	
		//----------------------------------------------------------------------
		// LOCAL VARIABLES
		//----------------------------------------------------------------------
	
	var regionSelect = document.getElementById(IDS.REGION);
	var citySelect = document.getElementById(IDS.CITY);
	var specialtySelect = document.getElementById(IDS.SPECIALTY);
	
	var citySelectCache = null;
	var specialtySelectCache = null;
	
	var nameInput = document.getElementById(IDS.NAME);
	var locationInput = document.getElementById(IDS.LOCATION);
	
	var doctorForm = document.getElementById(IDS.DOCTOR_FORM);
	var locationForm = document.getElementById(IDS.LOCATION_FORM);
	
	var navTable = document.getElementById(NAV_TABLE_ID);
	var navTableTds = [];
	var ancestorButtonCache = {};
	var openTimeout = null;
	var openElement = null;
	var closeTimeout = null;
	var timeout = null;
//	var delayTime = 750;
    var delayTime = 350;
	
		//----------------------------------------------------------------------
		// INITIALIZATION
		//----------------------------------------------------------------------
	
	if (regionSelect) {
		regionSelect.onchange = onRegionChange;
	}
	
	if (citySelect) {
		citySelect.onchange = onCityChange;
		citySelectCache = citySelect.cloneNode(true);
	}
	
	if (specialtySelect) {
		specialtySelectCache = specialtySelect.cloneNode(true);
	}
	
	if (nameInput) {
		nameInput.onfocus = nameInput.onblur = onFocusOrBlur;
		nameInput.autocomplete = "off";
	}
	
	if (locationInput) {
		locationInput.onfocus = locationInput.onblur = onFocusOrBlur;
		locationInput.autocomplete = "off";
	}
	
	if (navTable) {
		navTableTds = navTable.getElementsByTagName('div');
		for (var i = navTableTds.length - 1; i >= 0; i--) {
			navTableTds[i].onmouseover = handleMouseOver;
			navTableTds[i].onmouseout = handleMouseOut;
		}
		
		var navTableSelects = navTable.getElementsByTagName('select');
		for (var i = navTableSelects.length - 1; i >= 0; i--) {
			navTableSelects[i].onclick = handleOptionClick;
			navTableSelects[i].onblur = navTableSelects[i].onfocus = handleOptionBlur;
		}
	}
	
	// do some initialization after the browser is fully rendered
	setTimeout(function() {
		
		if (doctorForm) {
			doctorForm.reset();
		}
		
		if (locationForm) {
			locationForm.reset();
		}
		
		onRegionChange();
		
	}, 10);
	
		//----------------------------------------------------------------------
		// FUNCTIONS
		//-----------------------------------------------------------------------
	
	
	
	function getAncestorButton(element) {
		if (!element) {return null;}
		if (ancestorButtonCache[element]) { return ancestorButtonCache[element]; }
		
		var classRegExp = new RegExp(POPUP_CLASS, 'gi');
		var candidate = element;
		// roll parent nodes until we find the popup button, just to be safe
		// we'll use a fifty level limit
		for (var i = 50; i >= 0; i--) {
			if (classRegExp.test(candidate.className)) {
				ancestorButtonCache[element] = candidate;
				return candidate;
			}
			
			candidate = candidate.parentNode;
		}
		
		return null;
	}
	
	
	function onFocusOrBlur() {
		switch (this) {
		
		case nameInput:
			if (nameInput && nameInput.value === nameInput.getAttribute('rel')) {
				nameInput.value = "";
			} else if (nameInput && nameInput.value === "") {
				nameInput.value = nameInput.getAttribute('rel');
			}
			break;
		case locationInput:
			if (locationInput && locationInput.value === locationInput.getAttribute('rel')) {
				locationInput.value = "";
			} else if (locationInput && locationInput.value === "") {
				locationInput.value = locationInput.getAttribute('rel');
			}
			break;
		}
		
		handleOptionClick.call(this);
	}
	
	function onRegionChange() {
		// reset
		citySelectCache.onclick = citySelect.onclick;
		citySelectCache.onblur = citySelect.onblur;
		citySelectCache.onfocus = citySelect.onfocus;
		citySelectCache.onchange = citySelect.onchange;
		
		citySelect.parentNode.replaceChild(citySelectCache, citySelect);
		citySelect = document.getElementById(IDS.CITY);
		citySelectCache = citySelect.cloneNode(true);
		
		var cityOptions = citySelect.getElementsByTagName('option');
		var regionOptions = regionSelect.getElementsByTagName('option');
		var regionRegExp = new RegExp('.', 'g'); // default to prevent errors
		var regionValue = '';
		
		// find relevant className
		for (var i = regionOptions.length - 1; i >= 0; i--) {
			if (regionOptions[i].value === regionSelect.value) {
				regionRegExp = new RegExp(regionOptions[i].className, 'g');
				regionValue = regionOptions[i].className;
			}
		}
		
		// remove 'none' class from citySelect
		citySelect.className = citySelect.className.replace(/none/g, '');
		// if there is not a region selected, hide the citySelect
		if (!regionSelect.value || regionSelect.value === '' || regionSelect.value === MINNEAPOLIS_REGION_VALUE || regionSelect.value === STPAUL_REGION_VALUE) {
			citySelect.className += ' none';
//			return false;
		} else {
			for (var i = cityOptions.length - 1; i >= 0; i--) {
				if (cityOptions[i]) {
					// remove 'none' class
					cityOptions[i].className = cityOptions[i].className.replace(/none/g, '');
					regionRegExp.test(""); // this was behaving erratically, where if it tested the same string two times in a row it returned false.
					
					// if not part of this region, as tested by matching the className, 
					// remove the option node
					if (!regionRegExp.test(cityOptions[i].className) && cityOptions[i].value !== '') {
						citySelect.removeChild(cityOptions[i]);
					}
				}
			}
		}
		
		
		onCityChange();
		
	}
	
	function onCityChange() {
		// reset
		specialtySelectCache.onclick = specialtySelect.onclick;
		specialtySelectCache.onblur = specialtySelect.onblur;
		specialtySelectCache.onfocus = specialtySelect.onfocus;
		
		specialtySelect.parentNode.replaceChild(specialtySelectCache, specialtySelect);
		specialtySelect = document.getElementById(IDS.SPECIALTY);
		specialtySelectCache = specialtySelect.cloneNode(true);
		
		var specialtyOptions = specialtySelect.getElementsByTagName('option');
		
		var parentSelect = regionSelect;
		var parentPointer = 'className';
		if (citySelect && citySelect.value) {
			parentSelect = citySelect;
			parentPointer = 'value';
		}
		
		var options = parentSelect.getElementsByTagName('option');
		var classRegExp = new RegExp('.', 'g'); // default to prevent errors
		var parentValue = '';
		
		// find relevant className
		for (var i = options.length - 1; i >= 0; i--) {
			if (options[i].value === parentSelect.value) {
				classRegExp = new RegExp(options[i][parentPointer].replace(/\s+/gi, '_'), 'gi');
				parentValue = options[i][parentPointer].replace(/\s+/gi, '_');
			}
		}
		
		for (var i = specialtyOptions.length - 1; i >= 0; i--) {
			if (specialtyOptions[i]) {
				// remove 'none' class
				specialtyOptions[i].className = specialtyOptions[i].className.replace(/none/g, '');
				classRegExp.test(""); // this was behaving erratically, where if it tested the same string two times in a row it returned false.
				
				// if not part of this region, as tested by matching the className, 
				// remove the option node
				if (!classRegExp.test(specialtyOptions[i].className) && specialtyOptions[i].value !== '') {
					specialtySelect.removeChild(specialtyOptions[i]);
				}
			}
		}
	}
	
		//----------------------------------------------------------------------
		// EVENT HANDLERS
		//----------------------------------------------------------------------
	function pausecomp(millis) {
		var date = new Date();
		var curDate = null;

		do { curDate = new Date(); } 
		while(curDate-date < millis);
	} 
	
	function handleMouseOver(e) {
		
		clearTimeout(closeTimeout);
                pausecomp(100);  
		 for (var i = navTableTds.length - 1; i >= 0; i--) {
			navTableTds[i].className = navTableTds[i].className.replace(/ hover/gi, ''); 
			navTableTds[i].onmouseout = handleMouseOut;
		 }
		 this.className += ' hover';
	}
	
	function handleMouseOut(e, element) {
		var scope = this;
		
		clearTimeout(closeTimeout);
		closeTimeout = setTimeout(timeoutClose, delayTime);
		
		function timeoutClose() {
			scope.className = scope.className.replace(/ hover/gi, ''); 
		}
	}
	
	function handleOptionClick (e) {
		
		clearTimeout(closeTimeout);
		var button = getAncestorButton(this);
		if (button) {
			button.onmouseout = function(){};
		}
	}
	
	function handleOptionBlur (e) {
		
		var button = getAncestorButton(this);
		if (button) {
			button.onmouseout = handleMouseOut;
		}
	}
	
	
}());

