# HelpMatch

SketchSystems.spec

# HelpMatch
Start*
  mounted -> LoadingLocalState

LoadingLocalState
  localStateLoaded -> CheckingForSession
  localStateAbsent -> CheckingForSession

CheckingForSession
  sessionAbsent -> Welcome
  sessionLockedAndUnlockDataAbsent -> CollectingSetupData
  sessionLockedAndUnlockDataPresent -> UnlockingAccount
  sessionUsable -> LoadingRemoteState

# start listening for url changes
Welcome
  getStartedSelected -> Setup
  loginSelected -> CollectingAuthData
  verificationTokenProvided -> VerifyingToken

Setup
  CollectingSetupData
    setupDataCollected -> SavingSetupData
  SavingSetupData
    setupDataSaveSuccess -> CollectingAuthData
    setupDataSaveFailure -> Error

Auth
  CollectingAuthData
    # save unlock data
    authDataProvided -> SubmittingAuthData
  SubmittingAuthData
    success -> AuthSubmitted
    failure -> Error
  # only used manually during development  
  AuthSubmitted
    tokenProvided -> VerifyingToken
  VerifyingToken
    tokenVerificationSuccess -> UnlockingAccount
    tokenVerificationFailure -> Error
  UnlockingAccount
    accountUnlockSuccess -> UpdatingRemoteState
    accountUnlockFailure -> Setup

Main
  LoadingRemoteState
    remoteStateLoadSuccess -> BrowsingResults
    remoteStateLoadFailure -> Error
  UpdatingRemoteState
    remoteStateUpdateSuccess -> Main
    remoteStateUpdateFailure -> Main
  BrowsingResults
    criteriaButtonClicked -> EditingCriteria
  EditingCriteria
    resultsButtonClicked -> BrowsingResults

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