Run bower update

third_party/polymer/components/paper-ripple/paper-ripple.html

 <!--
+@license
 Copyright (c) 2014 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="../polymer/polymer.html">
 <link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
@@ skipping 18 matching lines @@
 effect when touches on it.  You can also defeat the default behavior and
 manually route the down and up actions to the ripple element.  Note that it is
 important if you call `downAction()` you will have to make sure to call
 `upAction()` so that `paper-ripple` would end the animation loop.
 
 Example:
 
     <paper-ripple id="ripple" style="pointer-events: none;"></paper-ripple>
     ...
     downAction: function(e) {
-      this.$.ripple.downAction({x: e.x, y: e.y});
+      this.$.ripple.downAction({detail: {x: e.x, y: e.y}});
     },
     upAction: function(e) {
       this.$.ripple.upAction();
     }
 
 Styling ripple effect:
 
   Use CSS color property to style the ripple:
 
     paper-ripple {
@@ skipping 17 matching lines @@
     <paper-ripple class="circle"></paper-ripple>
 
 @group Paper Elements
 @element paper-ripple
 @hero hero.svg
 @demo demo/index.html
 -->
 
 <dom-module id="paper-ripple">
 
-  <!--
-  Fired when the animation finishes. This is useful if you want to wait until the ripple
-  animation finishes to perform some action.
-
-  @event transitionend
-  @param {Object} detail
-  @param {Object} detail.node The animated node
-  -->
-
   <template>
     <style>
       :host {
         display: block;
         position: absolute;
         border-radius: inherit;
         overflow: hidden;
         top: 0;
         left: 0;
         right: 0;
@@ skipping 455 matching lines @@
 
         _boundAnimate: {
           type: Function,
           value: function() {
             return this.animate.bind(this);
           }
         }
       },
 
       get target () {
-        var ownerRoot = Polymer.dom(this).getOwnerRoot();
-        var target;
-
-        if (this.parentNode.nodeType == 11) { // DOCUMENT_FRAGMENT_NODE
-          target = ownerRoot.host;
-        } else {
-          target = this.parentNode;
-        }
-
-        return target;
+        return this.keyEventTarget;
       },
 
       keyBindings: {
         'enter:keydown': '_onEnterKeydown',
         'space:keydown': '_onSpaceKeydown',
         'space:keyup': '_onSpaceKeyup'
       },
 
       attached: function() {
         // Set up a11yKeysBehavior to listen to key events on the target,
         // so that space and enter activate the ripple even if the target doesn't
         // handle key events. The key handlers deal with `noink` themselves.
-        this.keyEventTarget = this.target;
-        this.listen(this.target, 'up', 'uiUpAction');
-        this.listen(this.target, 'down', 'uiDownAction');
+        if (this.parentNode.nodeType == 11) { // DOCUMENT_FRAGMENT_NODE
+          this.keyEventTarget = Polymer.dom(this).getOwnerRoot().host;
+        } else {
+          this.keyEventTarget = this.parentNode;
+        }
+        var keyEventTarget = /** @type {!EventTarget} */ (this.keyEventTarget);
+        this.listen(keyEventTarget, 'up', 'uiUpAction');
+        this.listen(keyEventTarget, 'down', 'uiDownAction');
       },
 
       detached: function() {
-        this.unlisten(this.target, 'up', 'uiUpAction');
-        this.unlisten(this.target, 'down', 'uiDownAction');
+        this.unlisten(this.keyEventTarget, 'up', 'uiUpAction');
+        this.unlisten(this.keyEventTarget, 'down', 'uiDownAction');
+        this.keyEventTarget = null;
       },
 
       get shouldKeepAnimating () {
         for (var index = 0; index < this.ripples.length; ++index) {
           if (!this.ripples[index].isAnimationComplete) {
             return true;
           }
         }
 
         return false;
@@ skipping 27 matching lines @@
       downAction: function(event) {
         if (this.holdDown && this.ripples.length > 0) {
           return;
         }
 
         var ripple = this.addRipple();
 
         ripple.downAction(event);
 
         if (!this._animating) {
+          this._animating = true;
           this.animate();
         }
       },
 
       /**
        * Provokes a ripple up effect via a UI event,
        * respecting the `noink` property.
        * @param {Event=} event
        */
       uiUpAction: function(event) {
         if (!this.noink) {
           this.upAction(event);
         }
       },
 
       /**
        * Provokes a ripple up effect via a UI event,
        * *not* respecting the `noink` property.
        * @param {Event=} event
        */
       upAction: function(event) {
         if (this.holdDown) {
           return;
         }
 
         this.ripples.forEach(function(ripple) {
           ripple.upAction(event);
         });
 
+        this._animating = true;
         this.animate();
       },
 
       onAnimationComplete: function() {
         this._animating = false;
         this.$.background.style.backgroundColor = null;
         this.fire('transitionend');
       },
 
       addRipple: function() {
@@ skipping 18 matching lines @@
         this.ripples.splice(rippleIndex, 1);
 
         ripple.remove();
 
         if (!this.ripples.length) {
           this._setAnimating(false);
         }
       },
 
       animate: function() {
+        if (!this._animating) {
+          return;
+        }
         var index;
         var ripple;
 
-        this._animating = true;
-
         for (index = 0; index < this.ripples.length; ++index) {
           ripple = this.ripples[index];
 
           ripple.draw();
 
           this.$.background.style.opacity = ripple.outerOpacity;
 
           if (ripple.isOpacityFullyDecayed && !ripple.isRestingAtMaxRadius) {
             this.removeRipple(ripple);
           }
@@ skipping 24 matching lines @@
       _holdDownChanged: function(newVal, oldVal) {
         if (oldVal === undefined) {
           return;
         }
         if (newVal) {
           this.downAction();
         } else {
           this.upAction();
         }
       }
+
+      /**
+      Fired when the animation finishes.
+      This is useful if you want to wait until
+      the ripple animation finishes to perform some action.
+
+      @event transitionend
+      @param {{node: Object}} detail Contains the animated node.
+      */
     });
   })();
 </script>