Roll Polymer elements

third_party/polymer/v1_0/components-chromium/app-layout/app-scroll-effects/effects/fade-background-extracted.js

Index: third_party/polymer/v1_0/components-chromium/app-layout/app-scroll-effects/effects/fade-background-extracted.js
diff --git a/third_party/polymer/v1_0/components-chromium/app-layout/app-scroll-effects/effects/fade-background-extracted.js b/third_party/polymer/v1_0/components-chromium/app-layout/app-scroll-effects/effects/fade-background-extracted.js
new file mode 100644
index 0000000000000000000000000000000000000000..ea2ac26f50ea6c1fb682a0f833f4f2faa4d88bed
--- /dev/null
+++ b/third_party/polymer/v1_0/components-chromium/app-layout/app-scroll-effects/effects/fade-background-extracted.js
@@ -0,0 +1,28 @@
+/**
+   * Upon scrolling past a threshold, fade in the rear background layer and fade out the front
+   * background layer (opacity CSS transitioned over time).
+   */
+  Polymer.AppLayout.registerEffect('fade-background', {
+    /** @this Polymer.AppLayout.ElementWithBackground */
+    setUp: function setUp(config) {
+      var duration = config.duration || '0.5s';
+      this.$.backgroundFrontLayer.style.willChange = 'opacity';
+      this.$.backgroundFrontLayer.style.webkitTransform = 'translateZ(0)';
+      this.$.backgroundFrontLayer.style.transitionProperty = 'opacity';
+      this.$.backgroundFrontLayer.style.transitionDuration = duration;
+      this.$.backgroundRearLayer.style.willChange = 'opacity';
+      this.$.backgroundRearLayer.style.webkitTransform = 'translateZ(0)';
+      this.$.backgroundRearLayer.style.transitionProperty = 'opacity';
+      this.$.backgroundRearLayer.style.transitionDuration = duration;
+    },
+    /** @this Polymer.AppLayout.ElementWithBackground */
+    run: function run(p, y) {
+      if (p >= 1) {
+        this.$.backgroundFrontLayer.style.opacity = 0;
+        this.$.backgroundRearLayer.style.opacity = 1;
+      } else {
+        this.$.backgroundFrontLayer.style.opacity = 1;
+        this.$.backgroundRearLayer.style.opacity = 0;
+      }
+    }
+  });