@yhwh-script/event-bux 1.0.4 → 1.0.6
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 +21 -14
- package/index.js +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -6,17 +6,6 @@ To install the eventbus into your project, simply run
|
|
|
6
6
|
npm install @yhwh-script/event-bux
|
|
7
7
|
```
|
|
8
8
|
|
|
9
|
-
## EventBus architecture
|
|
10
|
-
|
|
11
|
-
```mermaid
|
|
12
|
-
classDiagram
|
|
13
|
-
EventTarget <|-- EventBus
|
|
14
|
-
EventTarget: +addEventListener()
|
|
15
|
-
EventTarget: +removeEventListener()
|
|
16
|
-
EventTarget: +dispatchEvent()
|
|
17
|
-
EventBus: -WeakMap listeners
|
|
18
|
-
```
|
|
19
|
-
|
|
20
9
|
## How-To
|
|
21
10
|
|
|
22
11
|
For instance:
|
|
@@ -30,12 +19,30 @@ For instance:
|
|
|
30
19
|
|
|
31
20
|
After importing `@yhwh-script/event-bux`, it is recommended to add it to the `window` object.
|
|
32
21
|
|
|
33
|
-
|
|
22
|
+
Feel free to import at your own or stick to `@yhwh-script` examples.
|
|
23
|
+
|
|
24
|
+
Then use `bus.addEventListener(type, listener)` and `bus.dispatchEvent(event)` in your WebComponents. You are not bound to event bubbling or capturing, which are the standard event propagation mechanisms, but now you can send events even among any objects!
|
|
25
|
+
|
|
26
|
+
```javascript
|
|
27
|
+
bus.addEventListener("click", () => {console.log("click")}, window);
|
|
28
|
+
bus.dispatchEvent(new Event("click"), window);
|
|
29
|
+
```
|
|
34
30
|
|
|
35
|
-
|
|
31
|
+
## EventBus architecture
|
|
36
32
|
|
|
37
33
|

|
|
38
34
|
|
|
35
|
+
```mermaid
|
|
36
|
+
classDiagram
|
|
37
|
+
EventTarget <|-- EventBus
|
|
38
|
+
EventTarget: +addEventListener()
|
|
39
|
+
EventTarget: +removeEventListener()
|
|
40
|
+
EventTarget: +dispatchEvent()
|
|
41
|
+
EventBus: -WeakMap listeners
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
That's it. Check it out! KISS
|
|
45
|
+
|
|
39
46
|
## Contribute
|
|
40
47
|
|
|
41
|
-
Welcome
|
|
48
|
+
Welcome, please give your warm feedback.
|
package/index.js
CHANGED
|
@@ -8,10 +8,10 @@ export const addEventListener = function (type, listener, context = undefined) {
|
|
|
8
8
|
listeners.set(context, new Map()); // will be stored here
|
|
9
9
|
}
|
|
10
10
|
const contextListeners = listeners.get(context);
|
|
11
|
-
if (!contextListeners.has(type)) { //
|
|
11
|
+
if (!contextListeners.has(type)) { // type is not yet registered
|
|
12
12
|
contextListeners.set(type, []);
|
|
13
13
|
} // next push the handler to the WeakMap for the given context
|
|
14
|
-
contextListeners.get(
|
|
14
|
+
contextListeners.get(type).push(listener);
|
|
15
15
|
} else { // default
|
|
16
16
|
if (context) { // illegal context
|
|
17
17
|
throw new Error("Syntax error.")
|
package/package.json
CHANGED