$(document).ready(function () {

    $('#slidesloader').hide();
    $('#promoslides').show();
    $('.promopips').show();

    $('div#promo').bind("mouseover", function () {
        slideshow.cycle('pause');
    });

    $('div#promo').bind("mouseleave", function () {
        slideshow.cycle('resume');
    });

    $(".promopips li a").each(function (index) {
        $(this).click(function () {
            var but = $("#but" + index);
            var slide = $("#slide" + index + " .right");
            //slide.hide();
            //but.hide();
            slideshow.cycle('resume');
            setPip(index);
        });
    });

    var slideshow = $('#promoslides').cycle({
        fx: 'scrollLeft',
        speed: 500,
        speedOut: 250,
        speedIn: 250,
        timeout: 12000,
        after: onAfter,
        pager: '.promopips',
        pagerAnchorBuilder: function (idx, slide) {
            return '.promopips li:eq(' + (idx) + ') a';
        }
    });

    function setPip(index) {
        var pipon = "Images/Forum2012/pipon.png";
        var pipoff = "Images/Forum2012/pipoff.png";
        $(".promopips img").each(function () {
            $(this).attr("src", pipoff);
        });
        $("#pip" + index).attr("src", pipon);
    }

    function onAfter(curr, next, opts) {

        var index = opts.currSlide;
        setPip(index);
        // hide all animated panels
        $("#promoslides .right").each(function (index) {
            $(this).hide();
        });
        // set start position
        var but = $("#but" + index);
        var slide = $("#slide" + index + " .right");
        slide.css({ 'marginLeft': '200px' });
        but.css({ 'marginLeft': '420px' });
        // animate
        slide.fadeIn("fast");
        but.fadeIn("slow");
        slide.animate({ marginLeft: -200 },
            {
                duration: 'fast',
                easing: 'swing'
            });
        window.setTimeout(function () {
            but.animate({ marginLeft: -420 },
                {
                    duration: 'fast',
                    easing: 'swing'
                })
        }, 500);
    }

});