Skip to content

Commit 96cc12b

Browse files
agviegasagviegas
committed
feat: more progress on three.js coords
1 parent bfc4868 commit 96cc12b

File tree

5 files changed

+123
-104
lines changed

5 files changed

+123
-104
lines changed

‎packages/clay/src/elements/Walls/SimpleWall/example.ts‎

Lines changed: 41 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,9 @@ const grids = components.get(OBC.Grids);
3030
grids.create(world);
3131

3232
const axis = new THREE.AxesHelper();
33-
axis.material.depthTest = false;
34-
axis.material.transparent = true;
33+
const axisMat = axis.material as THREE.MeshLambertMaterial;
34+
axisMat.depthTest = false;
35+
axisMat.transparent = true;
3536
world.scene.three.add(axis);
3637

3738
const model = new CLAY.Model();
@@ -45,18 +46,36 @@ const simpleWallType = new CLAY.SimpleWallType(model);
4546

4647
const wall1 = simpleWallType.addInstance();
4748
world.scene.three.add(...wall1.meshes);
48-
// wall1.startPoint = new THREE.Vector2(0, 0);
49-
// wall1.endPoint = new THREE.Vector2(1, 0);
49+
wall1.startPoint = new THREE.Vector2(0, 0);
50+
wall1.endPoint = new THREE.Vector2(1, 0);
5051
wall1.update(true);
51-
// wall1.meshes[0].setColorAt(0, new THREE.Color(1, 0, 0));
52+
wall1.meshes[0].setColorAt(0, new THREE.Color(1, 0, 0));
53+
54+
const wall2 = simpleWallType.addInstance();
55+
world.scene.three.add(...wall2.meshes);
56+
wall2.startPoint = new THREE.Vector2(0, 0);
57+
wall2.endPoint = new THREE.Vector2(0, 1);
58+
wall2.update(true);
5259

5360
site.children.add(wall1.attributes.expressID);
61+
site.children.add(wall2.attributes.expressID);
62+
63+
simpleWallType.addCorner({
64+
wall1,
65+
wall2,
66+
to: "interior",
67+
cut: "interior",
68+
cutDirection: "interior",
69+
priority: "start",
70+
});
71+
72+
simpleWallType.updateCorners();
5473

5574
world.camera.controls.fitToSphere(wall1.meshes[0], false);
5675

5776
const simpleOpeningType = new CLAY.SimpleOpeningType(model);
5877
const opening = simpleOpeningType.addInstance();
59-
world.scene.three.add(...opening.meshes);
78+
// world.scene.three.add(...opening.meshes);
6079
console.log(simpleOpeningType);
6180
opening.transformation.position.x += 1;
6281

@@ -90,6 +109,8 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
90109
) => {
91110
wall1.startPoint.x = event.target.value;
92111
wall1.update(true);
112+
simpleWallType.updateCorners();
113+
93114
// simpleWallType.updateCorners();
94115
}}"></bim-number-input>
95116
@@ -98,6 +119,10 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
98119
) => {
99120
wall1.startPoint.y = event.target.value;
100121
wall1.update(true);
122+
simpleWallType.updateCorners();
123+
124+
console.log("hey");
125+
101126
// simpleWallType.updateCorners();
102127
}}"></bim-number-input>
103128
@@ -110,6 +135,8 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
110135
) => {
111136
wall1.endPoint.x = event.target.value;
112137
wall1.update(true);
138+
simpleWallType.updateCorners();
139+
113140
// simpleWallType.updateCorners();
114141
}}"></bim-number-input>
115142
@@ -118,24 +145,29 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
118145
) => {
119146
wall1.endPoint.y = event.target.value;
120147
wall1.update(true);
148+
simpleWallType.updateCorners();
149+
121150
// simpleWallType.updateCorners();
122151
}}"></bim-number-input>
123152
124153
125154
</div>
126155
127-
<bim-number-input slider step="0.05" label="Elevation" value="${wall1.elevation}" @change="${(
156+
<bim-number-input slider step="0.05" label="Elevation" value="${wall1.transformation.position.y}" @change="${(
128157
event: any,
129158
) => {
130159
wall1.transformation.position.y = event.target.value;
131160
wall1.update(true);
161+
simpleWallType.updateCorners();
132162
}}"></bim-number-input>
133163
134164
<bim-number-input slider step="0.01" label="Offset" value="${wall1.offset}" @change="${(
135165
event: any,
136166
) => {
137167
wall1.offset = event.target.value;
138168
wall1.update(true);
169+
simpleWallType.updateCorners();
170+
139171
// simpleWallType.updateCorners();
140172
}}"></bim-number-input>
141173
@@ -152,6 +184,8 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
152184
) => {
153185
wall1.height = event.target.value;
154186
wall1.update(true);
187+
simpleWallType.updateCorners();
188+
155189
// simpleWallType.updateCorners();
156190
}}"></bim-number-input>
157191

