/**
 * Slideshow
 * © 2009 eric le bihen
 */
(function($) {
  $.fn.slideshow = function(options) {
    var opts      = $.extend({}, $.fn.slideshow.defaults, options);
    var viewport  = $.extend({}, $.fn.slideshow.viewport, {width: this.width(), height: this.height()});

    return this.each(function() {
      var $this     = $(this);
      var _objects  = [];

      $this.build = function(images){
        $this.append('<div class="layer"></div>');
        $(images).each(function(i, item){
          var o = {};
          if(opts.use_href)
          {
            o = {url: $(item).attr('href'), caption: $(item).find('img').attr('alt')}
          }
          else
          {
            o = {url: $(item).attr('src'), caption: $(item).attr('alt')}
          }

          $this.find('.layer').append('<img />');
          $this.find('img:last').attr('src', o.url).attr('alt', o.caption).css({
            position:  'absolute',
            top:       0,
            left:      viewport.width * i
          });

          _objects.push(o);
        })

        // build interface
        $this.append(opts.interface);
        var top = (viewport.height / 2) - ($this.find('#previous').height() / 2);
        // layout
        $this.find('#previous').css({
          float:      'left',
          marginTop:  top
        })
        $this.find('#next').css({
          float:      'right',
          marginTop:  top
        })
        $this.find('#interface').css({
          width:     viewport.width,
          height:    viewport.height,
          position:  'absolute'
        })
      };

    $this.connect = function(){
      $this.find('#next, #previous').click(function(e)
      {
        var step  = (e.target.id == 'next') ? 1 : -1;
        var next  = opts.index + step;
        if(_objects[next])
        {
          $this.moveTo(next);
        }
      });

      $this.hover(
        function(e){$this.find('#interface').fadeIn('fast')},
        function(e){$this.find('#interface').fadeOut('fast')}
      );
    }

    $this.initialize = function(){
      $this.find('#previous, #next').hide();
      $this.moveTo(opts.index);
    }

    $this.moveTo = function(index)
    {
      if(_objects.length-1 != index)
      {
        $this.find('#next').fadeIn()
      }
      else
      {
        $this.find('#next').fadeOut()
      }

      if(index > 0)
      {
        $this.find('#previous').fadeIn()
      }
      else
      {
        $this.find('#previous').fadeOut()
      }

      $this.find('.layer').animate({left: (viewport.width * index) * -1}, 'normal', null, function()
      {
        opts.index = index;
      })
    };

    if(opts.images.length)
    {
      $this.build(opts.images);
      $this.connect();
      $this.initialize();
    }
    });

    return this;
  };

  $.fn.slideshow.defaults = {
    use_href:   true,
    index:      0,
    interface:  '<div id="interface"><div id="previous"></div><div id="next"></div></div>'
  }
  $.fn.slideshow.viewport = {
    width: 640,
    height:480
  }
})(jQuery);