bloodyKnuckles/esnextbin.md

## esnextbin.md

      
    Raw
  

              esnextbin.md
            
          
    made with esnextbin

  
## index.html
<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>cycle js schedule driver</title>
</head>
<body>
  <div id="app"></div>
</body>
</html>

## index.js
import {run} from "@cycle/run"
import {makeDOMDriver, div, p, button, h1, a, input, span} from '@cycle/dom'
import onionify, {pick, mix} from 'cycle-onionify'
import xs from 'xstream'
import isolate from '@cycle/isolate'

// MAIN
function App (sources) {
  const initReducer$ = xs.of(function initReducer() {
    return {tick: [0]}
  })
  const schedule$ = sources.Scheduler
  const tickReducer$ = schedule$
    .map(tick => {
      return function tickReducer (state) {
        return {...state, tick}
      }
    })
  const reducer$ = xs.merge(initReducer$, tickReducer$)
  const state$ = sources.onion.state$;
  const vdom$ = xs.combine(state$).map(([state]) => {
    const tickDOM = state.tick.map(function (tick) {
      return div([h1('hey there u ' + tick), p([button('.button', 'push me')])])
    })
    return div(tickDOM)
  });
  const scheduler$ = sources.DOM
    .select('.button').events('click')
    .mapTo('button pushed')
  //xs.periodic(1000).take(10)
  return {DOM: vdom$, Scheduler: scheduler$, onion: reducer$}
}

// DRIVER
function Scheduler (sink$) {
  sink$
    .addListener({
      next: sink => {
        console.log('sink: ', sink)
      },
      error: err => console.error(err),
      complete: () => {
        //console.log('sink completed')
      }
    })

  return xs.create({
    start: listener => {
      xs.periodic(3000).take(5)
        .addListener({
          next: tick => listener.next([++tick]),
          error: err => console.error(err),
          complete: () => {
            //console.log('periodic completed')
          }
        })
    },
    stop: () => {
      //console.log('stop scheduler')
    }
  })
}

run(onionify(App), {DOM: makeDOMDriver('#app'), Scheduler: Scheduler})

## package.json
{
  "name": "cycle js schedule driver",
  "version": "0.0.0",
  "dependencies": {
    "@cycle/run": "3.1.0",
    "@cycle/dom": "17.4.0",
    "cycle-onionify": "3.1.0",
    "xstream": "10.8.0",
    "@cycle/isolate": "3.0.0",
    "babel-runtime": "6.23.0"
  }
}

## transpiled.js
'use strict';

var _slicedToArray2 = require('babel-runtime/helpers/slicedToArray');

var _slicedToArray3 = _interopRequireDefault(_slicedToArray2);

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _run = require('@cycle/run');

var _dom = require('@cycle/dom');

var _cycleOnionify = require('cycle-onionify');

var _cycleOnionify2 = _interopRequireDefault(_cycleOnionify);

var _xstream = require('xstream');

var _xstream2 = _interopRequireDefault(_xstream);

var _isolate = require('@cycle/isolate');

var _isolate2 = _interopRequireDefault(_isolate);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

// MAIN
function App(sources) {
  var initReducer$ = _xstream2.default.of(function initReducer() {
    return { tick: [0] };
  });
  var schedule$ = sources.Scheduler;
  var tickReducer$ = schedule$.map(function (tick) {
    return function tickReducer(state) {
      return (0, _extends3.default)({}, state, { tick: tick });
    };
  });
  var reducer$ = _xstream2.default.merge(initReducer$, tickReducer$);
  var state$ = sources.onion.state$;
  var vdom$ = _xstream2.default.combine(state$).map(function (_ref) {
    var _ref2 = (0, _slicedToArray3.default)(_ref, 1),
        state = _ref2[0];

    var tickDOM = state.tick.map(function (tick) {
      return (0, _dom.div)([(0, _dom.h1)('hey there u ' + tick), (0, _dom.p)([(0, _dom.button)('.button', 'push me')])]);
    });
    return (0, _dom.div)(tickDOM);
  });
  var scheduler$ = sources.DOM.select('.button').events('click').mapTo('button pushed'
  //xs.periodic(1000).take(10)
  );return { DOM: vdom$, Scheduler: scheduler$, onion: reducer$ };
}

// DRIVER
function Scheduler(sink$) {
  sink$.addListener({
    next: function next(sink) {
      console.log('sink: ', sink);
    },
    error: function error(err) {
      return console.error(err);
    },
    complete: function complete() {
      //console.log('sink completed')
    }
  });

  return _xstream2.default.create({
    start: function start(listener) {
      _xstream2.default.periodic(3000).take(5).addListener({
        next: function next(tick) {
          return listener.next([++tick]);
        },
        error: function error(err) {
          return console.error(err);
        },
        complete: function complete() {
          //console.log('periodic completed')
        }
      });
    },
    stop: function stop() {
      //console.log('stop scheduler')
    }
  });
}

