var next_de;
var pageturn_de;
var thumbs_de;
var viewer_de;
var bigviewer_de;
var jumpmenu_de;
var logo_de;
var nav_de;
var debug_de;
var info_de;

var xmldoc;
var sectionID = 0;
var images_ar;
var currentImage;
var subImages_ar;
var currentSubImage;

var httpRequest;

var currentPage;

var dcount;
var menu_ar;
var root_node;
var deeplink;


function build() {
	defineDomObjects();
	makeXMLRequest("php/xmlsoc.php");
	dcount = 0;
	var loc = window.location.href.split('#', 2);
	if (loc.length>1) {
		deeplink = loc[1];
		debug('location: '+loc[1]);
	} else {
		deeplink = null;
	}
}

function defineDomObjects() {
	next_de = document.getElementById('next');
	pageturn_de = document.getElementById('pageturn');
	viewer_de = document.getElementById('viewer');
	bigviewer_de = document.getElementById('bigviewer');
	thumbs_de = document.getElementById('thumbs');
	info_de = document.getElementById('info');
	jumpmenu_de = document.getElementById('jumpmenu');
	nav_de = document.getElementById('nav');
	logo_de = document.getElementById('logo');
	debug_de = document.getElementById('debug');
}

function makeXMLRequest(url) {
	httpRequest = false;
	
	if (window.XMLHttpRequest) { // Mozilla, Safari, ...
		httpRequest = new XMLHttpRequest();
		if (httpRequest.overrideMimeType) {
			httpRequest.overrideMimeType('text/xml');
		}
	} else if (window.ActiveXObject) { // IE
		try {
			httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
			} 
			catch (e) {
					   try {
							httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
						   } 
						 catch (e) {}
					  }
								   }

	if (!httpRequest) {
		debug('Giving up :( Cannot create an XMLHTTP instance');
		return false;
	}
	httpRequest.onreadystatechange = confirmRequest;
	httpRequest.open('GET', url, true);
	httpRequest.send('');
}

function confirmRequest() {
	if (httpRequest.readyState == 4) {
		if (httpRequest.status == 200) {
			debug('confirm httpRequest');
			xmldoc = httpRequest.responseXML;
			root_node = xmldoc.getElementsByTagName('gallery').item(0);
			createMenu();
			if (deeplink == null) {
				update(0);
			} else {
				update(deeplink);
			}
		} else {
			debug('There was a problem with the request.');
		}
	}
}


function createMenu() {
	menu_ar = new Array();
	var a = 0;
	for (i=0;i<root_node.childNodes.length;i++) {
		var section_node = root_node.childNodes[i];
		if (section_node.nodeType == '1') {
			var _id = section_node.getAttribute('id');
			var _name = section_node.getAttribute('name');
			menu_ar[a] = {name:_name, id:_id};
			a ++;
		}
	}
	
	for (i=0;i<menu_ar.length;i++) {
		document.forms['null'].jumpmenu.options[i] = new Option(menu_ar[i].name, i);
	}
	// set's selected
	if (deeplink != null) {
		document.forms['null'].jumpmenu.options[deeplink].selected = true;
	}
	debug('create menu:');
}

function jumpMenu($selObj) {
	sectionID = $selObj.options[$selObj.selectedIndex].value;
	update(sectionID);
	
	var loc = window.location.href.split('#', 2);
	window.location.href = loc[0]+'#'+sectionID;
	
	debug("jumpMenu: "+$selObj+", "+sectionID);
}

function update($id) {
	var _section_node = xmldoc.getElementsByTagName('section').item($id);
	var _sectionType = _section_node.getAttribute('type');
	createImageArray(_section_node);
	switch (_sectionType) {
		case '1': // Thumbnails
			setThumbs();
			setImage(viewer_de, 0);
			setDisplayState('thumbnails');
			debug('update: '+$id+': thumbnails');
		break;
		case '2': // Slideshow
			setImage(bigviewer_de, 0);
			thumbs_de.innerHTML = '';
			setDisplayState('slideshow');
			debug('update: '+$id+': slideshow');
		break;
		case '3': // Home
			var _n = Math.ceil(Math.random()*images_ar.length)-1;
			setHomeImage(bigviewer_de, _n);
			thumbs_de.innerHTML = '';
			setDisplayState('home');
			debug('update: '+$id+': home '+_n);
		break;
		case '4': // Contact
			//setImage(bigviewer_de, 0);
			setContactImage();
			thumbs_de.innerHTML = '';
			setDisplayState('contact');
			debug('update: '+$id+': contact');
		break;
	}
}

function createImageArray(node) {
	images_ar = new Array();
	currentImage = 0;
	for (i=0;i<node.childNodes.length;i++) {
		if (node.childNodes[i].nodeType == '1') {
			var item_node = node.childNodes[i];
			var img = item_node.getElementsByTagName('image').item(0);
			images_ar.push({img:img.getAttribute('image'), thumb:img.getAttribute('thumb'), title:img.getAttribute('title'), description:img.getAttribute('description'), node:item_node});
		}
	}
}

