Expose MAX_RADIUS to public API

[BLamy]

I've had a situation where I was trying to replicate the IOWA's colored ripple effect when changing tabs.

I set my template up sort of like this.

...
: host{
      display: block;
      position: relative;
}
...
  <template>
    <paper-ripple initial-Opacity='1'></paper-ripple>
       <paper-toolbar class="tall" >
         <paper-tabs noink selected="1" selectedindex="1" horizontal center layout>
          <paper-tab id="paper_tab" flex horizontal layout>Home</paper-tab>
          <paper-tab id="paper_tab1" flex horizontal layout active>Phone</paper-tab>
        <paper-tab id="paper_tab2" flex horizontal layout>Activities</paper-tab>
      </paper-tabs>
  </template>

When they clicked the tab I would fire the paper ripple and it would animate across my navbar.

However, The paper ripple would only grow so large. The result was the ripple would grow about less then half way across the paper-toolbar and then the rest of the bar would just change colors (I could use a -webkit-transition to make it slightly better).

By increasing the max radius I was able to get the ripple to give me the effect I wanted.

What i'm proposing is could be used as so

<paper-ripple max-radius='700'></paper-ripple>

or possibly a fill-parent property where the ripple automatically calculates how big it's radius must be in order to fill the entire parent.

[notwaldorf]

There's a redesign of paper-ripple in progress (https://github.com/PolymerElements/paper-ripple/pull/63) which will address this issue. Does that work for you?

[stramel]

@notwaldorf Status update since #63 was closed?