Examples: IFCLoader clean up.

examples/jsm/loaders/IFCLoader.js

@@ -0,0 +1,176 @@
+//Example: https://github.com/tomvandig/web-ifc-three/tree/main/examples/jsm
+
+import { IfcAPI } from './ifc/web-ifc-api.js';
+import {
+	FileLoader,
+	Loader,
+	Object3D,
+	Mesh,
+	Color,
+	MeshPhongMaterial,
+	DoubleSide,
+	Matrix4,
+	BufferGeometry,
+	InterleavedBuffer,
+	InterleavedBufferAttribute,
+	BufferAttribute,
+} from '../../../../build/three.module.js';
+
+var ifcAPI = new IfcAPI();
+ifcAPI.Init();
+
+function IFCLoader( manager ) {
+
+	Loader.call( this, manager );
+
+}
+
+IFCLoader.prototype = Object.assign( Object.create( Loader.prototype ), {
+
+	constructor: IFCLoader,
+
+	load: function ( url, onLoad, onProgress, onError ) {
+
+		var scope = this;
+
+		var loader = new FileLoader( scope.manager );
+		loader.setPath( scope.path );
+		loader.setResponseType( 'arraybuffer' );
+		loader.setRequestHeader( scope.requestHeader );
+		loader.setWithCredentials( scope.withCredentials );
+		loader.load(
+			url,
+			function ( buffer ) {
+
+				try {
+
+					onLoad( scope.parse( buffer ) );
+
+				} catch ( e ) {
+
+					if ( onError ) {
+
+						onError( e );
+
+					} else {
+
+						console.error( e );
+
+					}
+
+					scope.manager.itemError( url );
+
+				}
+
+			},
+			onProgress,
+			onError
+		);
+
+	},
+
+	parse: ( function () {
+
+		return function ( buffer ) {
+
+			var data = new Uint8Array( buffer );
+			var modelID = ifcAPI.OpenModel( 'example.ifc', data );
+			return loadAllGeometry( modelID );
+
+			function loadAllGeometry( modelID ) {
+
+				var flatMeshes = getFlatMeshes( modelID );
+				var mainObject = new Object3D();
+				for ( var i = 0; i < flatMeshes.size(); i ++ ) {
+
+					var placedGeometries = flatMeshes.get( i ).geometries;
+					for ( var j = 0; j < placedGeometries.size(); j ++ )
+						mainObject.add( getPlacedGeometry( modelID, placedGeometries.get( j ) ) );
+
+				}
+
+				return mainObject;
+
+			}
+
+			function getFlatMeshes( modelID ) {
+
+				var flatMeshes = ifcAPI.LoadAllGeometry( modelID );
+				return flatMeshes;
+
+			}
+
+			function getPlacedGeometry( modelID, placedGeometry ) {
+
+				var geometry = getBufferGeometry( modelID, placedGeometry );
+				var material = getMeshMaterial( placedGeometry.color );
+				var mesh = new Mesh( geometry, material );
+				mesh.matrix = getMeshMatrix( placedGeometry.flatTransformation );
+				mesh.matrixAutoUpdate = false;
+				return mesh;
+
+			}
+
+			function getBufferGeometry( modelID, placedGeometry ) {
+
+				var geometry = ifcAPI.GetGeometry(
+					modelID,
+					placedGeometry.geometryExpressID
+				);
+				var verts = ifcAPI.GetVertexArray(
+					geometry.GetVertexData(),
+					geometry.GetVertexDataSize()
+				);
+				var indices = ifcAPI.GetIndexArray(
+					geometry.GetIndexData(),
+					geometry.GetIndexDataSize()
+				);
+				var bufferGeometry = ifcGeometryToBuffer( verts, indices );
+				return bufferGeometry;
+
+			}
+
+			function getMeshMaterial( color ) {
+
+				var col = new Color( color.x, color.y, color.z );
+				var material = new MeshPhongMaterial( { color: col, side: DoubleSide } );
+				material.transparent = color.w !== 1;
+				if ( material.transparent ) material.opacity = color.w;
+				return material;
+
+			}
+
+			function getMeshMatrix( matrix ) {
+
+				var mat = new Matrix4();
+				mat.fromArray( matrix );
+				// mat.elements[15 - 3] *= 0.001;
+				// mat.elements[15 - 2] *= 0.001;
+				// mat.elements[15 - 1] *= 0.001;
+				return mat;
+
+			}
+
+			function ifcGeometryToBuffer( vertexData, indexData ) {
+
+				var geometry = new BufferGeometry();
+				var buffer32 = new InterleavedBuffer( vertexData, 6 );
+				geometry.setAttribute(
+					'position',
+					new InterleavedBufferAttribute( buffer32, 3, 0 )
+				);
+				geometry.setAttribute(
+					'normal',
+					new InterleavedBufferAttribute( buffer32, 3, 3 )
+				);
+				geometry.setIndex( new BufferAttribute( indexData, 1 ) );
+				return geometry;
+
+			}
+
+		};
+
+	} )(),
+} );
+
+export { IFCLoader };

