I'm trying to find the most graceful way to distinguish between single and double clicks in Bacon.js, but I feel like I'm not completely grasping how this works. The following works for detecting a double-click, but I'm a bit stumped as to how I would specify different behavior (i.e., a different callback function) elegantly for a single-click event.
clicked = Bacon.fromEventTarget(document, "click") clicked.bufferWithTimeOrCount(300, 2) .filter((x) -> x.length is 2) .onValue (x) -> console.log "double clicked: ", x
You would probably be better off using "dblclick" for that separately - you will avoid the need to specify your own timing interval for what counts as a single-click vs. a double-click. On the other hand, with the straightforward use of "click"/"dblclick" both events will be fired in case of a double-click.
If you prefer specifying your own logic, then it would probably be as doing a different filter on the length:
clicked = Bacon.fromEventTarget(document, "click") buffered = clicked.bufferWithTimeOrCount(300, 2) buffered.filter((x) -> x.length is 2) .onValue (x) -> console.log "double clicked: ", x buffered.filter((x) -> x.length is 1) .onValue (x) -> console.log "single clicked: ", x
Also, perhaps it could be made more elegant by using flatmap to create a single stream of clicks:
clicks = clicked.bufferWithTime(300) .flatMap((x) -> if (x.length < 2) Bacon.once("single") else Bacon.once("double") )
Then you can do your onValue and compare the values.
By doing bufferWithTime (without count) you will classify a triple-click as a double-click as well, but it depends on what your desired behaviour is.