From fdd75b103b67178f0a7a27b00d490c44186a559d Mon Sep 17 00:00:00 2001
From: Mike Lynch <mike@mikelynch.org>
Date: Fri, 4 Aug 2023 14:10:39 +1000
Subject: [PATCH] Adjustable node sizes relative to links

---
 fourDShape.js | 9 +++++----
 gui.js        | 4 +++-
 main.js       | 3 ++-
 polytopes.js  | 4 ++--
 4 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/fourDShape.js b/fourDShape.js
index bd88764..c760d3f 100644
--- a/fourDShape.js
+++ b/fourDShape.js
@@ -1,7 +1,7 @@
 import * as THREE from 'three';
 
 
-const HYPERPLANE = 2;
+const HYPERPLANE = 2.0;
 
 
 class FourDShape extends THREE.Group {
@@ -15,7 +15,8 @@ class FourDShape extends THREE.Group {
 		this.links = structure.links;
 		this.node_size = structure.geometry.node_size;
 		this.link_size = structure.geometry.link_size;
-		this.geom_scale = 1;
+		this.node_scale = 1;
+		this.link_scale = 1;
 		this.hyperplane = HYPERPLANE;
 		this.initShapes();
 	}
@@ -64,7 +65,7 @@ class FourDShape extends THREE.Group {
 		const length = n1.distanceTo(n2);
 		const centre = new THREE.Vector3();
 		centre.lerpVectors(n1, n2, 0.5);
-		link.object.scale.copy(new THREE.Vector3(this.geom_scale, this.geom_scale, length));
+		link.object.scale.copy(new THREE.Vector3(this.link_scale, this.link_scale, length));
 		link.object.position.copy(centre);
 		link.object.lookAt(n2);
 		link.object.children[0].rotation.x = Math.PI / 2.0;
@@ -97,7 +98,7 @@ class FourDShape extends THREE.Group {
 
 
 	render3(rotations) {
-		this.scalev3 = new THREE.Vector3(this.geom_scale, this.geom_scale, this.geom_scale);
+		this.scalev3 = new THREE.Vector3(this.node_scale, this.node_scale, this.node_scale);
 		for( const n of this.nodes4 ) {
 			const v3 = this.fourDtoV3(n.x, n.y, n.z, n.w, rotations);
 			this.nodes3[n.id].v3 = v3;
diff --git a/gui.js b/gui.js
index d853255..54cb0df 100644
--- a/gui.js
+++ b/gui.js
@@ -16,6 +16,7 @@ class FourDGUI {
 		this.params = {
 			shape: this.link['shape'] || DEFAULT_SHAPE,
 			thickness: this.link['thickness'] || 1,
+			nodesize: this.link['nodesize'] || 0,
 			color: this.link['color'] || DEFAULT_COLOR,
 			background: this.link['background'] || DEFAULT_BG,
 			hyperplane: this.link['hyperplane'] || 2,
@@ -31,8 +32,9 @@ class FourDGUI {
 			[ '5-cell', '16-cell', 'tesseract', '24-cell', '120-cell', '600-cell' ]
 		).onChange(createShape)
 
-		this.gui.add(this.params, 'hyperplane', 1.5, 4);
+		this.gui.add(this.params, 'hyperplane', 1.5, 3);
 		this.gui.add(this.params, 'thickness', 0.1, 4);
+		this.gui.add(this.params, 'nodesize', 0, 5);
 		this.gui.addColor(this.params, 'color').onChange(setColor);
 		this.gui.addColor(this.params, 'background').onChange(setBackground);
 		this.gui.add(this.params, 'xRotate', [ 'YW', 'YZ', 'ZW' ]);
diff --git a/main.js b/main.js
index 37ebd31..6a6d808 100644
--- a/main.js
+++ b/main.js
@@ -132,7 +132,8 @@ function animate() {
 		rotfn[gui.params.yRotate](psi)
 	];
 	shape.hyperplane = gui.params.hyperplane;
-	shape.geom_scale = gui.params.thickness;
+	shape.link_scale = gui.params.thickness;
+	shape.node_scale = gui.params.thickness * (gui.params.nodesize + 1);
 	shape.render3(rotations);
 
 	renderer.render( scene, camera );
diff --git a/polytopes.js b/polytopes.js
index 9dfcc38..1894142 100644
--- a/polytopes.js
+++ b/polytopes.js
@@ -339,8 +339,8 @@ export const cell600 = () => {
 		nodes: nodes,
 		links: links,
 		geometry: {
-			node_size: 0.08,
-			link_size: 0.01
+			node_size: 0.02,
+			link_size: 0.02
 		}
 	}
 }