simulationjsv2 0.5.2 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/TODO.md +11 -3
- package/dist/constants.d.ts +9 -4
- package/dist/constants.js +10 -4
- package/dist/geometry.d.ts +15 -9
- package/dist/geometry.js +54 -25
- package/dist/graphics.d.ts +30 -42
- package/dist/graphics.js +144 -198
- package/dist/internalUtils.d.ts +9 -6
- package/dist/internalUtils.js +61 -24
- package/dist/simulation.d.ts +15 -6
- package/dist/simulation.js +152 -188
- package/dist/types.d.ts +9 -13
- package/dist/utils.d.ts +1 -0
- package/dist/utils.js +6 -2
- package/package.json +1 -1
package/dist/graphics.js
CHANGED
|
@@ -1,22 +1,51 @@
|
|
|
1
1
|
import { vec3, mat4, vec2, vec4 } from 'wgpu-matrix';
|
|
2
2
|
import { Vertex, cloneBuf, color, colorFromVector4, vector2, vector3, vertex, Color, transitionValues, vector2FromVector3, matrix4, vector3FromVector2, distance2d } from './utils.js';
|
|
3
3
|
import { BlankGeometry, CircleGeometry, CubeGeometry, Line2dGeometry, Line3dGeometry, PlaneGeometry, PolygonGeometry, Spline2dGeometry, SquareGeometry } from './geometry.js';
|
|
4
|
-
import { VertexCache, bufferGenerator, logger, rotateMat4,
|
|
4
|
+
import { VertexCache, bufferGenerator, logger, rotateMat4, vector3ToPixelRatio } from './internalUtils.js';
|
|
5
|
+
import { modelProjMatOffset } from './constants.js';
|
|
5
6
|
export class SimulationElement {
|
|
7
|
+
pos;
|
|
6
8
|
color;
|
|
7
9
|
wireframe;
|
|
8
10
|
vertexCache;
|
|
9
11
|
rotation;
|
|
12
|
+
modelMatrix;
|
|
13
|
+
uniformBuffer;
|
|
10
14
|
isInstanced;
|
|
11
15
|
/**
|
|
12
16
|
* @param pos - Expected to be adjusted to devicePixelRatio before reaching constructor
|
|
13
17
|
*/
|
|
14
|
-
constructor(color = new Color()
|
|
18
|
+
constructor(pos, rotation, color = new Color()) {
|
|
19
|
+
this.pos = pos;
|
|
15
20
|
this.color = color;
|
|
16
21
|
this.vertexCache = new VertexCache();
|
|
17
22
|
this.wireframe = false;
|
|
18
|
-
this.rotation = rotation;
|
|
19
23
|
this.isInstanced = false;
|
|
24
|
+
this.rotation = rotation;
|
|
25
|
+
this.uniformBuffer = null;
|
|
26
|
+
this.modelMatrix = matrix4();
|
|
27
|
+
}
|
|
28
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
29
|
+
getModelMatrix(_) {
|
|
30
|
+
return this.modelMatrix;
|
|
31
|
+
}
|
|
32
|
+
getUniformBuffer(device, mat) {
|
|
33
|
+
if (!this.uniformBuffer) {
|
|
34
|
+
const uniformBufferSize = 4 * 16 + 4 * 16 + 4 * 2 + 8; // 4x4 matrix + 4x4 matrix + vec2<f32> + 8 bc 144 is cool
|
|
35
|
+
this.uniformBuffer = device.createBuffer({
|
|
36
|
+
size: uniformBufferSize,
|
|
37
|
+
usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
device.queue.writeBuffer(this.uniformBuffer, modelProjMatOffset, mat);
|
|
41
|
+
return this.uniformBuffer;
|
|
42
|
+
}
|
|
43
|
+
updateModelMatrix3d() {
|
|
44
|
+
mat4.identity(this.modelMatrix);
|
|
45
|
+
mat4.translate(this.modelMatrix, this.pos, this.modelMatrix);
|
|
46
|
+
mat4.rotateZ(this.modelMatrix, this.rotation[2], this.modelMatrix);
|
|
47
|
+
mat4.rotateY(this.modelMatrix, this.rotation[1], this.modelMatrix);
|
|
48
|
+
mat4.rotateX(this.modelMatrix, this.rotation[0], this.modelMatrix);
|
|
20
49
|
}
|
|
21
50
|
getGeometryType() {
|
|
22
51
|
return this.geometry.getType();
|
|
@@ -50,6 +79,62 @@ export class SimulationElement {
|
|
|
50
79
|
this.vertexCache.updated();
|
|
51
80
|
}, t, f);
|
|
52
81
|
}
|
|
82
|
+
move(amount, t = 0, f) {
|
|
83
|
+
const tempAmount = cloneBuf(amount);
|
|
84
|
+
vector3ToPixelRatio(tempAmount);
|
|
85
|
+
const finalPos = cloneBuf(this.pos);
|
|
86
|
+
vec3.add(finalPos, tempAmount, finalPos);
|
|
87
|
+
return transitionValues((p) => {
|
|
88
|
+
this.pos[0] += tempAmount[0] * p;
|
|
89
|
+
this.pos[1] += tempAmount[1] * p;
|
|
90
|
+
this.pos[2] += tempAmount[2] * p;
|
|
91
|
+
this.updateModelMatrix3d();
|
|
92
|
+
}, () => {
|
|
93
|
+
this.pos = finalPos;
|
|
94
|
+
this.updateModelMatrix3d();
|
|
95
|
+
}, t, f);
|
|
96
|
+
}
|
|
97
|
+
moveTo(pos, t = 0, f) {
|
|
98
|
+
const tempPos = cloneBuf(pos);
|
|
99
|
+
vector3ToPixelRatio(tempPos);
|
|
100
|
+
const diff = vector3();
|
|
101
|
+
vec3.sub(tempPos, this.pos, diff);
|
|
102
|
+
return transitionValues((p) => {
|
|
103
|
+
this.pos[0] += diff[0] * p;
|
|
104
|
+
this.pos[1] += diff[1] * p;
|
|
105
|
+
this.pos[2] += diff[2] * p;
|
|
106
|
+
this.updateModelMatrix3d();
|
|
107
|
+
}, () => {
|
|
108
|
+
this.pos = tempPos;
|
|
109
|
+
this.updateModelMatrix3d();
|
|
110
|
+
}, t, f);
|
|
111
|
+
}
|
|
112
|
+
rotate(amount, t = 0, f) {
|
|
113
|
+
const tempAmount = cloneBuf(amount);
|
|
114
|
+
const finalRotation = cloneBuf(amount);
|
|
115
|
+
vec3.add(finalRotation, this.rotation, finalRotation);
|
|
116
|
+
return transitionValues((p) => {
|
|
117
|
+
this.rotation[0] += tempAmount[0] * p;
|
|
118
|
+
this.rotation[1] += tempAmount[1] * p;
|
|
119
|
+
this.rotation[2] += tempAmount[2] * p;
|
|
120
|
+
this.updateModelMatrix3d();
|
|
121
|
+
}, () => {
|
|
122
|
+
this.rotation = finalRotation;
|
|
123
|
+
this.updateModelMatrix3d();
|
|
124
|
+
}, t, f);
|
|
125
|
+
}
|
|
126
|
+
rotateTo(rot, t = 0, f) {
|
|
127
|
+
const diff = vec3.sub(rot, this.rotation);
|
|
128
|
+
return transitionValues((p) => {
|
|
129
|
+
this.rotation[0] += diff[0] * p;
|
|
130
|
+
this.rotation[1] += diff[1] * p;
|
|
131
|
+
this.rotation[2] += diff[2] * p;
|
|
132
|
+
this.updateModelMatrix3d();
|
|
133
|
+
}, () => {
|
|
134
|
+
this.rotation = cloneBuf(rot);
|
|
135
|
+
this.updateModelMatrix3d();
|
|
136
|
+
}, t, f);
|
|
137
|
+
}
|
|
53
138
|
getVertexCount() {
|
|
54
139
|
if (this.vertexCache.shouldUpdate()) {
|
|
55
140
|
this.geometry.recompute();
|
|
@@ -59,25 +144,14 @@ export class SimulationElement {
|
|
|
59
144
|
}
|
|
60
145
|
return this.geometry.getTriangleVertexCount();
|
|
61
146
|
}
|
|
62
|
-
|
|
147
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
148
|
+
defaultUpdateMatrix(_) {
|
|
63
149
|
const matrix = matrix4();
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
pos[1] = camera.getScreenSize()[1] + pos[1];
|
|
67
|
-
mat4.translate(matrix, pos, matrix);
|
|
68
|
-
mat4.rotateZ(matrix, this.rotation, matrix);
|
|
69
|
-
}
|
|
70
|
-
else {
|
|
71
|
-
mat4.translate(matrix, this.pos, matrix);
|
|
72
|
-
rotateMat4(matrix, this.rotation);
|
|
73
|
-
}
|
|
74
|
-
this.geometry.updateMatrix(matrix);
|
|
150
|
+
mat4.translate(matrix, this.pos, matrix);
|
|
151
|
+
rotateMat4(matrix, this.rotation);
|
|
75
152
|
}
|
|
76
|
-
getBuffer(
|
|
77
|
-
|
|
78
|
-
const reEvalExtender = shouldEvalExtender === undefined ? true : shouldEvalExtender;
|
|
79
|
-
if (this.vertexCache.shouldUpdate() || camera.hasUpdated() || reEvalExtender) {
|
|
80
|
-
this.updateMatrix(camera);
|
|
153
|
+
getBuffer(vertexParamGenerator) {
|
|
154
|
+
if (this.vertexCache.shouldUpdate()) {
|
|
81
155
|
this.geometry.recompute();
|
|
82
156
|
if (this.isInstanced) {
|
|
83
157
|
bufferGenerator.setInstancing(true);
|
|
@@ -101,119 +175,33 @@ export class SimulationElement3d extends SimulationElement {
|
|
|
101
175
|
rotation;
|
|
102
176
|
is3d = true;
|
|
103
177
|
constructor(pos, rotation = vector3(), color) {
|
|
104
|
-
super(
|
|
178
|
+
super(pos, rotation, color);
|
|
105
179
|
this.pos = pos;
|
|
106
180
|
vector3ToPixelRatio(this.pos);
|
|
107
181
|
this.rotation = rotation;
|
|
108
182
|
}
|
|
109
|
-
rotate(amount, t = 0, f) {
|
|
110
|
-
const finalRotation = cloneBuf(this.rotation);
|
|
111
|
-
vec3.add(finalRotation, amount, finalRotation);
|
|
112
|
-
return transitionValues((p) => {
|
|
113
|
-
this.rotation[0] += amount[0] * p;
|
|
114
|
-
this.rotation[1] += amount[1] * p;
|
|
115
|
-
this.rotation[2] += amount[2] * p;
|
|
116
|
-
this.vertexCache.updated();
|
|
117
|
-
}, () => {
|
|
118
|
-
this.rotation = finalRotation;
|
|
119
|
-
this.vertexCache.updated();
|
|
120
|
-
}, t, f);
|
|
121
|
-
}
|
|
122
|
-
rotateTo(rot, t = 0, f) {
|
|
123
|
-
const diff = vector3();
|
|
124
|
-
vec3.sub(rot, this.rotation, diff);
|
|
125
|
-
return transitionValues((p) => {
|
|
126
|
-
this.rotation[0] += diff[0] * p;
|
|
127
|
-
this.rotation[1] += diff[1] * p;
|
|
128
|
-
this.rotation[2] += diff[2] * p;
|
|
129
|
-
this.vertexCache.updated();
|
|
130
|
-
}, () => {
|
|
131
|
-
this.rotation = rot;
|
|
132
|
-
this.vertexCache.updated();
|
|
133
|
-
}, t, f);
|
|
134
|
-
}
|
|
135
|
-
move(amount, t = 0, f) {
|
|
136
|
-
const finalPos = cloneBuf(this.pos);
|
|
137
|
-
vec3.add(finalPos, amount, finalPos);
|
|
138
|
-
return transitionValues((p) => {
|
|
139
|
-
this.pos[0] += amount[0] * p;
|
|
140
|
-
this.pos[1] += amount[1] * p;
|
|
141
|
-
this.pos[2] += amount[2] * p;
|
|
142
|
-
this.vertexCache.updated();
|
|
143
|
-
}, () => {
|
|
144
|
-
this.pos = finalPos;
|
|
145
|
-
this.vertexCache.updated();
|
|
146
|
-
}, t, f);
|
|
147
|
-
}
|
|
148
|
-
moveTo(pos, t = 0, f) {
|
|
149
|
-
const diff = vector3();
|
|
150
|
-
vec3.sub(pos, this.pos, diff);
|
|
151
|
-
return transitionValues((p) => {
|
|
152
|
-
this.pos[0] += diff[0] * p;
|
|
153
|
-
this.pos[1] += diff[1] * p;
|
|
154
|
-
this.pos[2] += diff[2] * p;
|
|
155
|
-
this.vertexCache.updated();
|
|
156
|
-
}, () => {
|
|
157
|
-
this.pos = pos;
|
|
158
|
-
this.vertexCache.updated();
|
|
159
|
-
}, t, f);
|
|
160
|
-
}
|
|
161
183
|
}
|
|
162
184
|
export class SimulationElement2d extends SimulationElement {
|
|
163
|
-
pos
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
super(color, rotation);
|
|
167
|
-
this.pos = pos;
|
|
168
|
-
this.rotation = rotation;
|
|
185
|
+
constructor(pos, rotation = vector3(), color) {
|
|
186
|
+
super(vector3FromVector2(pos), rotation, color);
|
|
187
|
+
vector3ToPixelRatio(this.pos);
|
|
169
188
|
}
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
return transitionValues((p) => {
|
|
173
|
-
this.rotation += rotation * p;
|
|
174
|
-
this.vertexCache.updated();
|
|
175
|
-
}, () => {
|
|
176
|
-
this.rotation = finalRotation;
|
|
177
|
-
this.vertexCache.updated();
|
|
178
|
-
}, t, f);
|
|
189
|
+
rotate2d(amount, t = 0, f) {
|
|
190
|
+
return super.rotate(vector3(0, 0, amount), t, f);
|
|
179
191
|
}
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
return transitionValues((p) => {
|
|
183
|
-
this.rotation += diff * p;
|
|
184
|
-
this.vertexCache.updated();
|
|
185
|
-
}, () => {
|
|
186
|
-
this.rotation = newRotation;
|
|
187
|
-
this.vertexCache.updated();
|
|
188
|
-
}, t, f);
|
|
192
|
+
rotateTo2d(rot, t = 0, f) {
|
|
193
|
+
return super.rotateTo(vector3(0, 0, rot), t, f);
|
|
189
194
|
}
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
this.pos[0] += tempAmount[0] * p;
|
|
197
|
-
this.pos[1] += tempAmount[1] * p;
|
|
198
|
-
this.vertexCache.updated();
|
|
199
|
-
}, () => {
|
|
200
|
-
this.pos = finalPos;
|
|
201
|
-
this.vertexCache.updated();
|
|
202
|
-
}, t, f);
|
|
195
|
+
updateModelMatrix2d(camera) {
|
|
196
|
+
mat4.identity(this.modelMatrix);
|
|
197
|
+
const pos = cloneBuf(this.pos);
|
|
198
|
+
pos[1] = camera.getScreenSize()[1] + pos[1];
|
|
199
|
+
mat4.translate(this.modelMatrix, pos, this.modelMatrix);
|
|
200
|
+
mat4.rotateZ(this.modelMatrix, this.rotation[2], this.modelMatrix);
|
|
203
201
|
}
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
const diff = vector2();
|
|
208
|
-
vec2.sub(pos, this.pos, diff);
|
|
209
|
-
return transitionValues((p) => {
|
|
210
|
-
this.pos[0] += diff[0] * p;
|
|
211
|
-
this.pos[1] += diff[1] * p;
|
|
212
|
-
this.vertexCache.updated();
|
|
213
|
-
}, () => {
|
|
214
|
-
this.pos = pos;
|
|
215
|
-
this.vertexCache.updated();
|
|
216
|
-
}, t, f);
|
|
202
|
+
getModelMatrix(camera) {
|
|
203
|
+
this.updateModelMatrix2d(camera);
|
|
204
|
+
return this.modelMatrix;
|
|
217
205
|
}
|
|
218
206
|
}
|
|
219
207
|
export class Plane extends SimulationElement3d {
|
|
@@ -229,9 +217,6 @@ export class Plane extends SimulationElement3d {
|
|
|
229
217
|
this.points = newPoints;
|
|
230
218
|
this.vertexCache.updated();
|
|
231
219
|
}
|
|
232
|
-
updateMatrix(camera) {
|
|
233
|
-
this.defaultUpdateMatrix(camera);
|
|
234
|
-
}
|
|
235
220
|
}
|
|
236
221
|
export class Square extends SimulationElement2d {
|
|
237
222
|
geometry;
|
|
@@ -243,14 +228,23 @@ export class Square extends SimulationElement2d {
|
|
|
243
228
|
* @param vertexColors{Record<number, Color>} - 0 is top left vertex, numbers increase clockwise
|
|
244
229
|
*/
|
|
245
230
|
constructor(pos, width, height, color, rotation, centerOffset, vertexColors) {
|
|
246
|
-
super(pos, rotation, color);
|
|
247
|
-
vector2ToPixelRatio(this.pos);
|
|
231
|
+
super(pos, vector3(0, 0, rotation), color);
|
|
248
232
|
this.width = width * devicePixelRatio;
|
|
249
233
|
this.height = height * devicePixelRatio;
|
|
250
234
|
this.vertexColors = this.cloneColorMap(vertexColors || {});
|
|
251
235
|
this.geometry = new SquareGeometry(this.width, this.height, centerOffset);
|
|
252
236
|
this.geometry.setVertexColorMap(this.vertexColors);
|
|
253
237
|
}
|
|
238
|
+
setOffset(offset) {
|
|
239
|
+
this.geometry.setOffset(offset);
|
|
240
|
+
}
|
|
241
|
+
setOffsetInplace(offset) {
|
|
242
|
+
const diff = vector3FromVector2(offset);
|
|
243
|
+
vec2.sub(diff, this.geometry.getOffset(), diff);
|
|
244
|
+
vec2.mul(diff, vector2(this.width / devicePixelRatio, -this.height / devicePixelRatio), diff);
|
|
245
|
+
this.setOffset(offset);
|
|
246
|
+
this.move(diff);
|
|
247
|
+
}
|
|
254
248
|
cloneColorMap(colorMap) {
|
|
255
249
|
const newColorMap = {};
|
|
256
250
|
Object.entries(colorMap).forEach(([key, value]) => {
|
|
@@ -364,23 +358,14 @@ export class Square extends SimulationElement2d {
|
|
|
364
358
|
this.vertexCache.updated();
|
|
365
359
|
}, t, f);
|
|
366
360
|
}
|
|
367
|
-
updateMatrix(camera) {
|
|
368
|
-
const pos = cloneBuf(this.pos);
|
|
369
|
-
pos[1] = camera.getScreenSize()[1] + pos[1];
|
|
370
|
-
const matrix = matrix4();
|
|
371
|
-
mat4.translate(matrix, vector3FromVector2(pos), matrix);
|
|
372
|
-
mat4.rotateZ(matrix, this.rotation, matrix);
|
|
373
|
-
this.geometry.updateMatrix(matrix);
|
|
374
|
-
}
|
|
375
361
|
}
|
|
376
362
|
export class Circle extends SimulationElement2d {
|
|
377
363
|
geometry;
|
|
378
364
|
radius;
|
|
379
365
|
detail;
|
|
380
366
|
constructor(pos, radius, color, detail = 50) {
|
|
381
|
-
super(pos,
|
|
382
|
-
|
|
383
|
-
this.radius = radius;
|
|
367
|
+
super(pos, vector3(), color);
|
|
368
|
+
this.radius = radius * devicePixelRatio;
|
|
384
369
|
this.detail = detail;
|
|
385
370
|
this.geometry = new CircleGeometry(this.radius, this.detail);
|
|
386
371
|
}
|
|
@@ -410,15 +395,12 @@ export class Circle extends SimulationElement2d {
|
|
|
410
395
|
this.vertexCache.updated();
|
|
411
396
|
}, t, f);
|
|
412
397
|
}
|
|
413
|
-
updateMatrix(camera) {
|
|
414
|
-
this.defaultUpdateMatrix(camera);
|
|
415
|
-
}
|
|
416
398
|
}
|
|
417
399
|
export class Polygon extends SimulationElement2d {
|
|
418
400
|
geometry;
|
|
419
401
|
vertices;
|
|
420
402
|
constructor(pos, points, color, rotation) {
|
|
421
|
-
super(pos, rotation, color);
|
|
403
|
+
super(pos, vector3(0, 0, rotation), color);
|
|
422
404
|
this.vertices = points;
|
|
423
405
|
this.geometry = new PolygonGeometry(this.vertices);
|
|
424
406
|
}
|
|
@@ -492,9 +474,6 @@ export class Polygon extends SimulationElement2d {
|
|
|
492
474
|
this.vertexCache.updated();
|
|
493
475
|
}, t, f);
|
|
494
476
|
}
|
|
495
|
-
updateMatrix(camera) {
|
|
496
|
-
this.defaultUpdateMatrix(camera);
|
|
497
|
-
}
|
|
498
477
|
}
|
|
499
478
|
export class Line3d extends SimulationElement3d {
|
|
500
479
|
geometry;
|
|
@@ -506,7 +485,7 @@ export class Line3d extends SimulationElement3d {
|
|
|
506
485
|
this.to = to.getPos();
|
|
507
486
|
vec3.scale(this.to, devicePixelRatio, this.to);
|
|
508
487
|
vec3.sub(this.to, this.pos, this.to);
|
|
509
|
-
this.geometry = new Line3dGeometry(this.pos, this.to, this.thickness);
|
|
488
|
+
this.geometry = new Line3dGeometry(this.pos, this.to, this.thickness, pos.getColor() || this.getColor(), to.getColor());
|
|
510
489
|
}
|
|
511
490
|
setStart(pos, t = 0, f) {
|
|
512
491
|
return this.moveTo(pos, t, f);
|
|
@@ -526,29 +505,25 @@ export class Line3d extends SimulationElement3d {
|
|
|
526
505
|
this.vertexCache.updated();
|
|
527
506
|
}, t, f);
|
|
528
507
|
}
|
|
529
|
-
updateMatrix(camera) {
|
|
530
|
-
return this.defaultUpdateMatrix(camera);
|
|
531
|
-
}
|
|
532
508
|
}
|
|
533
509
|
export class Line2d extends SimulationElement2d {
|
|
534
510
|
geometry;
|
|
535
511
|
to;
|
|
536
512
|
thickness;
|
|
537
513
|
constructor(from, to, thickness = 1) {
|
|
538
|
-
super(vector2FromVector3(from.getPos()),
|
|
514
|
+
super(vector2FromVector3(from.getPos()), vector3(), from.getColor() || undefined);
|
|
539
515
|
this.thickness = thickness * devicePixelRatio;
|
|
540
|
-
this.to =
|
|
541
|
-
vec2.scale(this.to, devicePixelRatio, this.to);
|
|
516
|
+
this.to = to.getPos();
|
|
542
517
|
vec2.sub(this.to, this.pos, this.to);
|
|
543
|
-
this.geometry = new Line2dGeometry(this.pos, this.to, this.thickness);
|
|
518
|
+
this.geometry = new Line2dGeometry(this.pos, this.to, this.thickness, from.getColor() || this.getColor(), to.getColor());
|
|
544
519
|
}
|
|
545
520
|
setStart(pos, t = 0, f) {
|
|
546
521
|
return this.moveTo(pos, t, f);
|
|
547
522
|
}
|
|
548
523
|
setEnd(pos, t = 0, f) {
|
|
549
524
|
const tempPos = cloneBuf(pos);
|
|
550
|
-
|
|
551
|
-
vec2.sub(tempPos, this.getPos(), tempPos);
|
|
525
|
+
vector3ToPixelRatio(tempPos);
|
|
526
|
+
// vec2.sub(tempPos, this.getPos(), tempPos);
|
|
552
527
|
const diff = vector3();
|
|
553
528
|
vec2.sub(tempPos, this.to, diff);
|
|
554
529
|
return transitionValues((p) => {
|
|
@@ -561,9 +536,6 @@ export class Line2d extends SimulationElement2d {
|
|
|
561
536
|
this.vertexCache.updated();
|
|
562
537
|
}, t, f);
|
|
563
538
|
}
|
|
564
|
-
updateMatrix(camera) {
|
|
565
|
-
return this.defaultUpdateMatrix(camera);
|
|
566
|
-
}
|
|
567
539
|
}
|
|
568
540
|
export class Cube extends SimulationElement3d {
|
|
569
541
|
geometry;
|
|
@@ -642,9 +614,6 @@ export class Cube extends SimulationElement3d {
|
|
|
642
614
|
this.vertexCache.updated();
|
|
643
615
|
}, t, f);
|
|
644
616
|
}
|
|
645
|
-
updateMatrix(camera) {
|
|
646
|
-
this.defaultUpdateMatrix(camera);
|
|
647
|
-
}
|
|
648
617
|
}
|
|
649
618
|
export class BezierCurve2d {
|
|
650
619
|
points;
|
|
@@ -796,8 +765,7 @@ export class Spline2d extends SimulationElement2d {
|
|
|
796
765
|
length;
|
|
797
766
|
constructor(pos, points, thickness = devicePixelRatio, detail = 40) {
|
|
798
767
|
const tempPos = vector2FromVector3(pos.getPos());
|
|
799
|
-
|
|
800
|
-
super(tempPos, 0, pos.getColor() || undefined);
|
|
768
|
+
super(tempPos, vector3(), pos.getColor() || undefined);
|
|
801
769
|
this.thickness = thickness * devicePixelRatio;
|
|
802
770
|
this.detail = detail;
|
|
803
771
|
this.interpolateStart = 0;
|
|
@@ -849,7 +817,7 @@ export class Spline2d extends SimulationElement2d {
|
|
|
849
817
|
const clonePoint = newPoint.clone();
|
|
850
818
|
const start = clonePoint.getStart()?.getPos() || vector3();
|
|
851
819
|
const end = clonePoint.getEnd().getPos();
|
|
852
|
-
const pos =
|
|
820
|
+
const pos = this.getPos();
|
|
853
821
|
vec3.sub(start, pos, start);
|
|
854
822
|
vec3.sub(end, pos, end);
|
|
855
823
|
this.geometry.updatePoint(pointIndex, clonePoint);
|
|
@@ -893,9 +861,6 @@ export class Spline2d extends SimulationElement2d {
|
|
|
893
861
|
const [vec] = this.interpolateSlope(t);
|
|
894
862
|
return vec;
|
|
895
863
|
}
|
|
896
|
-
updateMatrix(camera) {
|
|
897
|
-
this.defaultUpdateMatrix(camera);
|
|
898
|
-
}
|
|
899
864
|
}
|
|
900
865
|
export class Instance extends SimulationElement3d {
|
|
901
866
|
geometry;
|
|
@@ -904,7 +869,6 @@ export class Instance extends SimulationElement3d {
|
|
|
904
869
|
matrixBuffer;
|
|
905
870
|
device;
|
|
906
871
|
baseMat;
|
|
907
|
-
needsRemap = false;
|
|
908
872
|
constructor(obj, numInstances) {
|
|
909
873
|
super(vector3());
|
|
910
874
|
this.device = null;
|
|
@@ -945,16 +909,11 @@ export class Instance extends SimulationElement3d {
|
|
|
945
909
|
const clone = cloneBuf(this.baseMat);
|
|
946
910
|
this.instanceMatrix[i] = clone;
|
|
947
911
|
}
|
|
948
|
-
if (this.device) {
|
|
949
|
-
this.setMatrixBuffer();
|
|
950
|
-
this.needsRemap = true;
|
|
951
|
-
}
|
|
952
912
|
}
|
|
953
913
|
setInstance(instance, transformation) {
|
|
954
914
|
if (instance >= this.instanceMatrix.length || instance < 0)
|
|
955
915
|
return;
|
|
956
916
|
this.instanceMatrix[instance] = transformation;
|
|
957
|
-
this.needsRemap = true;
|
|
958
917
|
}
|
|
959
918
|
mapBuffer() {
|
|
960
919
|
if (!this.device || this.matrixBuffer === null)
|
|
@@ -962,18 +921,6 @@ export class Instance extends SimulationElement3d {
|
|
|
962
921
|
const buf = new Float32Array(this.instanceMatrix.map((mat) => [...mat]).flat());
|
|
963
922
|
this.device.queue.writeBuffer(this.matrixBuffer, 0, buf.buffer, buf.byteOffset, buf.byteLength);
|
|
964
923
|
this.matrixBuffer.unmap();
|
|
965
|
-
this.needsRemap = false;
|
|
966
|
-
}
|
|
967
|
-
setMatrixBuffer() {
|
|
968
|
-
if (!this.device || this.instanceMatrix.length === 0)
|
|
969
|
-
return;
|
|
970
|
-
const minSize = 640;
|
|
971
|
-
const size = Math.max(minSize, this.instanceMatrix[0].byteLength * this.instanceMatrix.length);
|
|
972
|
-
this.matrixBuffer = this.device.createBuffer({
|
|
973
|
-
size,
|
|
974
|
-
usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST
|
|
975
|
-
});
|
|
976
|
-
this.needsRemap = true;
|
|
977
924
|
}
|
|
978
925
|
getInstances() {
|
|
979
926
|
return this.instanceMatrix;
|
|
@@ -981,13 +928,16 @@ export class Instance extends SimulationElement3d {
|
|
|
981
928
|
getNumInstances() {
|
|
982
929
|
return this.instanceMatrix.length;
|
|
983
930
|
}
|
|
984
|
-
|
|
985
|
-
this.
|
|
986
|
-
|
|
987
|
-
this.
|
|
931
|
+
getMatrixBuffer(device) {
|
|
932
|
+
if (!this.matrixBuffer) {
|
|
933
|
+
const minSize = 640;
|
|
934
|
+
const size = Math.max(minSize, this.instanceMatrix[0].byteLength * this.instanceMatrix.length);
|
|
935
|
+
this.matrixBuffer = device.createBuffer({
|
|
936
|
+
size,
|
|
937
|
+
usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST
|
|
938
|
+
});
|
|
988
939
|
}
|
|
989
|
-
|
|
990
|
-
getMatrixBuffer() {
|
|
940
|
+
this.mapBuffer();
|
|
991
941
|
return this.matrixBuffer;
|
|
992
942
|
}
|
|
993
943
|
getVertexCount() {
|
|
@@ -996,11 +946,7 @@ export class Instance extends SimulationElement3d {
|
|
|
996
946
|
getGeometryType() {
|
|
997
947
|
return this.obj.getGeometryType();
|
|
998
948
|
}
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
getBuffer(camera) {
|
|
1002
|
-
if (this.needsRemap)
|
|
1003
|
-
this.mapBuffer();
|
|
1004
|
-
return this.obj.getBuffer(camera);
|
|
949
|
+
getBuffer() {
|
|
950
|
+
return this.obj.getBuffer();
|
|
1005
951
|
}
|
|
1006
952
|
}
|
package/dist/internalUtils.d.ts
CHANGED
|
@@ -1,19 +1,20 @@
|
|
|
1
1
|
/// <reference types="@webgpu/types" />
|
|
2
2
|
import { AnySimulationElement, VertexParamGeneratorInfo, Mat4, Vector2, Vector3, VertexParamInfo } from './types.js';
|
|
3
3
|
import { Color } from './utils.js';
|
|
4
|
+
import { Camera } from './simulation.js';
|
|
4
5
|
export declare class VertexCache {
|
|
5
6
|
private vertices;
|
|
6
7
|
private hasUpdated;
|
|
7
8
|
constructor();
|
|
8
|
-
setCache(vertices: number[]): void;
|
|
9
|
-
getCache():
|
|
9
|
+
setCache(vertices: Float32Array | number[]): void;
|
|
10
|
+
getCache(): Float32Array;
|
|
10
11
|
updated(): void;
|
|
11
12
|
shouldUpdate(): boolean;
|
|
12
13
|
getVertexCount(): number;
|
|
13
14
|
}
|
|
14
|
-
export declare const
|
|
15
|
-
export declare const
|
|
16
|
-
export declare const
|
|
15
|
+
export declare const updateProjectionMatrix: (mat: Mat4, aspectRatio: number, zNear?: number, zFar?: number) => any;
|
|
16
|
+
export declare const updateWorldProjectionMatrix: (worldProjMat: Mat4, projMat: Mat4, camera: Camera) => void;
|
|
17
|
+
export declare const updateOrthoProjectionMatrix: (mat: Mat4, screenSize: [number, number]) => Float32Array;
|
|
17
18
|
export declare const buildDepthTexture: (device: GPUDevice, width: number, height: number) => GPUTexture;
|
|
18
19
|
export declare const buildMultisampleTexture: (device: GPUDevice, ctx: GPUCanvasContext, width: number, height: number) => GPUTexture;
|
|
19
20
|
export declare const addObject: (scene: SimSceneObjInfo[], el: AnySimulationElement, device: GPUDevice | null, id?: string) => void;
|
|
@@ -48,6 +49,7 @@ declare class Logger {
|
|
|
48
49
|
}
|
|
49
50
|
export declare const logger: Logger;
|
|
50
51
|
export declare function lossyTriangulate<T>(vertices: T[]): (readonly [T, T, T])[];
|
|
52
|
+
export declare function lossyTriangulateStrip<T>(vertices: T[]): T[];
|
|
51
53
|
declare class BufferGenerator {
|
|
52
54
|
private instancing;
|
|
53
55
|
constructor();
|
|
@@ -59,7 +61,8 @@ export declare function vector3ToPixelRatio(vec: Vector3): void;
|
|
|
59
61
|
export declare function vector2ToPixelRatio(vec: Vector2): void;
|
|
60
62
|
export declare function matrixFromRotation(rotation: Vector3): Mat4;
|
|
61
63
|
export declare function rotateMat4(mat: Mat4, rotation: Vector3): void;
|
|
62
|
-
export declare function createPipeline(device: GPUDevice, module: GPUShaderModule, bindGroupLayouts: GPUBindGroupLayout[], presentationFormat: GPUTextureFormat,
|
|
64
|
+
export declare function createPipeline(device: GPUDevice, module: GPUShaderModule, bindGroupLayouts: GPUBindGroupLayout[], presentationFormat: GPUTextureFormat, topology: GPUPrimitiveTopology, vertexParams?: VertexParamInfo[]): GPURenderPipeline;
|
|
63
65
|
export declare function triangulateWireFrameOrder(len: number): number[];
|
|
64
66
|
export declare function getTotalVertices(scene: SimSceneObjInfo[]): number;
|
|
67
|
+
export declare function wrapVoidPromise(promise: Promise<unknown>): Promise<void>;
|
|
65
68
|
export {};
|