Triggering events to notify of state machine state change

EventedStateMachine.js

// This is built on top of MarionetteJS' [Controller](https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.controller.md) 
// object, which includes Backbone.Events in it, to
// trigger events.
//
// I think this is a sort of statemachine. But honestly, I'm not entirely
// sure about that. I've had very little luck / experience with statemachines
// in my career.
//
// Would love to get feedback on this.

MyWorkflow = Marionette.Controller.extend({

  initialize: function(workflowData){
    // this is the list of available "states" or steps in this workflow
    this.steps = new WorkflowStepCollection(workflowData);
  },

  getSteps: function(){
    return this.steps;
  },

  nextStep: function(){
    var nextStep = this.steps.getNext();
    this.moveTo(nextStep);
  },

  previousStep: function(){
    var previousStep = this.steps.getPrevious();
    this.moveTo(previousStep);
  },

  moveTo: function(step){
    step.select();
    this._triggerStep(step);
  },

  _triggerStep: function(step){
    var key = step.get("key");
    this.trigger("step:" + key);
  }
});

// use of this 
// -----------

var workflowConfig = [
  {
    id: 1,
    key: "first",
    name: "First Step"
  },
  {
    id: 2,
    key: "second",
    name: "Second Step"
  }
]

var wf = new MyWorkflow(workflowConfig);

wf.on("step:first", aCallback);
wf.on("step:second", anotherCallback);

Make sense for a wizard-like linear workflow. When I think of "state machine" I don't immediately think of "linear", though. Agree you'll want a "CanMoveToStep" type function that you can check to manage availability of steps. What if you kept that in the workflow controller, and various steps (views?) raised events to mark when it is ready, or not?