var flipper = {
   gallery: [],
   active: undefined,

   delay: 6000,
   autoPlay: false,

   init: function() {
      var setActive;

      $('.flipper li').each( function() {
         flipper.gallery.push({'media': this, 'caption': $('a', this ).html() });
         var rel = $(this).find("a").attr("rel");
         if( $(this).hasClass('on') ) {
            setActive = flipper.gallery.length - 1;
         }

         $('a', this ).media({
            width: 321,
            height: 258,
            autoplay: false,
            caption: false
         });
         if( rel != "" ){
            $(this).find("div").wrap("<a href='" + rel + "'/>");
         }
      });

      for( var i=0, len=flipper.gallery.length; i < len; i++ ) {
         var ctr = document.createElement('li');
         $( ctr ).append('<li><a>'+ ( i+1 ) +'</a></li>');
         $('a', ctr ).click( function() {
            flipper.autoPlay = false;
            flipper.show( parseInt( $(this).html() ) - 1 );
         });

         $('.flipper .paginate').append( ctr );
      }

      $('.flipper .paginate').prepend('<li class="prev"><a>&lt;</a></li>');
      $('.flipper .paginate').append('<li class="next"><a>&gt;</a></li>');

      $('.flipper .paginate .prev').click( function() {
         flipper.autoPlay = false;
         flipper.prev()
      });
      $('.flipper .paginate .next').click( function() {
         flipper.autoPlay = false;
         flipper.next()
      });

      flipper.show( setActive ? setActive : 0 );
   },

   play: function() {
      if( flipper.autoPlay ) {
         flipper.next();
         setTimeout('flipper.play()', flipper.delay );
      }
   },

   show: function( idx ) {
      if( undefined !== idx && idx !== flipper.active ) {
         flipper.hide( flipper.active );

         var o = flipper.gallery[idx];

         $('.flipper .caption').html( o.caption );
         $('.flipper .paginate a:contains('+ (idx+1) +')').addClass('on');
         $( o.media ).addClass('on');
         $( o.media ).show();

         flipper.active = idx;
      }

      if( idx > 0 ) {
         $('.flipper .paginate .prev').show();
      } else {
         $('.flipper .paginate .prev').hide();
      }

      if( idx < flipper.gallery.length -1 ) {
         $('.flipper .paginate .next').show();
      } else {
         $('.flipper .paginate .next').hide();
      }
   },

   hide: function( idx ) {
      if( undefined !== idx ) {
         var o = flipper.gallery[idx];

         $('.flipper .caption').html('');
         $('.flipper .paginate a:contains('+ (idx+1) +')').removeClass('on');
         $( o.media ).removeClass('on');
         $( o.media ).hide();

         flipper.active = undefined;
      }
   },

   next: function() {
      flipper.show( ( flipper.active + 1 ) % flipper.gallery.length );
   },

   prev: function() {
      flipper.show( ( flipper.active - 1 ) % flipper.gallery.length );
   }
};

$( function() {
   flipper.init();
});