diff --git a/listener.md b/listener.md new file mode 100644 index 0000000..1bd9004 --- /dev/null +++ b/listener.md @@ -0,0 +1,16 @@ +# Listener + +A generator for proxy objects that run callbacks when properties are changed. + +## Interface + +```js +listener(target={}) +// Creates a new proxy for target +listener.listen(prop, callback) +// Adds a callback on a property change +listener.listen([prop, ...], callback) +// Adds a callback to several properties at once +listener.listen(prop) +// Removes all callbacks from a given property +``` diff --git a/skooma.md b/skooma.md new file mode 100644 index 0000000..3cf996f --- /dev/null +++ b/skooma.md @@ -0,0 +1,45 @@ +# Skooma + +A functional-friendly helper library for procedural DOM generation and +templating. + +Skooma provides two proxies: `html` and `svg`. + +## Interface / Examples + +```js +html.div() +// Creates a
element +html.div("hello", "world") +// Creates a
element with the content "helloworld" +html.div(html.span()) +// Creates a
element with a nested element +html.div([html.span(), html.span()]) +// Creates a
element with two nested elements +html.div({class: "foo"}) +// Creates a
with the class "foo" +html.div({class: ["foo", "bar"]}) +// Creates a
with the classes "foo" and "bar" +html.div({click: 1}) +// Creates a
with the attribute "click" set to "1" +html.div({click: event => console.log(event.target)}) +// Creates a
with an event listener for "click" events +html.div(player: {username: "KhajiitSlayer3564"}) +// Creates a
with the attribute "player" set to a JSON-encoded Object +html.div(self => self.innerHTML = "Hello, World!") +// Creates a
and passes it to a function that sets its inner HTML +html.div({foo: true}) +// Creates a
, adds the attribute "foo" +html.div({foo: "bar"}, {foo: false}) +// Creates a
, sets the "foo" attribute to "bar", then removes it again + +// Special keys: + +html.div(dataset: {foo: 1, bar: 2}) +// Creates a
with the attributes "data-foo" and "data-bar" set to 1 and 2 +html.div(style: {color: 'red'}) +// Creates a
with the "style" attribute set to "color: red" +``` + +Generators can be called with many arguments. Arrays get iterated recursively as +if they were part of a flat argument list. diff --git a/speaker.md b/speaker.md new file mode 100644 index 0000000..da57c4a --- /dev/null +++ b/speaker.md @@ -0,0 +1,17 @@ +# Speaker + +A simple messaging helper that lets you publish and subscribe to messages. +Callbacks are scheduled as microtasks by default. + +## Interface: + +``` +Speaker(immediate=false) +// Creates a new speaker. +Speaker.listen(callback) +// Registers a callback. +Speaker.speak(...args) +// Runs all callbacks with given arguments +Speaker.silence(callback) +// Removes a given callback +```