Olgagr/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="mapTo">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script src="https://npmcdn.com/@reactivex/rxjs@5.0.0-beta.1/dist/global/Rx.umd.js"></script>
  <title>JS Bin</title>
</head>
<body>

  <button id="startBtn">Start</button>
  <button id="stopBtn">Stop</button>
<script id="jsbin-javascript">
// You often need streams to trigger different behaviors
// on the data based on which streams triggers. This lessons shows
// how to use mapTo to pass functions into the scan operator and have
// completed control over you data

const Observable = Rx.Observable;

const startButton = document.querySelector('#startBtn');
const stopButton = document.querySelector('#stopBtn');

const start$ = Observable.fromEvent(startButton, 'click');
const stop$ = Observable.fromEvent(stopButton, 'click');
const interval$ = Observable.interval(1000);

const intervalThatStops$ = interval$.takeUntil(stop$);

const data = {count: 0};
const inc = (acc) => ({count: acc.count + 1});
const reset = (acc) => data;

// take an observable and then switch to other observable
const startInterval$ = start$
    .switchMapTo(intervalThatStops$)
    .mapTo(inc)
    .startWith(data) // init scan start value
    .scan((acc, curr) => { // scan is used to gather data
      return curr(acc);
    })
    .subscribe((x) => console.log(x));


</script>


<script id="jsbin-source-javascript" type="text/javascript">// You often need streams to trigger different behaviors
// on the data based on which streams triggers. This lessons shows
// how to use mapTo to pass functions into the scan operator and have
// completed control over you data

const Observable = Rx.Observable;

const startButton = document.querySelector('#startBtn');
const stopButton = document.querySelector('#stopBtn');

const start$ = Observable.fromEvent(startButton, 'click');
const stop$ = Observable.fromEvent(stopButton, 'click');
const interval$ = Observable.interval(1000);

const intervalThatStops$ = interval$.takeUntil(stop$);

const data = {count: 0};
const inc = (acc) => ({count: acc.count + 1});
const reset = (acc) => data;

// take an observable and then switch to other observable
const startInterval$ = start$
    .switchMapTo(intervalThatStops$)
    .mapTo(inc)
    .startWith(data) // init scan start value
    .scan((acc, curr) => { // scan is used to gather data
      return curr(acc);
    })
    .subscribe((x) => console.log(x));


</script></body>
</html>

## jsbin.zoyotam.js
// You often need streams to trigger different behaviors
// on the data based on which streams triggers. This lessons shows
// how to use mapTo to pass functions into the scan operator and have
// completed control over you data

const Observable = Rx.Observable;

const startButton = document.querySelector('#startBtn');
const stopButton = document.querySelector('#stopBtn');

const start$ = Observable.fromEvent(startButton, 'click');
const stop$ = Observable.fromEvent(stopButton, 'click');
const interval$ = Observable.interval(1000);

const intervalThatStops$ = interval$.takeUntil(stop$);

const data = {count: 0};
const inc = (acc) => ({count: acc.count + 1});
const reset = (acc) => data;

// take an observable and then switch to other observable
const startInterval$ = start$
    .switchMapTo(intervalThatStops$)
    .mapTo(inc)
    .startWith(data) // init scan start value
    .scan((acc, curr) => { // scan is used to gather data
      return curr(acc);
    })
    .subscribe((x) => console.log(x));
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="description" content="mapTo">
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<script src="https://npmcdn.com/@reactivex/rxjs@5.0.0-beta.1/dist/global/Rx.umd.js"></script>
	<title>JS Bin</title>
	</head>
	<body>

	<button id="startBtn">Start</button>
	<button id="stopBtn">Stop</button>
	<script id="jsbin-javascript">
	// You often need streams to trigger different behaviors
	// on the data based on which streams triggers. This lessons shows
	// how to use mapTo to pass functions into the scan operator and have
	// completed control over you data

	const Observable = Rx.Observable;

	const startButton = document.querySelector('#startBtn');
	const stopButton = document.querySelector('#stopBtn');

	const start$ = Observable.fromEvent(startButton, 'click');
	const stop$ = Observable.fromEvent(stopButton, 'click');
	const interval$ = Observable.interval(1000);

	const intervalThatStops$ = interval$.takeUntil(stop$);

	const data = {count: 0};
	const inc = (acc) => ({count: acc.count + 1});
	const reset = (acc) => data;

	// take an observable and then switch to other observable
	const startInterval$ = start$
	.switchMapTo(intervalThatStops$)
	.mapTo(inc)
	.startWith(data) // init scan start value
	.scan((acc, curr) => { // scan is used to gather data
	return curr(acc);
	})
	.subscribe((x) => console.log(x));








	</script>



	<script id="jsbin-source-javascript" type="text/javascript">// You often need streams to trigger different behaviors
	// on the data based on which streams triggers. This lessons shows
	// how to use mapTo to pass functions into the scan operator and have
	// completed control over you data

	const Observable = Rx.Observable;

	const startButton = document.querySelector('#startBtn');
	const stopButton = document.querySelector('#stopBtn');

	const start$ = Observable.fromEvent(startButton, 'click');
	const stop$ = Observable.fromEvent(stopButton, 'click');
	const interval$ = Observable.interval(1000);

	const intervalThatStops$ = interval$.takeUntil(stop$);

	const data = {count: 0};
	const inc = (acc) => ({count: acc.count + 1});
	const reset = (acc) => data;

	// take an observable and then switch to other observable
	const startInterval$ = start$
	.switchMapTo(intervalThatStops$)
	.mapTo(inc)
	.startWith(data) // init scan start value
	.scan((acc, curr) => { // scan is used to gather data
	return curr(acc);
	})
	.subscribe((x) => console.log(x));







	</script></body>
	</html>