diff --git a/gui.js b/gui.js index 69c4c09..cdba062 100644 --- a/gui.js +++ b/gui.js @@ -10,8 +10,7 @@ const DEFAULTS = { color: 0x3293a9, background: 0xd4d4d4, hyperplane: 2, - xRotate: 'YW', - yRotate: 'XZ', + rotation: 'rigid', dtheta: 0, dpsi: 0, } @@ -32,8 +31,7 @@ class FourDGUI { color: this.link['color'], background: this.link['background'], hyperplane: this.link['hyperplane'], - xRotate: this.link['xRotate'], - yRotate: this.link['yRotate'], + rotation: this.link['rotation'], damping: false, dtheta: this.link['dtheta'], dpsi: this.link['dpsi'], @@ -50,8 +48,7 @@ class FourDGUI { this.gui.add(this.params, 'nodesize', 0.1, 4); 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' ]); - this.gui.add(this.params, 'yRotate', [ 'XZ', 'XY', 'XW' ]); + this.gui.add(this.params, 'rotation', [ 'rigid', 'tumbling', 'inside-out', 'axisymmetrical' ]); this.gui.add(this.params, 'damping'); this.gui.add(this.params, 'copy link'); @@ -84,7 +81,7 @@ class FourDGUI { this.link = {}; this.urlParams = this.linkUrl.searchParams; - for( const param of [ "shape", "xRotate", "yRotate" ]) { + for( const param of [ "shape", "rotation" ]) { const value = this.urlParams.get(param); if( value ) { this.link[param] = value; @@ -112,8 +109,7 @@ class FourDGUI { url.searchParams.append("color", this.hexToString(this.params.color)); url.searchParams.append("background", this.hexToString(this.params.background)); url.searchParams.append("hyperplane", this.params.hyperplane.toString()); - url.searchParams.append("xRotate", this.params.xRotate); - url.searchParams.append("yRotate", this.params.yRotate); + url.searchParams.append("rotation", this.params.rotation); url.searchParams.append("dtheta", this.params.dtheta.toString()); url.searchParams.append("dpsi", this.params.dpsi.toString()); this.copyTextToClipboard(url); diff --git a/main.js b/main.js index a7348ea..f57802c 100644 --- a/main.js +++ b/main.js @@ -3,7 +3,7 @@ import * as THREE from 'three'; import * as POLYTOPES from './polytopes.js'; -import { rotfn } from './rotation.js'; +import { get_rotation } from './rotation.js'; import { FourDGUI, DEFAULTS } from './gui.js'; import { FourDShape } from './fourDShape.js'; import { get_colours } from './colours.js'; @@ -160,10 +160,8 @@ function animate() { } } - const rotations = [ - rotfn[gui.params.xRotate](theta), - rotfn[gui.params.yRotate](psi) - ]; + const rotations = get_rotation(gui.params.rotation, theta, psi); + shape.hyperplane = gui.params.hyperplane; shape.link_scale = gui.params.thickness; shape.node_scale = gui.params.nodesize; diff --git a/rotation.js b/rotation.js index 27b3fc7..a1cf475 100644 --- a/rotation.js +++ b/rotation.js @@ -81,5 +81,24 @@ export const rotfn = { ZW: rotZW, }; +const rotMode = { + 'rigid': [ rotYW, rotXW ], + 'tumbling': [ rotYW, rotXZ ], + 'inside-out': [ rotYW, rotXY ], + 'axisymmetrical': [ rotZW, rotXY ] +}; + + +export const get_rotation = (mode, theta, psi) => { + const fns = rotMode[mode]; + return [ fns[0](theta), fns[1](psi) ]; +} + + + + // [ + // rotfn[gui.params.xRotate](theta), + // rotfn[gui.params.yRotate](psi) + // ];