api-console-assets
Version:
This repo only exists to publish api console components to npm
56 lines (53 loc) • 2.11 kB
HTML
<!--
@license
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../app-scroll-effects-behavior.html">
<script>
/**
* Vertically translate the background based on a factor of the scroll position.
*/
Polymer.AppLayout.registerEffect('parallax-background', {
/**
* @param {{scalar: string}} config
* @this Polymer.AppLayout.ElementWithBackground
*/
setUp: function setUp(config) {
var fx = {};
var scalar = parseFloat(config.scalar);
fx.background = this._getDOMRef('background');
fx.backgroundFrontLayer = this._getDOMRef('backgroundFrontLayer');
fx.backgroundRearLayer = this._getDOMRef('backgroundRearLayer');
fx.deltaBg = fx.backgroundFrontLayer.offsetHeight - fx.background.offsetHeight;
if (fx.deltaBg === 0) {
if (isNaN(scalar)) {
scalar = 0.8;
}
fx.deltaBg = this._dHeight * scalar;
} else {
if (isNaN(scalar)) {
scalar = 1;
}
fx.deltaBg = fx.deltaBg * scalar;
}
this._fxParallaxBackground = fx;
},
/** @this Polymer.AppLayout.ElementWithBackground */
run: function run(p, y) {
var fx = this._fxParallaxBackground;
this.transform('translate3d(0px, ' + (fx.deltaBg * Math.min(1, p)) + 'px, 0px)', fx.backgroundFrontLayer);
if (fx.backgroundRearLayer) {
this.transform('translate3d(0px, ' + (fx.deltaBg * Math.min(1, p)) + 'px, 0px)', fx.backgroundRearLayer);
}
},
/** @this Polymer.AppLayout.ElementWithBackground */
tearDown: function tearDown() {
delete this._fxParallaxBackground;
}
});
</script>