Editable Page

SketchSystems.spec

Editable Page
  Error
    Reset -> View
  View*
    Read
      Change Data -> WaitForEdit
      Request Edit -> WaitForEdit
    WaitForEdit
      Ready -> Edit
      Error -> Error
  Edit
    Cancel -> WaitForView
    Prestine
      Change Data -> Dirty
    Dirty
      Change Data -> Dirty
      Submit -> WaitForView
    WaitForView
      Finished -> View
      Error -> Error

SketchSystems_prototype.js

function render(model){
  let current_state_name = model.active_states[0].name;
  return $("h1",
           {style: {color: "darkBlue"}},
           `The current state is: ${current_state_name}`);
}