‎packages/clay/src/elements/Walls/SimpleWall/index.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,8 @@ export class SimpleWallType extends DynamicClayElementType<SimpleWall> {
3939
this._cornerer.add(config);
4040
}
4141

42-
async updateCorners(ids?: Iterable<number>) {
43-
await this._cornerer.update(ids);
42+
updateCorners(ids?: Iterable<number>) {
43+
this._cornerer.update(ids);
4444
}
4545

4646
protected createElement() {

‎packages/clay/src/elements/Walls/SimpleWall/src/simple-wall-cornerer.ts‎

Lines changed: 67 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -38,19 +38,19 @@ export class SimpleWallCornerer {
3838
corners.set(id2, { ...config, to, priority, offset });
3939
}
4040

41-
async update(ids: Iterable<number> = this.list.keys()) {
41+
update(ids: Iterable<number> = this.list.keys()) {
4242
for (const id of ids) {
4343
const corners = this.list.get(id);
4444
if (!corners) {
4545
continue;
4646
}
4747
for (const [, corner] of corners) {
48-
await this.extend(corner);
48+
this.extend(corner);
4949
}
5050
}
5151
}
5252

53-
async extend(corner: WallCorner) {
53+
extend(corner: WallCorner) {
5454
const { wall1, wall2, to, priority, offset } = corner;
5555
// Strategy: there are 2 cases
5656
// A) Both points of the wall are on one side of this wall
@@ -65,29 +65,16 @@ export class SimpleWallCornerer {
6565
return;
6666
}
6767

68-
const { plane, p1 } = wall1.getPlane(to);
68+
const { plane } = wall1.getPlane(to);
6969
if (plane === null) {
7070
// Malformed wall (e.g. zero length)
7171
return;
7272
}
7373

74-
const currentWallLine = new THREE.Line3(
75-
wall2.startPoint3D,
76-
wall2.endPoint3D,
77-
);
78-
79-
const wallsIntersect = plane.intersectsLine(currentWallLine);
80-
8174
const start = wall2.startPoint3D;
8275
const end = wall2.endPoint3D;
8376

84-
let extendStart = priority === "start";
85-
86-
if (!wallsIntersect) {
87-
const d1 = Math.abs(plane.distanceToPoint(start));
88-
const d2 = Math.abs(plane.distanceToPoint(end));
89-
extendStart = d1 < d2;
90-
}
77+
const extendStart = priority === "start";
9178

9279
const pointToExtend = extendStart ? start : end;
9380
if (plane.distanceToPoint(pointToExtend) === 0) {
@@ -114,68 +101,68 @@ export class SimpleWallCornerer {
114101

115102
const extended = extendStart ? wall2.startPoint : wall2.endPoint;
116103
extended.x = intersection.x;
117-
extended.y = intersection.y;
118-
119-
if (corner.cut && corner.cutDirection) {
120-
if (!corner.halfSpace) {
121-
const halfSpace = new HalfSpace(wall1.model);
122-
corner.halfSpace = halfSpace;
123-
wall2.body.addSubtraction(halfSpace);
124-
}
125-
126-
const halfSpace = corner.halfSpace as HalfSpace;
127-
128-
const temp = new THREE.Mesh(
129-
new THREE.PlaneGeometry(10, 10, 10),
130-
new THREE.MeshLambertMaterial({
131-
color: "blue",
132-
}),
133-
);
134-
135-
const temp2 = new THREE.Object3D();
136-
temp2.position.copy(p1);
137-
const p4 = p1.clone().add(plane.normal);
138-
temp2.lookAt(p4);
139-
140-
temp2.applyMatrix4(new THREE.Matrix4().makeRotationX(-Math.PI / 2));
141-
temp2.applyMatrix4(new THREE.Matrix4().makeRotationY(Math.PI / 2));
142-
temp2.applyMatrix4(new THREE.Matrix4().makeRotationX(Math.PI / 2));
143-
144-
temp.applyMatrix4(temp2.matrix);
145-
146-
// temp.updateMatrix();
147-
148-
const temp3 = new THREE.Object3D();
149-
const transform = wall2.transformation.matrix.clone();
150-
transform.invert();
151-
152-
temp3.applyMatrix4(transform);
153-
temp3.applyMatrix4(new THREE.Matrix4().makeRotationZ(Math.PI / 2));
154-
temp.applyMatrix4(temp3.matrix);
155-
156-
// const temp4 = new THREE.Object3D();
157-
// temp4.position.copy(p1);
158-
// temp4.applyMatrix4(transform);
159-
160-
// const obj = MathUtils.getTempObject3DToDisplayIfcCoords();
161-
// obj.add(temp);
162-
// wall1.meshes[0].parent.add(obj);
163-
164-
// halfSpace.position.copy(temp.position);
165-
// halfSpace.rotation.copy(temp.rotation);
166-
167-
// const transform = wall2.getTransform();
168-
// transform.invert();
169-
// halfSpace.applyTransform(transform);
170-
171-
// halfSpace.rotation.y = Math.PI / 2;
172-
// halfSpace.position.x = 0.25;
173-
174-
halfSpace.transformation.rotation.copy(temp.rotation);
175-
halfSpace.transformation.position.copy(temp.position);
176-
177-
halfSpace.update();
178-
}
104+
extended.y = intersection.z;
105+
106+
// if (corner.cut && corner.cutDirection) {
107+
// if (!corner.halfSpace) {
108+
// const halfSpace = new HalfSpace(wall1.model);
109+
// corner.halfSpace = halfSpace;
110+
// wall2.body.addSubtraction(halfSpace);
111+
// }
112+
//
113+
// const halfSpace = corner.halfSpace as HalfSpace;
114+
//
115+
// const temp = new THREE.Mesh(
116+
// new THREE.PlaneGeometry(10, 10, 10),
117+
// new THREE.MeshLambertMaterial({
118+
// color: "blue",
119+
// }),
120+
// );
121+
//
122+
// const temp2 = new THREE.Object3D();
123+
// temp2.position.copy(p1);
124+
// const p4 = p1.clone().add(plane.normal);
125+
// temp2.lookAt(p4);
126+
//
127+
// temp2.applyMatrix4(new THREE.Matrix4().makeRotationX(-Math.PI / 2));
128+
// temp2.applyMatrix4(new THREE.Matrix4().makeRotationY(Math.PI / 2));
129+
// temp2.applyMatrix4(new THREE.Matrix4().makeRotationX(Math.PI / 2));
130+
//
131+
// temp.applyMatrix4(temp2.matrix);
132+
//
133+
// // temp.updateMatrix();
134+
//
135+
// const temp3 = new THREE.Object3D();
136+
// const transform = wall2.transformation.matrix.clone();
137+
// transform.invert();
138+
//
139+
// temp3.applyMatrix4(transform);
140+
// temp3.applyMatrix4(new THREE.Matrix4().makeRotationZ(Math.PI / 2));
141+
// temp.applyMatrix4(temp3.matrix);
142+
//
143+
// // const temp4 = new THREE.Object3D();
144+
// // temp4.position.copy(p1);
145+
// // temp4.applyMatrix4(transform);
146+
//
147+
// // const obj = MathUtils.getTempObject3DToDisplayIfcCoords();
148+
// // obj.add(temp);
149+
// // wall1.meshes[0].parent.add(obj);
150+
//
151+
// // halfSpace.position.copy(temp.position);
152+
// // halfSpace.rotation.copy(temp.rotation);
153+
//
154+
// // const transform = wall2.getTransform();
155+
// // transform.invert();
156+
// // halfSpace.applyTransform(transform);
157+
//
158+
// // halfSpace.rotation.y = Math.PI / 2;
159+
// // halfSpace.position.x = 0.25;
160+
//
161+
// halfSpace.transformation.rotation.copy(temp.rotation);
162+
// halfSpace.transformation.position.copy(temp.position);
163+
//
164+
// halfSpace.update();
165+
// }
179166

180167
wall2.update(true);
181168
}

‎packages/clay/src/elements/Walls/SimpleWall/src/simple-wall-nester.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ export class SimpleWallNester {
2626
const newPosition = new THREE.Vector3();
2727
wallPlane.projectPoint(element.transformation.position, newPosition);
2828

29-
console.log(newPosition);
3029
element.transformation.position.copy(newPosition);
3130
element.update();
3231

‎packages/clay/src/elements/Walls/SimpleWall/src/simple-wall.ts‎

Lines changed: 13 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -34,16 +34,6 @@ export class SimpleWall extends ClayElement {
3434
return this.startPoint.distanceTo(this.endPoint);
3535
}
3636

37-
get midPoint() {
38-
const start = this.startPoint3D;
39-
const end = this.endPoint3D;
40-
return new THREE.Vector3(
41-
(start.x + end.x) / 2,
42-
(start.y + end.y) / 2,
43-
(start.z + end.z) / 2,
44-
);
45-
}
46-
4737
get direction() {
4838
const vector = new THREE.Vector3();
4939
vector.subVectors(this.endPoint3D, this.startPoint3D);
@@ -98,8 +88,6 @@ export class SimpleWall extends ClayElement {
9888
}
9989

10090
update(updateGeometry = false) {
101-
this._nester.update();
102-
10391
const profile = this.body.profile;
10492
profile.dimension.x = this.length;
10593
profile.dimension.y = this.type.width;
@@ -109,16 +97,27 @@ export class SimpleWall extends ClayElement {
10997
this.body.depth = this.height;
11098
this.body.update();
11199

100+
const start = this.startPoint3D;
101+
const end = this.endPoint3D;
102+
const midPoint = new THREE.Vector3(
103+
(start.x + end.x) / 2,
104+
(start.y + end.y) / 2,
105+
(start.z + end.z) / 2,
106+
);
107+
112108
const dir = this.direction;
113109
this.transformation.rotation.y = Math.atan2(-dir.z, dir.x);
114-
this.transformation.position.copy(this.midPoint);
110+
this.transformation.position.copy(midPoint);
115111

116112
const shape = this.model.get(this.attributes.Representation);
117113
const reps = this.model.get(shape.Representations[0]);
118114
reps.Items = [this.body.attributes];
119115
this.model.set(reps);
120116

121117
this.updateGeometryID();
118+
119+
this._nester.update();
120+
122121
super.update(updateGeometry);
123122
}
124123

@@ -148,7 +147,7 @@ export class SimpleWall extends ClayElement {
148147
const p1 = this.startPoint3D;
149148
const p2 = this.endPoint3D;
150149
const p3 = p1.clone();
151-
p3.z += 1;
150+
p3.y += 1;
152151

153152
if (p1.equals(p2)) {
154153
// Zero length wall

0 commit comments

Comments
 (0)