$(function()
{
    $('#homeSlider .images[rel="inactive"]').hide();

    var delay = $('#timer').text();

    delay += '000';

    var id = setInterval( "slideSwitch()", parseInt(delay) );

    // make sure the arrow's href points to the first item's href.
    var firstHref = $("#homeSlider div[id='firstItem'] a").attr('href');
    $('#homeSlider .arrowHref').attr('href', firstHref);

    // bind function for stopping the interval on mouseover
    $('#homeSlider .images, #homeSlider .arrow').bind("mouseover", function ()
    {
        clearTimeout(id);
    });

    // bind function for starting the interval on mouseout
    $('#homeSlider .images, #homeSlider .arrow').bind("mouseout", function ()
    {
        id = setInterval( "slideSwitch()", parseInt(delay) );
    });

    // bind function for showing the description
    $('#homeSlider .images, #homeSlider .arrow').bind("mouseenter", function()
    {
        $('#homeSlider .picture').css( "display", "none" );
        $('#homeSlider .description').css( "display", "block" );
        
    });

    // bind function for showing the picture
    $('#homeSlider .images, #homeSlider .arrow').bind("mouseleave", function()
    {
        $('#homeSlider .description').css( "display", "none" );
        $('#homeSlider .picture').css( "display", "block" );
    });
});



function slideSwitch()
{
    // get active item
    var active = $("#homeSlider div[rel='active']");

    // check if there is a next item
    if ( active.next().html() != null )
    {
        // we have a next item

        var next = active.next();

        active.attr("rel", "inactive");

        next.attr("rel", "active");

        $('#homeSlider .images[rel="inactive"]').hide();
    }
    else 
    {
        // no more items, start over

        active.attr("rel", "inactive");

        $("#homeSlider div[id='firstItem']").attr("rel", "active");

        var next = $("#homeSlider div[id='firstItem']");

        $('#homeSlider .images[rel="inactive"]').hide();
    }

    // fade current item out, fade next item in
    active.fadeOut( 1000, function()
    {
        next.fadeIn( 1000 );
    });

    var nextHref = $('a', next).attr('href');
    $('#homeSlider .arrowHref').attr('href', nextHref);
}