var currentImage;
Event.onDOMReady(function(){

    /*
    $$('.hideShowToggle').each(function(s){
        
        if(s.next('.toggleContent'))
        {
            if(s.next('.toggleContent').down('div'))
            {
                s.next('.toggleContent').setStyle({'display':'none'});
                s.addClassName('toggleUp');
                s.next('.toggleContent').addClassName('toggleContentUp');
                Event.observe(s, 'click', this.HideShowSlideToggle.bindAsEventListener(this));                
            }
        }
    })
    */
    
    $$('.javascriptoff').each(function(s, index){s.hide();});
    
    $$('.hoverable').each( function(s){
        Event.observe(s, 'mouseover', this.Hovered.bindAsEventListener(this));
        Event.observe(s, 'mouseout', this.HoveredOff.bindAsEventListener(this));
    })
    
    //tabs
    if($$('.tabTitle')[0])
    {
        $$('.tabTitle')[0].addClassName("first");
        $$('.tabTitle')[0].addClassName("selectedTab");        
        var contentHolder = new Element('div', {'id':'TabsContentHolder', 'class':'tabsContentHolder'});
        $('ProductDescriptorsInner').insert(contentHolder);
        
        contentHolder.innerHTML = $$('.tabTitle')[0].next().innerHTML;
        
        $$('.tabTitle').each( function(s){
            s.next().hide();     
            s.addClassName("tab");
            Event.observe(s, 'click', function(s, element){
                $$('.tabTitle').each(function(s){s.removeClassName("selectedTab");});
                this.addClassName("selectedTab");
                contentHolder.innerHTML = this.next().innerHTML;
            });
        });
    }
    
    //manufacturer filter
    $$('.options').each(function(s){
        s.hide();
    });
    
    $$('.title').each(function(s){  
        Event.observe(s, 'click', function(s){
            var element = Event.element(s);
            element.next().toggle();
        });
    });
    
    /*
    $$('.productsummaryimageholder').each( function(s){
        s.setOpacity(0);
        new Effect.Opacity(s, {duration: 0.2, from: 0, to: 1, queue: 'end'});
    } )
    */
    
    $$('.productBox').each(function(s){
        var productLink = s.down('a').href;    
        Event.observe(s, 'click', function(){window.location = productLink;});
    })
    
    var i = 0;
    $$('#HomeManImages a').each(function(s){
        
        if(i != 0)
        {
            s.setStyle({'display': 'none'});
        }
        i++;
    })
        
    currentImage = $$('#HomeManImages a')[0];
    if(currentImage)
    {
        currentImage = $$('#HomeManImages a')[0];
        currentImage.setStyle({'display': 'block'});
        var effect = new Effect.Opacity(currentImage, {from: 0, to: 1, duration: 4, afterFinish: function(){HideThis(currentImage);}});
    }
    
    /*
    var prodImages = $$(".productsummaryimageholder img");
    prodImages.each(function(image, index){
        
        //var imageHolder = image.up().up();
        //imageHolder.setStyle({'display':'none'});
        //imageHolder.setOpacity(0);
        
        if(image.src == "" || image.getWidth() == 0 || image.getHeight() == 0)
        {
            Event.observe(image, 'load', function(){
        
                //imageHolder.setStyle({'display':'block'});
                positionImage(image);
                //new Effect.Opacity(imageHolder, {duration: 0.2, from: 0, to: 1, queue: 'end'});
            
            });
        }
        else
        {
            //imageHolder.setStyle({'display':'block'});
            positionImage(image);
            //new Effect.Opacity(imageHolder, {duration: 0.2, from: 0, to: 1, queue: 'end'});
        }        
        
    });
    */
});

function positionImage(image)
{
    var e = $(image);
    var holderWidth = e.up().up().getWidth();
    var holderHeight = e.up().up().getHeight();
    var imageHeight = e.getHeight();
    var imageWidth = e.getWidth();


    var leftMargin = (imageWidth - holderWidth)/2;
    var topMargin = (imageHeight - holderHeight)/2;

    e.setStyle({
        marginLeft: ~leftMargin + 'px',
        marginTop: ~topMargin + 'px'
    });
    
    /*
    alert("Margin Left: " + e.getStyle("marginLeft") + 
            "\nMargin Right: " + e.getStyle("marginTop") + 
            "\nHolder Width: " + holderWidth + 
            "\nHolder Height: " + holderHeight +
            "\nimageHeight: " + imageHeight +
            "\nimageWidth: " + imageWidth);
    */
}                

/*
// JScript File
Event.observe(window, 'dom:loaded', function() {

    
   
});
*/

function HideThis(element)
{
    var effect = new Effect.Opacity(element, {from: 1, to: 0, duration: 2, queue: 'end', afterFinish: function(){element.setStyle({'display':'none'}); ShowThis(GetNextImage(element));}});
}

function ShowThis(element)
{
    element.setOpacity(0);
    element.setStyle({'display':'block'});
    var effect = new Effect.Opacity(element, {from: 0, to: 1, duration: 2, queue: 'end', afterFinish: function(){HideThis(element);}});
}

function GetNextImage(element)
{
    //alert("element: " + element + "\nelement.next(): " + element.next());
    
    if(element.next() != null)
    {
        return element.next();
    }
    else
    {
        return $$('#HomeManImages a')[0];
    }
}

function Hovered(e)
{
    e = Event.element(e);
    e.addClassName("hover");
}

function HoveredOff(e)
{
    e = Event.element(e);
    e.removeClassName("hover");
}

function RegisterUserClick(e)
{
    window.location = "/Register-User.aspx";
}

function RegisterSiteClick(e)
{
    window.location = "/Register-Site.aspx";
}

function ShowManufacturers(e)
{
    e = Event.element(e);
    Effect.SlideUp('ReviewCategories', {duration:0.5, queue: 'front'});
    Effect.SlideDown('ReviewManufacturers', {duration:0.5, queue: 'end'});
}

function ShowCats(e)
{
    e = Event.element(e);
    Effect.SlideUp('ReviewManufacturers', {duration:0.5, queue: 'front'});
    Effect.SlideDown('ReviewCategories', {duration:0.5, queue: 'end'});    
}

function HideShowSlideToggle(e)
{
    var element = Event.element(e);
    element = $(element);
    
    toBeToggled = element.next('.toggleContent');
    
    Event.stop(e);
    if(toBeToggled.getStyle('display') != 'none')
    {
        Effect.SlideUp(toBeToggled, {duration:0.5, afterFinish: function(){
            toBeToggled.setStyle({'display':'none'}); 
            toBeToggled.removeClassName('toggleContentDown'); 
            toBeToggled.addClassName('toggleContentUp'); 
            element.removeClassName('toggleDown'); 
            element.addClassName('toggleUp');
            }
        });
    }
    else
    {
        Effect.SlideDown(toBeToggled, {duration: 0.5, beforeStart: function(){
            toBeToggled.setStyle({'display':'block'});
            toBeToggled.removeClassName('toggleContentUp'); 
            toBeToggled.addClassName('toggleContentDown'); 
            element.removeClassName('toggleUp');
            element.addClassName('toggleDown');}});
    }    
}