// keep variables things off the window (good practice) by privatizing
	// in call object (i.e. packaging)
	(function() {
			var RaceEthnicity = [],
				Eyes = [], 
				Rh = [], 
				Hair = [], 
				Blood = [], 
				Unit = [], 
				qty = 0,
				wStart = 0,
				wEnd = 0,
				hStart = 0,
				hEnd = 0,
				cmv = 0,
				activeListId;
			
			// "this" is a sandbox (window in live)
			this.submitSearch = function () {
				var url = '', i, len;
				
				if (qty) {
					url += 'qty=' + encodeURIComponent(qty);
				}
				
				url = buildUrl(url, RaceEthnicity, 'race');
				url = buildUrl(url, Eyes, 'eyes');
				url = buildUrl(url, Rh, 'rh');
				url = buildUrl(url, Hair, 'hair');
				url = buildUrl(url, Blood, 'blood');
				url = buildUrl(url, Unit, 'unit');
				
				if (wStart && wEnd) {
					if (url) url += '&';
					url += 'wstart=' + encodeURIComponent(wStart);
					url += '&wend=' + encodeURIComponent(wEnd);
				}
				
				if (hStart && hEnd) {
					if (url) url += '&';
					url += 'hstart=' + hStart;
					url += '&hend=' + hEnd;
				}
				
				if (cmv) {
					if (url) url += '&';
					url += 'cmv=' + encodeURIComponent(cmv);
				}
				
				if (url) {
					url = '&' + url;
				}
				
				window.location.replace('/index.php?option=com_content&view=article&id=121&dsearch=go' + url);
			};
		
			function buildUrl(url, arr, key) {
				if (!arr.length) return url;
				if (url) url += '&';
				url += key + '=';
				
				for (var i = 0, len = arr.length; i < len; ++i) {
					url += encodeURIComponent(arr[i] + ',');
				}
				
				return url.substring(0, url.length - 3);
			}
			
			this.updateRaceEthnicity = function(checkbox, value) {
				updateSelection(checkbox, 'race_eth_selection', value, 28, RaceEthnicity);
			};
		
			this.updateEyes = function(checkbox, value) {
				updateSelection(checkbox, 'eyes_selection', value, 11, Eyes);
			};
		
			this.updateHair = function(checkbox, value) {
				updateSelection(checkbox, 'hair_selection', value, 11, Hair);
			};
			
			this.updateBlood = function(checkbox, value) {
				updateSelection(checkbox, 'blood_selection', value, 11, Blood);
			};
		
			this.updateRH = function(checkbox, value) {
				updateSelection(checkbox, 'rh_selection', value, 11, Rh);
			};
		
			this.updateUnit = function(checkbox, value) {
				updateSelection(checkbox, 'unit_selection', value, 11, Unit);
			};
		
			this.updateQty = function(value) {
				qty = value;
				updateSelectBox('qty_selection', value);
				toggleList('qty_avail');
			};
		
			this.updateCmv = function(value) {
				cmv = value;
				updateSelectBox('cmv_selection', value);
				toggleList('cmv_avail');
			};
		
			this.updateSelection = function(checkbox, id, value, maxChars, arr) {
				if (checkbox.checked) {
					arr[arr.length] = value;
				} else {
					for (var i = 0, len = arr.length; i < len; ++i) {
						if (arr[i] == value) {
							arr.splice(i, 1);
							break;
						}
					}
				}
				
				var html = '';
				
				for (var i = 0, len = arr.length; i < len; ++i) {
					html += arr[i] + ', ';
				}
				
				html = html.substring(0, html.length-2);
				
				if (!html) {
					html = '-SELECT-';
				}
				
				if (html.length > maxChars) {
					html = html.substring(0, maxChars-3) + '...';
				}
				
				updateSelectBox(id, html);
			};
			
			this.updateSelectBox = function(id, value) {
				var elem = document.getElementById(id);
				elem.innerHTML = value;
			};
			
			this.selectSingle = function (selId, listId, value, winKey) {
				switch(winKey) {
					case 'wStart':
						wStart = value;
						break;
					case 'wEnd':
						wEnd = value;
						break;
					case 'hStart':
						hStart = value;
						break;
					case 'hEnd':
						hEnd = value;
						break;
				}
				
				updateSelectBox(selId, value);
				toggleList(listId);
			};
			
			this.toggleList = function (id, src) {
				var elem = document.getElementById(id),
					style = elem.style.visibility == "hidden" ? "visible" : "hidden";
				
				if (activeListId && activeListId != id) {
					var activeElem = document.getElementById(activeListId);
					activeElem.style.visibility = "hidden";
					activeListId = null;
				}
				
				activeListId = style == "visible" ? id : null;
				elem.style.visibility = style;
				elem.onmouseover = disableDocument;
				elem.onmouseout = hookupDocument;
				disableDocument();
				
				// there has be common ground
				if (src) {
					src.onmouseover = disableDocument;
					src.onmouseout = hookupDocument;
				}
			};
			
			function disableDocument() {
				document.onmousedown = null;
			}
			
			function hookupDocument() {
				document.onmousedown = function(e) {
					e = e || window.event;
					
					if (!(e.target || e.srcElement) === document) {
						return;
					}
					
					if (activeListId) {
						window.toggleList(activeListId);
					}
				};
			}
		})();