Draggable

SketchSystems.spec

Draggable
  Nothing Dragging
    pointerdown -> Just Dragging
  Just Dragging
    pointercancel -> Nothing Dragging
    Nothing Droppable
      pointerenter -> Just Droppable
      pointerup -> Nothing Dragging
    Just Droppable
      pointerleave -> Nothing Droppable
      pointerup -> Dropped
Dropped

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