headers = new Array();

function InitiateHeader(){
		
		new Ajax.Request(
			'header.php',
			{
				method: "get",
				onSuccess: parseAjaxHeader,
				onComplete: observeHeader
			}
		);

}

function parseAjaxHeader(transport){

	response=transport.responseXML;
	headerRoot=response.getElementsByTagName('header')[0];
	headers = headerRoot.getElementsByTagName("images")[0].getElementsByTagName("image");
	$('header_inner').innerHTML = '<img src="images/' + headers[0].attributes.getNamedItem("src").value + '.jpg" alt="header" />';
	$('header_thumbs').innerHTML = '<img src="images/' + headers[1].attributes.getNamedItem("src").value + '_thumb.jpg" rel="1" alt="" />&nbsp;&nbsp;<img src="images/' + headers[2].attributes.getNamedItem("src").value + '_thumb.jpg" rel="2" alt="" />';
	aH = 0;

}

function observeHeader() {
	thumbs = $$('#header_thumbs img');
	thumbs.each(function(headerImg) {
		
		headerImg.observe("click", function(e) {
			
			cT = Event.element(e).readAttribute("rel");

			$('header_inner').innerHTML = '<img src="images/' + headers[cT].attributes.getNamedItem("src").value + '.jpg" alt="header" />';

			if(cT == 0) {
				$('header_thumbs').innerHTML = '<img src="images/' + headers[1].attributes.getNamedItem("src").value + '_thumb.jpg" rel="1" alt="" />&nbsp;&nbsp;<img src="images/' + headers[2].attributes.getNamedItem("src").value + '_thumb.jpg" rel="2" alt="" />';
				observeHeader();
			} else if(cT == 1) {
				$('header_thumbs').innerHTML = '<img src="images/' + headers[0].attributes.getNamedItem("src").value + '_thumb.jpg" rel="0" alt="" />&nbsp;&nbsp;<img src="images/' + headers[2].attributes.getNamedItem("src").value + '_thumb.jpg" rel="2" alt="" />';
				observeHeader();
			} else {
				$('header_thumbs').innerHTML = '<img src="images/' + headers[0].attributes.getNamedItem("src").value + '_thumb.jpg" rel="0" alt="" />&nbsp;&nbsp;<img src="images/' + headers[1].attributes.getNamedItem("src").value + '_thumb.jpg" rel="1" alt="" />';
				observeHeader();
			}

		});
	
	});
}