Javascript event emitter, foundation of everything.
Dot-event creates interfaces for listening to and emitting events.
Dot-event listeners can be synchronous or asynchronous, accept arguments, and return values.
Dot-event has a tiny footprint (<1 kb compressed and gzipped).
Event listeners may emit any event through the dot
argument, resulting in less require
calls and easy access to functionality across your application.
Dot-event optionally uses event id and prop string(s) to add identifying context to an emit. Props pay off with logging, store updates, and even dom element ids.
Dot-event uses a composer function pattern to add event listeners. This pattern works very well with dynamic imports to create dot-event instances with dynamic functionality.
Dot-event provides basic state via the dot.state
object. On this object we built an immutable store that leverages props and is only ~1 kb compressed and gzipped.
Its simple to wait for all dot-event listeners before rendering the final version of your server side page.
const dot = require("dot-event")()
dot.on(() => {}) // listener
dot() // emitter
dot.on(() => "value")
dot() // "value"
dot.on(async () => "value")
dot().then(result => /* "value" */)
The event id is the first string argument to dot.on
or dot.any
.
dot.on("myEvent", () => "value")
dot("myEvent") // "value"
ℹ️ The listener function receives the event id as its fourth argument.
No matter what is passed to the dot
emitter, listener functions always receive five arguments:
Argument | Description |
---|---|
prop |
Array of string identifiers |
arg |
Emit argument |
dot |
Dot-event instance |
event |
Event id |
signal |
Signal object |
String arguments after the event id are prop identifiers.
dot.on("myEvent", "prop", prop => prop)
dot("myEvent", "prop") // [ "prop" ]
ℹ️ The listener function receives the prop array as its first argument.
The last non-prop argument becomes the emit argument (arg
).
dot.on((prop, arg) => arg)
dot({ option: true }) // { option: true }
ℹ️ The listener function receives the emit argument as its second argument.
dot.on((prop, arg, dot, eventId, signal) => {
signal.cancel = true
return "value"
})
dot.on(() => "never called")
dot() // "value"
ℹ️ There is one other signal,
signal.value
, which you can set instead of usingreturn
in your listener function.
dot.any(() => "!")
dot("myEvent", "prop") // "!"
dot.any("myEvent", prop => prop)
dot("myEvent", "prop") // [ "prop" ]
dot.myEvent("prop") // <-- cool helper function!
ℹ️ Dot-event creates a helper function only if
dot.any
receives an event id with no props.
dot.any("myEvent", "prop", "prop2", props => props)
dot("myEvent") // noop
dot("myEvent", "prop") // noop
dot("myEvent", "prop", "prop2") // [ "prop", "prop2" ]
dot("myEvent", "prop", "prop2", "prop3") // [ "prop", "prop2", "prop3" ]
A common pattern is for composers to define listeners that respond to any
props of a particular event id.
export default function(dot) {
dot.any("myEvent", myEvent)
}
async function myEvent(prop, arg, dot) {
prop = prop.concat(["myEvent"])
await dot.otherEvent(prop)
}
ℹ️ Another common pattern illustrated here is to append a prop id before passing them along to another emit.
dot.add(import("./myEvent"))
ℹ️ You might need to run node with
--experimental-modules
to enable dynamic imports server side.
await Promise.all([...dot.state.events])
ℹ️
dot.state.events
is aSet
of promises.
Library | Description | URL |
---|---|---|
ad | Google Publisher Tag | https://github.com/dot-event/ad#readme |
args | Argument definitions | https://github.com/dot-event/args#readme |
argv | Parse process.argv | https://github.com/dot-event/argv#readme |
controller | DOM controller | https://github.com/dot-event/controller#readme |
el | DOM elements | https://github.com/dot-event/el#readme |
fetch | Universal HTTP fetch | https://github.com/dot-event/fetch#readme |
log | Event logger | https://github.com/dot-event/log#readme |
render | Server side render | https://github.com/dot-event/render#readme |
store | Immutable store | https://github.com/dot-event/store#readme |
view | DOM view | https://github.com/dot-event/view#readme |