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