/*
 * Rotating picture carousel
 * 
 */

var carousel_images = [];
var positions = [];
var anim_timeout = null;
var offset = 0;

$(window).load(function(){
    $('#carousel li').each(function(){
        $(this).css('-webkit-transition-duration', '0.5s');
    });
anim_timeout = setTimeout('rotateCarousel(++offset)', 5000);
});
$(document).ready(function(){
    var width = 720;
    var height = 540; //width * 10/16;
    var falloff = 0.5;
        
    var carousel = $('#carousel');
    var images = $('li', carousel);
    var size = Math.min(images.size(), 7);
    var nb_images = images.size();
    var half_size = Math.ceil(size/2);
        
    images.each(function(i, value){
        carousel_images.push($(this));
        var index = (((i - offset) % nb_images) + nb_images) % nb_images; // JS Modulo fix for negative numbers
        var img = $(this);
        var pos = {};
            
        if(index != 0) {
            img.children('div').hide();
        }
            
        if(index < half_size) {
            var factor = index * falloff + 1;
            img.width(width/factor);
            img.height(height/factor);
            var position = img.offset();
                
            position.left = carousel.offset().left + carousel.innerWidth() - img.width();
            position.left -= (carousel.innerWidth()/2 - img.width()/2) / Math.pow(factor, 3) * ((half_size - index - 1)/(half_size - 1));
                
            position.top = carousel.offset().top + carousel.innerHeight() - img.height() - (factor - 1) * 30 - 20;
            img.offset(position);
            var zIndex = 100 + (half_size - index - 1);
            img.css('z-index', zIndex)

        }
        else if(index > (nb_images - half_size)){
            index = nb_images - index;
            var factor = index * falloff + 1;
            img.width(width/factor);
            img.height(height/factor);
            var position = img.offset();

            position.left = carousel.offset().left;
            position.left += (carousel.innerWidth()/2 - img.width()/2) / Math.pow(factor, 3) * (half_size - index - 1)/(half_size - 1);

            position.top = carousel.offset().top + carousel.innerHeight() - img.height() - (factor - 1) * 30 - 20;
            img.offset(position);
            var zIndex = 100 + (half_size - index - 1);
            img.css('z-index', zIndex)

        }
        else {
            var factor = half_size * falloff + 1;
            img.width(width/factor);
            img.height(height/factor);
            var position = img.offset();
            position.left = carousel.offset().left + carousel.innerWidth()/2 - img.width()/2;
            position.top = carousel.offset().top + carousel.innerHeight() - img.height() - 50;
            img.offset(position);
            var zIndex = 0;
            img.css('z-index', zIndex)

        }
        img.attr('pos', i);
        pos = {
            width: img.width(),
            height: img.height(),
            top: position.top - carousel.offset().top,
            left: position.left - carousel.offset().left,
            zIndex: zIndex //,
            //videoSrc: img.children('iframe').attr('src')
        }
        positions.push(pos);
        //if(i != 0) {
        //    img.children('iframe').attr('src', '');
        //}
            
    });
                
    $(document).keydown(function(e){
        var code = (e.keyCode ? e.keyCode : e.which);
        switch(code){
            case 37: // Left
                offset -= 1;
                break;
            case 38: // Up
                break;
            case 39: // Right
                offset += 1;
                break;
            case 40: // Down
                break;
        }
        if(code == 37 || code == 39) {
            rotateCarousel(offset);
        }
    });
//    $('#carousel').mousewheel(function(e, d, dX, dY){
//        if(carousel_images[0].queue().length == 0) {
//            if(dX > 0) {
//                offset += 1;
//            }
//            else if(dX < 0) {
//                offset -= 1;
//            }
//
//            if(dX != 0) {
//                rotateCarousel(offset);                    
//            }
//        }
//    });
    $('#carousel').wipetouch({
        allowDiagonal: false,
        wipeLeft: function(e) {
            rotateCarousel(++offset);
        },
        wipeRight: function(e) {
            rotateCarousel(--offset);
        }
    });
    $('#carousel li').click(function(){
        var nb_images = carousel_images.length;
        var half_size = Math.ceil(carousel_images.length/2);
        var pos = $(this).attr('pos');
        rel_pos = (pos < half_size ? pos : pos - nb_images);
        if(rel_pos > 0) {
            for(i = 0; i < rel_pos; i++) {
                setTimeout(function(){
                    rotateCarousel(++offset);
                }, 200 * i);
            }
        }
        else {
            for(i = 0; i < -rel_pos; i++) {
                setTimeout(function(){
                    rotateCarousel(--offset);
                }, 200 * i);
            }
        }
    });
    $('#carousel').hover(function(){
        clearTimeout(anim_timeout);
    });
});
    
    
rotateCarousel = function(offset) {
    clearTimeout(anim_timeout);
    
    for(i = 0; i < carousel_images.length; i++) {
        rotation_index = (((i - offset) % carousel_images.length) + carousel_images.length) % carousel_images.length;
        var image = carousel_images[i];
        var pos = positions[rotation_index];
        var half_size = Math.ceil(carousel_images.length/2);
        var factor = 1/(rotation_index * 0.5 + 1);
        image.attr('pos', rotation_index);
            
        if(rotation_index == 0) {
            image.addClass('carousel-front-image');
        }
        else {
            image.removeClass('carousel-front-image');
        }
        //image.children('iframe').attr('src', '').hide();
        image.children('div').hide();
        image.queue(function(pos) {
            return function() {
                $(this).css('z-index', pos.zIndex); // z-index does not animate
                $(this).dequeue();
            }
        }(pos));
        if($.browser.webkit) {
            image.css({
                width: pos.width,
                height: pos.height,
                left: pos.left,
                top: pos.top,
                'z-index': pos.zIndex
            });
            image.bind('webkitTransitionEnd', function(pos) {
                return function() {
                    $(this).unbind('webkitTransitionEnd');
                    if($(this).hasClass('carousel-front-image')) {
                        if($(this).queue().length == 0) {
                            //$(this).children('iframe').attr('src', pos.videoSrc).show();
                            $(this).children('div').fadeIn('slow');
                        }
                    }
                }
            }(pos));
        }
        else {
            image.animate(
                pos,
                {
                    duration: 500,
                    easing: 'swing',
                    complete: function(pos) {
                        return function() {
                            if($(this).hasClass('carousel-front-image')) {
                                if($(this).queue().length <= 1) {
                                    //$(this).children('iframe').attr('src', pos.videoSrc).show();
                                    $(this).children('div').fadeIn('slow');
                                }
                            }
                        }
                    }(pos)
                }
                );                
        }
    }

anim_timeout = setTimeout('rotateCarousel(++offset)', 5000);
}