Plugin de pasos de wizard

Inevitable como las mareas... si hace unos días os presentaba los CSSs para generar pasos de wizard, ahora llega el plugin que automatiza la asignación de estilos para los vagos como yo.

Como es habitual, el código con un ejemplo funcionando, en mi jsFiddle


Y ahora el código completo del plugin

/**
 * jquery.steps-0.1,js - Steps plugin for jQuery
 *  ================================================
 *  (C) 2011 José Ramón Díaz - jrdiazweb@gmail.com
 * 
 * Instantiation: $('.stepsDiv').steps()
 * 
 * Functions:
 *     $('.stepsDiv').steps('getStep') - Returns current step for stepDiv
 *     $('.stepsDiv').steps('start')   - Resets state to initial step
 *     $('.stepsDiv').steps('finish')  - Sets state to completed
 *     $('.stepsDiv').steps('next')    - Sets state to next state
 *     $('.stepsDiv').steps('prev')    - Sets state to previous state
 *     
 * Classes needed and meaning
 *     N/A              - Uncompleted step. Greyed by default
 *     end              - Last uncompleted step. Greyed and no "arrow"
 *     last             - Boundary class. Marks last completed step and last step
 *     current          - Current step
 *     completed        - Completed step
 *     completedLast    - Last completed step
 *     completedLastEnd - Last step when all steps are completed
 * 
 * Extending steps with representation
 *     You can also use the steps CSS. You can find it at
 *     http://3nibbles.blogspot.com/2011/06/pasos-de-wizard.html
 *     
 * Legal stuff
 *     You are free to use this CSS, but you must give credit or keep header intact.
 *     Please, tell me if you find it useful. An email will be enough.
 *     If you enhance this code or correct a bug, please, tell me.
 * 
 */
(function( $ ){

 $.fn.steps = function( options ) {  
  
  var self = this;
  
  
  //////////////////////////////////////////////////////////////////////////////////
  // DEFAULT VALUES
  var defaults = {};

  //////////////////////////////////////////////////////////////////////////////////
  // PRIVATE FUNCTIONS
  var init = function( options ) {
   
   // If options exist, merge them with default settings
   if ( options ) $.extend( defaults, options );
  
   var $this = $(this);
   var data = $this.data('steps');
   
   return this.each(function() {
    
    var $this = $(this);
    data      = $this.data('steps');
    
    // The plugin hasn't been initialized yet
    if ( ! data ) {
     
     // Initializes the plugin data
     $(this).data('steps', { 
      target : $this,
      step   : 0
     });
 
    };
   });   
   
  };
  
  var destroy = function( ) { 
   return this.each(function() { self.removeData('steps'); })
  };

  //////////////////////////////////////////////////////////////////////////////////
  // PUBLIC FUNCTIONS
  var methods = {
    getStep: function( ) { return self.data('steps')['step']; },
    start:   function( ) { return methods.setStep(0); },
    finish:  function( ) { 
     var l = self.find('ul li').length;
     methods.setStep(l);
     self.data('steps')['step'] = l; 
     return l;
    },
    prev:    function( ) { 
     var step = methods.getStep();
     var l    = self.find('ul li').length;
     if(step == l) step = step-1;
     return methods.setStep(step - 1); 
    },
    next:    function( ) {  
     return methods.setStep(methods.getStep() + 1);
    },
    setStep: function( stepNumber ) {  
     // Sets the step number
     var l = self.find('ul li').length;
     if(stepNumber < 0) stepNumber = 0;
     if(stepNumber > l) stepNumber = l;
     
     // Resets styles
     self.find('ul li').removeClass('current completed completedLast last end completedLastEnd');

     // Styles for intermediate steps
     self.find('ul li:lt(' + ((stepNumber < l) ? stepNumber : l-1) + ')').addClass('completed');

     if(stepNumber > 0 && stepNumber < l) 
      self.find('ul li:nth(' + (stepNumber-1) + ')').addClass('completedLast');
     if(stepNumber < l)
      self.find('ul li:nth(' + stepNumber + ')').addClass('current');

     // Last step style
     if(stepNumber == l)  
      self.find('ul li:last').addClass('completedLastEnd');
     //if(stepNumber == l-1)  
     // self.find('ul li:last').addClass('currentEnd');
     else 
      self.find('ul li:last').addClass('end');
     
     self.data('steps')['step'] = stepNumber; 
     return stepNumber;
    }
    
  };
  
  /////////////////////////////////////////////////////////////////////////////////////
  // Decides what to do
  if ( methods[options] ) {
   return methods[options].apply( self, Array.prototype.slice.call( arguments, 1 ));
  } else if ( typeof options === 'object' || ! options ) {
   return init.apply( self, arguments );
  } else {
   //$.error( 'Method ' +  options + ' does not exist on jQuery.tooltip' );
   return init.apply( self, {} );
  }    
    
 };
})( jQuery );

$('.steps').steps();

El uso es muy sencillo. Sobre el elemento contenerdor de los pasos (.steps en nuestro caso) se invoca la función ".steps()" para inicializar el plugin y posteriormente se pueden llamar a los métodos definidos mediante "obj.steps("metodo", [param]);" Los métodos de los que se deispone son:

• 'getStep' - Estado en el que se encuentra
• 'start' - Resetea el estado al principio
• 'finish' - Finaliza todos los pasos
• 'next' - Siguiente estado
• 'prev' - Estado anterior

La versión minimizada es poco más de 1Kb (a un 10% Wow!) y la comprimida aún menos. Ya no hay excusas para usarlo.