function addEvent( obj, type, fn )
{
    if (obj.addEventListener)
        obj.addEventListener( type, fn, false );
    else if (obj.attachEvent)
    {
        obj["e"+type+fn] = fn;
        obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
        obj.attachEvent( "on"+type, obj[type+fn] );
    }
}
function removeEvent( obj, type, fn )
{
    if (obj.removeEventListener)
        obj.removeEventListener( type, fn, false );
    else if (obj.detachEvent)
    {
        obj.detachEvent( "on"+type, obj[type+fn] );
        obj[type+fn] = null;
        obj["e"+type+fn] = null;
    }
}
function showPic (thePic) {
    if (!document.getElementById) return false;
    var controls = document.getElementById('slideshow_controls').getElementsByTagName('a');
    for (var i=0; i < controls.length; i++) {
        $(controls[i]).removeClass('current_control');
    }
    
    
    // Fade out current image, change img src to new image and fade back in
    var current = document.getElementById('slideshow_current');
    $(current).fadeOut('slow');
    current.id = "";
    
    var items = document.getElementById('slideshow_images').getElementsByTagName('li');
    var activeItem = thePic.firstChild.nodeValue;
    $(thePic).addClass("current_control");
    
    $(items[activeItem-1]).fadeIn('slow');
    items[activeItem-1].id = "slideshow_current";
}
function nextPic(thePic) {
    var controls = document.getElementById('slideshow_controls').getElementsByTagName('a');
    for (var i=0; i < controls.length; i++) {
        $(controls[i]).removeClass('current_control');
    }
    var items = document.getElementById('slideshow_images').getElementsByTagName('li');
    var currentItem = "";
    for (var i=0; i < items.length; i++) {
        if (items[i].id == "slideshow_current") {
            currentItem = i;
            $(items[i]).fadeOut('slow');
            items[i].id = "";
        }
    }
    if (currentItem < items.length-1) {
        $(items[currentItem+1]).fadeIn('slow');
        items[currentItem+1].id = "slideshow_current";
        $(controls[currentItem+2]).addClass('current_control');
    } else {
        $(items[0]).fadeIn('slow');
        items[0].id = "slideshow_current";
        $(controls[1]).addClass('current_control');
    }
}
function previousPic(thePic) {
    var controls = document.getElementById('slideshow_controls').getElementsByTagName('a');
    for (var i=0; i < controls.length; i++) {
        $(controls[i]).removeClass('current_control');
    }
    var items = document.getElementById('slideshow_images').getElementsByTagName('li');
    var currentItem = "";
    for (var i=0; i < items.length; i++) {
        if (items[i].id == "slideshow_current") {
            currentItem = i;
            $(items[i]).fadeOut('slow');
            items[i].id = "";
        }
    }
    if (currentItem == 0) {
        $(items[items.length-1]).fadeIn('slow');
        items[items.length-1].id = "slideshow_current";
        $(controls[controls.length-2]).addClass('current_control');
    } else {
        $(items[currentItem-1]).fadeIn('slow');
        items[currentItem-1].id = "slideshow_current";
        $(controls[currentItem]).addClass('current_control');
    }
}
function loadGallery() {
    document.getElementById('slideshow_images').style.display='block';
    if(!document.getElementById('slideshow_controls')) return false;
    // Get all links on page
    var controls = document.getElementById('slideshow_controls');
    var prev = document.createElement('li');
    var prevLink = document.createElement('a');
    prevLink.setAttribute('href',"#scrolling_images");
    prevLink.className = "previous";
    prevLink.appendChild(document.createTextNode("Previous"));
    prevLink.onclick = function() { return previousPic(this); };
    prev.appendChild(prevLink);
    controls.appendChild(prev);
    var items = document.getElementById('slideshow_images').getElementsByTagName('li');
    if (items.length >= 5) {
        document.getElementById('slideshow_controls').className = "large-controls";
    } else {
        document.getElementById('slideshow_controls').className = "small-controls";
    }
    for (var i=0; i < items.length; i++) {
        items[i].style.display = "none";
        var control = document.createElement('li');
        var controlLink = document.createElement('a');
        controlLink.setAttribute('href',"#scrolling_images");
        controlLink.className = "number";
        if(i == items.length-1) {
            controlLink.className += " current_control";
        }
        controlLink.appendChild(document.createTextNode(i+1));
        controlLink.onclick = function() { return showPic(this); };
        control.appendChild(controlLink);
        controls.appendChild(control);    
    }
    items[items.length-1].style.display = "block";
    items[items.length-1].id = "slideshow_current";
    
    var next = document.createElement('li');
    var nextLink = document.createElement('a');
    nextLink.setAttribute('href',"#scrolling_images");
    nextLink.className = "next";
    nextLink.appendChild(document.createTextNode("Next"));
    nextLink.onclick = function() { return nextPic(this); };
    next.appendChild(nextLink);
    controls.appendChild(next);
} addEvent(window, 'load', loadGallery);