$.fn.gq_gallery = function(settings) {
  settings = $.extend({
  }, settings);
  
  return this.each(function(){
    if($(this).find('.panel').length>1){
        var slider = $(this).gq_slider();
        var scrollJump=true;
    }else{
        $(this).css({'position':'relative'});
        var selectedIndex=$('.thumbs li').index($('.thumbs li.selected:first'));
        var scrollJump=false;
    }

    var thumbs = $(this).find('.thumbs');
    var navigation = thumbs.find('.navigation');
    var captions = $(this).find('.caption');
    
    thumbs
      .after('<span class="thumb-prev">Previous</span>')
      .after('<span class="thumb-next">Next</span>');
    
    navigation.css({
      'margin-left': '32px',
      'width': '' + (87 * thumbs.find('li').length + 32-10) + 'px'
    });
      
    thumbs.css({
      position: 'relative', 
      overflow: 'hidden'
    });
    
    thumbs.serialScroll({
      items: 'li',
      prev: '.thumb-prev',
      next: '.thumb-next',
      offset: -27, //when scrolling to photo, stop 230 before reaching it (from the left)
      start: 0, //as we are centering it, start at the 2nd
      duration: 400,
      step: 3,
      force: true,
      stop: true,
      lock: false,
      cycle: false,           //don't pull back once you reach the end
      easing: 'swing', //use this easing equation for a funny effect
      jump: scrollJump //click on the images to scroll to them
    });
    if(selectedIndex){
        thumbs.trigger( 'goto', [ selectedIndex ] );
    }
    
    captions.click(function() {
      $(this)
        .toggleClass('close')
        .toggleClass('open')
        .find('span').animate({
        'height': 'toggle'
      }, 400);
    })
      .toggleClass('open')
      .click();
  });
};