Detail Overlays

SketchSystems.spec

Detail Overlays
  Overlays Closed*
    doctorSelected -> Doctor Detail Overlay
    locationSelected -> Location Detail Overlay
          
  # There should be a guard on this display checking if there are
  # any locations associated with the doctor and refusing to display
  # if not.
  Doctor Detail Overlay&
    close -> Overlays Closed
    
    Sidebar&
      navigateAbout -> Showing Doctor About Content
      navigateInformation -> Showing Doctor Information Content
      navigateLocations -> Showing Doctor Locations Content
        
      # Entry guard on Doctor Detail Overlay would consult whether
      # doctor has specialist boolean to true to determine this state
      Specialist Mark
        Mark Hidden*
        Mark Displayed
      
      # Entry guard should determine based on if doctor has a photo
      # or not
      Doctor Avatar
        Placeholder Showing*
        Doctor Photo Showing
        
      # Entry guard should determine based on whether office hours
      # are available to display at all. Get these from the first
      # related location
      Office Hours
        Hidden
        Showing Today*
          showMore -> Showing All Days
        Showing All Days
          showLess -> Showing Today

    Page Area
      Showing Doctor About Content*
        Contact Buttons&
          Message Button
            Hidden 2
            Showing*
              navigateContact -> Check Mail Method?
        
          Call Button
            Hidden 3
            Showing 2*
          
          Website Button
            Hidden 4
            Showing 3*
              #navigateWebsite -> Showing External Link Modal

      # Has duplicate of About's Contact Buttons
      Showing Doctor Information Content
      Showing Doctor Locations Content
        navigateLocation -> Location Detail Overlay
      Showing Doctor Contact Form
        submitContactForm -> Check Form Valid?
      Showing Doctor Thank You

  # This is largely identical to Doctors, so I'm omitting
  # most states except what is different. These should remain
  # separate state machines in the application in case the
  # functionality diverges over time.
  Location Detail Overlay
    close -> Overlays Closed

    Showing Location Doctors Content
      navigateDoctor -> Doctor Detail Overlay


Check Mail Method?
  #hasExternalForm -> Showing External Link Modal
  hasEmail -> Showing Doctor Contact Form

Check Form Valid?
  isValid -> Sending Form?
  # With error context
  notValid -> Showing Doctor Contact Form
              
Sending Form?
  success -> Showing Doctor Thank You
  # With error context
  error -> Showing Doctor Contact Form

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