addLoadEvent(initShowBox);

var interval;

function initShowBox() {
    obj = new showBox();
    obj.abc();
}

/* class showBox */
function showBox() 
{   
    var div = document.getElementById('showBox');
    this.numberOfItems = null;
    this.currentItem = 0;
    var that = this; 
    
    if (div) initialize();
      
    function initialize() {
    	var previewBox = document.getElementById('fastpreviewBox');
    	previewBox.parentNode.removeChild(previewBox);
    	
        var photoBox = document.createElement('div');
		photoBox.setAttribute('id', 'photoBox');
        
        var photoAnchor = document.createElement('a');
        photoAnchor.setAttribute('class', 'photoAnchor');
        photoAnchor.setAttribute('id', 'showBoxPhotoAnchor');
        
        var photoImg = document.createElement('img');
        photoImg.setAttribute('id', 'showBoxImg');
                
        photoAnchor.appendChild(photoImg);
        photoBox.appendChild(photoAnchor);
        div.appendChild(photoBox);
        
        var lis = div.getElementsByTagName('li');
        that.numberOfItems = lis.length;
        for (var i = 0; i < lis.length; i++) {
            Show(lis[i],i);
        }
    }
      
    function clearAllListItems() {
        var lis = div.getElementsByTagName('li');
        for (var i = 0; i < lis.length; i++) {
            lis[i].className='blank clearfix';
        }
    }
    
    function setCurrent(li) {
        li.className = 'current hotContent clearfix';
        var img = li.getElementsByTagName('img')[0];
        if (img) {
            var src = img.getAttribute('src');
            var showBoxImg = document.getElementById('showBoxImg')
            showBoxImg.setAttribute('src',src);
        }
        var a = document.getElementById('showBoxPhotoAnchor');
        var h3 = li.getElementsByTagName('h3')[0];
        var h3a = h3.getElementsByTagName('a')[0];
        var newHref = h3a.getAttribute('href');
        a.setAttribute('href', newHref);
    }
    
    function Show(li,i) {
        if (i==0) setCurrent(li);
        li.onmouseover = function() {
            clearAllListItems();
            setCurrent(this);
            attachDecoration(this, 'underline');
            clearInterval(interval);
        }
        li.onmouseout = function() {
            attachDecoration(this, 'none');
            that.abc();
        }
    }
    
    this.bar = function()
    {
        var lis = div.getElementsByTagName('li');
        for (var i = 0; i < lis.length; i++) {
            if (i == this.currentItem) {
                lis[i].className = 'current hotContent clearfix';
                var img = lis[i].getElementsByTagName('img')[0];
                if (img) {
                    var src = img.getAttribute('src');
                    var showBoxImg = document.getElementById('showBoxImg')
                    showBoxImg.setAttribute('src',src);
                }
            } else {
                lis[i].className='blank clearfix';
            }
        }
        this.currentItem++;
        if (this.currentItem == this.numberOfItems) this.currentItem = 0;
    }

    this.abc = function()
    {
        var self = that;
        interval = setInterval(function() { self.bar(); }, 9000);
    }
    
}