console.clear();

​

/*** Render Functions ***/

​

const showTyping = () =>

  $('.typing').text('User is typing...');

​

const showIdle = () =>

  $('.typing').text('');

​

const updateTimer = ms =>

  $('.timer').text(ms / 1000);

​

/*** Program Logic ***/

​

const typing$ = Rx.Observable

  .fromEvent($('#input'), 'input')

  .switchMapTo(Rx.Observable

               .never()

               .startWith('TYPING')

               .merge(Rx.Observable.timer(1000).mapTo('IDLE')))

  .do(e => e === 'TYPING' ? showTyping() : showIdle());

​

const isTyping$ = typing$

  .distinctUntilChanged()

  .map(e => e === "TYPING")

  .publishReplay(1)

  .refCount();

​

const exactTimer$ = isTyping$

  .map(() => +new Date())

  .bufferCount(2)

  .map((times) => times[1] - times[0])

  .do(updateTimer)

  .do(typedTime => console.log("User typed " + typedTime + "ms"))

  .subscribe();