benptc/cube-proposal.html

## cube-proposal.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>THREE.js Cube</title>
  <script src="objectDefaultFiles/object.js"></script>
  <script src="objectDefaultFiles/threejsInterface.js"></script>
  <script src="objectDefaultFiles/gl-worker.js"></script>
</head>
<body>
<script type="module">
import * as THREE from 'https://unpkg.com/three@0.126.1/build/three.module.js';

let spatialInterface = new SpatialInterface();
// handles gl-worker and nitty-gritty spatialInterface APIs to provide a clean interface
let threejsInterface = new ThreejsInterface(spatialInterface);

let mesh = null;

// creates a scene, camera, renderer with correct parameters and gl-worker compatibility
// ..sceneObj is positioned at the tool position, groundplaneObj is positioned at groundplane origin
// ..they are automatically managed so any content you attach to them will render correctly
threejsInterface.onSceneCreated(function(sceneObj, _groundplaneObj) {
  threejsInterface.resourceLoaded('crate', false);
  let texture = new THREE.TextureLoader().load('textures/crate.gif', function() {
    threejsInterface.resourceLoaded('crate', true);
  });
  let geometry = new THREE.BoxBufferGeometry(500, 500, 500);
  let material = new THREE.MeshBasicMaterial({map: texture});
  mesh = new THREE.Mesh(geometry, material);
  mesh.position.setZ(50);
  sceneObj.add(mesh);

// all the other boilerplate of our old render functions happens in the threejsInterface
// this gets called 60fps for any custom rendering/updates specific to this tool
}).onRender(function() {
  mesh.rotation.z += 0.01; // make it spin
});

</script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>THREE.js Cube</title>
	<script src="objectDefaultFiles/object.js"></script>
	<script src="objectDefaultFiles/threejsInterface.js"></script>
	<script src="objectDefaultFiles/gl-worker.js"></script>
	</head>
	<body>
	<script type="module">
	import * as THREE from 'https://unpkg.com/three@0.126.1/build/three.module.js';

	let spatialInterface = new SpatialInterface();
	// handles gl-worker and nitty-gritty spatialInterface APIs to provide a clean interface
	let threejsInterface = new ThreejsInterface(spatialInterface);

	let mesh = null;

	// creates a scene, camera, renderer with correct parameters and gl-worker compatibility
	// ..sceneObj is positioned at the tool position, groundplaneObj is positioned at groundplane origin
	// ..they are automatically managed so any content you attach to them will render correctly
	threejsInterface.onSceneCreated(function(sceneObj, _groundplaneObj) {
	threejsInterface.resourceLoaded('crate', false);
	let texture = new THREE.TextureLoader().load('textures/crate.gif', function() {
	threejsInterface.resourceLoaded('crate', true);
	});
	let geometry = new THREE.BoxBufferGeometry(500, 500, 500);
	let material = new THREE.MeshBasicMaterial({map: texture});
	mesh = new THREE.Mesh(geometry, material);
	mesh.position.setZ(50);
	sceneObj.add(mesh);

	// all the other boilerplate of our old render functions happens in the threejsInterface
	// this gets called 60fps for any custom rendering/updates specific to this tool
	}).onRender(function() {
	mesh.rotation.z += 0.01; // make it spin
	});

	</script>
	</body>
	</html>