res/imp/timer-sk.html

<!--
  This in an HTML Import-able file that contains the JS and HTML Templates for
  the timer-sk element.

  To use this file import it:

    <link href="/res/imp/timer-sk.html" rel="import" />

  Properties:
    period - The number of seconds that should elapse before the trigger event fires.  After
      firing, the timer resets.  If the period is changed, the timer is also reset. -1 means to
      stop the timer.

  Methods:
    None.

  Events:
    trigger - The specified time has come to perform some event.  The event object will have the
      following attributes:
        period: Number, the period that was used to create the event.
-->
<dom-module id="timer-sk">
  <script>
  (function() {
    Polymer({
      is: "timer-sk",

      properties: {
        period: {
          type: Number,
          value: -1,  // by default, never fire.
          observer: "_periodChanged",
        },
      },

      _periodChanged: function(period) {
        if (this.timeout) {
          window.clearTimeout(this.timeout);
        }
        if (period > 0) {
          this.timeout = window.setTimeout(function() {
            this.fire('trigger');
            // refire event
            this._periodChanged(period);
          }.bind(this), period * 1000);
        }
      },
    });
  }());
  </script>
</dom-module>