examples/jsm/loaders/ifc/IfcLoader.js

@@ -1,145 +0,0 @@
-//Example: https://github.com/tomvandig/web-ifc-three/tree/main/examples/jsm
-
-import { IfcAPI } from "./web-ifc-api.js";
-import {
-	FileLoader,
-	Loader,
-	Object3D,
-	Mesh,
-	Color,
-	MeshPhongMaterial,
-	DoubleSide,
-	Matrix4,
-	BufferGeometry,
-	InterleavedBuffer,
-	InterleavedBufferAttribute,
-	BufferAttribute,
-} from "../../../../build/three.module.js";
-
-var IFCLoader = function (manager) {
-	Loader.call(this, manager);
-};
-
-var ifcAPI = new IfcAPI();
-ifcAPI.Init();
-
-IFCLoader.prototype = Object.assign(Object.create(Loader.prototype), {
-	constructor: IFCLoader,
-
-	setDecoderPath: function (path) {
-		var loader = new FileLoader(this.manager);
-		loader.load(url, ()=>{}, undefined, ()=>{});
-	},
-
-	load: function (url, onLoad, onProgress, onError) {
-		var scope = this;
-
-		var loader = new FileLoader(scope.manager);
-		loader.setPath(scope.path);
-		loader.setResponseType("arraybuffer");
-		loader.setRequestHeader(scope.requestHeader);
-		loader.setWithCredentials(scope.withCredentials);
-		loader.load(
-			url,
-			function (buffer) {
-				try {
-					onLoad(scope.parse(buffer));
-				} catch (e) {
-					if (onError) {
-						onError(e);
-					} else {
-						console.error(e);
-					}
-
-					scope.manager.itemError(url);
-				}
-			},
-			onProgress,
-			onError
-		);
-	},
-
-	parse: (function () {
-		return function (buffer) {
-			var data = new Uint8Array(buffer);
-			var modelID = ifcAPI.OpenModel("example.ifc", data);
-			return loadAllGeometry(modelID);
-
-			function loadAllGeometry(modelID) {
-				var flatMeshes = getFlatMeshes(modelID);
-				var mainObject = new Object3D();
-				for (var i = 0; i < flatMeshes.size(); i++) {
-					var placedGeometries = flatMeshes.get(i).geometries;
-					for (var j = 0; j < placedGeometries.size(); j++)
-						mainObject.add(getPlacedGeometry(modelID, placedGeometries.get(j)));
-				}
-				return mainObject;
-			}
-
-			function getFlatMeshes(modelID) {
-				var flatMeshes = ifcAPI.LoadAllGeometry(modelID);
-				return flatMeshes;
-			}
-
-			function getPlacedGeometry(modelID, placedGeometry) {
-				var geometry = getBufferGeometry(modelID, placedGeometry);
-				var material = getMeshMaterial(placedGeometry.color);
-				var mesh = new Mesh(geometry, material);
-				mesh.matrix = getMeshMatrix(placedGeometry.flatTransformation);
-				mesh.matrixAutoUpdate = false;
-				return mesh;
-			}
-
-			function getBufferGeometry(modelID, placedGeometry) {
-				var geometry = ifcAPI.GetGeometry(
-					modelID,
-					placedGeometry.geometryExpressID
-				);
-				var verts = ifcAPI.GetVertexArray(
-					geometry.GetVertexData(),
-					geometry.GetVertexDataSize()
-				);
-				var indices = ifcAPI.GetIndexArray(
-					geometry.GetIndexData(),
-					geometry.GetIndexDataSize()
-				);
-				var bufferGeometry = ifcGeometryToBuffer(verts, indices);
-				return bufferGeometry;
-			}
-
-			function getMeshMaterial(color) {
-				var col = new Color(color.x, color.y, color.z);
-				var material = new MeshPhongMaterial({ color: col, side: DoubleSide });
-				material.transparent = color.w !== 1;
-				if (material.transparent) material.opacity = color.w;
-				return material;
-			}
-
-			function getMeshMatrix(matrix) {
-				var mat = new Matrix4();
-				mat.fromArray(matrix);
-				// mat.elements[15 - 3] *= 0.001;
-				// mat.elements[15 - 2] *= 0.001;
-				// mat.elements[15 - 1] *= 0.001;
-				return mat;
-			}
-
-			function ifcGeometryToBuffer(vertexData, indexData) {
-				var geometry = new BufferGeometry();
-				var buffer32 = new InterleavedBuffer(vertexData, 6);
-				geometry.setAttribute(
-					"position",
-					new InterleavedBufferAttribute(buffer32, 3, 0)
-				);
-				geometry.setAttribute(
-					"normal",
-					new InterleavedBufferAttribute(buffer32, 3, 3)
-				);
-				geometry.setIndex(new BufferAttribute(indexData, 1));
-				return geometry;
-			}
-		};
-	})(),
-});
-
-export { IFCLoader };

