Select objects – Dragon3DGraff_Blog

Select objects

0

When creating an object, a panel appears with its parameters displayed.

Implemented the selection of objects.

TODO: make the object selected after creation, when selected, display the panel with the parameters, when changing the value in the parameter panel, change the geometry of the selected object.

		this.deleteParametersMenu();

		let dom = document.getElementById( 'Parameters');
		let elem = document.createElement( 'div' );
		elem.id = 'ParametersRows';
		dom.appendChild( elem );

		let typeOfObject = document.createElement( 'div' );
		typeOfObject.id = 'ParametersRows';
		elem.appendChild( typeOfObject );
		typeOfObject.innerHTML = entity.geometry.type;// + ' id = ' + entity.id;


		let parametersArray = Object.entries( entity.geometry.parameters );

		for (let i = 0; i < parametersArray.length; i++) {

			let rowDiv = document.createElement( 'div' );
			elem.appendChild( rowDiv );
			rowDiv.className = 'ParametersRow';

			let text = document.createElement( 'p' );
			rowDiv.appendChild( text );
			text.innerHTML = parametersArray[i][0];

			let input = document.createElement( 'input' );
			input.id = parametersArray[i][0]; //'param_' + 
			input.type = 'number';
			input.step = 0.01;
			rowDiv.appendChild (input);
			input.value = Math.round( parametersArray[i][1] * 1000 )/1000;	

		        }, false );

		}

	}
this.selectEntity = function ( objectToSelect, selectedObject ){

		selectedObject.objectOwnColor = objectToSelect.material.color;
		objectToSelect.material.color = new THREE.Color( 'whitesmoke' );
		selectedObject.object = objectToSelect;

		selectedObject.object.add( this.createWireframe ( selectedObject ) );
		selectedObject.object.add( this.createBoundingBox( selectedObject ) );

		let taUI = new TA_UI;
		taUI.createParametersMenu( objectToSelect );

	}

	this.createWireframe = function ( selectedObject ) {

		let wireframe = new THREE.WireframeGeometry( selectedObject.object.geometry );
		
		let wireframeLines = new THREE.LineSegments( wireframe );
		wireframeLines.material.depthTest = true;
		// wireframeLines.material.opacity = 0.25;
		// wireframeLines.material.transparent = true;
		wireframeLines.material.color = new THREE.Color( 'white' );
		wireframeLines.name = 'wireframe';

		wireframeLines.scale.set( 1.001, 1.001, 1.001 );

		return wireframeLines;

	}
this.removeSelection = function ( selectedObject ) {

		let wireframeScene = selectedObject.object.children.filter( item => item.name === "wireframe" || item.name === "BoundingBox" );
		wireframeScene.forEach( element => {
		selectedObject.object.remove( element );			
		});

		selectedObject.object.material.color = selectedObject.objectOwnColor;
		selectedObject.object = null;
		selectedObject.objectOwnColor = null;

	}
0

Leave a Reply