JSFiddle - React, Tailwind, and code Playground

by Jérôme Beau

JavaScript

states = [
	{
		'name':'working',
		'initial':true,
		'events':{
			'bored':'coffee',
			'call_for_meeting':'meeting',
		}
	},
	{
		'name':'coffee',
		'events':{
			'break_over':'working',
			'call_for_meeting':'meeting'
		}
	},
	{
		'name':'meeting',
		'events':{
			'meetings_over':'working'
		}
	},
];
    
function StateMachine(states){
	this.states = states;
	this.indexes = {}; //just for convinience
	for( var i = 0; i< this.states.length; i++){
		this.indexes[this.states[i].name] = i;
		if (this.states[i].initial){
			this.currentState = this.states[i];
		}
	}
	this.consumeEvent = function(e){
		if(this.currentState.events[e]){
			this.currentState = this.states[this.indexes[this.currentState.events[e]]] ;
		}
	}
	this.getStatus = function(){
		return this.currentState.name;
	}
}

function log(o) {
    var e = document.createElement("p");
    e.innerHtml = o;
    document.body.appendChild(e);
}

sm = new StateMachine(states);
log(sm.getStatus()); // will return 'working'
 
sm.consumeEvent('bored');
log(sm.getStatus()); // I went for coffee
 
sm.consumeEvent('call_for_meeting');
sm.getStatus(); //will return 'meeting'
 
sm.consumeEvent('bored'); //doesn't matter how boring a meeting can be...
sm.getStatus(); //will still return 'meeting'
 
sm.consumeEvent('meetings_over')
sm.getStatus(); // 'working'