Getting Started with SensDat Development

1. Make sure that you have NVM installed.
2. Clone the Repo onto your local machine using your choice of git cloning methods.
3. cd into the src folder.
4. Run a npm install from the terminal to download all the required node modules.
5. Start the app in development mode with npm start.
6. Open http://localhost:3000 to view it in your browser.

Note that the app was initially created with Create React App.

SensDat Deployment

SensDat is deployed as a static website at (sensdat.cs.vt.edu)[sensdat.cs.vt.edu]. Steps to push new code:

1. Open up your terminal, navigate to the top-level SensDatfolder, and build the code locally via npm run build.
2. If you're not on VT's network, use Pulse Secure to proxy.
3. Now we'll use the sftp command to transfer the build files to the server!
   1. Run sftp [email protected] (or if you have another username) and enter the password.
   2. Run cd sensdat.
   3. Run put -r build.
      • NOTE: This will clobber whatever's currently in the directly build on the server with the local build directory. If you're not sure you want to clobber the old build directory, you can ssh in to the server and copy it to to the directory sensdat/old_builds/ as backup.
4. That's it!

File Organization

NOTE: This may not be exhaustive or up-to-date. Please update as needed :)

Where to Start?

1. index.js This contains the root component of the app. Good for getting a high-level view of how all the components are assembled.
2. app-state.js This file is for managing the "app-state", i.e., a blob of state that is initialized in index.js and passed down/shared with all the subcomponents. This file also has various functions for mutating the app-state. Most state needed by multiple components should live and be managed here.

Data Visualization Development Files

1. viz-view.js for development on the main data visualization.
2. viz-data-editor.js for development on the edit data section of the visualization.
3. upload-layout.js for development on uploading a site layout to display on the visualization.

Data Table Development Files

1. data-view.js for the component that houses the tabs with the data and summary tables
2. data-table.js for main development on the base data table.
3. summary-tabl.sj for summary tables based on states.

States

1. state-view.js for the component that lists the currently-existing states.
2. states/<state-name>.js has a special object for each state.
3. utils.js has a list stateFactories which needs to be updated for each state (though that's kind of sad).
4. For individual states:
   1. create-region-interaction.js for Region State creation (which is embedded in viz-view.js).
   2. compound-state-pane.js is a component for creating Combination States
   3. condition-state-pane.js is a component for creating Condition States
   4. sequence-state-pane.js is a component for creating Sequence States
   5. timespan-state-panel.js is a component for creatign Timespan states.