LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

update gui controls

Browse source
This commit is contained in:
btzr-io 2018-08-15 00:15:15 -06:00 • committed by Sean Yesmunt
parent 00ae8600f0
commit 267cf2c11f
1 changed files with 26 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/renderer/component/viewers/threeViewer/index.jsx
View file

@ -136,6 +136,8 @@ class ThreeViewer extends React.PureComponent<Props, State> {
if (child.material) child.material.dispose(); if (child.material) child.material.dispose();
} }
}); });
// Clean up controls
if (this.controls) this.controls.dispose();
// It's unclear if we need this: // It's unclear if we need this:
if (this.renderer) { if (this.renderer) {
this.renderer.renderLists.dispose(); this.renderer.renderLists.dispose();
@ -157,25 +159,36 @@ class ThreeViewer extends React.PureComponent<Props, State> {
transformGroup(group) { transformGroup(group) {
ThreeViewer.fitMeshToCamera(group); ThreeViewer.fitMeshToCamera(group);
this.updateControlsTarget(group.position); this.updateControlsTarget(this.mesh.position);
} }
createInterfaceControls() { createInterfaceControls() {
if (this.guiContainer && this.mesh) { if (this.guiContainer && this.mesh) {
this.gui = new dat.GUI({ autoPlace: false, name: 'controls' });
const config = { const config = {
color: this.materialColor, color: this.materialColor,
wireframe: false,
}; };
this.gui = new dat.GUI({ autoPlace: false }); config.reset = () => {
// Reset material color
config.color = this.materialColor;
this.material.color.set(config.color);
// Reset wireframe
this.material.wireframe = false;
// Reset camera
this.restoreCamera();
};
const colorPicker = this.gui.addColor(config, 'color'); // Color picker
const colorPicker = this.gui.addColor(config, 'color').listen();
colorPicker.onChange(color => { colorPicker.onChange(color => {
this.material.color.set(color); this.material.color.set(color);
}); });
this.gui.add(this.material, 'wireframe').listen(); this.gui.add(this.material, 'wireframe').listen();
this.gui.add(config, 'reset');
this.guiContainer.current.appendChild(this.gui.domElement); this.guiContainer.current.appendChild(this.gui.domElement);
} }
} }
@ -187,10 +200,11 @@ class ThreeViewer extends React.PureComponent<Props, State> {
controls.enableDamping = true; controls.enableDamping = true;
controls.dampingFactor = 0.75; controls.dampingFactor = 0.75;
controls.enableZoom = true; controls.enableZoom = true;
controls.minDistance = 1; controls.minDistance = 5;
controls.maxDistance = 50; controls.maxDistance = 14;
controls.autoRotate = autoRotate; controls.autoRotate = autoRotate;
controls.enablePan = false; controls.enablePan = false;
controls.saveState();
return controls; return controls;
} }
@ -245,6 +259,12 @@ class ThreeViewer extends React.PureComponent<Props, State> {
this.controls.update(); this.controls.update();
} }
restoreCamera() {
this.controls.reset();
this.camera.position.set(-9.5, 14, 11);
this.updateControlsTarget(this.mesh.position);
}
renderStl(data) { renderStl(data) {
this.createGeometry(data); this.createGeometry(data);
this.mesh = new THREE.Mesh(this.geometry, this.material); this.mesh = new THREE.Mesh(this.geometry, this.material);