Skip to content

Instantly share code, notes, and snippets.

@Pajn
Created February 22, 2016 10:32
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Pajn/798b11f780d05dcde018 to your computer and use it in GitHub Desktop.
Save Pajn/798b11f780d05dcde018 to your computer and use it in GitHub Desktop.
Adding a reset to Cycle counter example
const Cycle = require('@cycle/core');
const {makeDOMDriver, div, button, p} = require('@cycle/dom');
const {Observable} = require('rx');
function main(sources) {
const decrement$ = sources.DOM
.select('.decrement').events('click').map(ev => -1);
const increment$ = sources.DOM
.select('.increment').events('click').map(ev => +1);
const reset$ = sources.DOM
.select('.reset').events('click').map(ev => 0);
const action$ = Observable.merge(decrement$, increment$);
const count$ = action$.startWith(0).scan((x,y) => x+y);
const value$ = Observable.merge(count$, reset$);
const vtree$ = value$.map(count =>
div([
button('.decrement', 'Decrement'),
button('.increment', 'Increment'),
button('.reset', 'Reset'),
p('Counter: ' + count)
])
);
return { DOM: vtree$ };
}
const sources = {
DOM: makeDOMDriver('.app')
}
// Normally you need to call Cycle.run, but Tricycle handles that for you!
// If you want to try this out locally, just uncomment this code.
//
// Cycle.run(main, sources);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment