vmario/Doodle3D-Slicer
0
0
Fork 0
mirror of https://github.com/Doodle3D/Doodle3D-Slicer.git synced 2024-11-22 13:37:58 +01:00
Code Issues Projects Releases Wiki Activity

update size when props change

Browse Source
This commit is contained in:
casperlamboo 2017-11-13 11:15:00 +01:00
parent 10055824aa
commit fcfe7f7bc6
2 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/interface/index.js
View File

@ -156,13 +156,17 @@ class Interface extends React.Component {
} }
componentWillUpdate(nextProps, nextState) { componentWillUpdate(nextProps, nextState) {
const { control, box, render } = this.state; const { control, box, render, setSize } = this.state;
if (control && nextState.controlMode !== this.state.controlMode) control.setMode(nextState.controlMode); if (control && nextState.controlMode !== this.state.controlMode) control.setMode(nextState.controlMode);
if (box && nextState.settings.dimensions !== this.state.settings.dimensions) { if (box && nextState.settings.dimensions !== this.state.settings.dimensions) {
const { dimensions } = nextState.settings; const { dimensions } = nextState.settings;
box.scale.set(dimensions.y, dimensions.z, dimensions.x); box.scale.set(dimensions.y, dimensions.z, dimensions.x);
render(); render();
} }
if (setSize && nextProps.width !== this.props.width || nextProps.height !== this.props.height || nextProps.pixelRatio !== this.props.pixelRatio) {
console.log('update pixel ratio');
setSize(nextProps.width, nextProps.height, nextProps.pixelRatio);
}
} }
render() { render() {
@ -238,7 +242,8 @@ Interface.propTypes = {
quality: PropTypes.object.isRequired, quality: PropTypes.object.isRequired,
defaultQuality: PropTypes.string.isRequired, defaultQuality: PropTypes.string.isRequired,
material: PropTypes.object.isRequired, material: PropTypes.object.isRequired,
defaultMaterial: PropTypes.string.isRequired defaultMaterial: PropTypes.string.isRequired,
pixelRatio: PropTypes.number.isRequired
}; };
Interface.defaultProps = { Interface.defaultProps = {
defaultSettings: baseSettings, defaultSettings: baseSettings,
@ -247,7 +252,8 @@ Interface.defaultProps = {
quality: qualitySettings, quality: qualitySettings,
defaultQuality: 'medium', defaultQuality: 'medium',
material: materialSettings, material: materialSettings,
defaultMaterial: 'pla' defaultMaterial: 'pla',
pixelRatio: 1
}; };
export default injectSheet(styles)(Interface); export default injectSheet(styles)(Interface);

17
src/interface/utils.js
View File

@ -10,7 +10,7 @@ export function placeOnGround(mesh) {
} }
export function createScene(canvas, props, state) { export function createScene(canvas, props, state) {
const { width, height, geometry } = props; const { width, height, geometry, pixelRatio } = props;
const { controlMode, settings } = state; const { controlMode, settings } = state;
// center geometry // center geometry
@ -22,13 +22,20 @@ export function createScene(canvas, props, state) {
const renderer = new THREE.WebGLRenderer({ canvas, alpha: true }); const renderer = new THREE.WebGLRenderer({ canvas, alpha: true });
renderer.setClearColor(0xffffff, 0); renderer.setClearColor(0xffffff, 0);
renderer.setSize(width, height);
const scene = new THREE.Scene(); const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(50, width / height, 1, 10000); const camera = new THREE.PerspectiveCamera(50, 1, 1, 10000);
camera.position.set(0, 400, 300); camera.position.set(0, 400, 300);
const setSize = (width, height, pixelRatio = 1) => {
renderer.setSize(width, height);
renderer.setPixelRatio(pixelRatio);
camera.aspect = width / height;
camera.updateProjectionMatrix();
render();
};
const directionalLight = new THREE.DirectionalLight(0xd5d5d5); const directionalLight = new THREE.DirectionalLight(0xd5d5d5);
directionalLight.position.set(1, 1, 1); directionalLight.position.set(1, 1, 1);
scene.add(directionalLight); scene.add(directionalLight);
@ -71,7 +78,7 @@ export function createScene(canvas, props, state) {
const { dimensions } = settings; const { dimensions } = settings;
box.scale.set(dimensions.y, dimensions.z, dimensions.x); box.scale.set(dimensions.y, dimensions.z, dimensions.x);
render(); setSize(width, height, pixelRatio);
return { control, editorControls, scene, mesh, camera, renderer, render, box }; return { control, editorControls, scene, mesh, camera, renderer, render, box, setSize };
} }