/*
 * jQuery Fullscreen Image Slider v0.1
 * http://www.svenaarts.be
 *
 * Copyright 2011, Sven Aarts
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * April 2011
 */
(function($) { 
   $.fn.fullscreenimageslider = function(settings) {
      var config = {
          autoscroll: true,
          duration: 3000
      };
     
     if (settings) $.extend(config, settings);
      
     this.each(function() {
       
        var slidercontainer = $(this);
        
        slidercontainer.append('<div class="prev"></div><div class="next"></div><div class="frame"></div>');
        
        var pager = slidercontainer.find('.frame');
        var slider = slidercontainer.find('ul:first');
        var slides = slider.find('li');
        var n = parseInt(slides.length);
        var autoscroll = config.autoscroll;
        var duration = config.duration;
            
        slides.width(slidercontainer.width());
        $(window).resize(function(){
          slides.width(slidercontainer.width());
          _scroll();
        });
        
        if (n > 1) {        
          var sliding = false;
          var cur = 0;
          
          var next = slidercontainer.find('.next:first');
          var prev = slidercontainer.find('.prev:first');
          
          next.fadeTo(0, 1).addClass('clickable');
          prev.fadeTo(0, 0.3);
                        
          next.click(function(){
             autoscroll = false;
             if($(this).hasClass('clickable')){
              cur++; 
              _scroll();                   
             }
          });
          prev.click(function(){
             autoscroll = false;
             if($(this).hasClass('clickable')){
              cur--;
              _scroll();
             }
          });             
          
          // add bullets
          for (i=0;i<n;i++){
            pager.append('<span class="bullet">'+(i+1)+'</span>');
          }
          $('.bullet:eq(0)',slidercontainer).addClass('active');
          
          // scroll when bullet is clicked
          $('.bullet',slidercontainer).click(function(){
              cur = $(this).html()-1;
              _scroll();
          });
          
          function _autoscroll(){
              if(autoscroll == true){
                cur++; 
                _scroll();
                setTimeout (_autoscroll, duration); 
              }                       
          }
          setTimeout (_autoscroll, duration)
          
          //nested function
          function _scroll(){
            
              sliding = true;
              
              if(cur == n){
                cur = 0
              }
              
              
              //prev arrow
              if(cur == 0){                        
                prev.removeClass('clickable').fadeTo('slow', 0.3);
              }
              else{
                prev.fadeTo('slow', 1).addClass('clickable');
              }
              
              //next arrow
              if(cur == (n-1)){
                next.removeClass('clickable').fadeTo('slow', 0.3);
              }
              else{
                next.fadeTo('slow', 1).addClass('clickable');
              }
              
              // active bullet
              $('.bullet',slidercontainer).removeClass('active');
              $('.bullet:eq('+cur+')',slidercontainer).addClass('active');
              
              var newpos = cur * slidercontainer.width();
              slider.stop().animate( {
                  'left' : '-'+ newpos + 'px'
                }, 'slow', 'easeOutExpo', function() {
                  sliding = false;
              });        
          }//_scroll
        }// i > 1 
     });      
     return this;
   };
 
 })(jQuery);