function nextPage() {
	if (currentImage < (images_ar.length-1)) {
		currentImage++;
	} else {
		currentImage = 0;
	}
	setImage(bigviewer_de, currentImage);
	debug('next page');
}

function setThumbs() {
	var _imgs = "";
	for (i=0;i<images_ar.length;i++) {
		_imgs += '<a href="#" onclick="clickThumb('+i+');"><img src="'+images_ar[i].thumb+'" /></a>';
	}
	clickThumb(0);
	thumbs_de.innerHTML = _imgs;
	debug('set thumbnails');
}

function setImage($domElement, $num) {
	$domElement.innerHTML = '<img src="'+images_ar[$num].img+'" />';
	info_de.innerHTML = '<b>'+images_ar[$num].title+'</b><br>'+images_ar[$num].description;
	debug('Set Big Image: '+images_ar[$num].img);
}

function setHomeImage($domElement, $num) {
	$domElement.innerHTML = '<a href="#" onclick="update(0);"><img src="'+images_ar[$num].img+'" /></a>'
}

function setContactImage() {
	// serious hack
	bigviewer_de.innerHTML = '<img src="images/folio/info.jpg" width="622" height="400" border="0" usemap="#contact_map"><map name="contact_map"><area shape="rect" coords="355,80,575,102" href="http://www.12ozprophet.com/index.php/geezer/" target="_blank"><area shape="rect" coords="355,106,575,130" href="mailto:info@unclegeez.com"></map>';
}

function setSubImage($domElement, $num) {
	$domElement.innerHTML = '<img src="'+subImages_ar[$num].img+'" />';
	info_de.innerHTML = '<b>'+subImages_ar[$num].title+'</b><br>'+subImages_ar[$num].description;
	debug('Set Big Image: '+subImages_ar[$num].img);
}

function setMulti() {
	var alpha = new Array('a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z');
	currentSubImage = 0;
	var _str = '<a href="#" onclick="clickStep(-1);"><i>More</i> &rarr;</a>';
	/*
	for (i=0;i<subImages_ar.length;i++) {
		_str += '<a href="#" id="multi'+i+'" onclick="clickMulti(this, '+i+');">'+(alpha[i])+'</a>';
		if (i<(subImages_ar.length-1)) {
			_str += '&nbsp;&nbsp;/&nbsp;&nbsp;';
		}
	}
	*/
	//_str += '&nbsp;<a href="#" onclick="clickStep(1);">&rarr;</a> ';
	next_de.innerHTML = _str;
	debug('set multi');
}

function clickThumb($num) {
	subImages_ar = new Array();
	var _curNode = images_ar[$num].node;
	for (i=0;i<_curNode.childNodes.length;i++) {
		if (_curNode.childNodes[i].nodeType == '1') {
			subImages_ar.push({img:_curNode.childNodes[i].getAttribute('image'), title:_curNode.childNodes[i].getAttribute('title'), description:_curNode.childNodes[i].getAttribute('description')});
		}
	}
	if (subImages_ar.length>1) { // has multiple images
		debug('Click Thumb: '+$num+', Has Multiple: true');
		show([next_de], true);
		setMulti();
	} else { // has only one image
		debug('Click Thumb: '+$num+', Has Multiple: false');
		show([next_de], false);
	}
	setImage(viewer_de, $num);
	debug(subImages_ar);
}

function clickMulti($obj, $num) {
	setSubImage(viewer_de, $num);
	currentSubImage = $num;
	debug('click multi');
}

function clickStep($dir) {
		currentSubImage += $dir;
	if (currentSubImage<0) {
		currentSubImage = subImages_ar.length-1;
	}
	if (currentSubImage>(subImages_ar.length-1)) {
		currentSubImage = 0;
	}
	setSubImage(viewer_de, currentSubImage);
}

function show($domElements, $isVisible) {
	var _vis;
	if ($isVisible) {
		_vis = 'visible';
	} else {
		_vis = 'hidden';
	}
	for (i=0;i<$domElements.length;i++) {
		$domElements[i].style.visibility = _vis;
	}
}

function setDisplayState($type) {
	show([nav_de, logo_de, info_de], true);
	switch ($type) {
		case 'slideshow':
			show([thumbs_de, viewer_de, next_de], false);
			show([bigviewer_de, pageturn_de, info_de], true);
		break;
		case 'thumbnails':
			show([thumbs_de, viewer_de, info_de], true);
			show([bigviewer_de, pageturn_de], false);
		break;
		default:
			show([thumbs_de, viewer_de, next_de, pageturn_de, info_de], false);
			show([bigviewer_de], true);
		break;
	}
	debug("set display state: "+$type);
}

function debug($str) {
/*
	debug_de.innerHTML = dcount+": "+$str+"<br>\r"+debug_de.innerHTML;
	dcount++;
*/
}

function addEvent($obj, $evType, $fn){ 
	if ($obj.addEventListener){ 
		$obj.addEventListener($evType, $fn, false); 
		return true; 
	} else if ($obj.attachEvent){ 
		var __r = $obj.attachEvent("on"+$evType, $fn); 
		return __r; 
	} else { 
		return false; 
	} 
}

addEvent(window, 'load', build);