function offset_slideshow() {
    // center the slideshow
    half_width = ($(window).width() / 2)
    offset = half_width - 500 /*500*/
    $('#slideshow .wrapper2 ul').css({
        'margin-left': offset
        })
    $('#slideshow a.prev').css('left', half_width-500-22)/*500*/
    $('#slideshow a.next').css('left', half_width+420-11)/*430*/
}

$(window).load(function(){
    // Display the slideshow once we're relatively sure everything has loaded.
    setTimeout(function(){
        offset_slideshow();
        $('#slideshow-loading').fadeOut(function(){ $(this).remove() });
    }, 1000)
})

// Inifite slideshow, based on http://jqueryfordesigners.com/jquery-infinite-carousel/
$.fn.slideshow = function () {
    return this.each(function () {
        var $slideshow = $(this);
        var $wrapper = $slideshow.find('> div.wrapper2');
        var $slider = $wrapper.find('> ul');
        var $items = $slider.find('> li');
        var $firstSlide = $items.filter(':first');
        var $lastSlide = $items.filter(':last');

        var slideWidth = $firstSlide.outerWidth(true);
        var numSlides = $items.length;
        var currentPage = 1;

        // Clone the first 2 and last 2 slides
        $firstSlide.before($items.slice(-2).clone().addClass('clone'));
        $lastSlide.after($items.slice(0, 2).clone().addClass('clone'));

        // Reset the $items and initialize the slideshow
        var $items = $slider.find('> li');
        var $active = $firstSlide.addClass('active');
        $active.find('a').fadeTo(0, 1);
        $wrapper
            .css('overflow', 'hidden')
            .scrollLeft(slideWidth * 2);
        $slideshow.hover(
            function(){ $(this).addClass('hover'); },
            function(){ $(this).removeClass('hover'); }
        );

        function gotoPage(page){
            var direction = page < currentPage ? -1 : 1;
            var left = slideWidth * direction;

            // Determine the next slide
            if(direction == 1){
                $next = $active.next();
            } else {
                $next = $active.prev();
            }

            // Only scroll if it isn't already
            if(!$wrapper.is(':animated')){
                $items.find('a:visible').fadeOut(750);
                $next.find('a').fadeIn(750);
                $wrapper.animate({
                    scrollLeft: '+=' + left
                    }, 750, function(){
                        if(page == 0){
                            $next = $items.eq(numSlides + 1);
                            $next.find('a').fadeTo(0, 1);
                            $wrapper.scrollLeft(slideWidth * (numSlides + 1));
                            page = numSlides;
                        }else if(page > numSlides){
                            $next = $items.eq(2);
                            $next.find('a').fadeTo(0, 1);
                            $wrapper.scrollLeft(slideWidth * 2);
                            page = 1;
                        }
                        currentPage = page;
                        $active.removeClass('active');
                        $next.addClass('active');
                        $active = $next;
                    });
            }
        };

        // Scroll to a slide when it's clicked
        $items.each(function(index){
            $(this).click(function(){
                gotoPage($(this).index() - 1);
            })
        });

        // prev/next buttons
        $slideshow.find('a.prev').click(function(){
            gotoPage(currentPage - 1);
            return false;
        });

        $slideshow.find('a.next').click(function(){
            gotoPage(currentPage + 1);
            return false;
        });

        // Autoscroll every 10 seconds...
        setInterval(function(){
            // ...but only if the mouse isn't hovered over it
            if(!$slideshow.hasClass('hover')){
                gotoPage(currentPage + 1)
            }
        }, 50000);
    });
};


$(document).ready(function(){
    // Make sure slide slideshow is always centered
    $(window).resize(offset_slideshow);

    //$('*').click(function(){ console.log('-------------------------') })

    // Fix for old versions of webkit
    if($.browser.webkit && parseInt($.browser.version) <= 531){
        $('#dc-search input[type=submit]').css('margin-bottom', '-4px');
        $('#dc-email-signup input[type=submit]').css('margin-bottom', '-5px');
    }

    // Initialize the slideshow
    if($('#slideshow li').length > 1) {
        $('#slideshow').slideshow();
    } else {
        // Only one slide? Remove the next/prev buttons and display the color image
        $('#slideshow .prev, #slideshow .next').remove();
        $('#slideshow li a').fadeIn(0);
    }

    // CTA Hovers
    $('#dc-ctas a').hover(
        function(){ $(this).children('div').stop().fadeTo('fast', 1.0); },
        function(){ $(this).children('div').stop().fadeTo('fast', 0.0); }
    );

    // If we have multiple news items, kick off the cycle.
    if($('#dc-news li').length > 1) {
        $('#dc-news li').hover(
            function(){ $(this).data('hover', true); },
            function(){ $(this).data('hover', false); }
        );
        setInterval(function(){
            $active_item = $('#dc-news li.active');
            if(!$active_item.length) {
                // If we have no active class, start from the beginning.
                $active_item = $('#dc-news li:first-child')
            }
            // Only cycle if the mouse isn't currently over the link
            if(!$active_item.data('hover')) {
                $next_item = $active_item.next();
                if(!$next_item.length){
                    // We reached the end, go to the beginning
                    $next_item = $('#dc-news li:first-child');
                }
                $active_item.removeClass('active').fadeOut(function(){
                    $next_item.addClass('active').fadeIn();
                });
            }
        }, 5000);
    }
});