function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

function insertAfter(newElement,targetElement) {
 var parent = targetElement.parentNode;
 if(parent.lastChild == targetElement) {
   parent.appendChild(newElement);
  } else {
   parent.insertBefore(newElement,targetElement.nextSibling)
  }
}

function hideslide() {
 var thisdiv = document.getElementById("slide");
 thisdiv.style.display = "none";
}
function preparePlaceholder() {
  if (!document.createElement) return false;
  if (!document.createTextNode) return false;
  if (!document.getElementById) return false;
  if (!document.getElementById("photoblock")) return false;
  var slide = document.createElement("div");
  slide.setAttribute("id","slide");
  var placeholder = document.createElement("img");
  placeholder.setAttribute("id","placeholder");
  placeholder.setAttribute("src","images/placeholder.gif");
  placeholder.setAttribute("alt","big pictures go here");
  var bwidth = screen.availWidth;
  var bheight = screen.availHeight;

  slide.style.padding = "10px";
  slide.style.border = "1px solid #ccc";
  slide.style.position = "absolute";
  slide.style.left = "110px";
  slide.style.top = (bheight/3) + "px"; 
  slide.style.overflow = "hidden";
  var description = document.createElement("p");
  description.setAttribute("id","description");
  var desctext = document.createTextNode("Choose an image");
  description.appendChild(desctext);
  var gallery = document.getElementById("photoblock");
  var closeimage = document.createElement("img");
  var closelink = document.createElement("a");
  closelink.setAttribute("id","closelink");
  closelink.setAttribute("title","close");
  closelink.setAttribute("href","javascript: hideslide();");
  //closelink.setAttribute("onclick","hideslide();");
  closeimage.setAttribute("src","closebox.png");
  insertAfter(slide,gallery);
  insertAfter(closelink,slide);
  insertAfter(closeimage,closelink);
  closelink.appendChild(closeimage);
  slide.appendChild(placeholder);
  slide.appendChild(description);
  slide.appendChild(closelink);
}



/* to do:
   -- set div dimensions by image dimension
   -- place close button
   -- make close button work */

function showPic(whichpic) {
  if (!document.getElementById("placeholder")) return true;
  var source = whichpic.getAttribute("href");
  var thisthumb = whichpic.getElementsByTagName("img");
  for (var i=0; i < thisthumb.length; i++) {
    thumbwidth = thisthumb[i].getAttribute("width");    
    thumbheight = thisthumb[i].getAttribute("height");    
    if (thumbheight > thumbwidth ) {
      var slideclass = "vertical";
    } else {
      var slideclass = "horizontal";    
    }
  }

  var placeholder = document.getElementById("placeholder");
  placeholder.setAttribute("src",source);
  if (!document.getElementById("description")) return true;
  if (whichpic.getAttribute("title")) {
    var text = whichpic.getAttribute("title");
  } else {
    var text = "";
  }
  var description = document.getElementById("description");
  //alert(description.firstChild);
  if (description.firstChild.nodeType == 3) {
    description.firstChild.nodeValue = text;
  }
  var slide = document.getElementById("slide");
  slide.setAttribute("class",slideclass);
  slide.style.display = "block";
  return false;
}
 
function prepareGallery() {
  if (!document.getElementsByTagName) return false;
  if (!document.getElementById) return false;
  if (!document.getElementById("photoblock")) return false;
  var gallery = document.getElementById("photoblock");
  var links = gallery.getElementsByTagName("a");
  for ( var i=0; i < links.length; i++) {
    links[i].onclick = function() {
      return showPic(this);
	}
    links[i].onkeypress = links[i].onclick;
  }
}
  
addLoadEvent(preparePlaceholder);
addLoadEvent(prepareGallery);
addLoadEvent(prepareForm);