JSFiddle - React, Tailwind, and code Playground

by vikikamath

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/bacon.js/0.7.50/Bacon.min.js"></script>

JavaScript

/*
 Bacon.fromArray([1,2,3])
  .withStateMachine(0, function(sum, event) {
    if (event.hasValue())
      return [sum + event.value(), []]
    else if (event.isEnd())
      return [undefined, [new Bacon.Next(sum), event]]
    else
      return [sum, [event]]
  }).log() 
 */

var eventsArr = ["r8", "r9", "r0", "r3", "d9", "d8", "r2", "r5", "r6", "d2", "d5", "r6"];



var origStruct = {
    url1: {
        s1: [0,5,9],
        s2: [2,3,6,5],
        s3: [8,6,3]
    }
};
var struct = {
    s1: {
        r: [],
        d: [0,5,9]
    },
    s2: {
        r: [],
        d: [2,3,6,5]
    },
    s3: {
        r: [],
        d: [8,6,3]
    }
};

var screenIdMatchFind = function(o) {
    var _o = o, min = {};
   
   Object.keys(_o).forEach(function(k){
       if (_o[k]['d'].length === 0){ // exhausted
           if (!min.id){
            min ['len'] = _o[k]['r'].length
            min ['id'] = k
           } else {
               if (_o[k]['r'].length > min ['len']){ // swap
                   min ['len'] = _o[k]['r'].length
                   min ['id'] = k
               }
           }
       }     
   })
   
   return min ? min ['id']: undefined;
};
var moveToReady = function(o, val){
    var _o = o
    //console.log(val)
    Object.keys(_o).forEach(function(k){
        var idx = _o[k]['d'].indexOf(val)
        //console.log(k)
        //console.log(idx)
        if (idx > -1){
            //console.log(idx)
           _o[k]['d'].splice(idx,1)
           _o[k]['r'].push(val)
        }
    })
    //console.log(_o)
    return _o
};

var moveToDestroy = function(o, val){
    var _o = o
    Object.keys(_o).forEach(function(k){
        var idx = _o[k]['r'].indexOf(val)
        if (idx > -1){
           _o[k]['r'].splice(idx,1)
           _o[k]['d'].push(val)
        }
    })
    return _o
};



Bacon.fromArray(eventsArr)
  .withStateMachine(struct, function(structState, event) {
      var updatedStructState, screenId, val;
      if (event.hasValue()) {
          val =...