Merge branch 'main' of https://github.com/simularium/simularium-viewer …

…into feature/session-colors

CHANGELOG.md

@@ -4,10 +4,29 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
-#### [v3.8.1](https://github.com/simularium/simularium-viewer/compare/v3.7.4...v3.8.1)
+#### [v3.8.3](https://github.com/simularium/simularium-viewer/compare/v3.8.2...v3.8.3)
+
+- Fix/null agent function [`#396`](https://github.com/simularium/simularium-viewer/pull/396)
+- spread null agent object when parsing frames [`#395`](https://github.com/simularium/simularium-viewer/pull/395)
+- send selected agent data to front end [`#392`](https://github.com/simularium/simularium-viewer/pull/392)
+
+#### [v3.8.2](https://github.com/simularium/simularium-viewer/compare/v3.8.1...v3.8.2)
+
+> 10 June 2024
+
+- Fix/remove simularium engine specific code [`#391`](https://github.com/simularium/simularium-viewer/pull/391)
+
+#### [v3.8.1](https://github.com/simularium/simularium-viewer/compare/v3.8.0...v3.8.1)
+
+> 3 June 2024
 
 - With octopus, we can assume frame per message [`#390`](https://github.com/simularium/simularium-viewer/pull/390)
 - update cache setting [`#388`](https://github.com/simularium/simularium-viewer/pull/388)
+
+#### [v3.8.0](https://github.com/simularium/simularium-viewer/compare/v3.7.4...v3.8.0)
+
+> 23 May 2024
+
 - Fix/plotdata [`#386`](https://github.com/simularium/simularium-viewer/pull/386)
 - Feature/trim cache head [`#381`](https://github.com/simularium/simularium-viewer/pull/381)
 

README.md

@@ -118,7 +118,7 @@ This will run the example in `/examples/src/`, demonstrating the viewer's functi
 | transpileES       | run babel on `src` directory; _do not_ transpile `import/export` statements for an ES module compatible build (used by bundlers for tree-shaking) |
 | test              | run `jest`; searches for any files matching the pattern "src/\*_/_.test.js"                                                                      |
 | typeCheck         | run `tsc` in type-check only mode                                                                                                                 |
-| start             | runs an example app from `examples` for testing. Runs at `localhost:8080/public/`. Use `--octopus` to connect to octopus backend and/or `--localserver` to run backend locally. With no flags, this script will default to using remote simularium-engine as backend |
+| start             | runs an example app from `examples` for testing. Runs at `localhost:8080/public/`. Use `--localserver` to run backend locally. With no flags, this script will default to using the staging octopus server as backend |
 
 ---
 

examples/src/AgentMetadata.tsx

@@ -0,0 +1,34 @@
+import React from "react";
+import { AgentData } from "../../type-declarations/simularium/types";
+
+interface AgentMetadataProps {
+    agentData: AgentData;
+}
+
+const AgentMetadata = ({ agentData }: AgentMetadataProps): JSX.Element => {
+
+    const getContents = () => {
+        if (agentData.instanceId === -1) {
+            return <div>No agent selected</div>;
+        }
+        return (
+            <div>
+                <div> uniqueID: {agentData.instanceId}</div>
+                <div> agentType: {agentData.type}</div>
+                <div>
+                    position: x = {agentData.x}, y = {agentData.y}, z =
+                    {agentData.z}
+                </div>
+                <div>
+                    rotation: x = {agentData.xrot}, y = {agentData.yrot}, z =
+                    {agentData.zrot}
+                </div>
+                <div> radius: {agentData.cr}</div>
+            </div>
+        );
+    };
+
+    return <div>Agent Metadata: {getContents()}</div>;
+};
+
+export default AgentMetadata;

examples/src/Viewer.tsx

@@ -8,7 +8,7 @@ import type {
     SelectionStateInfo,
     SelectionEntry,
 } from "../../type-declarations";
-import { TrajectoryType } from "../../src/constants";
+import { nullAgent, TrajectoryType } from "../../src/constants";
 import SimulariumViewer, {
     SimulariumController,
     RenderStyle,
@@ -33,6 +33,7 @@ import SimulariumViewer, {
 //     ErrorLevel,
 // } from "../es";
 import "../../style/style.css";
+import { AgentData } from "../../type-declarations/simularium/types";
 import PointSimulator from "./simulators/PointSimulator";
 import BindingSimulator from "./simulators/BindingSimulator2D";
 import PointSimulatorLive from "./simulators/PointSimulatorLive";
@@ -51,6 +52,7 @@ import {
 } from "./api-settings";
 import ConversionForm from "./ConversionForm";
 import MetaballSimulator from "./simulators/MetaballSimulator";
+import AgentMetadata from "./AgentMetadata";
 
 let playbackFile = "TEST_LIVEMODE_API";
 let queryStringFile = "";
@@ -110,6 +112,7 @@ interface ViewerState {
     trajectoryTitle: string;
     initialPlay: boolean;
     firstFrameTime: number;
+    followObjectData: AgentData;
 }
 
 interface BaseType {
@@ -138,7 +141,6 @@ interface CustomType {
 
 interface InputParams {
     localBackendServer: boolean;
-    useOctopus: boolean;
 }
 
 const simulariumController = new SimulariumController({});
@@ -173,6 +175,7 @@ const initialState: ViewerState = {
     trajectoryTitle: "",
     initialPlay: true,
     firstFrameTime: 0,
+    followObjectData: nullAgent(),
 };
 
 class Viewer extends React.Component<InputParams, ViewerState> {
@@ -197,22 +200,11 @@ class Viewer extends React.Component<InputParams, ViewerState> {
             this.netConnectionSettings = {
                 serverIp: "0.0.0.0",
                 serverPort: 8765,
-                useOctopus: props.useOctopus,
-                secureConnection: props.useOctopus,
             };
-        } else if (props.useOctopus) {
+        } else {
             this.netConnectionSettings = {
                 serverIp: "staging-simularium-ecs.allencell.org",
                 serverPort: 443,
-                useOctopus: true,
-                secureConnection: true,
-            };
-        } else {
-            this.netConnectionSettings = {
-                serverIp: "staging-node1-agentviz-backend.cellexplore.net",
-                serverPort: 9002,
-                secureConnection: true,
-                useOctopus: false,
             };
         }
     }
@@ -398,16 +390,21 @@ class Viewer extends React.Component<InputParams, ViewerState> {
     public convertFile(obj: Record<string, any>, fileType: TrajectoryType) {
         const fileName = uuidv4() + ".simularium";
         simulariumController
-            .convertTrajectory(this.netConnectionSettings, obj, fileType, fileName)
+            .convertTrajectory(
+                this.netConnectionSettings,
+                obj,
+                fileType,
+                fileName
+            )
             .then(() => {
                 this.clearPendingFile();
             })
             .then(() => {
                 simulariumController.changeFile(
-                    { netConnectionSettings: this.netConnectionSettings, },
+                    { netConnectionSettings: this.netConnectionSettings },
                     fileName,
-                    true,
-                )
+                    true
+                );
             })
             .catch((err) => {
                 console.error(err);
@@ -422,7 +419,7 @@ class Viewer extends React.Component<InputParams, ViewerState> {
         const simulariumFile = fileName.includes(".simularium")
             ? trajectoryFile
             : null;
-        this.setState({ initialPlay: true})
+        this.setState({ initialPlay: true });
         return simulariumController
             .handleFileChange(simulariumFile, fileName, geoAssets)
             .catch(console.log);
@@ -719,6 +716,10 @@ class Viewer extends React.Component<InputParams, ViewerState> {
         this.setState({ isRecordingEnabled: value });
     };
 
+    public handleFollowObjectData = (agentData: AgentData) => {
+        this.setState({ followObjectData: agentData });
+    };
+
     public render(): JSX.Element {
         if (this.state.filePending) {
             const fileType = this.state.filePending.type;
@@ -1006,6 +1007,7 @@ class Viewer extends React.Component<InputParams, ViewerState> {
                         }
                     />
                 )}
+                <AgentMetadata agentData={this.state.followObjectData} />
                 <div className="viewer-container">
                     <SimulariumViewer
                         ref={this.viewerRef}
@@ -1029,6 +1031,9 @@ class Viewer extends React.Component<InputParams, ViewerState> {
                                 ? this.onRecordedMovie
                                 : undefined
                         }
+                        onFollowObjectChanged={this.handleFollowObjectData.bind(
+                            this
+                        )}
                         loadInitialData={true}
                         agentColors={this.state.agentColors}
                         showPaths={this.state.showPaths}

examples/src/index.tsx

@@ -3,15 +3,13 @@ import { createRoot } from "react-dom/client";
 
 import Viewer from './Viewer';
 
-declare const SIMULARIUM_USE_OCTOPUS: boolean;
 declare const SIMULARIUM_USE_LOCAL_BACKEND: boolean;
 
 const container: HTMLElement | null = document.getElementById("root");
 
 const root = createRoot(container!);
 root.render(
     <Viewer
-        useOctopus={SIMULARIUM_USE_OCTOPUS}
         localBackendServer={SIMULARIUM_USE_LOCAL_BACKEND}
     />
 );

examples/webpack.dev.js

@@ -28,7 +28,6 @@ module.exports = {
             ],
         }),
         new webpack.DefinePlugin({
-            SIMULARIUM_USE_OCTOPUS: Boolean(process.env.npm_config_octopus),
             SIMULARIUM_USE_LOCAL_BACKEND: Boolean(process.env.npm_config_localserver),
         }),
     ],

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@aics/simularium-viewer",
-    "version": "3.8.1",
+    "version": "3.8.3",
     "description": "An npm package to view simulations.",
     "main": "es/index.js",
     "module": "es/index.js",

src/constants.ts

@@ -1,4 +1,8 @@
-import { CameraSpec, PerspectiveCameraSpec } from "./simularium/types";
+import {
+    AgentData,
+    CameraSpec,
+    PerspectiveCameraSpec,
+} from "./simularium/types";
 
 export const DEFAULT_CAMERA_Z_POSITION = 120;
 export const DEFAULT_CAMERA_SPEC_PERSPECTIVE: PerspectiveCameraSpec = {
@@ -29,3 +33,19 @@ export const enum TrajectoryType {
 }
 
 export const DEFAULT_FRAME_RATE = 60; // frames per second
+
+export const nullAgent = (): AgentData => {
+    return {
+        visType: -1,
+        instanceId: -1,
+        type: -1,
+        x: 0,
+        y: 0,
+        z: 0,
+        xrot: 0,
+        yrot: 0,
+        zrot: 0,
+        cr: 0,
+        subpoints: [],
+    };
+};

src/controller/index.ts

@@ -156,11 +156,7 @@ export default class SimulariumController {
                 this.onError
             );
             this.remoteWebsocketClient = webSocketClient;
-            this.simulator = new RemoteSimulator(
-                webSocketClient,
-                !!netConnectionConfig.useOctopus,
-                this.onError
-            );
+            this.simulator = new RemoteSimulator(webSocketClient, this.onError);
             this.simulator.setTrajectoryDataHandler(
                 this.visData.parseAgentsFromNetData.bind(this.visData)
             );

src/index.ts

@@ -28,5 +28,6 @@ export {
 } from "./simularium";
 export { compareTimes, loadSimulariumFile } from "./util";
 export { DEFAULT_CAMERA_SPEC } from "./constants";
+export { AgentData } from "./simularium/types";
 
 export default Viewport;