Implement Jupyter notebook viewer (production)

[blairlyons]

Use Case

As a computational biologist user, I want to view my simulation results directly in a Python Jupyter notebook while I work on my simulation model in order to iterate faster with less steps to view Simularium results.

Acceptance Criteria

https://github.com/simularium/simularium-planning/issues/130

UI Tasks

The following tasks have been prioritized as necessary for MVP:

• [x] Configure css variables
• [x] Viewer title
• [x] Playback controls and scale bar
• [x] Side panel layout
• [x] Agent checkboxes
• [x] Style the checkboxes/agent tree

Existing issues and future work/post-MVP:

• [ ] Info panel
• [ ] Use config provider for styling

Link to Figma Designs: https://www.figma.com/file/A5t0B9ZpmYHorP6stjHsQu/Simularium-Jupyter-Notebooks?type=design&node-id=31%3A1640&mode=design&t=wwMZU8Hwvs45iJDq-1

Follow designs for MVP Product. Components are identical in appearance and function to Simularium except for the following changes:

• Agent panel is not collapsible
• Plots panel does not exist
• Rotate, pan, and focus buttons do not exist
• Header does not exist
• Title is centered at the top of the viewport, if no title is entered, text appears saying "Simulation Title"
• If a user has entered information corresponding to information on the cards from the main Simularium home page, a filled info icon appears to the right of the title. This icon has three colors for a default (#FFFFFF), hover (#E7E4F2), and selected (#B59FF6) state.
• Upon clicking info icon, a modal appears. Modal contains any information entered about simulation. Clicking the 'x' button on modal, or clicking outside of it closes modal. See Figma for designs

New features of designs are prototyped. Select the MVP frame and click the play button in the top right of Figma to interact with prototype.

Details

From initial UX discussions, it seems likely this will need minimal front end web work, and might mostly involve releasing the prototype Jupyter viewer with a few modifications as a package on PyPI.

Potential Reviewers

(while Blair is away) @meganrm @TravisKroeker

[jsavieo]

@blairlyons to split into subtasks

[ascibisz]

@interim17 I'm changing you to be the assignee since you're actually doing this work!

@jsavieo Blair's not going to split into subtasks right now, since this is largely going to be done by one dev now. Joe can feel free to break into subtasks if that helps his organization, and I will open a subtask if I'm doing any significant amount of work on it again