jquery.shuffleLetters.js

/**
* @name		Shuffle Letters
* @author		Martin Angelov
* @version 	1.1
* @url			http://tutorialzine.com/2011/09/shuffle-letters-effect-jquery/
* @license		MIT License
*/

(function($){

  $.fn.shuffleLetters = function(prop){

    var options = $.extend({
      "step"			: 8,  // How many times should the letters be changed
      "fps"				: 25, // Frames Per Second
      "text"			: "", // Use this text instead of the contents
      "pool"			: "", // Random character pool override
      "callback"	: function(){}	// Run once the animation is complete
    },prop)

    return this.each(function(){

      var el = $(this),
      str = "";


      // Preventing parallel animations using a flag;

      if(el.data('animated')){
        return true;
      }

      el.data('animated',true);


      if(options.text) {
        str = options.text.split('');
      }
      else {
        str = el.text().split('');
      }

      // The types array holds the type for each character;
      // Letters holds the positions of non-space characters;

      var types = [],
      letters = [];

      // Looping through all the chars of the string

      for(var i=0;i<str.length;i++){

        var ch = str[i];

        if(ch == " "){
          types[i] = "space";
          continue;
        }
        else if(/[a-z]/.test(ch)){
          types[i] = "lowerLetter";
        }
        else if(/[A-Z]/.test(ch)){
          types[i] = "upperLetter";
        }
        else if(/[0-9]/){
          types[i] = "numeric";
        }
        else {
          types[i] = "symbol";
        }

        letters.push(i);
      }

      el.html("");

      // Self executing named function expression:

      (function shuffle(start){

        // This code is run options.fps times per second
        // and updates the contents of the page element

        var i,
        len = letters.length,
        strCopy = str.slice(0);	// Fresh copy of the string

        if(start>len){

          // The animation is complete. Updating the
          // flag and triggering the callback;

          el.data('animated',false);
          options.callback(el);
          return;
        }

        // All the work gets done here
        for(i=Math.max(start,0); i < len; i++){

          // The start argument and options.step limit
          // the characters we will be working on at once

          if( i < start+options.step){
            // Generate a random character at thsi position
            strCopy[letters[i]] = randomChar(types[letters[i]], options.pool);
          }
          else {
            strCopy[letters[i]] = "";
          }
        }

        el.text(strCopy.join(""));

        setTimeout(function(){

          shuffle(start+1);

        },1000/options.fps);

      })(-options.step);


    });
  };

  function randomChar(type, pool){
    var pool = pool || "";

    // A pool has not been passed
    if (!pool.length) {
      var pools = {
        "lowerLetter": "abcdefghijklmnopqrstuvwxyz0123456789",
        "upperLetter": "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789",
        "symbol": ",.?/\\(^)![]{}*&^%$#'\"",
        "numeric": "0123456789",

        all: function() {
          return lowerLetter + upperLetter + symbol + numeric;
        }
      }

      if (type == "lowerLetter"){
        pool = pools.lowerLetter;
      }
      else if (type == "upperLetter"){
        pool = pools.upperLetter;
      }
      else if (type == "symbol"){
        pool = pools.symbol;
      }
      else if (type == "numeric"){
        pool = pools.numeric
      } else {
        pool = polls.all();
      }
    }

    var arr = pool.split('');
    return arr[Math.floor(Math.random()*arr.length)];
  }

})(jQuery);