kaosat-dev

function meshResolver(){
  let _watchers = []
  
  let inner = function*(){
    let mesh = undefined
    let value = mesh
    //console.log("here in generator")
    while(1){
      value = yield mesh
      if(value){

kaosat-dev

// ES7 Observables + WHATWG Streams
//
//   https://github.com/jhusain/asyncgenerator
//   https://github.com/whatwg/streams
//
// Continuation from file:
//   https://github.com/jhusain/asyncgenerator/blob/master/src/observable.js

Observable.fromStream = function(readable) {
  return new Observable(function(generator) {

kaosat-dev

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

So you're curious in learning this new thing called Reactive Programming, particularly its variant comprising of Rx, Bacon.js, RAC, and others.

Learning it is hard, even harder by the lack of good material. When I started, I tried looking for tutorials. I found only a handful of practical guides, but they just scratched the surface and never tackled the challenge of building the whole architecture around it. Library documentations often don't help when you're trying to understand some function. I mean, honestly, look at this:

Rx.Observable.prototype.flatMapLatest(selector, [thisArg])

Projects each element of an observable sequence into a new sequence of observable sequences by incorporating the element's index and then transforms an observable sequence of observable sequences into an observable sequence producing values only from the most recent observable sequence.

kaosat-dev

function hackyModel(interactions){
  let clicky$ = interactions.get(".foo .innerButton","click").map(true).startWith(true)
    //.subscribe(settings => console.log("inner click"))

  let checky$ = interactions.get(".foo #fooSetting","change").map(event => event.target.checked).startWith(false)
    //.subscribe(settings => console.log("checkbox change"))


  let bla$ = Rx.Observable.combineLatest(
    clicky$,

kaosat-dev

var Rx = require( 'rx' )
//var combineTemplate = require('rx.observable.combinetemplate')
var merge = Rx.Observable.merge

var mesh$ = Rx.Observable
	.interval(10 /* ms */)
  .timeInterval()
  .map(function(e){return {name:"bla"+e.value+".stl"}})
	.take(2)

kaosat-dev

var Rx = require( 'rx' )
//var combineTemplate = require('rx.observable.combinetemplate')
var merge = Rx.Observable.merge

var mesh$ = Rx.Observable
	.interval(10 /* ms */)
  .timeInterval()
  .map(function(e){return {name:"bla"+e.value+".stl"}})
	.take(2)

kaosat-dev

function main(drivers){
  let DOM      = drivers.DOM
  
  //our basic data is using seamless-immutable
  let baseData = Immutable({model:
    {
      data:[
        {name:"fooobar", power:43}
        ,{name:"sdfds",  power:2.34}
      ]

kaosat-dev

Cycle.js tips and tricks

Inline SVGs using JSX

inline svgs seem to have issues when using JSX syntax, so this is a possible workaround:

kaosat-dev

Getting the code

mkdir -p $HOME/src/offscreen_sample # or anywhere you'd like
cd $HOME/src/offscreen_sample
cp package.json and offscree_sample.coffee in here

Executing the code

$ npm install # maybe npm start will take care of it but just in case

$ npm start && open out.png

kaosat-dev

/*****************************************************************************
 This is the function doing all the heavy lifting.
 
 It takes a function and returns a stream generated by feeding its output
 back into itself as input. (It doesn't start consuming the stream.)
 
 It's basically a pared-down version of Cycle.run that forgets about the
 application architecture of separating out a pure main from the effectful
 drivers and just resolves a single circularly dependent stream. The other
 files just build up more API-compatible versions of Cycle.run from this.