thx.stream.dom - Examples

container
  .streamMouseMove()
  .map.fn('x: ${_.clientX}, y: ${_.clientY}')
  .next(output.receive()).run();

click
  .streamClick()
  .count()
  .map.fn('clicks: $_')
  .next(output.receive()).run();

plus
  .streamClick().toValue(1)
  .merge(
    minus.streamClick().toValue(-1)
  )
  .reduce(function(acc, v) return acc + v, 0)
  .map.fn('count: $_')
  .next(output.receive()).run();

input
  .streamInput()
  .map.fn(_.toUpperCase())
  .next(output.receive()).run();

canvas.streamMouseMove()
  .map(function(e) {
    var bb = canvas.getBoundingClientRect();
    return { x : e.clientX - bb.left, y : e.clientY - bb.top };
  })
  .slidingWindow(2, 2)
  .pair(
    canvas
      .streamMouseDown().toTrue()
      .merge(canvas.streamMouseUp().toFalse())
  )
  .filter.fn(_._1)
  .left()
  .next(function(e) {
    ctx.beginPath();
    ctx.moveTo(e[0].x, e[0].y);
    ctx.lineTo(e[1].x, e[1].y);
    ctx.stroke();
  }).run();