iOS acceleration

move.js

@@ -1,4 +1,3 @@
-
 /*!
  * move
  * Copyright(c) 2011 TJ Holowaychuk <[email protected]>
@@ -180,6 +179,7 @@
     this._props = {};
     this._rotate = 0;
     this._transitionProps = [];
+    this._webkitTransforms = [];
     this._transforms = [];
     this.duration(move.defaults.duration)
   };
@@ -200,6 +200,7 @@
    */
 
   Move.prototype.transform = function(transform){
+    this._webkitTransforms.push(transform);
     this._transforms.push(transform);
     return this;
   };
@@ -254,11 +255,13 @@
    */
 
   Move.prototype.translate = 
-  Move.prototype.to = function(x, y){
-    y = y || 0;
-    return this.transform('translate('
-      + x + 'px, '
-      + y + 'px)');
+  Move.prototype.to = function(x, y, z){
+    x = this.el._translateX = (x == null ? this.el._translateX : x) || 0;
+    y = this.el._translateY = (y == null ? this.el._translateY : y) || 0;
+    z = z || 0;
+    this._webkitTransforms.push('translate3d('+x+'px, '+y+'px, '+z+')');
+    this._transforms.push('translate('+x+'px, '+y+'px)');
+    return this;
   };
 
   /**
@@ -271,7 +274,7 @@
 
   Move.prototype.translateX =
   Move.prototype.x = function(n){
-    return this.transform('translateX(' + n + 'px)');
+    return this.translate(n, null);
   };
 
   /**
@@ -284,7 +287,7 @@
 
   Move.prototype.translateY =
   Move.prototype.y = function(n){
-    return this.transform('translateY(' + n + 'px)');
+    return this.translate(null, n);
   };
 
   /**
@@ -297,11 +300,13 @@
    * @api public
    */
 
-  Move.prototype.scale = function(x, y){
-    y = null == y ? x : y;
-    return this.transform('scale('
-      + x + ', '
-      + y + ')');
+  Move.prototype.scale = function(x, y, z){
+    x = this.el._scaleX = (x == null ? this.el._scaleX : x) || 1;
+    y = y == null ? x : y;
+    z = z == null ? x : z;
+    this._webkitTransforms.push('scale3d('+x+', '+y+', '+z+')');
+    this._transforms.push('scale('+x+', '+y+')');
+    return this;
   };
 
   /**
@@ -313,7 +318,7 @@
    */
 
   Move.prototype.scaleX = function(n){
-    return this.transform('scaleX(' + n + ')')
+    return this.scale(n, null);
   };
 
   /**
@@ -325,7 +330,7 @@
    */
 
   Move.prototype.scaleY = function(n){
-    return this.transform('scaleY(' + n + ')')
+    return this.scale(null, n);
   };
 
   /**
@@ -431,8 +436,10 @@
    * @api public
    */
 
-  Move.prototype.setVendorProperty = function(prop, val){
-    this.setProperty('-webkit-' + prop, val);
+  Move.prototype.setVendorProperty = function(prop, val, options){
+    if (!options.noWebkit) {
+      this.setProperty('-webkit-' + prop, val);
+    }
     this.setProperty('-moz-' + prop, val);
     this.setProperty('-ms-' + prop, val);
     this.setProperty('-o-' + prop, val);
@@ -614,7 +621,12 @@
     this.emit('start');
 
     // transforms
-    if (this._transforms.length) {
+    if (this._webkitTransforms.length) {
+      this.setProperty('-webkit-transform', this._webkitTransforms.join(' '));
+      this.setVendorProperty('transform', this._transforms.join(' '), { noWebkit: true });
+    }
+
+    else if (this._transforms.length) {
       this.setVendorProperty('transform', this._transforms.join(' '));
     }