Totally revise opto-transform for jquery 1.4.3, based off of Louis-Rémi Babé jquery.rotate.js

src/jquery.opto-transform.js

@@ -2,56 +2,44 @@
 (function($){  
 
 
-  // if props.transform hasn't been set, do it already
+  $.optoTransform = {
-  $.props.transform = getStyleProperty('transform');
     
-  var optoTransform = {
+    transformProp : getStyleProperty('transform'),
-    fnUtilsDimensional : {
+    
-      '2d' : {
+    fnUtils : Modernizr.csstransforms3d ? 
+      { // 2d transform functions
         translate : function ( position ) {
-          return 'translate(' + position[0] + 'px, ' + position[1] + 'px) ';
+          return 'translate3d(' + position[0] + 'px, ' + position[1] + 'px, 0) ';
         },
         scale : function ( scale ) {
-          return 'scale(' + scale[0] + ') ';
+          return 'scale3d(' + scale + ', ' + scale + ', 1) ';
         }
-      },
+      } :
-      '3d' : {
+      { // 3d transform functions
         translate : function ( position ) {
-          return 'translate3d(' + position[0] + 'px, ' + position[1] + 'px, 0) ';
+          return 'translate(' + position[0] + 'px, ' + position[1] + 'px) ';
         },
         scale :  function ( scale ) {
-          return 'scale3d(' + scale[0] + ', ' + scale[0] + ', 1) ';
+          return 'scale(' + scale + ') ';
         }
       }
-    },
+    ,
-    dimensions : Modernizr.csstransforms3d ? '3d' : '2d',
-    // always do translate then scale
-    transforms : [ 'translate', 'scale' ]
-  };
     
-  optoTransform.fnUtils = optoTransform.fnUtilsDimensional[ optoTransform.dimensions ];
+    set : function( elem, name, value ) {
-  optoTransform.transformsLen = 2;
 
-  
-  
-  var _jQueryStyle = $.style;
-  $.style = function ( elem, name, value  ) {
-
-    switch ( name ) {
-      case 'scale' :
-      case 'translate' :
       // unpack current transform data
-        var data =  $( elem ).data('opto-transform') || {},
+      var data =  $( elem ).data('transform') || {},
       // extend new value over current data
           newData = {},
           fnName,
           transformObj = {};
+      // overwrite new data
       newData[ name ] = value;
       $.extend( data, newData );
 
       for ( fnName in data ) {
         var transformValue = data[ fnName ],
-              getFn = optoTransform.fnUtils[ fnName ];
+            getFn = $.optoTransform.fnUtils[ fnName ];
         transformObj[ fnName ] = getFn( transformValue );
       }
 
@@ -63,35 +51,74 @@
           valueFns = translateFn + scaleFn;
 
       // set data back in elem
-        $( elem ).data('opto-transform', data );
+      $( elem ).data( 'transform', data );
 
       // sorting so scale always comes before 
       value = valueFns;
 
       // set name to vendor specific property
-        name = $.props.transform;
+      elem.style[ $.optoTransform.transformProp ] = valueFns;
 
-        break;
     }
-
-    return _jQueryStyle.apply( this, arguments );
   };
   
+  // ==================== scale ===================
   
-  var _fxCur = $.fx.prototype.cur;
+  $.cssNumber.scale = true;
-  $.fx.prototype.cur = function () {
+  
-    if ( this.prop === 'scale' ) {
+  $.cssHooks.scale = {
-      var data = $( this.elem ).data('transform'),
+    set: function( elem, value ) {
-          currentScale = data && data[ this.prop ] ? data[ this.prop ] : [ 1 ];
+
-      // scale value is saved as a 1 item array
+      if ( typeof value === 'string' ) {
-      return currentScale[0];
+        value = parseFloat( value );
       }
 
-    return _fxCur.apply(this, arguments);
+      $.optoTransform.set( elem, 'scale', value )
-  };
+
+    },
+    get: function( elem, computed ) {
+      var transform = $.data( elem, 'transform' );
+      return transform && transform.scale ? transform.scale : 1;
+    }
+  }
 
   $.fx.step.scale = function( fx ) {
-    $( fx.elem ).css({ scale: [ fx.now ] });
+    $.cssHooks.scale.set( fx.elem, fx.now+fx.unit );
   };
   
+  
+  // ==================== translate ===================
+    
+  $.cssNumber.translate = true;
+  
+  $.cssHooks.translate = {
+    set: function( elem, value ) {
+
+      // all this would be for public ease-of-use,
+      // but we're leaving it out since this add-on is
+      // only for internal-plugin use
+      // if ( typeof value === 'string' ) {
+      //   value = value.split(' ');
+      // }
+      // 
+      //  
+      // var i, val;
+      // for ( i = 0; i < 2; i++ ) {
+      //   val = value[i];
+      //   if ( typeof val === 'string' ) {
+      //     val = parseInt( val );
+      //   }
+      // }
+
+      $.optoTransform.set( elem, 'translate', value )
+
+    },
+    
+    get: function( elem, computed ) {
+      var transform = $.data( elem, 'transform' );
+      return transform && transform.translate ? transform.translate : [ 0, 0 ];
+    }
+  }
+
+
 })( jQuery );