JSFiddle - React, Tailwind, and code Playground

by ifandelse

HTML

<script src="https://raw.github.com/ifandelse/machina.js/v0.2.0/ext/underscore.js"></script>
<script src="https://raw.github.com/ifandelse/machina.js/events/lib/browser/machina.js"></script>
<h2>Expected</h2>
<p>["notstarted","one"]<br>["one","two"]<br>["two","three"]</p>
<h2>Actual</h2>
<p id="output"></p>

JavaScript

var fsm = new machina.Fsm({
    initialState: "notstarted",
    states: {
        notstarted: {
            "start": function () {
                this.transition( "one" );
            }
        },
        one: {
            _onEnter: function () {
                this.transition( "two" );
            }
        },
        two: {
            _onEnter: function () {
                this.transition( "three" );
            }
        },

        three: {
        }
    }
});

var output = document.getElementById( "output" );

fsm.on( "transition", function () {
    output.innerHTML += JSON.stringify( _.toArray(arguments) ) + "<br>";
});


fsm.handle( "start" );