Skip to content

Commit 56a2b4b

Browse files
agviegasagviegas
committed
Merge branch 'restructure-project'
2 parents f19cdae + b9545fd commit 56a2b4b

38 files changed

+906
-807
lines changed

‎examples/simple-html/index.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,15 @@
44
<meta charset="UTF-8" />
55
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
66
<link rel="icon" type="image/png" href="./favicon.ico" />
7-
<link rel="preconnect" href="https://fonts.gstatic.com">
8-
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
7+
<link rel="preconnect" href="https://fonts.gstatic.com" />
8+
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet" />
99
<link rel="stylesheet" type="text/css" href="./styles.css" />
1010
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
1111
<title>IFC.js</title>
1212
</head>
1313
<body>
1414
<aside class="side-menu" id="side-menu-left"></aside>
15-
<canvas id="viewer-container" style='width: 100vw; height: 100vh'></canvas>
15+
<div id="viewer-container" style="width: 100vw; height: 100vh"></div>
1616
<script type="module" src="./build/main.js"></script>
1717
</body>
1818
</html>

‎examples/simple-html/main.js‎

Lines changed: 19 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,12 @@
1-
import { Axes, ClippingComponent, DropboxAPI, Edges, Grid, Viewer } from 'web-ifc-viewer';
1+
import {IfcViewerAPI } from 'web-ifc-viewer';
22
import { createSideMenuButton } from './utils/gui-creator';
33

44
const container = document.getElementById("viewer-container");
5-
const viewer = new Viewer(container);
5+
const viewer = new IfcViewerAPI({container});
6+
viewer.addAxes();
7+
viewer.addGrid();
68
viewer.setWasmPath("wasm/");
7-
const grid = new Grid(viewer, 100, 100);
8-
const axes = new Axes(viewer);
9-
const clippingComponent = new ClippingComponent(viewer);
10-
const dropBoxAPI = new DropboxAPI(viewer);
11-
12-
const edges = new Edges(viewer);
9+
// const edges = new Edges(viewer);
1310

1411
//Setup loader
1512
const loadIfc = async (event) => {
@@ -22,8 +19,13 @@ inputElement.classList.add('hidden');
2219
inputElement.addEventListener('change', loadIfc, false);
2320
document.body.appendChild(inputElement);
2421

25-
window.onmousemove = viewer.preselect;
26-
window.ondblclick = viewer.select;
22+
const handleKeyDown = (event) => {
23+
viewer.removeClippingPlane();
24+
};
25+
26+
window.onmousemove = viewer.preselectIfcItem;
27+
window.onkeydown = handleKeyDown;
28+
window.ondblclick = viewer.addClippingPlane;
2729

2830
//Setup UI
2931
const loadButton = createSideMenuButton('./resources/folder-icon.svg');
@@ -35,17 +37,17 @@ const loadButton = createSideMenuButton('./resources/folder-icon.svg');
3537
const sectionButton = createSideMenuButton('./resources/section-plane-down.svg');
3638
sectionButton.addEventListener('click', () => {
3739
sectionButton.blur();
38-
clippingComponent.active = !clippingComponent.active;
40+
viewer.toggleClippingPlanes();
3941
});
4042

41-
const edgesButton = createSideMenuButton('./resources/wireframe-cube.svg');
42-
edgesButton.addEventListener('click', () => {
43-
edgesButton.blur();
44-
edges.active ? edges.deactivateEdgeDisplay() : edges.activateEdgeDisplay();
45-
});
43+
// const edgesButton = createSideMenuButton('./resources/wireframe-cube.svg');
44+
// edgesButton.addEventListener('click', () => {
45+
// edgesButton.blur();
46+
// edges.active ? edges.deactivateEdgeDisplay() : edges.activateEdgeDisplay();
47+
// });
4648

4749
const dropBoxButton = createSideMenuButton('./resources/dropbox-icon.svg');
4850
dropBoxButton.addEventListener('click', () => {
4951
dropBoxButton.blur();
50-
dropBoxAPI.loadDropboxIfc();
52+
viewer.openDropboxWindow();
5153
});

‎viewer/.eslintrc.js‎

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ module.exports = {
1010
sourceType: 'module'
1111
},
1212
plugins: ['@typescript-eslint', 'prettier'],
13-
ignorePatterns: ['**/dist/*', '**/node_modules/*'],
13+
ignorePatterns: ['**/dist/*', '**/node_modules/*', '**/*.json'],
1414
rules: {
1515
'prettier/prettier': [
1616
'error',
@@ -19,14 +19,15 @@ module.exports = {
1919
}
2020
],
2121
indent: 'off',
22+
'no-shadow': 'off',
2223
'lines-between-class-members': 'off',
2324
'linebreak-style': 'off',
25+
'arrow-body-style': 'off',
26+
'prefer-destructuring': 'off',
2427
'no-console': 'off',
2528
'no-param-reassign': 'off',
2629
'eol-last': 'off',
27-
'no-unused-vars': ['error', {
28-
argsIgnorePattern: '^_'
29-
}],
30+
'no-unused-vars': 'off',
3031
'class-methods-use-this': 'off',
3132
'import/extensions': [
3233
'error',
@@ -42,14 +43,16 @@ module.exports = {
4243
settings: {
4344
'import/resolver': {
4445
node: {
45-
extensions: ['.js', '.jsx', '.ts', '.tsx', '.d.ts'],
46-
},
47-
},
46+
extensions: ['.js', '.jsx', '.ts', '.tsx', '.d.ts']
47+
}
48+
}
4849
},
49-
overrides: [{
50-
files: ['*.spec.ts'],
51-
env: {
52-
jest: true,
53-
},
54-
}],
55-
};
50+
overrides: [
51+
{
52+
files: ['*.spec.ts'],
53+
env: {
54+
jest: true
55+
}
56+
}
57+
]
58+
};

