diff --git a/bim.js b/bim.js index 9c1f6ec..c458276 100644 --- a/bim.js +++ b/bim.js @@ -1,5 +1,6 @@ import * as THREE from 'three'; import * as OBC from 'openbim-components'; +import * as OBF from '@thatopen/components-front'; import * as WEBIFC from 'web-ifc'; /** @@ -33,6 +34,7 @@ BIM.init = function (container) { */ BIM.createScene = function (container) { this.init(container); + this.world.scene.setup(); // Add a grid to the scene const grids = this.components.get(OBC.Grids); @@ -44,6 +46,7 @@ BIM.createScene = function (container) { * @todo Serve web-ifc.wasm locally via AJAX * @param {OBC.Components} components * @param {ArrayBuffer} buffer The uploaded IFC file + * @returns {OBC.FragmentsGroup} model */ BIM.loadIfc = async function (buffer) { const fragments = this.components.get(OBC.FragmentsManager); @@ -81,4 +84,20 @@ BIM.loadIfc = async function (buffer) { return model; } +/** + * @param {OBC.FragmentsGroup} model The loaded IFC model + */ +BIM.setupHighligther = async function (model) { + const world = this.world; + const indexer = this.components.get(OBC.IfcRelationsIndexer); + await indexer.process(model); + + const highlighter = this.components.get(OBF.Highlighter); + highlighter.setup({ world }); + + highlighter.events.select.onHighlight.add((property) => { + console.log(property); + }); +} + export default BIM; \ No newline at end of file diff --git a/index.html b/index.html index fa10917..c2dc6a5 100644 --- a/index.html +++ b/index.html @@ -12,6 +12,7 @@ "@thatopen/fragments": "./vendor/@thatopen/fragments/dist/index.mjs", "web-ifc": "./vendor/web-ifc/web-ifc-api.js", "openbim-components": "./vendor/@thatopen/components/dist/index.mjs", + "@thatopen/components-front": "./vendor/@thatopen/components-front/dist/index.js", "lit": "./vendor/@lit-labs/ssr-dom-shim/index.js" } } @@ -21,12 +22,12 @@ diff --git a/main.js b/main.js index f020ada..7daf832 100644 --- a/main.js +++ b/main.js @@ -4,5 +4,5 @@ import UI from './ui.js'; document.addEventListener('DOMContentLoaded', () => { UI.setScene(document.querySelector('#scene')); - UI.ifcLoader(); + const model = UI.ifcLoader(); }); \ No newline at end of file diff --git a/ui.js b/ui.js index 22ca43a..a769634 100644 --- a/ui.js +++ b/ui.js @@ -14,14 +14,20 @@ UI.setScene = function (container) { BIM.createScene(container); } /** + * Returns the loaded model * @param {string} btnId The loading button's id */ UI.ifcLoader = function (btnId = 'load-ifc') { const loadBtn = document.querySelector(`#${btnId}`); + let model = null; loadBtn.onchange = async function () { const files = this.files; - BIM.loadIfc(new Uint8Array(await files[0].arrayBuffer())); + model = await BIM.loadIfc(new Uint8Array(await files[0].arrayBuffer())); + // Set a raycaster to select objects + BIM.setupHighligther(model); } + + return model; }; export default UI; \ No newline at end of file