Some refactoring; add @thatopen/components-front
This commit is contained in:
parent
a9896ad8ce
commit
b62a8fe579
84
bim.js
Normal file
84
bim.js
Normal file
@ -0,0 +1,84 @@
|
||||
import * as THREE from 'three';
|
||||
import * as OBC from 'openbim-components';
|
||||
import * as WEBIFC from 'web-ifc';
|
||||
|
||||
/**
|
||||
* @namespace BIM
|
||||
*/
|
||||
const BIM = {};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {HTMLElement} container The scene container element
|
||||
* @returns {object} {components, world}
|
||||
*/
|
||||
BIM.init = function (container) {
|
||||
const components = new OBC.Components();
|
||||
const worlds = components.get(OBC.Worlds);
|
||||
|
||||
const world = worlds.create();
|
||||
|
||||
world.scene = new OBC.SimpleScene(components);
|
||||
world.renderer = new OBC.SimpleRenderer(components, container);
|
||||
world.camera = new OBC.SimpleCamera(components);
|
||||
|
||||
// Starts the app and updates components at 60 fps
|
||||
components.init();
|
||||
this.world = world;
|
||||
this.components = components;
|
||||
}
|
||||
/**
|
||||
* @param {HTMLElement} container The scene container element
|
||||
* @returns {OBC.Components}
|
||||
*/
|
||||
BIM.createScene = function (container) {
|
||||
this.init(container);
|
||||
this.world.scene.setup();
|
||||
// Add a grid to the scene
|
||||
const grids = this.components.get(OBC.Grids);
|
||||
const grid = grids.create(this.world);
|
||||
// (zoom_level, position)
|
||||
this.world.camera.controls.setLookAt(15, 15, 15, 0, 0, 0);
|
||||
}
|
||||
/**
|
||||
* @todo Serve web-ifc.wasm locally via AJAX
|
||||
* @param {OBC.Components} components
|
||||
* @param {ArrayBuffer} buffer The uploaded IFC file
|
||||
*/
|
||||
BIM.loadIfc = async function (buffer) {
|
||||
const fragments = this.components.get(OBC.FragmentsManager);
|
||||
// Clean memory before uploading new file
|
||||
fragments.dispose();
|
||||
|
||||
const fragmentIfcLoader = this.components.get(OBC.IfcLoader);
|
||||
// NOTE: loads web-ifc WASM from https://unpkg.com/web-ifc@0.0.53/
|
||||
//await fragmentIfcLoader.setup();
|
||||
fragmentIfcLoader.settings.wasm = {
|
||||
path: "./vendor/web-ifc/",
|
||||
absolute: false
|
||||
};
|
||||
// Excludes IFC categories from the fragment
|
||||
const excludedCats = [
|
||||
WEBIFC.IFCTENDONANCHOR,
|
||||
WEBIFC.IFCREINFORCINGBAR,
|
||||
WEBIFC.IFCREINFORCINGELEMENT,
|
||||
];
|
||||
|
||||
for (const cat of excludedCats) {
|
||||
fragmentIfcLoader.settings.excludedCategories.add(cat);
|
||||
}
|
||||
|
||||
fragmentIfcLoader.settings.webIfc.COORDINATE_TO_ORIGIN = true;
|
||||
fragmentIfcLoader.settings.webIfc.OPTIMIZE_PROFILES = true;
|
||||
|
||||
const model = await fragmentIfcLoader.load(buffer);
|
||||
model.name = "Test";
|
||||
this.world.scene.three.add(model);
|
||||
|
||||
// Useful?
|
||||
this.fragments = fragments;
|
||||
|
||||
return model;
|
||||
}
|
||||
|
||||
export default BIM;
|
2
main.js
2
main.js
@ -6,7 +6,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const container = document.querySelector('#scene');
|
||||
|
||||
UI.setScene(container);
|
||||
UI.ifcLoader('ui');
|
||||
UI.ifcLoader();
|
||||
|
||||
// Creates a cube with three.js
|
||||
/*
|
||||
|
@ -1,6 +1,7 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"@thatopen/components": "^2.0.1",
|
||||
"@thatopen/components-front": "^2.0.2",
|
||||
"@thatopen/fragments": "^2.0.0",
|
||||
"lit": "^3.1.3",
|
||||
"three": "^0.164.1",
|
||||
|
91
ui.js
91
ui.js
@ -1,105 +1,26 @@
|
||||
'use strict';
|
||||
|
||||
import * as THREE from 'three';
|
||||
import * as OBC from 'openbim-components';
|
||||
import * as WEBIFC from 'web-ifc';
|
||||
|
||||
/**
|
||||
* @namespace Actions
|
||||
*/
|
||||
const Actions = {};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {HTMLElement} container The scene container element
|
||||
* @returns {object} {components, world}
|
||||
*/
|
||||
Actions.init = function (container) {
|
||||
const components = new OBC.Components();
|
||||
const worlds = components.get(OBC.Worlds);
|
||||
|
||||
const world = worlds.create();
|
||||
|
||||
world.scene = new OBC.SimpleScene(components);
|
||||
world.renderer = new OBC.SimpleRenderer(components, container);
|
||||
world.camera = new OBC.SimpleCamera(components);
|
||||
|
||||
// Starts the app and updates components at 60 fps
|
||||
components.init();
|
||||
this.world = world;
|
||||
this.components = components;
|
||||
}
|
||||
/**
|
||||
* @param {HTMLElement} container The scene container element
|
||||
* @returns {OBC.Components}
|
||||
*/
|
||||
Actions.createScene = function (container) {
|
||||
this.init(container);
|
||||
this.world.scene.setup();
|
||||
// Add a grid to the scene
|
||||
const grids = this.components.get(OBC.Grids);
|
||||
const grid = grids.create(this.world);
|
||||
// (zoom_level, position)
|
||||
this.world.camera.controls.setLookAt(15, 15, 15, 0, 0, 0);
|
||||
}
|
||||
/**
|
||||
* @todo Serve web-ifc.wasm locally via AJAX
|
||||
* @param {OBC.Components} components
|
||||
* @param {ArrayBuffer} buffer The uploaded IFC file
|
||||
*/
|
||||
Actions.loadIfc = async function (buffer) {
|
||||
const fragments = this.components.get(OBC.FragmentsManager);
|
||||
// Clean memory before uploading new file
|
||||
fragments.dispose();
|
||||
|
||||
const fragmentIfcLoader = this.components.get(OBC.IfcLoader);
|
||||
// NOTE: loads web-ifc WASM from https://unpkg.com/web-ifc@0.0.53/
|
||||
//await fragmentIfcLoader.setup();
|
||||
fragmentIfcLoader.settings.wasm = {
|
||||
path: "./vendor/web-ifc/",
|
||||
absolute: false
|
||||
};
|
||||
// Excludes IFC categories from the fragment
|
||||
const excludedCats = [
|
||||
WEBIFC.IFCTENDONANCHOR,
|
||||
WEBIFC.IFCREINFORCINGBAR,
|
||||
WEBIFC.IFCREINFORCINGELEMENT,
|
||||
];
|
||||
|
||||
for (const cat of excludedCats) {
|
||||
fragmentIfcLoader.settings.excludedCategories.add(cat);
|
||||
}
|
||||
|
||||
fragmentIfcLoader.settings.webIfc.COORDINATE_TO_ORIGIN = true;
|
||||
fragmentIfcLoader.settings.webIfc.OPTIMIZE_PROFILES = true;
|
||||
|
||||
const model = await fragmentIfcLoader.load(buffer);
|
||||
model.name = "Test";
|
||||
this.world.scene.three.add(model);
|
||||
|
||||
return fragments;
|
||||
}
|
||||
import BIM from './bim.js';
|
||||
|
||||
/**
|
||||
* @namespace UI
|
||||
*/
|
||||
const UI = {};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {HTMLElement} container The scene container element
|
||||
*/
|
||||
UI.setScene = function (container) {
|
||||
Actions.createScene(container);
|
||||
BIM.createScene(container);
|
||||
}
|
||||
/**
|
||||
* @param {string} uiContainer The UI div's id
|
||||
* @param {string} btnId The loading button's id
|
||||
*/
|
||||
UI.ifcLoader = function () {
|
||||
const loadBtn = document.querySelector(`#load-ifc`);
|
||||
UI.ifcLoader = function (btnId = 'load-ifc') {
|
||||
const loadBtn = document.querySelector(`#${btnId}`);
|
||||
loadBtn.onchange = async function () {
|
||||
const files = this.files;
|
||||
Actions.loadIfc(new Uint8Array(await files[0].arrayBuffer()));
|
||||
BIM.loadIfc(new Uint8Array(await files[0].arrayBuffer()));
|
||||
}
|
||||
};
|
||||
|
||||
|
34
yarn.lock
34
yarn.lock
@ -14,7 +14,19 @@
|
||||
dependencies:
|
||||
"@lit-labs/ssr-dom-shim" "^1.2.0"
|
||||
|
||||
"@thatopen/components@^2.0.1":
|
||||
"@thatopen/components-front@^2.0.2":
|
||||
version "2.0.2"
|
||||
resolved "https://registry.yarnpkg.com/@thatopen/components-front/-/components-front-2.0.2.tgz#c1f41b37b5f992615ee3e0ec851a6faad6db192e"
|
||||
integrity sha512-O3zVhMchlY0hI6VGmeeawCKS7pISEvkzDWyGNYlejPbjf7kPi0l1adsxwQDW4wVBl53rpBqjsBtBAC+s421F6g==
|
||||
dependencies:
|
||||
"@thatopen/components" "2.0.1"
|
||||
camera-controls "2.7.3"
|
||||
dexie "^4.0.4"
|
||||
earcut "^2.2.4"
|
||||
n8ao "1.5.1"
|
||||
postprocessing "6.34.2"
|
||||
|
||||
"@thatopen/components@2.0.1", "@thatopen/components@^2.0.1":
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/@thatopen/components/-/components-2.0.1.tgz#b172057612263ee819ec546071b6d4b153685377"
|
||||
integrity sha512-Nz+vRM24HucIQ3Sl1gD1r3nsNIg9JG19p0bAC6Gz/lhYEg8tjLXRFrKRIu7agiNpJlRGw0jfSm1xBxmmzmFfOw==
|
||||
@ -40,6 +52,16 @@ camera-controls@2.7.3:
|
||||
resolved "https://registry.yarnpkg.com/camera-controls/-/camera-controls-2.7.3.tgz#99e0449f68d203bf5f98f6c4ac0021c10b5c13a8"
|
||||
integrity sha512-L4mxjBd3u8qiOLozdWrH2P8ZybSsDXBF7iyNyqNEFJhPUkovmuARWR8JTc1B/qlclOIg6FvZZA/0uAZMMim0mw==
|
||||
|
||||
dexie@^4.0.4:
|
||||
version "4.0.7"
|
||||
resolved "https://registry.yarnpkg.com/dexie/-/dexie-4.0.7.tgz#c92e5032245fc075de58c636238a82ee3ff9fedb"
|
||||
integrity sha512-M+Lo6rk4pekIfrc2T0o2tvVJwL6EAAM/B78DNfb8aaxFVoI1f8/rz5KTxuAnApkwqTSuxx7T5t0RKH7qprapGg==
|
||||
|
||||
earcut@^2.2.4:
|
||||
version "2.2.4"
|
||||
resolved "https://registry.yarnpkg.com/earcut/-/earcut-2.2.4.tgz#6d02fd4d68160c114825d06890a92ecaae60343a"
|
||||
integrity sha512-/pjZsA1b4RPHbeWZQn66SWS8nZZWLQQ23oE3Eam7aroEFGEvwKAsJfZ9ytiEMycfzXWpca4FA9QIOehf7PocBQ==
|
||||
|
||||
flatbuffers@23.3.3:
|
||||
version "23.3.3"
|
||||
resolved "https://registry.yarnpkg.com/flatbuffers/-/flatbuffers-23.3.3.tgz#23654ba7a98d4b866a977ae668fe4f8969f34a66"
|
||||
@ -70,6 +92,16 @@ lit@^3.1.3:
|
||||
lit-element "^4.0.4"
|
||||
lit-html "^3.1.2"
|
||||
|
||||
n8ao@1.5.1:
|
||||
version "1.5.1"
|
||||
resolved "https://registry.yarnpkg.com/n8ao/-/n8ao-1.5.1.tgz#e48960352e9c358955d7da072a341bbc64961bb5"
|
||||
integrity sha512-Dn5o6ecmLC1xZm2mby2qdGYgwKcNsC9oKv85TQBKFbDJVzUHGXV2oys14rDl6nhwjH+zZU3YcLJkMcY7qe+jTg==
|
||||
|
||||
postprocessing@6.34.2:
|
||||
version "6.34.2"
|
||||
resolved "https://registry.yarnpkg.com/postprocessing/-/postprocessing-6.34.2.tgz#49258c2e9549828f1351bf0084623cbc92007f81"
|
||||
integrity sha512-EQWCbeRdlfIO4WMkQCYW0rfFYaSvrU9hKxZKyhtuY0RrTM2eTNVpSyj7cUKEYG7pD1qjh8Nkj1qhxj1GdIBuXw==
|
||||
|
||||
three-mesh-bvh@0.7.0:
|
||||
version "0.7.0"
|
||||
resolved "https://registry.yarnpkg.com/three-mesh-bvh/-/three-mesh-bvh-0.7.0.tgz#8327c3483060bb7fe3e0151d7863d338095527d4"
|
||||
|
Loading…
Reference in New Issue
Block a user