﻿/* jquery.perspecitve
 * copyright (c) 2007 New Perceptions Technology
 * $LastChangedDate: 2008-5-2 $
 * $Rev: 10 $
 *
 * Version: 1.1
 *
 * Requires: jQuery 1.2+
 * Usage: 
    
    $('#logo').perspective({
                depth: 4,
                direction: 'rl' or 'lr'
            });
    
    Example at http://newperceptionstech.com

 */

(function($) {

    
$.fn.perspective = function(opts){
    
    debug(this);
    
    
    var options = $.extend({}, $.fn.perspective.defaults, opts); 
    
    return this.each(function() {
          $this = $(this);
          
          // build element specific options
          var o = $.meta ? $.extend({}, options, $this.data()) : options;
          // update element styles
          $this.defaults ={ 
            depth: o.depth,
            direction: o.direction,
            left: o.direction== 'lr' ? 0 : 9 * o.depth,
            top: 0,
            opacity: 20
          };
          
          $this.css({
            top: o.top,
            left:  o.direction == 'lr' ? 0 : (9 * o.depth),
            top: 0,
            opacity: o.opacity
          });
          var text = $this.html();
          
          text = $.fn.perspective.apply(text);
          $this.html(text);
        });
        
    };

    $.fn.perspective.apply = function(txt) {
        
        $this.html("&nbsp;");
        var direction = $this.defaults.direction == 'lr' ? 1 : -1;
        
        var opIncr = (100 - $this.defaults.opacity) / $this.defaults.depth;
        for (var i = 0; i<$this.defaults.depth; i++){
                
                var div = document.createElement("div");
                div.href = "";
                div.style.top = $this.defaults.top + "px";
                div.style.left = $this.defaults.left + "px";
                div.innerHTML = txt;
                div.style.filter = "alpha(opacity=" + $this.defaults.opacity + ")";
                div.style.opacity = $this.defaults.opacity * .01;
                div.style.position = "absolute";
                
                $this.defaults.top += 6;
                $this.defaults.left += (9 * direction);
                $this.defaults.opacity += opIncr;
                $this.append(div);
                
                if (i==$this.defaults.depth-1)
                {
                    div.style.filter = "alpha(opacity=" + 100 + ")";
                    div.style.opacity = 1.0;
                }
            }
            
        return $this.html();
    };

    function debug($obj) {
        if (window.console && window.console.log)
          window.console.log('options: ' + $obj.size());
      };

    // default attributes
    $.fn.perspective.defaults = {
        depth:2,
        direction: 'lr'
    };
    
/*END*/
})(jQuery);