IMS

SketchSystems.spec

IMS
  Left Panel
    Switch Panel
      tabs*
        return -> tab item
        down-> reports

      reports
        return -> report item
        up -> tabs

    Listing Panel    
      tab item
        return -> Table Screen
        escape -> reports
        up -> tab item
        down -> tab item
        
      report item
        return -> Report Detail
        espace -> tabs
        up -> report item      
        down -> report item
     
        
  Table Screen
    table empty?*
      empty -> add
      not empty -> table
    
    add
      return -> Forms
      escape -> tab item
      up -> row
      down -> row
    
    table
      row
        escape -> tab item
        return -> Forms
        delete -> table
        up -> row
        down -> row
        ctrl_up -> add
        ctrl_down -> add

    
  Forms
    form*
      field
        return__valid_form_field -> field
        backspace__field_empty -> field    
        return__dependency_in_next_field -> dropdown
        return__all_fields_valid -> submit_btn
        escape -> warning_alert
        ctrl_t -> preview_table
    
    submit_btn
      return -> confirmation_alert
      escape -> field
      ctrl_p -> Print View
    
    confirmation_alert
      return_or_y -> form
      escape_or_n -> field
    
    warning_alert
      return_or_y -> tab item
      escape_or_n -> field
    
    dropdown
      select option
        up -> select option
        down -> select option
        return -> field
        ctrl_down -> add_more_btn
        ctrl_up -> add_more_btn
    
      add_more_btn
        return -> form
        up -> select option
        down -> select option
    
    preview_table
      preview_row
        up -> preview_row
        down -> preview_row
        return -> form
        escape -> field
    
    
  Report Detail
    duration_field
      return__valid_duration -> Report View
      escape -> report item
    
  
  Report View
    report_row
      up -> report_row
      down  -> report_row
      ctrl_f -> filter
      ctrl_p -> Print View
    
    filter
      
  Print View

SketchSystems_prototype.js

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