third_party/polymer/v0_8/components/iron-signals/iron-signals.html

   1 <!--
   2 @license
   3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
   4 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
   5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
   6 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
   7 Code distributed by Google as part of the polymer project is also
   8 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
   9 -->
  10 <link rel="import" href="../polymer/polymer.html">
  11
  12 <script>
  13 (function(){
  14 /**
  15 `iron-signals` provides basic publish-subscribe functionality.
  16
  17 Note: avoid using `iron-signals` whenever you can use
  18 a controller (parent element) to mediate communication
  19 instead.
  20
  21 To send a signal, fire a custom event of type `iron-signal`, with
  22 a detail object containing `name` and `data` fields.
  23
  24     this.fire('iron-signal', {name: 'hello', data: null});
  25
  26 To receive a signal, listen for `iron-signal-<name>` event on a
  27 `iron-signals` element.
  28
  29   <iron-signals on-iron-signal-hello="{{helloSignal}}">
  30
  31 You can fire a signal event from anywhere, and all
  32 `iron-signals` elements will receive the event, regardless
  33 of where they are in DOM.
  34
  35 @demo demo/index.html
  36 */
  37   Polymer({
  38     is: 'iron-signals',
  39
  40     attached: function() {
  41       signals.push(this);
  42     },
  43     detached: function() {
  44       var i = signals.indexOf(this);
  45       if (i >= 0) {
  46         signals.splice(i, 1);
  47       }
  48     }
  49   });
  50
  51   // private shared database
  52   var signals = [];
  53
  54   // signal dispatcher
  55   function notify(name, data) {
  56     // convert generic-signal event to named-signal event
  57     var signal = new CustomEvent('iron-signal-' + name, {
  58       // if signals bubble, it's easy to get confusing duplicates
  59       // (1) listen on a container on behalf of local child
  60       // (2) some deep child ignores the event and it bubbles
  61       //     up to said container
  62       // (3) local child event bubbles up to container
  63       // also, for performance, we avoid signals flying up the
  64       // tree from all over the place
  65       bubbles: false,
  66       detail: data
  67     });
  68     // dispatch named-signal to all 'signals' instances,
  69     // only interested listeners will react
  70     signals.forEach(function(s) {
  71       s.dispatchEvent(signal);
  72     });
  73   }
  74
  75   // signal listener at document
  76   document.addEventListener('iron-signal', function(e) {
  77     notify(e.detail.name, e.detail.data);
  78   });
  79
  80 })();
  81 </script>