jQuery().ready(function() {
    //Next/Prev button creation
    var $next = $('<span class="nav-button next" title="Nästa">&nbsp;</span>');
    var $previous = $('<span class="nav-button previous" title="Föregående">&nbsp;</span>');
    $next.insertBefore(".slideshow-holder");
    $previous.insertBefore(".slideshow-holder");

    //If Slideshow exists
    $(".slideshow-holder", $("#RegionMainContent")).cycle({
        timeout: 8000,
        delay: -2000,
        next: $next,
        prev: $previous
    });


    //Add Next/Prev Button events
    function hideArrowsAtStart() {
        $(".TopImageContainer .next").animate({ "right": "-90px" }, 1000);
        $(".TopImageContainer .previous").animate({ "left": "-90px" }, 1000);
        //$(".TopImageContainer .slideshow-holder .TopImageInfo").animate({ "bottom": "-36px" }, 1000);
    }
    setTimeout(hideArrowsAtStart, 1000);
    
    var speed = 100;
    function overSlideShow() {
        if ($(this).hasClass("previous"))
            $(this).animate({ "left": "0px" }, speed);
        else
            $(this).animate({ "right": "0px" }, speed);
        //$(".slideshow-holder .TopImageInfo", $(this).parent()).animate({ "bottom": "0px" }, 1000);    
        

    }
    function outSlideShow() {
        if ($(this).hasClass("next"))
            $(this).animate({ "right": "-90px" }, speed);
        else
            $(this).animate({ "left": "-90px" }, speed);
        //$(".slideshow-holder .TopImageInfo", $(this).parent()).animate({ "bottom": "-36px" }, 1000);        
    }
    var slideshowConfig = {
        sensitivity: 3, // number = sensitivity threshold (must be 1 or higher)    
        interval: 50, // number = milliseconds for onMouseOver polling interval
        over: overSlideShow, // function = onMouseOver callback (REQUIRED)    
        timeout: 150, // number = milliseconds delay before onMouseOut
        out: outSlideShow // function = onMouseOut callback (REQUIRED)
    };
    $(".TopImageContainer .nav-button").hoverIntent(slideshowConfig);

   

    //Add hover effect to desc area for a slideshow slide.    
    //$("#SlideShow li .slideshow-decription").hover(function() { $(this).fadeTo(50, 1); }, function() { $(this).fadeTo(50, 0.5); });

});