Programming Cold Flow Update - Ground Software
The ground station is the GUI that we use to control/check our system on the test stand. It receives data from flight software (sensors + valves), shows progress/stages, allows up to send commands to fight station (actuate valves, request for certain sensor data, etc.), execute commands based on priorities, and defines safe/warning/critical boundaries in the config.json file.
Shown below are a couple of screenshots of our GUI (which will go more in-depth later in this post). Each screenshot is a View and can be switched to another View through a Dropdown. A View consists of multiple Panes, and Panes hold many Components.
Shown above is the StatisticsView. It displays the current stage, sensor readings, and graphs of selected pressure transducers. Most of the fields are self-explanatory except for the Mode box on the DataPane, which tells us if the system aborted ("Abort") or not ("Normal").
Allows us to send messages to the flight software by actuating valves, resetting priorities, and progressing to the next stage. On the right side of this view, we can see the processed messages, the priorities, and the states of certain valves.
During AutoSequence (a stage in the sequence), the TimerView will display a countdown starting from 10 seconds. After 10 seconds, the main propellant valve will pulse (open for one second then close).
How It All Works
React uses components to build GUIs. So, what is a component? Components are objects that accept inputs of information. The basic framework of a component is outlined in a file, but we use a component like a function and pass in props (or parameters) to create new instances of these components. Creating instructions for each component makes it really easy for us to use the same component over and over. One example of a component is the Graph component. As you can see in the StatisticsView above, there are two graphs, each of which is a component. We didn't have to outline the axis values or the type of graph again (or any similar fields across all of our graphs) because we used components. All we had to do was input the unique information, such as the title, and the components are automatically built with our instructions!
All the data of the components are stored in the Redux store (the data bank of our application). Every component can retrieve data from the Redux store. Our application has three parts concerning Redux: the state, the actions, and the reducers.
- The state describes the condition of an app at a certain point in time.
- An action tells you what happened in the event at a given point in time. When you dispatch an action, you change the state.
- A reducer receives the action and decides if it wants to update the state. A reducer does not update the state directly; rather, it makes a copy and returns the new information.