Everything's working except for default colours

feature-faces
Mike Lynch 2023-07-29 16:44:18 +10:00
parent d253a851e9
commit 0b78ea2939
2 changed files with 18 additions and 17 deletions

30
gui.js
View File

@ -12,6 +12,7 @@ class FourDGUI {
constructor(createShape, setColor, setBackground) {
this.gui = new GUI();
this.parseLinkParams();
const guiObj = this;
this.params = {
shape: this.link['shape'] || DEFAULT_SHAPE,
thickness: this.link['thickness'] || 1,
@ -21,9 +22,9 @@ class FourDGUI {
xRotate: this.link['xRotate'] || 'YW',
yRotate: this.link['yRotate'] || 'XZ',
damping: false,
dtheta: this.link['dtheta'],
dpsi: this.link['dpsi'],
"copy link": function () { this.copyUrl() }
dtheta: this.link['dtheta'] || 0,
dpsi: this.link['dpsi'] || 0,
"copy link": function () { guiObj.copyUrl() }
};
this.gui.add(this.params, 'shape',
@ -52,7 +53,7 @@ class FourDGUI {
return dft;
}
stringtoHex(cstr) {
stringToHex(cstr) {
return parseInt('0x' + cstr.substr(1));
}
@ -73,32 +74,33 @@ class FourDGUI {
this.link[param] = value;
}
}
const guiObj = this;
console.log(guiObj);
this.link['hyperplane'] = this.numParam('hyperplane', parseFloat, 2);
this.link['thickness'] = this.numParam('thickness', parseFloat, 1);
this.link['color'] = this.numParam(
'color', (s) => this.stringToHex(s), DEFAULT_COLOR
'color', (s) => guiObj.stringToHex(s), DEFAULT_COLOR
);
this.link['background'] = this.numParam(
'background', (s) => this.stringToHex(s), DEFAULT_BG
'background', (s) => guiObj.stringToHex(s), DEFAULT_BG
);
this.link['dpsi'] = this.numParam('dpsi', 0);
this.link['dtheta'] = this.numParam('dtheta', 0);
this.link['dpsi'] = this.numParam('dpsi', parseFloat, 0);
this.link['dtheta'] = this.numParam('dtheta', parseFloat, 0);
}
copyUrl() {
const url = new URL(linkUrl.origin + linkUrl.pathname);
const url = new URL(this.linkUrl.origin + this.linkUrl.pathname);
url.searchParams.append("shape", this.params.shape);
url.searchParams.append("thickness", this.params.thickness.toString());
url.searchParams.append("color", hexToString(this.params.color));
url.searchParams.append("background", hexToString(this.params.background));
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("dtheta", this.dtheta.toString());
url.searchParams.append("dpsi", this.dpsi.toString());
url.searchParams.append("dtheta", this.params.dtheta.toString());
url.searchParams.append("dpsi", this.params.dpsi.toString());
this.copyTextToClipboard(url);
}

View File

@ -28,8 +28,8 @@ document.body.appendChild( renderer.domElement );
// set up colours and materials for gui callbacks
scene.background = new THREE.Color(0x000000);
const material = new THREE.MeshStandardMaterial({ color: 0xff0000 });
scene.background = new THREE.Color(0xdddddd);
const material = new THREE.MeshStandardMaterial({ color: 0x90ebff });
const node_ms = [ material ];
@ -52,7 +52,6 @@ function createShape(name) {
}
shape = new FourDShape(node_ms, link_ms, STRUCTURES[name]);
scene.add(shape);
}
// initialise gui and read params from URL