var stuffbox, img, h3, choice, next, prev, arch, current;
var archopen = false, archlist;

var stuff = [
{src: "2006-12-28.jpg", title: "Light bulbs"},
{src: "Kiss under tree.jpg", title: "Kiss Under Tree"},
{src: "marshmallows.jpg", title: "Sweet Tooth"},
{src: "westwood.jpg", title: "Sunday"},
{src: "tetris.jpg", title: "Human Tetris!"},
{src: "001.jpg", title: "The Neverending Artwork Project - 25/5/07"},
{src: "002.jpg", title: "The Neverending Artwork Project - 26/5/07"},
{src: "red onion.jpg", title: "Red onion"},
{src: "wine.jpg", title: "A Few Bottles Of Wine"},
{src: "cup.jpg", title: "cup"}
];

function stuffload()
{
   stuffbox = document.getElementById("stuff");
   img = stuffbox.getElementsByTagName("IMG")[0];
   h3 = stuffbox.getElementsByTagName("H3")[0];
   choice = stuffbox.getElementsByTagName("P")[0];

   arch = stuffbox.getElementsByTagName("A")[0];
   arch.firstChild.data += "\u2193";
   aEL(arch, "click", onarch);

   prev = document.createElement("SPAN");
   prev.appendChild(document.createTextNode("\u2190 Previous"));
   aEL(prev, "click", onprev);

   next = document.createElement("SPAN");
   next.appendChild(document.createTextNode("Next \u2192"));
   next.style.display = "none";
   aEL(next, "click", onnext);

   // next line wouldn't be needed if IE didn't eat text nodes for breakfast.
   choice.insertBefore(document.createTextNode(" "), choice.firstChild);
   choice.insertBefore(prev, choice.firstChild);
   choice.appendChild(next);

   current = stuff.length - 1;
}

function pick(index)
{
   h3.firstChild.data = stuff[index].title;
   img.src = "pics/joe_stuff/" + stuff[index].src;

   prev.style.display = (index == 0) ? "none" : "";
   next.style.display = (index == stuff.length - 1) ? "none" : "";
   current = index;
}

function onprev()
{
   pick(current - 1);
}

function onnext()
{
   pick(current + 1);
}

function onarch(e)
{
   if(arch.className)
   {
      archlist.parentNode.removeChild(archlist);
      arch.className = "";
   }
   else
   {
      if(!archlist)
      {
         archlist = document.createElement("UL");
         archlist.className = "archlist";
         var archli, lititle;
         for(var i = 0; i < stuff.length; ++i)
         {
            archli = document.createElement("LI");
            archli.index = i;
            lititle = stuff[i].title ? stuff[i].title : stuff[i].src;
            archli.appendChild(document.createTextNode(lititle));
            archlist.appendChild(archli);
         }
         aEL(archlist, "click", onarchli);
      }
      stuffbox.insertBefore(archlist, h3);
      arch.className = "current";
   }
   arch.blur();
   if(e && ("preventDefault" in e)) e.preventDefault();
   return false;
}

function onarchli(e)
{
   var targ = e.target ? e.target : e.srcElement;
   if(targ.tagName != "LI") return;
   pick(targ.index);
   onarch();
}

function aEL(node, eventName, fn)
{
   if(node.addEventListener)
      node.addEventListener(eventName, fn, false);
   else if(node.attachEvent)
      node.attachEvent("on" + eventName, function(){return fn(window.event);});
}

aEL(window, "load", stuffload);