Songster

SketchSystems.spec

Songster
  Inactive Paused
    unpause -> Inactive Unpaused

  Inactive Unpaused
    timer completes -> Active
    is paused -> Inactive Paused

  Active
    is wrong time of day -> Inactive Unpaused
    default -> Playing Song

  Playing Song
    play completes -> Inactive Unpaused
   

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}`);
}