‎viewer/src/IO/dropbox.ts‎

Lines changed: 0 additions & 57 deletions
This file was deleted.

‎viewer/src/base-types.ts‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import {
2+
Camera,
3+
Color,
4+
Intersection,
5+
Material,
6+
Object3D,
7+
Plane,
8+
Renderer,
9+
Scene,
10+
Vector2
11+
} from 'three';
12+
13+
export interface ViewerOptions {
14+
container: HTMLElement;
15+
preselectMaterial?: Material;
16+
selectMaterial?: Material;
17+
backgroundColor?: Color;
18+
}
19+
20+
interface Component {
21+
update: (_delta: number) => void;
22+
}
23+
24+
export interface Items {
25+
components: Component[];
26+
ifcModels: Object3D[];
27+
}
28+
29+
export interface Context {
30+
items: Items;
31+
options: ViewerOptions;
32+
33+
getScene: () => Scene;
34+
getCamera: () => Camera;
35+
getRenderer: () => Renderer;
36+
getDomElement: () => HTMLElement;
37+
getDimensions: () => Vector2;
38+
getClippingPlanes: () => Plane[];
39+
40+
addComponent: (component: Component) => void;
41+
addClippingPlane: (plane: Plane) => void;
42+
removeClippingPlane: (plane: Plane) => void;
43+
castRay: (items: Object3D[]) => Intersection[];
44+
castRayIfc: () => Intersection;
45+
toggleCameraControls: (active: boolean) => void;
46+
}
47+
48+
export abstract class IfcComponent implements Component {
49+
constructor(context: Context) {
50+
context.addComponent(this);
51+
}
52+
53+
update(_delta: number) {}
54+
}

‎viewer/src/components/axes.ts‎

Lines changed: 0 additions & 15 deletions
This file was deleted.

‎viewer/src/components/component.ts‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

‎viewer/src/components/context/camera.ts‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import { PerspectiveCamera, Vector3 } from 'three';
2+
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
3+
import { IfcComponent, Context } from '../../base-types';
4+
5+
export class IfcCamera extends IfcComponent {
6+
readonly camera: PerspectiveCamera;
7+
private readonly controls: OrbitControls;
8+
private readonly context: Context;
9+
10+
constructor(context: Context) {
11+
super(context);
12+
this.context = context;
13+
14+
const dims = this.context.getDimensions();
15+
this.camera = new PerspectiveCamera(45, dims.x / dims.y, 0.1, 1000);
16+
this.setupCamera();
17+
18+
this.controls = new OrbitControls(this.camera, context.getDomElement());
19+
this.setupControls();
20+
}
21+
22+
update(_delta: number) {
23+
this.controls.update();
24+
}
25+
26+
updateAspect() {
27+
const dims = this.context.getDimensions();
28+
this.camera.aspect = dims.x / dims.y;
29+
this.camera.updateProjectionMatrix();
30+
}
31+
32+
toggleControls(active: boolean) {
33+
this.controls.enabled = active;
34+
}
35+
36+
private setupCamera() {
37+
// camera.up = new Vector3(0, 0, 1);
38+
this.camera.position.z = 8;
39+
this.camera.position.y = 8;
40+
this.camera.position.x = 8;
41+
this.camera.lookAt(new Vector3(0, 0, 0));
42+
}
43+
44+
private setupControls() {
45+
this.controls.enableDamping = true;
46+
this.controls.dampingFactor *= 2;
47+
}
48+
}

0 commit comments

Comments
 (0)