res/imp/error-toast-sk.html

<!-- The <error-toast-sk> custom element declaration.

  Listens for 'error-sk' events that bubble up to the document
  and displays them.

  The 'error-sk' event should have 'detail' of the form:

    {
      message: "The error message to display goes here.",
      duration: Integer, the number of ms to display or 0 for indefinitely.
                Defaults to 10000 (10s)
    }

  Attributes:
  Events:
  Methods:
-->
<link rel="import" href="/res/imp/bower_components/paper-toast/paper-toast.html" />

<dom-module id="error-toast-sk">
  <template>
    <paper-toast id=toast></paper-toast>
  </template>
</dom-module>

<script>
  Polymer({
    is: "error-toast-sk",
    ready: function() {
      document.addEventListener('error-sk', function(e) {
        this.$.toast.close();
        if (e.detail.message) {
          this.$.toast.text = e.detail.message;
          // duration = 0 is a valid input for "keep open indefinitely".
          this.$.toast.duration = (e.detail.duration === undefined ? 10000 : e.detail.duration)
          this.$.toast.show();
        } else {
          console.log("Empty message?", e);
        }
      }.bind(this));
    },
  });
</script>