(0, _run.run)((0, _cycleOnionify2.default)(App), { DOM: (0, _dom.makeDOMDriver)('#app'), Scheduler: Scheduler });
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>cycle js schedule driver</title>
	</head>
	<body>
	<div id="app"></div>
	</body>
	</html>
	import {run} from "@cycle/run"
	import {makeDOMDriver, div, p, button, h1, a, input, span} from '@cycle/dom'
	import onionify, {pick, mix} from 'cycle-onionify'
	import xs from 'xstream'
	import isolate from '@cycle/isolate'

	// MAIN
	function App (sources) {
	const initReducer$ = xs.of(function initReducer() {
	return {tick: [0]}
	})
	const schedule$ = sources.Scheduler
	const tickReducer$ = schedule$
	.map(tick => {
	return function tickReducer (state) {
	return {...state, tick}
	}
	})
	const reducer$ = xs.merge(initReducer$, tickReducer$)
	const state$ = sources.onion.state$;
	const vdom$ = xs.combine(state$).map(([state]) => {
	const tickDOM = state.tick.map(function (tick) {
	return div([h1('hey there u ' + tick), p([button('.button', 'push me')])])
	})
	return div(tickDOM)
	});
	const scheduler$ = sources.DOM
	.select('.button').events('click')
	.mapTo('button pushed')
	//xs.periodic(1000).take(10)
	return {DOM: vdom$, Scheduler: scheduler$, onion: reducer$}
	}

	// DRIVER
	function Scheduler (sink$) {
	sink$
	.addListener({
	next: sink => {
	console.log('sink: ', sink)
	},
	error: err => console.error(err),
	complete: () => {
	//console.log('sink completed')
	}
	})

	return xs.create({
	start: listener => {
	xs.periodic(3000).take(5)
	.addListener({
	next: tick => listener.next([++tick]),
	error: err => console.error(err),
	complete: () => {
	//console.log('periodic completed')
	}
	})
	},
	stop: () => {
	//console.log('stop scheduler')
	}
	})
	}

	run(onionify(App), {DOM: makeDOMDriver('#app'), Scheduler: Scheduler})
	{
	"name": "cycle js schedule driver",
	"version": "0.0.0",
	"dependencies": {
	"@cycle/run": "3.1.0",
	"@cycle/dom": "17.4.0",
	"cycle-onionify": "3.1.0",
	"xstream": "10.8.0",
	"@cycle/isolate": "3.0.0",
	"babel-runtime": "6.23.0"
	}
	}
	'use strict';

	var _slicedToArray2 = require('babel-runtime/helpers/slicedToArray');

	var _slicedToArray3 = _interopRequireDefault(_slicedToArray2);

	var _extends2 = require('babel-runtime/helpers/extends');

	var _extends3 = _interopRequireDefault(_extends2);

	var _run = require('@cycle/run');

	var _dom = require('@cycle/dom');

	var _cycleOnionify = require('cycle-onionify');

	var _cycleOnionify2 = _interopRequireDefault(_cycleOnionify);

	var _xstream = require('xstream');

	var _xstream2 = _interopRequireDefault(_xstream);

	var _isolate = require('@cycle/isolate');

	var _isolate2 = _interopRequireDefault(_isolate);

	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

	// MAIN
	function App(sources) {
	var initReducer$ = _xstream2.default.of(function initReducer() {
	return { tick: [0] };
	});
	var schedule$ = sources.Scheduler;
	var tickReducer$ = schedule$.map(function (tick) {
	return function tickReducer(state) {
	return (0, _extends3.default)({}, state, { tick: tick });
	};
	});
	var reducer$ = _xstream2.default.merge(initReducer$, tickReducer$);
	var state$ = sources.onion.state$;
	var vdom$ = _xstream2.default.combine(state$).map(function (_ref) {
	var _ref2 = (0, _slicedToArray3.default)(_ref, 1),
	state = _ref2[0];

	var tickDOM = state.tick.map(function (tick) {
	return (0, _dom.div)([(0, _dom.h1)('hey there u ' + tick), (0, _dom.p)([(0, _dom.button)('.button', 'push me')])]);
	});
	return (0, _dom.div)(tickDOM);
	});
	var scheduler$ = sources.DOM.select('.button').events('click').mapTo('button pushed'
	//xs.periodic(1000).take(10)
	);return { DOM: vdom$, Scheduler: scheduler$, onion: reducer$ };
	}

	// DRIVER
	function Scheduler(sink$) {
	sink$.addListener({
	next: function next(sink) {
	console.log('sink: ', sink);
	},
	error: function error(err) {
	return console.error(err);
	},
	complete: function complete() {
	//console.log('sink completed')
	}
	});

	return _xstream2.default.create({
	start: function start(listener) {
	_xstream2.default.periodic(3000).take(5).addListener({
	next: function next(tick) {
	return listener.next([++tick]);
	},
	error: function error(err) {
	return console.error(err);
	},
	complete: function complete() {
	//console.log('periodic completed')
	}
	});
	},
	stop: function stop() {
	//console.log('stop scheduler')
	}
	});
	}

	(0, _run.run)((0, _cycleOnionify2.default)(App), { DOM: (0, _dom.makeDOMDriver)('#app'), Scheduler: Scheduler });