EventProcessor

Similar to the Airstream compose operator.

Use this when you need to apply stream operators on this element's events, e.g.:

div(onScroll.compose(_.throttle(100)) --> observer)

a(onClick.preventDefault.compose(_.delay(100)) --> observer)

Note: This method is not chainable. Put all the operations you need inside the operator callback.

Values that do not pass will not propagate down the chain and into the emitter.

Similar to the Airstream flatMap operator.

Use this when you want to create a new stream or signal on every event, e.g.:

button(onClick.preventDefault.flatMap(_ => makeAjaxRequest()) --> observer)

#TODO[IDE] IntelliJ (2022.3.2) shows false errors when using this flatMap implementation, at least with Scala 2, making it annoying. Use flatMapStream or flatMapSignal to get around that.

Note: This method is not chainable. Put all the operations you need inside the operator callback, or use the compose method instead for more flexibility

Similar to flatMap, but restricted to signals only.

Similar to flatMap, but restricted to streams only.

(originalEvent, accumulatedValue) => newAccumulatedValue

Unlike other processors, this one will fire regardless of .filter-s up the chain. Instead, if the event was filtered, project will receive None as accumulatedValue. The output of project should be Some(newValue), or None if you want to filter out this event.

Same as map(_ => value)

Note: value will be re-evaluated every time the event is fired

Get the value of event.target.checked

Get the original event. You might want to call this in a chain, after some other processing.

Get the value of event.target.files

Like mapTo, but with strict evaluation of the value

Unsafe – Get the value of event.target, cast to a certain element type

You should generally avoid this in favor of other helpers like mapToValue or inContext { thisNode => ... }.

Get the value of event.target.value

Use a standard non-passive listener. You don't need to call this unless you set passive previously, and want to revert to non-passive.

See passive docs here: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#passive

Evaluate f if the value was filtered out up the chain. For example:

onClick.filter(isRightClick).orElseEval(_.preventDefault()) --> observer

This observer will fire only on right clicks, and for events that aren't right clicks, ev.preventDefault() will be called instead.

Use a passive event listener

Note that unlike preventDefault config which applies to individual events, passive is used to install the listener onto the DOM node in the first place.

See passive docs here: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#passive

Prevent default browser action for the given event (e.g. following the link when it is clicked) https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

Note: this is just a standard processor, so it will be fired in whatever order you have applied it. So for example, you can filter events before applying this, preventing default action only for certain events.

Example: input(onKeyUp().filter(ev => ev.keyCode == KeyCode.Tab).preventDefault --> tabKeyUpBus)

Write the resulting boolean into event.target.checked. You can only do this on checkbox or radio button elements.

Warning: if using this, do not use preventDefault. The browser may override the value you set here.

Write the resulting string into event.target.value. You can only do this on elements that have a value property - input, textarea, select

Write a custom boolean into event.target.checked. You can only do this on checkbox or radio button elements.

Warning: if using this, do not use preventDefault. The browser may override the value you set here.

Write a custom string into event.target.value. You can only do this on elements that have a value property - input, textarea, select

This method prevents other listeners of the same event from being called. If several listeners are attached to the same element for the same event type, they are called in the order in which they were added. If stopImmediatePropagation() is invoked during one such call, no remaining listeners will be called.

MDN https://developer.mozilla.org/en-US/docs/Web/API/Event/stopImmediatePropagation

Note: this is just a standard processor, so it will be fired in whatever order you have applied it. So for example, you can filter events before applying this, propagation will be stopped only for certain events.

Example: div(onClick.filter(isGoodClick).stopImmediatePropagation --> goodClickBus)

Propagation here refers to DOM Event bubbling or capture propagation. https://developer.mozilla.org/en-US/docs/Web/API/Event/stopPropagation

Note: this is just a standard processor, so it will be fired in whatever order you have applied it. So for example, you can filter events before applying this, propagation will be stopped only for certain events.

Example: div(onClick.filter(isGoodClick).stopPropagation --> goodClickBus)

Use standard bubble propagation mode. You don't need to call this unless you set useCapture previously, and want to revert to bubbling.

See useCapture docs here: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#usecapture

Use capture mode

Note that unlike preventDefault config which applies to individual events, useCapture is used to install the listener onto the DOM node in the first place.

See useCapture docs here: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#usecapture