Frikki/esnextbin.md

## esnextbin.md

      
    Raw
  

              esnextbin.md
            
          
    made with esnextbin

  
## index.html
<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>ESNextbin Sketch</title>
  <!-- put additional styles and scripts here -->
</head>
<body>
  <div id="app">Application</div>
</body>
</html>

## index.js
import Cycle from '@cycle/most-run';
import {
  makeDOMDriver,
  AttrsModule,
  ClassModule,
  StyleModule,
  PropsModule,
  VNode,
  div,
} from '@motorcycle/dom';
import { just, Stream } from 'most';

const view = id => div('.uid', {}, [`Hello, world!`]);

const DOM = just(view);

function main(sources) {
  const id$ = sources.DOM.select(`.uid`).elements()
  .take(2)
  .map((element) => {
    return element.length > 0 ? element[0].getBoundingClientRect() : void 0
  })
  .tap(x => console.log(x));

  return {
    DOM: id$.map(view)
  };
}

const modules =
  [
    AttrsModule,
    ClassModule,
    StyleModule,
    PropsModule
  ];

const drivers = {
  DOM: makeDOMDriver(`#app`, { transposition: false, modules } )
};

Cycle.run(main, drivers);

## package.json
{
  "name": "esnextbin-sketch",
  "version": "0.0.0",
  "dependencies": {
    "@cycle/most-run": "4.1.3",
    "@motorcycle/dom": "3.1.0",
    "most": "1.1.0"
  }
}

## transpiled.js
'use strict';

var _mostRun = require('@cycle/most-run');

var _mostRun2 = _interopRequireDefault(_mostRun);

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

var _most = require('most');

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

var view = function view(id) {
  return (0, _dom.div)('.uid', {}, ['Hello, world!']);
};

var DOM = (0, _most.just)(view);

function main(sources) {
  var id$ = sources.DOM.select('.uid').elements().take(2).map(function (element) {
    return element.length > 0 ? element[0].getBoundingClientRect() : void 0;
  }).tap(function (x) {
    return console.log(x);
  });

  return {
    DOM: id$.map(view)
  };
}

var modules = [_dom.AttrsModule, _dom.ClassModule, _dom.StyleModule, _dom.PropsModule];

var drivers = {
  DOM: (0, _dom.makeDOMDriver)('#app', { transposition: false, modules: modules })
};

_mostRun2.default.run(main, drivers);
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>ESNextbin Sketch</title>
	<!-- put additional styles and scripts here -->
	</head>
	<body>
	<div id="app">Application</div>
	</body>
	</html>
	import Cycle from '@cycle/most-run';
	import {
	makeDOMDriver,
	AttrsModule,
	ClassModule,
	StyleModule,
	PropsModule,
	VNode,
	div,
	} from '@motorcycle/dom';
	import { just, Stream } from 'most';

	const view = id => div('.uid', {}, [`Hello, world!`]);

	const DOM = just(view);

	function main(sources) {
	const id$ = sources.DOM.select(`.uid`).elements()
	.take(2)
	.map((element) => {
	return element.length > 0 ? element[0].getBoundingClientRect() : void 0
	})
	.tap(x => console.log(x));

	return {
	DOM: id$.map(view)
	};
	}

	const modules =
	[
	AttrsModule,
	ClassModule,
	StyleModule,
	PropsModule
	];

	const drivers = {
	DOM: makeDOMDriver(`#app`, { transposition: false, modules } )
	};

	Cycle.run(main, drivers);
	{
	"name": "esnextbin-sketch",
	"version": "0.0.0",
	"dependencies": {
	"@cycle/most-run": "4.1.3",
	"@motorcycle/dom": "3.1.0",
	"most": "1.1.0"
	}
	}
	'use strict';

	var _mostRun = require('@cycle/most-run');

	var _mostRun2 = _interopRequireDefault(_mostRun);

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

	var _most = require('most');

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

	var view = function view(id) {
	return (0, _dom.div)('.uid', {}, ['Hello, world!']);
	};

	var DOM = (0, _most.just)(view);

	function main(sources) {
	var id$ = sources.DOM.select('.uid').elements().take(2).map(function (element) {
	return element.length > 0 ? element[0].getBoundingClientRect() : void 0;
	}).tap(function (x) {
	return console.log(x);
	});

	return {
	DOM: id$.map(view)
	};
	}

	var modules = [_dom.AttrsModule, _dom.ClassModule, _dom.StyleModule, _dom.PropsModule];

	var drivers = {
	DOM: (0, _dom.makeDOMDriver)('#app', { transposition: false, modules: modules })
	};

	_mostRun2.default.run(main, drivers);