<h1>Observables Example #2</h1>
  We have created 2 subscriptions where first
    <li>transform event into sum of offsets</li>
    <li>filter for those which are bigger than 200</li>
    <li>debounce by 300ms ( => subscribe called no more than once 300ms)</li>
    <li>log sum into subscribe</li>
  and second which just logs all events as they come.
<script src="https://unpkg.com/@reactivex/rxjs@5.0.3/dist/global/Rx.js"></script>
const source = Rx.Observable.fromEvent(document.body, 'mousemove');

// original example
      value => console.log(`val => x: ${value.offsetX} & y: ${value.offsetY}`),
      error => console.log(error),
      () => console.log('completed')

// log event where sum of offsets is bigger than 200 and debounce by 300ms
  .map(value => value.offsetX + value.offsetY)
  .filter(offsetSum => offsetSum > 200)
      value => console.log(`Offset sum once 300 ms => ${value}`),
      error => console.log(error),
      () => console.log('completed')
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.