// ajax object creation
function getHTTPObject() {
	var xhr = false;
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();	
	} else if (window.ActiveXObject) { // IE
		try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) { // catch Mac IE 5 here
				xhr = false;	
			}
		}
	}
	return xhr;
}

/* function to display a loading bar */
function displayLoading(element, imageSrc) {
	var el = document.createElement('div');
	el.setAttribute("id", "loadingBar");
	var imgEl = document.createElement('img');
	imgEl.setAttribute("src", imageSrc);
	imgEl.setAttribute("alt", "loading");
	el.appendChild(imgEl);
	element.appendChild(el);

}

/* data sender function for contact form */
function sendData(data, destPage) {
	// start the ajax object
	var request = getHTTPObject();
	if (request) {
		// display a loading bar:
		var el = document.getElementById('c_container');
		displayLoading(el, 'images/structure/icon_loadbar.gif');
		request.onreadystatechange = function() {
			// on the return, parse what comes back:
			parseResponse(request);
		};
		request.open("POST", destPage, true);
		request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		request.send(data);
		return true;
	} else {
		return false;
	}
}

/* parse the response from contact sendData func */
function parseResponse(request) {
	if (request.readyState == 4) {
		if (request.status == 200 || request.status == 304) {
			// remove the loading bar...
			var theBar = document.getElementById('loadingBar');
			var cEl = document.getElementById('c_container');
			cEl.removeChild(theBar);
			// fill in the new html
			var el = document.getElementById('c_container');
			el.innerHTML = request.responseText;
			if (request.responseText.indexOf('c_form') != -1) {
				prepForm();
			}
			
		} else { // else die
			return false;
		}
	}
}

/* form initiation - hijack the form and point the Submit action to the ajax handler */
function prepForm() {
	
	// tests for support
	if (!document.getElementById) { return false }
	if (!document.getElementById('c_form')) { return false }
	
	var theForm = document.getElementById('c_form');
	var destPage = theForm.getAttribute('action');
	
	theForm.onsubmit = function() {
		var destPage = "contact_formLogic.php";
		var data = '';
		// assemble the value pairs from the form:
		for (var i=0; i<this.elements.length; i++) {
			data += this.elements[i].name;	
			data += '=';
			data += escape(this.elements[i].value);
			data += '&';
		}

		return !sendData(data, destPage);
	};

}

// add '&' or '?' to query string for ajax calls - pass in the href
function sortChars(pageRef) {
	var rtnChar = '&';
	if (pageRef.indexOf('?') == -1) {
		rtnChar = '?';
	}
	rtnChar += 'hjx=true';
	return rtnChar;
}

/* fetch an info window via ajax */
function fetchPage(reqPage, targId) {
	// start the ajax object
	var request = getHTTPObject();
	if (request) {
		// display a loading bar:
		/*var el = fetchPage.parentNode;
		displayLoading(el, 'images/structure/icon_loadbar.gif');*/
		request.onreadystatechange = function() {
			// on the return, parse what comes back:
			insertPage(request, targId);
		};
		request.open("GET", reqPage + sortChars(reqPage), true);
		request.send(null);
		return true;
	} else {
		return false;
	}
}

/* parse the response from contact sendData func */
function insertPage(request, targId) {
	if (request.readyState == 4) {
		if (request.status == 200 || request.status == 304) {
			// fill in the new html
			var myLink = document.getElementById(targId);
			var el = myLink.parentNode;
			
			// create the item's container div
			var newDiv = document.createElement('div');
			newDiv.setAttribute('id', 'infoItem' + targId);
			
			// write in the 'panel' divs next:
			var itemContent = document.createElement('div');
			itemContent.className = "itemContent";
			var br = document.createElement('div');
			br.className = "br";
			var bl = document.createElement('div');
			bl.className = "bl";
			var tl = document.createElement('div');
			tl.className = "tl";
			var panelInner = document.createElement('div');
			panelInner.className = "panelInner";
			
			// append these together:
			newDiv.appendChild(itemContent);
			itemContent.appendChild(br);
			br.appendChild(bl);
			bl.appendChild(tl);
			tl.appendChild(panelInner);
			
			// fill panelInner with the returned html
			panelInner.innerHTML = request.responseText;
			
			// next create the close link
			var closeBtn = document.createElement('a');
			closeBtn.className = "btn close";
			var span1 = document.createElement('span');
			var span2 = document.createElement('span');
			var span3 = document.createElement('span');
			var span4 = document.createElement('span');
			var closeTxt = document.createTextNode('Close');
			closeBtn.appendChild(span1);
			span1.appendChild(span2);
			span2.appendChild(span3);
			span3.appendChild(span4);
			span4.appendChild(closeTxt);
			closeBtn.onclick = function() {
				mySlide.toggle();
			}
			// append to panelInner
			panelInner.appendChild(closeBtn);
			
			// append all this into the hook
			el.appendChild(newDiv);
			
			var toSlide = document.getElementById('infoItem' + targId);
			var mySlide = new Fx.Slide(toSlide);
			mySlide.hide();
			mySlide.slideIn();
			
			// destroy the more info link, and recreate it as a toggle link instead
			var togLink = document.getElementById(targId);
			togLink.onclick = function() {
				mySlide.toggle();
				return false;
			}
			
		} else { // else die
			return false;
		}
	}
}

/* prep all links in the upgrades page to use ajax */
function prepLinks() {
	
	// tests for support
	if (!document.getElementsByTagName) { return false }
	
	// get all the <a> tags inside leftCol with class of 'btn'
	var leftCol = document.getElementById('leftCol');
	var allLinks = leftCol.getElementsByTagName('a');
	
	// a count var to plug into IDs:
	var count = 0;
	
	// search allLinks for classes of 'btn'
	for (var i=0; i<allLinks.length; i++) {
		if (allLinks[i].className == 'btn') {
			// if it's true hijack it
			var el = allLinks[i];
			el.setAttribute('id', count);
			el.onclick = function() {
				var myId = this.getAttribute('id');
				var myLink = this.getAttribute('href');
				// now we have clicked once, disable the button until after we've got the request back:
				this.onclick = function() {
					return false;
				}
				return !fetchPage(myLink, myId);
			}
			// increment the count var:
			count++;
		}
	}
	
	
}

/* moo slider		
var mySlide = new Fx.Slide('c_container');
mySlide.toggle();
*/