FSM - Machine Js

Testing for dummy purposes :D! Also allows private methods by using module pattern in Javascript.

by Jeancarlo Fontalvo

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/machina.js/2.0.0/machina.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/4.0.2/bootstrap-material-design.min.css">
<form action="#" class="form">
  <div class="form-group">
    <label for="">Nombre</label>
    <input type="text" class="form-control">
    <label for="">Descripcion</label>
    <input type="text" class="form-control">
    <label for="">Tipo</label>
    <select name="" id="" class="form-control">
      <option value="1"> Tipo 1</option>
      <option value="2"> Tipo 2</option>
      <option value="3"> Tipo 3</option>
      <option value="4"> Tipo 4</option>
    </select>
    <label for=""></label>
    <input type="text" class="form-control">
  </div>
</form>

JavaScript

var stages = {
		Inicio              : 1,
    SeguimientoEditable : 2,
    SeguimientoNormal   : 3,
    CierreEvaluacion    : 4
};

function initState(func) {
	return {
  	_onEnter: function() {
    	func();
    }
  };
}


var StagesForm = new machina.Fsm((function() {

  var config = {
    initialState: "init",
    states: {},
    stage: function( stage ) {
      this.transition(stage);
    }
  };
  
  config[ "states" ][ "init" ] = {
    "*": function() {
      this.deferUntilTransition("inicio");
    }
  };
  
  config[ "states" ][ stages.Inicio ] = initState(actionInicio);
  
  config[ "states" ][ stages.SeguimientoEditable ] = initState(actionSeguimientoEditable);
  
  config[ "states" ][ stages.SeguimientoNormal ] = initState(actionSeguimientoNormal)
  
  config[ "states" ][ stages.CierreEvaluacion ] = initState(actionCierreEvaluacion);
    
  function actionInicio() {
    console.log("Estamos en: Inicio de Etapa!")
  }

  function actionSeguimientoEditable() {
    console.log("Estamos en: Seguimiento que permite editar!")
  }

  function actionSeguimientoNormal() {
    console.log("Estamos en: Seguimiento que permite normal!");
  }
  
  function actionCierreEvaluacion() {
    console.log("Estamos en: CierreEvaluacion!");
  }
	
  return config;
})())

StagesForm.stage( stages.SeguimientoEditable );