822 geometry of patient body (#847)

* Add CT body

* Add resultCT

* lint

* Rename CT to 3D_datafile_CT

* Change dimension to 3

* Rename CT to 3D

* Update src/JsRoot/GraphData.tsx

Co-authored-by: Jakub Niechaj <quban123@gmail.com>

* Apply suggestions from code review

Co-authored-by: Jakub Niechaj <quban123@gmail.com>

---------

Co-authored-by: Jakub Niechaj <quban123@gmail.com>

package.json

@@ -32,6 +32,7 @@
 		"pyodide": "^0.22.1",
 		"react": "^17.0.2",
 		"react-async-script": "^1.2.0",
+		"react-copy-to-clipboard": "^5.1.0",
 		"react-countdown": "^2.3.2",
 		"react-dnd": "^15.1.2",
 		"react-dom": "^17.0.2",
@@ -96,6 +97,7 @@
 	"devDependencies": {
 		"@types/react": "^18.0.9",
 		"@types/react-async-script": "^1.2.1",
+		"@types/react-copy-to-clipboard": "^5.0.4",
 		"@types/three": "^0.149.0",
 		"cross-env": "^7.0.3",
 		"gh-pages": "^5.0.0",

src/JsRoot/GraphData.tsx

@@ -8,6 +8,7 @@ import { estimatorPage1DToCsv } from '../util/csv/Csv';
 import { ScoringOutputJSON } from '../ThreeEditor/util/Scoring/ScoringOutput';
 import { FilterJSON } from '../ThreeEditor/util/Detect/DetectFilter';
 import { EstimatorResults } from '../WrapperApp/components/Results/ResultsPanel';
+import Result3D from '../WrapperApp/components/Results/Results3D';
 
 export type pageData = {
 	name: string;
@@ -38,14 +39,19 @@ export interface Page0D extends IPage {
 	dimensions: 0;
 }
 
+export interface Page3D extends IPage {
+	dimensions: 3;
+	resultsUrl: string;
+}
+
 export type Estimator = {
 	name: string;
 	metadata?: unknown;
 	pages: Page[];
 	scoringOutputJsonRef?: ScoringOutputJSON;
 };
 
-export type Page = Page2D | Page1D | Page0D;
+export type Page = Page3D | Page2D | Page1D | Page0D;
 
 export const isPage2d = (page: Page): page is Page2D => {
 	return (page as Page2D).dimensions === 2;
@@ -59,13 +65,19 @@ export const isPage0d = (page: Page): page is Page0D => {
 	return (page as Page0D).dimensions === 0;
 };
 
+export const isPage3D = (page: Page): page is Page3D => {
+	return (page as Page3D).dimensions === 3;
+};
+
 const getGraphFromPage = (page: Page, title?: string) => {
 	if (isPage2d(page)) {
 		return <JsRootGraph2D page={page} title={title} />;
 	} else if (isPage1d(page)) {
 		return <JsRootGraph1D page={page} title={title} />;
 	} else if (isPage0d(page)) {
 		return <JsRootGraph0D page={page} title={title} />;
+	} else if (isPage3D(page)) {
+		return <Result3D page={page} title={title} />;
 	} else {
 		return <div>Error</div>;
 	}

src/ThreeEditor/components/Sidebar/EditorSidebar.tsx

@@ -4,7 +4,7 @@ import { Box, Tabs, Tab } from '@mui/material';
 import { TabPanel } from '../../../WrapperApp/components/TabPanel';
 import { PropertiesPanel } from './propeteries/PropeteriesPanel';
 import { EditorSidebarTabTree } from './tabs/EditorSidebarTabTree';
-import { BoxMesh, CylinderMesh, SphereMesh } from '../../util/BasicMeshes';
+import { BoxMesh, CTMesh, CylinderMesh, SphereMesh } from '../../util/BasicMeshes';
 import { AddObjectCommand } from '../../js/commands/AddObjectCommand';
 import { AddZoneCommand } from '../../js/commands/AddZoneCommand';
 import { AddDetectGeometryCommand } from '../../js/commands/AddDetectGeometryCommand';
@@ -85,6 +85,11 @@ export function EditorSidebar(props: { editor: Editor }) {
 					title: 'Sphere',
 					onClick: () =>
 						editor.execute(new AddObjectCommand(editor, new SphereMesh(editor)))
+				},
+				{
+					title: 'CT',
+					onClick: () =>
+						editor.execute(new AddObjectCommand(editor, new CTMesh(editor)))
 				}
 			],
 			tree: <SidebarTree editor={editor} sources={[editor.scene.children]} />

src/ThreeEditor/components/Sidebar/propeteries/PropeteriesPanel.tsx

@@ -16,6 +16,7 @@ import { QuantityDifferentialScoring } from './category/QuantityDifferentialScor
 import { BeamConfiguration } from './category/BeamConfiguration';
 import { ObjectMaterial } from './category/ObjectMaterial';
 import { FilterConfiguration } from './category/FilterConfiguration';
+import { CTConfiguration } from './category/CTConfiguration';
 
 export function PropertiesPanel(props: { boxProps: BoxProps; editor: Editor }) {
 	const { boxProps, editor } = props;
@@ -40,6 +41,7 @@ export function PropertiesPanel(props: { boxProps: BoxProps; editor: Editor }) {
 					<QuantityConfiguration {...panelProps} />
 					<QuantityDifferentialScoring {...panelProps} />
 					<BeamConfiguration {...panelProps} />
+					<CTConfiguration {...panelProps} />
 					<ObjectDimensions {...panelProps} />
 					<DetectorGrid {...panelProps} />
 					<ZoneOperations {...panelProps} />

src/ThreeEditor/components/Sidebar/propeteries/category/CTConfiguration.tsx

@@ -0,0 +1,38 @@
+import { Object3D } from 'three';
+import { SetValueCommand } from '../../../../js/commands/SetValueCommand';
+import { Editor } from '../../../../js/Editor';
+import { TextPropertyField } from '../fields/PropertyField';
+import { useSmartWatchEditorState } from '../../../../util/hooks/signals';
+import { PropertiesCategory } from './PropertiesCategory';
+import { isCTMesh } from '../../../../util/BasicMeshes';
+
+export function CTConfiguration(props: { editor: Editor; object: Object3D }) {
+	const { object, editor } = props;
+
+	const { state: watchedObject } = useSmartWatchEditorState(editor, object);
+
+	const visibleFlag = isCTMesh(watchedObject);
+
+	return (
+		<PropertiesCategory category='CT Configuration' visible={visibleFlag}>
+			{visibleFlag && (
+				<>
+					<TextPropertyField
+						label='Path on server'
+						value={watchedObject.pathOnServer}
+						onChange={value => {
+							editor.execute(
+								new SetValueCommand(
+									editor,
+									watchedObject.object,
+									'pathOnServer',
+									value
+								)
+							);
+						}}
+					/>
+				</>
+			)}
+		</PropertiesCategory>
+	);
+}

src/ThreeEditor/components/Sidebar/propeteries/category/ObjectDimensions.tsx

@@ -11,6 +11,7 @@ import {
 	BASIC_GEOMETRY_OPTIONS,
 	isBasicMesh,
 	isBoxMesh,
+	isCTMesh,
 	isCylinderMesh,
 	isSphereMesh
 } from '../../../../util/BasicMeshes';
@@ -460,7 +461,9 @@ export function ObjectDimensions(props: {
 }) {
 	const { object, editor } = props;
 
-	const visibleFlag = isBasicMesh(object) || isDetectGeometry(object) || isWorldZone(object);
+	const visibleFlag =
+		!isCTMesh(object) &&
+		(isBasicMesh(object) || isDetectGeometry(object) || isWorldZone(object));
 
 	return (
 		<PropertiesCategory category='Dimensions' visible={visibleFlag}>

src/ThreeEditor/util/BasicMeshes.ts

@@ -13,7 +13,8 @@ const defaultMaterial = new THREE.MeshBasicMaterial({
 export const BASIC_GEOMETRY_OPTIONS = {
 	Box: 'Box',
 	Cylinder: 'Cylinder',
-	Sphere: 'Sphere'
+	Sphere: 'Sphere',
+	CT: 'CT',
 } as const;
 
 export type BasicGeometry = typeof BASIC_GEOMETRY_OPTIONS[keyof typeof BASIC_GEOMETRY_OPTIONS];
@@ -78,10 +79,32 @@ export class SphereMesh extends BasicMesh<THREE.SphereGeometry> {
 	}
 }
 
+const ctGeometry = new THREE.BoxGeometry(2, .5, 1, 1, 1, 1);
+const ctMaterial = defaultMaterial.clone()
+ctMaterial.color.setHex(0x00ff00);
+export class CTMesh extends BasicMesh<THREE.BoxGeometry> {
+	readonly notScalable = true;
+
+	pathOnServer: string = '';
+
+	constructor(editor: Editor, geometry?: THREE.BoxGeometry, material?: THREE.MeshBasicMaterial) {
+		super(editor, 'CT', 'CTMesh', 'CT', geometry ?? ctGeometry, material ?? ctMaterial.clone());
+	}
+
+	toJSON(meta: { geometries: unknown; materials: unknown; textures: unknown; images: unknown; } | undefined) {
+		const json = super.toJSON(meta);
+		json.object.pathOnServer = this.pathOnServer;
+		return json;
+	}
+}
+
+
 export const isBasicMesh = (x: unknown): x is BasicMesh => x instanceof BasicMesh;
 
 export const isBoxMesh = (x: unknown): x is BoxMesh => x instanceof BoxMesh;
 
 export const isCylinderMesh = (x: unknown): x is CylinderMesh => x instanceof CylinderMesh;
 
 export const isSphereMesh = (x: unknown): x is SphereMesh => x instanceof SphereMesh;
+
+export const isCTMesh = (x: unknown): x is CTMesh => x instanceof CTMesh;

src/ThreeEditor/util/ObjectLoader.ts

@@ -1,6 +1,6 @@
 import { Object3D, ObjectLoader } from 'three';
 import { Editor } from '../js/Editor';
-import { BoxMesh, CylinderMesh, SphereMesh } from './BasicMeshes';
+import { BoxMesh, CTMesh, CylinderMesh, SphereMesh } from './BasicMeshes';
 
 export class EditorObjectLoader extends ObjectLoader {
 	private editor: Editor;
@@ -17,6 +17,7 @@ export class EditorObjectLoader extends ObjectLoader {
 		const geometry = geometries[data.geometry];
 		const material = materials[data.material];
 
+
 		let object = super.parseObject<T>(data, geometries, materials, animations);
 		let editorObject;
 		switch (data.type) {
@@ -30,6 +31,10 @@ export class EditorObjectLoader extends ObjectLoader {
 				editorObject = new CylinderMesh(this.editor);
 				geometry.rotateX(Math.PI / 2);
 				break;
+			case 'CTMesh':
+				editorObject = new CTMesh(this.editor);
+				editorObject.pathOnServer = data.pathOnServer;
+				break;
 			default:
 			// not custom object type
 		}