paper-ripple mouseDown event handler downAction Override

[Darin Hensley]

Stackover flow post: http://stackoverflow.com/questions/33060861/paper-ripple-mousedown-event-handler-downaction-override

Polymer 1.1

In paper ripple source code they have the `mouseDown` event handler:

      /** @param {Event=} event */

      downAction: function(event) {

        var xCenter = this.containerMetrics.width / 2;

        var yCenter = this.containerMetrics.height / 2;

In documentation it states:

> paper-ripple listens to "mousedown" and "mouseup" events so it would display ripple effect when touches on it. You can also defeat the default behavior and manually route the down and up actions to the ripple element

However, in my custom element I am not able to override this handler:

            <paper-ripple

              fit

              id="ripple"

              initial-opacity="0.95"

              opacity-decay-velocity="0.98">

            </paper-ripple>

          </section>

        </template>

      </template>

    

      <script>

        Polymer({

          is: "portfolio-page",

         ...

          downAction: function(e) {

            console.log('sssssssssssssssssssssssss');

          },

          upAction: function(e) {

            this.$.ripple.upAction();

          }

When I induce the action of paper ripple by clicking on my element, I do not get any console output. 

How do I override the default `downAction` handler for `mouseDown` that `paper-ripple` listens for as documented in paper-ripple doc?