/**
 * @author koes
 */

$.fn.infiniteCarousel = function () {

    function repeat(str, num) {
        return new Array( num + 1 ).join( str );
    }
  
    return this.each(function () {
        var $wrapper = $('> div', this).css('overflow', 'hidden'),
            $slider = $wrapper.find('> ul'),
            $items = $slider.find('> li'),
            $single = $items.filter(':first'),
            
            singleWidth = $single.outerWidth(), 
            visible = Math.ceil($wrapper.innerWidth() / singleWidth), // note: doesn't include padding or border
            currentPage = 1,
            pages = Math.ceil($items.length / visible);            


        // 1. Pad so that 'visible' number will always be seen, otherwise create empty items
        if (($items.length % visible) != 0) {
            $slider.append(repeat('<li class="empty" />', visible - ($items.length % visible)));
            $items = $slider.find('> li');
        }

        // 2. Top and tail the list with 'visible' number of items, top has the last section, and tail has the first
        $items.filter(':first').before($items.slice(- visible).clone().addClass('cloned'));
        $items.filter(':last').after($items.slice(0, visible).clone().addClass('cloned'));
        $items = $slider.find('> li'); // reselect
        
        // 3. Set the left position to the first 'real' item
        $wrapper.scrollLeft(singleWidth * visible);
        
        // 4. paging function
        function gotoPage(page) {
            var dir = page < currentPage ? -1 : 1,
                n = Math.abs(currentPage - page),
                left = singleWidth * dir * visible * n;
            
            $wrapper.filter(':not(:animated)').animate({
                scrollLeft : '+=' + left
            }, 500, function () {
                if (page == 0) {
                    $wrapper.scrollLeft(singleWidth * visible * pages);
                    page = pages;
                } else if (page > pages) {
                    $wrapper.scrollLeft(singleWidth * visible);
                    // reset back to start position
                    page = 1;
                } 

                currentPage = page;
            });                
            
            return false;
        }
        
//        $wrapper.after('<a class="arrow back">&lt;</a><a class="arrow forward">&gt;</a>');
        
        // 5. Bind to the forward and back buttons
        $('a.left-arrow', this).click(function () {
            return gotoPage(currentPage - 1);                
        });
        
        $('a.right-arrow', this).click(function () {
            return gotoPage(currentPage + 1);
        });
        
        // create a public interface to move to a specific page
        $(this).bind('goto', function (event, page) {
            gotoPage(page);
        });
    });  
};

$(document).ready(function(){
    $('.infiniteCarousel').infiniteCarousel();
    
    $('a.banner-left-list-title-view').bind('click', function(){
        var id = $(this).attr('id');
        $('.banner-left-list-title-view').removeClass('yellow');
        $('.banner-left-list-desc').slideUp();
        $('.banner-right').hide();
        $('#' + id + '_desc').slideDown();
        $('#' + id + '_banner').fadeIn('slow');
        $('#' + id).addClass('yellow');
    });
    $('a.banner-left-list-title').bind('click', function(){
        var x = $(this).attr('id');
        var sp_id = x.split("_");
        id = sp_id[0]
        $('.banner-left-list-title-view').removeClass('yellow');
        $('.banner-left-list-desc').slideUp();
        $('.banner-right').hide();
        $('#' + id + '_desc').slideDown();
        $('#' + id + '_banner').fadeIn('slow');
        $('#' + id).addClass('yellow');
    });    
    $('a.left-column-content-list-title, a.secondary-view-list').bind('click', function(){
        var get_id = $(this).attr('id');
        split_id = get_id.split("_");
        id = split_id[0];
        $('.left-column-content-list-title .view').removeClass('yellow');
        $('.left-column-content-list-desc').slideUp(); 
        $('#' + id + '_desc').slideDown();
        $('#' + id + '_main .view').addClass('yellow');
        
        $('.secondary-view-wrapper').find('a.secondary-view-list').show();
        $('.secondary-view-wrapper').find('a.secondary-view-list.selected').hide();
        
        $('#' + id + '_secondary').css('display', 'none');
        $('#' + id + '_secondary_selected').css('display', 'block');
    });
    
    $('#main-teaching-action a, #teachings-specific-series-options a').bind('click', function(){
        var vid_class = $(this).attr('class');

        $('#teachings-specific-video .video').hide();
        $('#teachings-specific-video .audio').hide();
        $('#teachings-specific-video #'+vid_class+'-video').show();
        $('#teachings-specific-video #'+vid_class+'-audio').show();
        $('#series-options tr').removeClass('highlight active');
        $('#series-options tr#'+vid_class+'-series').addClass('highlight active');
    });

    $('table#series-options tr').hover(function() {
        $(this).addClass('highlight');
    }, 
    function(){
        if ($(this).hasClass('active')) {
        
        }
        else {
            $(this).removeClass('highlight');
        }
    });
    
    if (jQuery.browser.msie && jQuery.browser.version == "6.0") {
//		$(document).pngFix();
    } else {
        Cufon.replace('.banner-left-list-title, .block_text h3, .block_text a, .campus_text h3, .campus_text a, .menu ul li a.parent, .secondary-view-wrapper a, .menu ul li a.current_parent, #main-teaching-action a, ' +
        ' #content .inner-wrapper .right-content .left-column .left-column-content-wrapper .left-column-content-list a.left-column-content-list-title .title, .teachings-footer a, #teachings-specific-banner table td.col1', {
            hover: true
        });
    }
});