var gallery = {

	para: null,
	curr: null,

    init: function(){
        
        var div = document.getElementById("img");
        var img = div.getElementsByTagName("img")[0];
        gallery.para = div.getElementsByTagName("p")[0];
        
        var list =	document.getElementById("thumbnails");
        var links = list.getElementsByTagName("a");
        
        for(var i = 0; i < links.length; i++ ){
            addEvent( links[i], "click", gallery.fire( img ) );
            addEvent( links[i], "focus", gallery.fire( img ) );
       };
    },
    
    fire: function( el ){
        return function(e){
        	if( gallery.para.childNodes.length !== 0 ){
        		for( var i = 0, cn = gallery.para.childNodes; i < cn.length; i++ ){
        			gallery.para.removeChild(cn[i]);
        		};
        	};
        	
        	if( gallery.curr ){
        		gallery.curr.style.border = null;
        		gallery.curr.style.opacity = 0.7;
    
        	};
        	
        	this.style.border = "solid 1px #000";
        	this.style.opacity = 1;
        	gallery.curr = this;

        	var txt = document.createTextNode(this.title);
        	gallery.para.appendChild(txt);
        	
        	gallery.setOpacity( el, 0 );
        	
            el.src = e.currentTarget || this.href;
            el.alt = e.currentTarget || this.href;
            
            gallery.fade( el );
            return stopDefault(e);
       };
    },
    
    fade: function( el ){
        for(var i = 0; i <= 100; i += 5 ){
            (function(){
                var pos = i;
                setTimeout(function(){
                    gallery.setOpacity( el , pos );
                }, ( pos + 1 ) * 5 )
            })();
        }
    },
    
    setOpacity: function( elem, level ){
        if( elem.filters ){
            elem.style.filter = 'alpha(opacity='+level+')';
        }else{
            elem.style.opacity = level / 100;
        }
    }
}

addEvent( window, "load", gallery.init );