Merge pull request #178 from dstockwell/effects

Move style updates after effect creation
PolymerElements · May 11, 2016 · c007398 · c007398
2 parents bc4bb92 + 3720edd
commit c007398
Show file tree

Hide file tree

Showing 11 changed files with 52 additions and 52 deletions.
diff --git a/animations/scale-down-animation.html b/animations/scale-down-animation.html
@@ -41,10 +41,6 @@
     configure: function(config) {
       var node = config.node;
 
-      if (config.transformOrigin) {
-        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
-      }
-
       var scaleProperty = 'scale(0, 0)';
       if (config.axis === 'x') {
         scaleProperty = 'scale(0, 1)';
@@ -57,6 +53,10 @@
         {'transform': scaleProperty}
       ], this.timingFromConfig(config));
 
+      if (config.transformOrigin) {
+        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
+      }
+
       return this._effect;
     }
 

diff --git a/animations/scale-up-animation.html b/animations/scale-up-animation.html
@@ -41,10 +41,6 @@
     configure: function(config) {
       var node = config.node;
 
-      if (config.transformOrigin) {
-        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
-      }
-
       var scaleProperty = 'scale(0)';
       if (config.axis === 'x') {
         scaleProperty = 'scale(0, 1)';
@@ -57,6 +53,10 @@
         {'transform': 'scale(1, 1)'}
       ], this.timingFromConfig(config));
 
+      if (config.transformOrigin) {
+        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
+      }
+
       return this._effect;
     }
 

diff --git a/animations/slide-down-animation.html b/animations/slide-down-animation.html
@@ -40,17 +40,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateY(0%)'},
+        {'transform': 'translateY(100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateY(0%)'},
-        {'transform': 'translateY(100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-from-bottom-animation.html b/animations/slide-from-bottom-animation.html
@@ -40,17 +40,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateY(100%)'},
+        {'transform': 'translateY(0)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateY(100%)'},
-        {'transform': 'translateY(0)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-from-left-animation.html b/animations/slide-from-left-animation.html
@@ -41,17 +41,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateX(-100%)'},
+        {'transform': 'none'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateX(-100%)'},
-        {'transform': 'none'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-from-right-animation.html b/animations/slide-from-right-animation.html
@@ -41,17 +41,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateX(100%)'},
+        {'transform': 'none'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateX(100%)'},
-        {'transform': 'none'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-from-top-animation.html b/animations/slide-from-top-animation.html
@@ -40,17 +40,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateY(-100%)'},
+        {'transform': 'translateY(0%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateY(-100%)'},
-        {'transform': 'translateY(0%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-left-animation.html b/animations/slide-left-animation.html
@@ -40,17 +40,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'none'},
+        {'transform': 'translateX(-100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'none'},
-        {'transform': 'translateX(-100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-right-animation.html b/animations/slide-right-animation.html
@@ -40,17 +40,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'none'},
+        {'transform': 'translateX(100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'none'},
-        {'transform': 'translateX(100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/slide-up-animation.html b/animations/slide-up-animation.html
@@ -40,17 +40,17 @@
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translate(0)'},
+        {'transform': 'translateY(-100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translate(0)'},
-        {'transform': 'translateY(-100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 

diff --git a/animations/transform-animation.html b/animations/transform-animation.html
@@ -53,15 +53,15 @@
       var transformFrom = config.transformFrom || 'none';
       var transformTo = config.transformTo || 'none';
 
-      if (config.transformOrigin) {
-        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
-      }
-
       this._effect = new KeyframeEffect(node, [
         {'transform': transformFrom},
         {'transform': transformTo}
       ], this.timingFromConfig(config));
 
+      if (config.transformOrigin) {
+        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
+      }
+
       return this._effect;
     }