var currentIndex = 0;
var numberOfItems = 0;
var intervalId = null;
$(function(){
    numberOfItems = $('#flipperBox').children().length;
    for(var i = 1; i <= numberOfItems; i++) {
        $('#flipperMarkers').append('<div class="marker" id="flipperMarker_' + i + '"></div>');
        $('#flipperMarker_' + i).click(function(){
            go2 = parseInt($(this).attr('id').split("_")[1], 10);
            if(go2 == currentIndex)
                return;
            go2index();
        });
    }
    var w = 360 * (numberOfItems - 1) + 615;
    $('#flipperBox').css('width', w + 'px');
    currentIndex = Math.floor(numberOfItems / 2);
    w = 360 * (currentIndex - 1) + 307 - 472;
    $('#flipperBox').css('margin-left', '-' + w + 'px');
    $('#flipperMarker_' + currentIndex).css('background-color','white');
    $('#flipperBox_' + currentIndex).animate({
        marginBottom: '0px',
	    marginTop: '0px',
	    height: '340px',
	    width: '605px'
    },400, 'linear', function() {
        $('#shadowText_' + currentIndex).fadeIn();
    });
    
    intervalId = setInterval('showNext()', 5000);
    
    $('#goLeft').click(function() {
        clearInterval(intervalId);
        intervalId = setInterval('showNext()', 5000);
        if($(':animated').length > 0) {
            return;
        }
        $('#shadowText_' + currentIndex).fadeOut();
        $('#flipperMarker_' + currentIndex).css('background-color','lightgrey');
        var item2move = $('#flipperBox').children(':last');
        item2move.css('width','0px');
        $('#flipperBox').prepend(item2move.detach());
        item2move.animate({
            width: '350px'
        }, { queue: false, duration: 400, easing: 'linear'});
        $('#flipperBox_' + currentIndex).animate({
            marginBottom: '71px',
	        marginTop: '71px',
	        height: '198px',
	        width: '350px'
        }, { queue: false, duration: 400, easing: 'linear' });
        currentIndex--;
        if(currentIndex == 0)
            currentIndex = numberOfItems;
        $('#flipperBox_' + currentIndex).animate({
            marginBottom: '0px',
	        marginTop: '0px',
	        height: '340px',
	        width: '605px'
        }, { 
                queue: false, 
                duration: 400, 
                easing: 'linear', 
                complete: function(){
                    $('#shadowText_' + currentIndex).fadeIn();
                    $('#flipperMarker_' + currentIndex).css('background-color','white');
                } 
           }
        );
    });
    $('#goRight').click(function() {
        clearInterval(intervalId);
        intervalId = setInterval('showNext()', 5000);
        if($(':animated').length > 0) {
            return;
        }
        $('#shadowText_' + currentIndex).fadeOut();
        $('#flipperMarker_' + currentIndex).css('background-color','lightgrey');
        var item2move = $('#flipperBox').children(':first');
        item2move.animate({
            width: '0px'
        }, { queue: false, duration: 400, easing: 'linear', complete: function(){
                    $('#flipperBox').append(item2move.detach());
                    item2move.css('width', '350px');
                } });
        $('#flipperBox_' + currentIndex).animate({
            marginBottom: '71px',
	        marginTop: '71px',
	        height: '198px',
	        width: '350px'
        }, { queue: false, duration: 400, easing: 'linear' });
        currentIndex++;
        if(currentIndex > numberOfItems)
            currentIndex = 1;
        $('#flipperBox_' + currentIndex).animate({
            marginBottom: '0px',
	        marginTop: '0px',
	        height: '340px',
	        width: '605px'
        }, { 
                queue: false, 
                duration: 400, 
                easing: 'linear', 
                complete: function(){
                    $('#shadowText_' + currentIndex).fadeIn();
                    $('#flipperMarker_' + currentIndex).css('background-color','white');
                } 
           }
        );
    });
    $('[go2]').addClass('pointer');
    $('.flipperImage').click(function(){
        clearInterval(intervalId);
        intervalId = setInterval('showNext()', 5000);
        go2 = parseInt($(this).parent().attr('id').split("_")[1], 10);
        if(go2 == currentIndex) {
            if($(this).attr('go2'))
                window.location.href = $(this).attr('go2');
        } else {
            go2index();
        }
    });
});
function showNext() {
    if($(':animated').length > 0) {
        return;
    }
    $('#shadowText_' + currentIndex).fadeOut();
    $('#flipperMarker_' + currentIndex).css('background-color','lightgrey');
    var item2move = $('#flipperBox').children(':first');
    item2move.animate({
        width: '0px'
    }, { queue: false, duration: 400, easing: 'linear', complete: function(){
                $('#flipperBox').append(item2move.detach());
                item2move.css('width', '350px');
            } });
    $('#flipperBox_' + currentIndex).animate({
        marginBottom: '71px',
        marginTop: '71px',
        height: '198px',
        width: '350px'
    }, { queue: false, duration: 400, easing: 'linear' });
    currentIndex++;
    if(currentIndex > numberOfItems)
        currentIndex = 1;
    $('#flipperBox_' + currentIndex).animate({
        marginBottom: '0px',
        marginTop: '0px',
        height: '340px',
        width: '605px'
    }, { 
            queue: false, 
            duration: 400, 
            easing: 'linear', 
            complete: function(){
                $('#shadowText_' + currentIndex).fadeIn();
                $('#flipperMarker_' + currentIndex).css('background-color','white');
            } 
       }
    );
}

var go2 = 0;
function go2index() {
    if(intervalId != null) {
        clearInterval(intervalId);
        intervalId = null;
    }
    if($('#flipperBox_' + currentIndex).css('height') != '198px') {
        $('#shadowText_' + currentIndex).fadeOut();
        $('#flipperMarker_' + currentIndex).css('background-color','lightgrey');
        $('#flipperBox_' + currentIndex).animate({
            marginBottom: '71px',
	        marginTop: '71px',
	        height: '198px',
	        width: '350px'
        }, { queue: false, duration: 400, easing: 'linear' });
    }
    if(go2 < currentIndex) {
        currentIndex--;
        var item2move = $('#flipperBox').children(':last');
        item2move.css('width','0px');
        $('#flipperBox').prepend(item2move.detach());
        item2move.animate({
            width: '350px'
        }, { queue: false, duration: 200, easing: 'linear', complete: function(){
            _go2index();
        }});
    } else if(go2 > currentIndex) {
        currentIndex++;
        var item2move = $('#flipperBox').children(':first');
        item2move.animate({
            width: '0px'
        }, { queue: true, duration: 200, easing: 'linear', complete: function(){
                    $('#flipperBox').append(item2move.detach());
                    item2move.css('width', '350px');
                    _go2index();
                } });
    }
    
}
function _go2index() {
    if(currentIndex == go2) {
        $('#flipperBox_' + currentIndex).animate({
            marginBottom: '0px',
	        marginTop: '0px',
	        height: '340px',
	        width: '605px'
        }, { 
                queue: false, 
                duration: 400, 
                easing: 'linear', 
                complete: function(){
                    $('#shadowText_' + currentIndex).fadeIn();
                    $('#flipperMarker_' + currentIndex).css('background-color','white');
                    intervalId = setInterval('showNext()', 5000);
                } 
           }
        );
    } else {
        go2index();
    }
}