var galleryBackendURL = '/cgi-bin/fetchGallery';
var navigateURL = '/cgi-bin/navigate';
var CURRENT = null;

function updateGallery(contents) {
   gal = document.getElementById("imagegrid");
   gal.innerHTML = contents;
}

function httpReq(method, url, handler, data) {
   var hreq;

   //determine browser
   if (window.XMLHttpRequest) {
	  hreq = new XMLHttpRequest();
   }
   else if (window.ActiveXObject) {
	  hreq = new ActiveXObject("Microsoft.XMLHTTP");
   }

   //setup handlers
   hreq.onreadystatechange = function() {
	 if (hreq.readyState == 4) {
	   if (hreq.status == 200) {
		 handler(hreq);
	   }
	 }
   };

   // make the request
   hreq.open(method, url, true);
   hreq.send(data);
}

function fetchGallery(elem, galName) {
   var url = galleryBackendURL + '?gallery=' + galName;
   var handler = function (hreq) {
	 updateGallery(hreq.responseText);
   };
   httpReq('GET', url, handler, null);
   toggleCurrent(elem);
   return false;
}

function navigate(elem, pageName) {
	var url = navigateURL + '?page=' + pageName;
	var handler = function (hr) {
		content = document.getElementById("content");
		content.innerHTML = hr.responseText;
		if (pageName == 'work') {
			fetchGallery(null ,'careful');
		}
	};
	httpReq('GET', url, handler, null);
	return false;
}

function toggleCurrent(newelem) {
  if (CURRENT) {
    var li = CURRENT.parentNode;
    li.className = "";
  }
  nli = newelem.parentNode;
  nli.className = "current";
  CURRENT = newelem;
}