examples/webgl_loader_ifc.html

@@ -15,74 +15,76 @@
 		<div id="info">
 			<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a>
 			-
-			<a href="https://www.buildingsmart.org/standards/bsi-standards/industry-foundation-classes/" target="_blank" rel="noopener"
-				>IFC</a
-			>
+			<a href="https://www.buildingsmart.org/standards/bsi-standards/industry-foundation-classes/" target="_blank" rel="noopener">IFC</a>
 			loader
 		</div>
 
 		<script type="module">
-			import * as THREE from "../build/three.module.js";
-			import { OrbitControls } from "./jsm/controls/OrbitControls.js";
 
-			import { IFCLoader } from "./jsm/loaders/ifc/IFCLoader.js";
+			import * as THREE from '../build/three.module.js';
+			import { OrbitControls } from './jsm/controls/OrbitControls.js';
+
+			import { IFCLoader } from './jsm/loaders/IFCLoader.js';
 
 			//Scene
 			const scene = new THREE.Scene();
-			scene.background = new THREE.Color(0x8cc7de);
+			scene.background = new THREE.Color( 0x8cc7de );
 
 			//Renderer
 			const container = document.querySelector( '#container' );
-			const renderer = new THREE.WebGLRenderer({ antialias: true	});
-			renderer.setSize(window.innerWidth, window.innerHeight);
-			renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
+			const renderer = new THREE.WebGLRenderer( { antialias: true	} );
+			renderer.setSize( window.innerWidth, window.innerHeight );
+			renderer.setPixelRatio( Math.min( window.devicePixelRatio, 2 ) );
+			renderer.setAnimationLoop( animation );
 			container.appendChild( renderer.domElement );
 
 			//Camera
-			const camera = new THREE.PerspectiveCamera(45,window.innerWidth / window.innerHeight,0.1,1000);
-			camera.position.z = -70;
+			const camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 1000 );
+			camera.position.z = - 70;
 			camera.position.y = 25;
 			camera.position.x = 90;
-			camera.lookAt(0,0,0);
-			let controls = new OrbitControls(camera, renderer.domElement);
+			camera.lookAt( 0, 0, 0 );
+			const controls = new OrbitControls( camera, renderer.domElement );
 
 			//Initial cube
 			const geometry = new THREE.BoxGeometry();
-			const material = new THREE.MeshPhongMaterial({ color: 0xffffff });
-			const cube = new THREE.Mesh(geometry, material);
-			scene.add(cube);
+			const material = new THREE.MeshPhongMaterial( { color: 0xffffff } );
+			const cube = new THREE.Mesh( geometry, material );
+			scene.add( cube );
 
 			//Lights
-			const directionalLight1 = new THREE.DirectionalLight(0xffeeff, 0.8);
-			directionalLight1.position.set(1, 1, 1);
-			scene.add(directionalLight1);
-			const directionalLight2 = new THREE.DirectionalLight(0xffffff, 0.8);
-			directionalLight2.position.set(-1, 0.5, -1);
-			scene.add(directionalLight2);
-			const ambientLight = new THREE.AmbientLight(0xffffee, 0.25);
-			scene.add(ambientLight);
+			const directionalLight1 = new THREE.DirectionalLight( 0xffeeff, 0.8 );
+			directionalLight1.position.set( 1, 1, 1 );
+			scene.add( directionalLight1 );
+			const directionalLight2 = new THREE.DirectionalLight( 0xffffff, 0.8 );
+			directionalLight2.position.set( - 1, 0.5, - 1 );
+			scene.add( directionalLight2 );
+			const ambientLight = new THREE.AmbientLight( 0xffffee, 0.25 );
+			scene.add( ambientLight );
 
 			//Window resize support
-			window.addEventListener("resize", () => {
+			window.addEventListener( 'resize', () => {
+
 				camera.aspect = window.innerWidth / window.innerHeight;
 				camera.updateProjectionMatrix();
-				renderer.setSize(window.innerWidth, window.innerHeight);
-			});
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+			} );
 
 			//Setup IFC Loader
 			const ifcLoader = new IFCLoader();
 
 			//Load IFC file
-			ifcLoader.load('models/ifc/rac_advanced_sample_project.ifc', (geometry) => scene.add(geometry));
+			ifcLoader.load( 'models/ifc/rac_advanced_sample_project.ifc', ( geometry ) => scene.add( geometry ) );
 
 			//Animation
-			function AnimationLoop() {
-				requestAnimationFrame(AnimationLoop);
+			function animation() {
+
 				controls.update();
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
+
 			}
 
-			AnimationLoop();
 		</script>
 	</body>
 </html>