@yhwh-script/event-bux 1.0.3 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -2
- package/eventbus.png +0 -0
- package/index.js +7 -6
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -19,7 +19,7 @@ classDiagram
|
|
|
19
19
|
|
|
20
20
|
## How-To
|
|
21
21
|
|
|
22
|
-
|
|
22
|
+
For instance:
|
|
23
23
|
|
|
24
24
|
```javascript
|
|
25
25
|
<script type="module">
|
|
@@ -27,4 +27,15 @@ After importing this module in your code, it is recommended to add it to the win
|
|
|
27
27
|
window.bus = bus;
|
|
28
28
|
</script>
|
|
29
29
|
```
|
|
30
|
-
|
|
30
|
+
|
|
31
|
+
After importing `@yhwh-script/event-bux`, it is recommended to add it to the `window` object.
|
|
32
|
+
|
|
33
|
+
You can use your own import or stick to other `@yhwh-script` examples
|
|
34
|
+
|
|
35
|
+
Then use `bus.addEventListener(type, listener)` and `bus.dispatchEvent(type, event)` in your WebComponents. You are not bound to event bubbling or capturing (which are the standard event propagation mechanisms), but you can send events even between WebComponents! Check it out!
|
|
36
|
+
|
|
37
|
+

|
|
38
|
+
|
|
39
|
+
## Contribute
|
|
40
|
+
|
|
41
|
+
Welcome!
|
package/eventbus.png
ADDED
|
Binary file
|
package/index.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
export const name = "eventbux"; // The module name, can be made globally available via the window object, which should be on top.
|
|
1
2
|
const listeners = new WeakMap(); // WeakMap to store listeners per object. Keep it private unless you know what you do.
|
|
2
|
-
// Should auto-cleanup listeners when object is GC'd
|
|
3
|
-
// implements EventTarget
|
|
4
|
-
export const addEventListener = function (type, listener, context = undefined) {
|
|
3
|
+
// Should auto-cleanup listeners when object is GC'd (TODO Test!)
|
|
4
|
+
// This module implements EventTarget.
|
|
5
|
+
export const addEventListener = function (type, listener, context = undefined) { // (TODO check integration into options)
|
|
5
6
|
if (context && typeof context === 'object') { // context is well defined, should be a WebComponent
|
|
6
7
|
if (!listeners.has(context)) { // context is yet unknown to the listeners
|
|
7
8
|
listeners.set(context, new Map()); // will be stored here
|
|
@@ -12,8 +13,8 @@ export const addEventListener = function (type, listener, context = undefined) {
|
|
|
12
13
|
} // next push the handler to the WeakMap for the given context
|
|
13
14
|
contextListeners.get(eventName).push(listener);
|
|
14
15
|
} else { // default
|
|
15
|
-
if (context) {
|
|
16
|
-
throw new Error("Syntax error.")
|
|
16
|
+
if (context) { // illegal context
|
|
17
|
+
throw new Error("Syntax error.")
|
|
17
18
|
}
|
|
18
19
|
window.addEventListener(type, listener);
|
|
19
20
|
}
|
|
@@ -34,7 +35,7 @@ export const removeEventListener = function (type, listener, context = undefined
|
|
|
34
35
|
}
|
|
35
36
|
}
|
|
36
37
|
|
|
37
|
-
export const dispatchEvent = function (event, context = undefined) {
|
|
38
|
+
export const dispatchEvent = function (event, context = undefined) { // TODO check if context == event.target, if yes, remove context? What if CustomEvent is used?
|
|
38
39
|
if (context && listeners.has(context)) {
|
|
39
40
|
const contextListeners = listeners.get(context);
|
|
40
41
|
if (contextListeners.has(event.type)) { // Call context-specific listeners
|
package/package.json
CHANGED