mermaid diagrams for PSST paper

[venkateshpotluri]

This thread will contain mermaid diagrams for the PSST paper. If you would like to make changes, please post a new comment with a clear textual label of the diagram you are iterating on. To provide an example of this, I have included the architecture diagram of PSST from the paper in this post. I will include more diagrams to seek feedback.

graph LR
  OutputEngine  -- State:Play/Pause/Stop  -->  DataSink
  OutputEngine -- State --> DataSink2
  OutputEngine -- State --> DataSink3
  
  subgraph    
    InputStream[Input Stream] -- Datum --> DataSink
    InputStream2[Input Stream]  -- Datum --> DataSink2(DataSink ...)
    InputStream3[Input Stream]  -- Datum --> DataSink3(DataSink ...)
  end
    DataSink -- Datum/State --> DataHandler1(DataHandler, e.g. NoteHandler)
    DataHandler1  -- Datum/State --> DataOutput(DataOutput, e.g. NoteOutput)
    DataSink -- Datum/State -->  DataHandler2(DataHandler, e.g. FilterHandler)
    subgraph Can Chain to support Filtering
    DataHandler2 -- ... --> DataHandler3(DataHandler)
    end
    DataHandler3 -- Datum/State --> DataOutput3(Data Output)
    subgraph May Use Statistics
       DataOutput
       DataOutput3
    end

Loading

[venkateshpotluri]

Diagram for scenario described in PSST section

graph LR
    LightSensor -->|RXJS stream| DataSink
    DataSink --> NoteHandler
    DataSink -->|Min/Max| ExtremaHandler
    ExtremaHandler --> SpeechOutput
    NoteHandler --> SonifyOutput
    SpeechOutput --> User
    SonifyOutput --> User

Loading

[jrthompson33]

The overall layout of the diagram makes sense to me. I'm not sure the label of "Min/Max" on the link between DataSink and ExtremaHandler is accurate though. Wouldn't the raw Datum value be passed to the ExtremaHandler and then the ExtremaHandler produces a Min/Max when a new extrema is detected?

I have a few additional ideas on how to improve the diagram as well:

1. Add a subtitle for each node indicating the type of node. For example, LightSensor (Input Stream), ExtremaHandler (DataHandler)
2. Add labels for each of the connections, and consider including example values of what is being passed to explain the scenario futher. For example, between DataSink to ExtremaHandler the label could be "Datum [39%, 62%, 58%, 48%, ...]" and then from ExtremaHandler to SpeechOutput the label could be "Datum [39%, 62%, ...]". Similarly for the NoteHandler links it could produce the frequencies sent to the SonifyOutput.