JSFiddle - React, Tailwind, and code Playground

by ifandelse

HTML

<script src="https://rawgit.com/lodash/lodash/2.4.1/dist/lodash.js"></script>
<script src="https://rawgit.com/ifandelse/machina.js/master/lib/machina.js"></script>

JavaScript

var plainFsm = new machina.Fsm({
    initialize: function () {
        this.history = [];
    },
    initialState: "on",
    states: {
        "on": {
            _onEnter: function () {
                this.history.push("turning on");
            },
            "turn.on": function () {
                this.history.push("already on!");
            },
            "turn.off": "off"
        },
            "off": {
            _onEnter: function () {
                this.history.push("turning off");
            },
            "turn.on": "on",
            "turn.off": function () {
                this.history.push("already off!");
            }
        }
    },
    turnOn: function () {
        this.handle("turn.on");
    },
    turnOff: function () {
        this.handle("turn.off");
    }
});

var behavioralFsm = new machina.BehavioralFsm({
    initialState: "on",
    states: {
        "on": {
            _onEnter: function (client) {
                client.history.push("turning on");
            },
            "turn.on": function (client) {
                client.history.push("already on!");
            },
                "turn.off": "off"
        },
            "off": {
            _onEnter: function (client) {
                client.history.push("turning off");
            },
            "turn.on": "on",
                "turn.off": function (client) {
                client.history.push("already off!");
            }
        }
    },
    turnOn: function (client) {
        this.handle(client, "turn.on");
    },
    turnOff: function (client) {
        this.handle(client, "turn.off");
    }
});

var client = {
    history: []
};

plainFsm.turnOn();
plainFsm.turnOff();
plainFsm.turnOff();
plainFsm.turnOn();
plainFsm.turnOn();

behavioralFsm.turnOn(client);
behavioralFsm.turnOff(client);
behavioralFsm.turnOff(client);
behavioralFsm.turnOn(client);
behavioralFsm.turnOn(client);


console.log(plainFsm.history);
console.log(client.history);