/**
 * A Carousel using jQuery
 * Coded by Abdullah Rubiyath
 * 
 * Reads from a JSON File, which can be passed when calling it
 * Released under MIT License
 * 
 * Date: Sept 1, 2009
 * 
 */
var aCarousel = {
    $this  : '',
    options : {
        jsonFile      : 'list.json', 
        navClass      : '.ac-nav-list',
        infoClass     : '.ac-info' ,
        displayClass  : '.ac-display' ,
        progressClass : '.ac-progress-bar' ,
        info          : '' ,
        progressWidth : '',
        current       : 0 ,
        total         : 0 ,
        videoPlaying  : false,
        interval      : 8000,
        timerObj      : null,
        progressObj   : null
    },
    elem : {
        nav     : '',
        display : '',
        info    : '',
        progress : ''
    },
    init : function() {
    // initialize the Carousel.
    $.getJSON(aCarousel.options.jsonFile, function(data) {

        aCarousel.elem.nav.html('');
        aCarousel.options.total = data.entries.length;
        aCarousel.elem.display.html("");
        for(var i=0;i<aCarousel.options.total;i++) {
		 aCarousel.elem.display.append('<div style="position:absolute;top:0;left:0;opacity:0,z-index:0;"></div>');
         var videoType = { vClass : '',  vTag : ''  }
         if( data.entries[i].type == "html-video" ) {
             videoType.vClass = ' class="video" ';
             videoType.vTag   = ' <span class="video"></span>';
         } 
         $('<a></a>')
          .attr({ href : data.entries[i].link , title  : data.entries[i].alt})
          .html(videoType.vTag+'<img src="'+data.entries[i].thumb+'"'+videoType.vClass+'alt="'+data.entries[i].alt+'" />'
                   + '<span>'+data.entries[i].alt+'</span>'
                   + '<span class="hide">'+data.entries[i].desc+'</span>'
           ).appendTo(aCarousel.elem.nav);
        }     
        aCarousel.elem.nav.append('<div class="clear"></div>');
        $('>a', aCarousel.elem.nav).hover(function() {
           aCarousel.options.info = aCarousel.elem.info.html();
           aCarousel.elem.info.html( $(">.hide", this).html() ) ;  
         }, function() {
           aCarousel.elem.info.html(aCarousel.options.info);
         }).click(function() {
             aCarousel.goTo( $(">a", $(this).parent()).index(this) );
             return false;
         });       
        
        // add the hover effect, and make an exception if video is playing :|
        aCarousel.elem.display.hover(function() { 
            if (!aCarousel.options.videoPlaying) {
                aCarousel.pauseInterval();
            } 
        }, function() {  
            if (!aCarousel.options.videoPlaying) {
                aCarousel.startInterval();
            }
        });
        
        if( $(">a:first-child", aCarousel.elem.nav).width()*aCarousel.options.total > aCarousel.elem.nav.parent().width()+20 ) {
            $('.ac-prev').click(function(event) {
                aCarousel.scrollLeft();
                event.preventDefault();
            });
            
            $('.ac-next').click(function(event) {
                aCarousel.scrollRight();
                event.preventDefault();
            });
        }
        
        aCarousel.loadItem(0, false);  
 
    });


        
    } ,
    start : function(jsonFile, divId) {
        divId  = divId || '#ac';
        aCarousel.$this = $(divId);
        aCarousel.options.jsonFile = jsonFile || 'list.json';
        aCarousel.elem.display  = $(aCarousel.options.displayClass, aCarousel.$this);
        aCarousel.elem.nav      = $(aCarousel.options.navClass, aCarousel.$this);
        aCarousel.elem.info     = $(aCarousel.options.infoClass, aCarousel.$this);
        aCarousel.elem.progress = $(aCarousel.options.progressClass, aCarousel.$this); 
        aCarousel.options.progressWidth = aCarousel.elem.progress.width();
        aCarousel.init();
    },
    loadItem : function(index, hasHTML) {
        // if any video was playing before, set it to false
        aCarousel.options.videoPlaying = false;
        $.getJSON(aCarousel.options.jsonFile, function(data) {
            
            if( data.entries[aCarousel.options.current].type == "html-video") {
                $('>div:eq(' + aCarousel.options.current + ')', aCarousel.elem.display).html("");
            }
            if (!hasHTML) {
                if (data.entries[index].type == "image") {
                    $('>div:eq(' + index + ')', aCarousel.elem.display).html('<a href="' + data.entries[index].link + '" title="' + data.entries[index].alt + '">' +
                    '<img src="' +
                    data.entries[index].url +
                    '" alt="' +
                    data.entries[index].alt +
                    '" border="0" />' +
                    '</a>');
                } else if(data.entries[index].type == "html-code"){
					$('>div:eq(' + index + ')', aCarousel.elem.display).html(data.entries[index].url);
				} else {
                    $('>div:eq(' + index + ')', aCarousel.elem.display).load(data.entries[index].url);
                }
            }
            aCarousel.options.info = data.entries[index].desc;
            aCarousel.elem.info.html(data.entries[index].desc);
            aCarousel.crossFade(index, aCarousel.options.interval);
        });  
        
    } ,
    goTo    : function(index) {
        if( aCarousel.options.current == index )  return;   
        var cHTML = $('>div:eq('+index+')', aCarousel.elem.display).html();    
        aCarousel.loadItem(index, cHTML != "");        
    } ,
    pauseInterval : function() {        
        if (aCarousel.options.timerObj != null) {
            clearTimeout(aCarousel.options.timerObj);
        } 
        if( aCarousel.options.progressObj != null ) {
            clearTimeout(aCarousel.options.progressObj);
        }        
    },
    startInterval : function() {
        aCarousel.options.timerObj = window.setTimeout('aCarousel.goTo('+((aCarousel.options.current+1)%aCarousel.options.total)+')', aCarousel.options.interval);    
        aCarousel.startProgress(aCarousel.options.interval);       
    },
    startProgress : function(factor) {
        aCarousel.elem.progress.css("width" , ""+ (aCarousel.options.progressWidth/aCarousel.options.interval)*factor+'px');
        aCarousel.options.progressObj = window.setTimeout('aCarousel.startProgress('+(factor-1000)+')', 1000);             
    }, 
    crossFade     : function(index, interval) {        
        var currentElem = $('>div:eq('+aCarousel.options.current+')', aCarousel.elem.display).css('z-index', '0');
        $('>div:eq('+index+')', aCarousel.elem.display).css( {
            'z-index': '3',
            'marginTop': '-540px',
            'opacity' : 0
        }).animate({
                'opacity'   :  1 ,
                'marginTop' : 0
            }, 800, 'swing', function() {
           if (aCarousel.options.current != index) {
               currentElem.css('opacity', '0');
               $('>a:eq('+aCarousel.options.current+')', aCarousel.elem.nav).removeClass('on');     
           }
           $('>a:eq('+index+')', aCarousel.elem.nav).addClass('on');
           aCarousel.options.current = index;
           aCarousel.pauseInterval();
           aCarousel.startInterval();
        });
    },
    scrollLeft : function() {
        if( parseInt(aCarousel.elem.nav.css('marginLeft')) < 0 ) {
            aCarousel.elem.nav.animate({ "marginLeft": 0}, 250);
        }
    },
    scrollRight : function() {
        if( parseInt(aCarousel.elem.nav.css('marginLeft')) >=0 ) {
            aCarousel.elem.nav.animate({ "marginLeft": -1*aCarousel.elem.nav.parent().width()}, 250);
        }
    }
    
}