@industry-theme/repository-composition-panels 0.7.15 → 0.7.17

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.
Files changed (39) hide show
  1. package/dist/browserAll-BWR83R0-.js +7 -0
  2. package/dist/browserAll-BWR83R0-.js.map +1 -0
  3. package/dist/{index-pPFTSf2O.js → index-BsDrFty7.js} +16159 -704
  4. package/dist/{index-pPFTSf2O.js.map → index-BsDrFty7.js.map} +1 -1
  5. package/dist/index.d.ts +2 -2
  6. package/dist/index.d.ts.map +1 -1
  7. package/dist/init-BViSvzO2.js +4 -0
  8. package/dist/init-BViSvzO2.js.map +1 -0
  9. package/dist/panels/CollectionMapPanel.d.ts.map +1 -1
  10. package/dist/panels/overworld-map/OverworldMapPanel.d.ts.map +1 -1
  11. package/dist/panels/overworld-map/components/IsometricRenderer.d.ts.map +1 -1
  12. package/dist/panels/overworld-map/components/RepoSprite.d.ts +51 -0
  13. package/dist/panels/overworld-map/components/RepoSprite.d.ts.map +1 -0
  14. package/dist/panels/overworld-map/index.d.ts +3 -1
  15. package/dist/panels/overworld-map/index.d.ts.map +1 -1
  16. package/dist/panels.bundle.js +32 -31
  17. package/dist/webworkerAll-DkB5mV_6.js +3 -0
  18. package/dist/webworkerAll-DkB5mV_6.js.map +1 -0
  19. package/package.json +1 -1
  20. package/dist/BufferResource-DME1VWVJ.js +0 -593
  21. package/dist/BufferResource-DME1VWVJ.js.map +0 -1
  22. package/dist/CanvasRenderer-Md8Ayshs.js +0 -1525
  23. package/dist/CanvasRenderer-Md8Ayshs.js.map +0 -1
  24. package/dist/Filter-Bi2t_gmW.js +0 -81
  25. package/dist/Filter-Bi2t_gmW.js.map +0 -1
  26. package/dist/RenderTargetSystem-D98tiHim.js +0 -3046
  27. package/dist/RenderTargetSystem-D98tiHim.js.map +0 -1
  28. package/dist/WebGLRenderer-2YtxQhbh.js +0 -3884
  29. package/dist/WebGLRenderer-2YtxQhbh.js.map +0 -1
  30. package/dist/WebGPURenderer-kS6gO2Xc.js +0 -2142
  31. package/dist/WebGPURenderer-kS6gO2Xc.js.map +0 -1
  32. package/dist/browserAll-TZZf5l7B.js +0 -2687
  33. package/dist/browserAll-TZZf5l7B.js.map +0 -1
  34. package/dist/init-CfSmqCnm.js +0 -670
  35. package/dist/init-CfSmqCnm.js.map +0 -1
  36. package/dist/panels/overworld-map/spriteGenerator.d.ts +0 -53
  37. package/dist/panels/overworld-map/spriteGenerator.d.ts.map +0 -1
  38. package/dist/webworkerAll-TcJuZTza.js +0 -3
  39. package/dist/webworkerAll-TcJuZTza.js.map +0 -1
@@ -1,2142 +0,0 @@
1
- import { a as State, I as getTextureBatchBindGroup, E as ExtensionType, J as GCManagedHash, l as uid, K as fastCopy, D as DOMAdapter, h as STENCIL_MODES, j as BufferUsage, i as Buffer, B as BindGroup, L as createIdFromString, w as warn, N as CLEAR, v as CanvasSource, O as TextureSource, U as UniformGroup, Q as CanvasPool, M as Matrix, V as compileHighShaderGpuProgram, W as colorBit, X as generateTextureBatchBit, Y as roundPixelsBit, S as Shader, c as Texture, A as AbstractRenderer, R as RendererType, f as extensions } from "./index-pPFTSf2O.js";
2
- import { c as createUboSyncFunction, u as uboSyncFunctionsWGSL, U as UboSystem, B as BufferResource, G as GpuStencilModesToPixi, e as ensureAttributes, l as localUniformBitGroup2, a as localUniformBit, t as textureBit } from "./BufferResource-DME1VWVJ.js";
3
- import { R as RenderTargetSystem, S as SharedSystems, d as SharedRenderPipes } from "./RenderTargetSystem-D98tiHim.js";
4
- const tempState = State.for2d();
5
- class GpuBatchAdaptor {
6
- start(batchPipe, geometry, shader) {
7
- const renderer = batchPipe.renderer;
8
- const encoder = renderer.encoder;
9
- const program = shader.gpuProgram;
10
- this._shader = shader;
11
- this._geometry = geometry;
12
- encoder.setGeometry(geometry, program);
13
- tempState.blendMode = "normal";
14
- renderer.pipeline.getPipeline(
15
- geometry,
16
- program,
17
- tempState
18
- );
19
- const globalUniformsBindGroup = renderer.globalUniforms.bindGroup;
20
- encoder.resetBindGroup(1);
21
- encoder.setBindGroup(0, globalUniformsBindGroup, program);
22
- }
23
- execute(batchPipe, batch) {
24
- const program = this._shader.gpuProgram;
25
- const renderer = batchPipe.renderer;
26
- const encoder = renderer.encoder;
27
- if (!batch.bindGroup) {
28
- const textureBatch = batch.textures;
29
- batch.bindGroup = getTextureBatchBindGroup(
30
- textureBatch.textures,
31
- textureBatch.count,
32
- renderer.limits.maxBatchableTextures
33
- );
34
- }
35
- tempState.blendMode = batch.blendMode;
36
- const gpuBindGroup = renderer.bindGroup.getBindGroup(
37
- batch.bindGroup,
38
- program,
39
- 1
40
- );
41
- const pipeline = renderer.pipeline.getPipeline(
42
- this._geometry,
43
- program,
44
- tempState,
45
- batch.topology
46
- );
47
- batch.bindGroup._touch(renderer.gc.now, renderer.tick);
48
- encoder.setPipeline(pipeline);
49
- encoder.renderPassEncoder.setBindGroup(1, gpuBindGroup);
50
- encoder.renderPassEncoder.drawIndexed(batch.size, 1, batch.start);
51
- }
52
- }
53
- GpuBatchAdaptor.extension = {
54
- type: [
55
- ExtensionType.WebGPUPipesAdaptor
56
- ],
57
- name: "batch"
58
- };
59
- class BindGroupSystem {
60
- constructor(renderer) {
61
- this._hash = /* @__PURE__ */ Object.create(null);
62
- this._renderer = renderer;
63
- }
64
- contextChange(gpu) {
65
- this._gpu = gpu;
66
- }
67
- getBindGroup(bindGroup, program, groupIndex) {
68
- bindGroup._updateKey();
69
- const gpuBindGroup = this._hash[bindGroup._key] || this._createBindGroup(bindGroup, program, groupIndex);
70
- return gpuBindGroup;
71
- }
72
- _createBindGroup(group, program, groupIndex) {
73
- const device = this._gpu.device;
74
- const groupLayout = program.layout[groupIndex];
75
- const entries = [];
76
- const renderer = this._renderer;
77
- for (const j in groupLayout) {
78
- const resource = group.resources[j] ?? group.resources[groupLayout[j]];
79
- let gpuResource;
80
- if (resource._resourceType === "uniformGroup") {
81
- const uniformGroup = resource;
82
- renderer.ubo.updateUniformGroup(uniformGroup);
83
- const buffer = uniformGroup.buffer;
84
- gpuResource = {
85
- buffer: renderer.buffer.getGPUBuffer(buffer),
86
- offset: 0,
87
- size: buffer.descriptor.size
88
- };
89
- } else if (resource._resourceType === "buffer") {
90
- const buffer = resource;
91
- gpuResource = {
92
- buffer: renderer.buffer.getGPUBuffer(buffer),
93
- offset: 0,
94
- size: buffer.descriptor.size
95
- };
96
- } else if (resource._resourceType === "bufferResource") {
97
- const bufferResource = resource;
98
- gpuResource = {
99
- buffer: renderer.buffer.getGPUBuffer(bufferResource.buffer),
100
- offset: bufferResource.offset,
101
- size: bufferResource.size
102
- };
103
- } else if (resource._resourceType === "textureSampler") {
104
- const sampler = resource;
105
- gpuResource = renderer.texture.getGpuSampler(sampler);
106
- } else if (resource._resourceType === "textureSource") {
107
- const texture = resource;
108
- gpuResource = renderer.texture.getTextureView(texture);
109
- }
110
- entries.push({
111
- binding: groupLayout[j],
112
- resource: gpuResource
113
- });
114
- }
115
- const layout = renderer.shader.getProgramData(program).bindGroups[groupIndex];
116
- const gpuBindGroup = device.createBindGroup({
117
- layout,
118
- entries
119
- });
120
- this._hash[group._key] = gpuBindGroup;
121
- return gpuBindGroup;
122
- }
123
- destroy() {
124
- this._hash = null;
125
- this._renderer = null;
126
- }
127
- }
128
- BindGroupSystem.extension = {
129
- type: [
130
- ExtensionType.WebGPUSystem
131
- ],
132
- name: "bindGroup"
133
- };
134
- class GpuBufferData {
135
- constructor(gpuBuffer) {
136
- this.gpuBuffer = gpuBuffer;
137
- }
138
- destroy() {
139
- this.gpuBuffer.destroy();
140
- this.gpuBuffer = null;
141
- }
142
- }
143
- class GpuBufferSystem {
144
- constructor(renderer) {
145
- this._renderer = renderer;
146
- this._managedBuffers = new GCManagedHash({
147
- renderer,
148
- type: "resource",
149
- onUnload: this.onBufferUnload.bind(this),
150
- name: "gpuBuffer"
151
- });
152
- }
153
- contextChange(gpu) {
154
- this._gpu = gpu;
155
- }
156
- getGPUBuffer(buffer) {
157
- var _a;
158
- buffer._gcLastUsed = this._renderer.gc.now;
159
- return ((_a = buffer._gpuData[this._renderer.uid]) == null ? void 0 : _a.gpuBuffer) || this.createGPUBuffer(buffer);
160
- }
161
- updateBuffer(buffer) {
162
- const gpuBuffer = this.getGPUBuffer(buffer);
163
- const data = buffer.data;
164
- if (buffer._updateID && data) {
165
- buffer._updateID = 0;
166
- this._gpu.device.queue.writeBuffer(
167
- gpuBuffer,
168
- 0,
169
- data.buffer,
170
- 0,
171
- // round to the nearest 4 bytes
172
- (buffer._updateSize || data.byteLength) + 3 & -4
173
- );
174
- }
175
- return gpuBuffer;
176
- }
177
- /** dispose all WebGL resources of all managed buffers */
178
- destroyAll() {
179
- this._managedBuffers.removeAll();
180
- }
181
- onBufferUnload(buffer) {
182
- buffer.off("update", this.updateBuffer, this);
183
- buffer.off("change", this.onBufferChange, this);
184
- }
185
- createGPUBuffer(buffer) {
186
- const gpuBuffer = this._gpu.device.createBuffer(buffer.descriptor);
187
- buffer._updateID = 0;
188
- buffer._resourceId = uid("resource");
189
- if (buffer.data) {
190
- fastCopy(
191
- buffer.data.buffer,
192
- gpuBuffer.getMappedRange(),
193
- buffer.data.byteOffset,
194
- buffer.data.byteLength
195
- );
196
- gpuBuffer.unmap();
197
- }
198
- buffer._gpuData[this._renderer.uid] = new GpuBufferData(gpuBuffer);
199
- if (this._managedBuffers.add(buffer)) {
200
- buffer.on("update", this.updateBuffer, this);
201
- buffer.on("change", this.onBufferChange, this);
202
- }
203
- return gpuBuffer;
204
- }
205
- onBufferChange(buffer) {
206
- this._managedBuffers.remove(buffer);
207
- buffer._updateID = 0;
208
- this.createGPUBuffer(buffer);
209
- }
210
- destroy() {
211
- this._managedBuffers.destroy();
212
- this._renderer = null;
213
- this._gpu = null;
214
- }
215
- }
216
- GpuBufferSystem.extension = {
217
- type: [
218
- ExtensionType.WebGPUSystem
219
- ],
220
- name: "buffer"
221
- };
222
- class UboBatch {
223
- constructor({ minUniformOffsetAlignment: minUniformOffsetAlignment2 }) {
224
- this._minUniformOffsetAlignment = 256;
225
- this.byteIndex = 0;
226
- this._minUniformOffsetAlignment = minUniformOffsetAlignment2;
227
- this.data = new Float32Array(65535);
228
- }
229
- clear() {
230
- this.byteIndex = 0;
231
- }
232
- addEmptyGroup(size) {
233
- if (size > this._minUniformOffsetAlignment / 4) {
234
- throw new Error(`UniformBufferBatch: array is too large: ${size * 4}`);
235
- }
236
- const start = this.byteIndex;
237
- let newSize = start + size * 4;
238
- newSize = Math.ceil(newSize / this._minUniformOffsetAlignment) * this._minUniformOffsetAlignment;
239
- if (newSize > this.data.length * 4) {
240
- throw new Error("UniformBufferBatch: ubo batch got too big");
241
- }
242
- this.byteIndex = newSize;
243
- return start;
244
- }
245
- addGroup(array) {
246
- const offset = this.addEmptyGroup(array.length);
247
- for (let i = 0; i < array.length; i++) {
248
- this.data[offset / 4 + i] = array[i];
249
- }
250
- return offset;
251
- }
252
- destroy() {
253
- this.data = null;
254
- }
255
- }
256
- class GpuColorMaskSystem {
257
- constructor(renderer) {
258
- this._colorMaskCache = 15;
259
- this._renderer = renderer;
260
- }
261
- setMask(colorMask) {
262
- if (this._colorMaskCache === colorMask) return;
263
- this._colorMaskCache = colorMask;
264
- this._renderer.pipeline.setColorMask(colorMask);
265
- }
266
- destroy() {
267
- this._renderer = null;
268
- this._colorMaskCache = null;
269
- }
270
- }
271
- GpuColorMaskSystem.extension = {
272
- type: [
273
- ExtensionType.WebGPUSystem
274
- ],
275
- name: "colorMask"
276
- };
277
- class GpuDeviceSystem {
278
- /**
279
- * @param {WebGPURenderer} renderer - The renderer this System works for.
280
- */
281
- constructor(renderer) {
282
- this._renderer = renderer;
283
- }
284
- async init(options) {
285
- if (this._initPromise) return this._initPromise;
286
- this._initPromise = (options.gpu ? Promise.resolve(options.gpu) : this._createDeviceAndAdaptor(options)).then((gpu) => {
287
- this.gpu = gpu;
288
- this._renderer.runners.contextChange.emit(this.gpu);
289
- });
290
- return this._initPromise;
291
- }
292
- /**
293
- * Handle the context change event
294
- * @param gpu
295
- */
296
- contextChange(gpu) {
297
- this._renderer.gpu = gpu;
298
- }
299
- /**
300
- * Helper class to create a WebGL Context
301
- * @param {object} options - An options object that gets passed in to the canvas element containing the
302
- * context attributes
303
- * @see https://developer.mozilla.org/en/docs/Web/API/HTMLCanvasElement/getContext
304
- * @returns {WebGLRenderingContext} the WebGL context
305
- */
306
- async _createDeviceAndAdaptor(options) {
307
- const adapter = await DOMAdapter.get().getNavigator().gpu.requestAdapter({
308
- powerPreference: options.powerPreference,
309
- forceFallbackAdapter: options.forceFallbackAdapter
310
- });
311
- const requiredFeatures = [
312
- "texture-compression-bc",
313
- "texture-compression-astc",
314
- "texture-compression-etc2"
315
- ].filter((feature) => adapter.features.has(feature));
316
- const device = await adapter.requestDevice({
317
- requiredFeatures
318
- });
319
- return { adapter, device };
320
- }
321
- destroy() {
322
- this.gpu = null;
323
- this._renderer = null;
324
- }
325
- }
326
- GpuDeviceSystem.extension = {
327
- type: [
328
- ExtensionType.WebGPUSystem
329
- ],
330
- name: "device"
331
- };
332
- GpuDeviceSystem.defaultOptions = {
333
- /**
334
- * {@link WebGPUOptions.powerPreference}
335
- * @default default
336
- */
337
- powerPreference: void 0,
338
- /**
339
- * Force the use of the fallback adapter
340
- * @default false
341
- */
342
- forceFallbackAdapter: false
343
- };
344
- class GpuEncoderSystem {
345
- constructor(renderer) {
346
- this._boundBindGroup = /* @__PURE__ */ Object.create(null);
347
- this._boundVertexBuffer = /* @__PURE__ */ Object.create(null);
348
- this._renderer = renderer;
349
- }
350
- renderStart() {
351
- this.commandFinished = new Promise((resolve) => {
352
- this._resolveCommandFinished = resolve;
353
- });
354
- this.commandEncoder = this._renderer.gpu.device.createCommandEncoder();
355
- }
356
- beginRenderPass(gpuRenderTarget) {
357
- this.endRenderPass();
358
- this._clearCache();
359
- this.renderPassEncoder = this.commandEncoder.beginRenderPass(gpuRenderTarget.descriptor);
360
- }
361
- endRenderPass() {
362
- if (this.renderPassEncoder) {
363
- this.renderPassEncoder.end();
364
- }
365
- this.renderPassEncoder = null;
366
- }
367
- setViewport(viewport) {
368
- this.renderPassEncoder.setViewport(viewport.x, viewport.y, viewport.width, viewport.height, 0, 1);
369
- }
370
- setPipelineFromGeometryProgramAndState(geometry, program, state, topology) {
371
- const pipeline = this._renderer.pipeline.getPipeline(geometry, program, state, topology);
372
- this.setPipeline(pipeline);
373
- }
374
- setPipeline(pipeline) {
375
- if (this._boundPipeline === pipeline) return;
376
- this._boundPipeline = pipeline;
377
- this.renderPassEncoder.setPipeline(pipeline);
378
- }
379
- _setVertexBuffer(index, buffer) {
380
- if (this._boundVertexBuffer[index] === buffer) return;
381
- this._boundVertexBuffer[index] = buffer;
382
- this.renderPassEncoder.setVertexBuffer(index, this._renderer.buffer.updateBuffer(buffer));
383
- }
384
- _setIndexBuffer(buffer) {
385
- if (this._boundIndexBuffer === buffer) return;
386
- this._boundIndexBuffer = buffer;
387
- const indexFormat = buffer.data.BYTES_PER_ELEMENT === 2 ? "uint16" : "uint32";
388
- this.renderPassEncoder.setIndexBuffer(this._renderer.buffer.updateBuffer(buffer), indexFormat);
389
- }
390
- resetBindGroup(index) {
391
- this._boundBindGroup[index] = null;
392
- }
393
- setBindGroup(index, bindGroup, program) {
394
- if (this._boundBindGroup[index] === bindGroup) return;
395
- this._boundBindGroup[index] = bindGroup;
396
- bindGroup._touch(this._renderer.gc.now, this._renderer.tick);
397
- const gpuBindGroup = this._renderer.bindGroup.getBindGroup(bindGroup, program, index);
398
- this.renderPassEncoder.setBindGroup(index, gpuBindGroup);
399
- }
400
- setGeometry(geometry, program) {
401
- const buffersToBind = this._renderer.pipeline.getBufferNamesToBind(geometry, program);
402
- for (const i in buffersToBind) {
403
- this._setVertexBuffer(parseInt(i, 10), geometry.attributes[buffersToBind[i]].buffer);
404
- }
405
- if (geometry.indexBuffer) {
406
- this._setIndexBuffer(geometry.indexBuffer);
407
- }
408
- }
409
- _setShaderBindGroups(shader, skipSync) {
410
- for (const i in shader.groups) {
411
- const bindGroup = shader.groups[i];
412
- if (!skipSync) {
413
- this._syncBindGroup(bindGroup);
414
- }
415
- this.setBindGroup(i, bindGroup, shader.gpuProgram);
416
- }
417
- }
418
- _syncBindGroup(bindGroup) {
419
- for (const j in bindGroup.resources) {
420
- const resource = bindGroup.resources[j];
421
- if (resource.isUniformGroup) {
422
- this._renderer.ubo.updateUniformGroup(resource);
423
- }
424
- }
425
- }
426
- draw(options) {
427
- const { geometry, shader, state, topology, size, start, instanceCount, skipSync } = options;
428
- this.setPipelineFromGeometryProgramAndState(geometry, shader.gpuProgram, state, topology);
429
- this.setGeometry(geometry, shader.gpuProgram);
430
- this._setShaderBindGroups(shader, skipSync);
431
- if (geometry.indexBuffer) {
432
- this.renderPassEncoder.drawIndexed(
433
- size || geometry.indexBuffer.data.length,
434
- instanceCount ?? geometry.instanceCount,
435
- start || 0
436
- );
437
- } else {
438
- this.renderPassEncoder.draw(size || geometry.getSize(), instanceCount ?? geometry.instanceCount, start || 0);
439
- }
440
- }
441
- finishRenderPass() {
442
- if (this.renderPassEncoder) {
443
- this.renderPassEncoder.end();
444
- this.renderPassEncoder = null;
445
- }
446
- }
447
- postrender() {
448
- this.finishRenderPass();
449
- this._gpu.device.queue.submit([this.commandEncoder.finish()]);
450
- this._resolveCommandFinished();
451
- this.commandEncoder = null;
452
- }
453
- // restores a render pass if finishRenderPass was called
454
- // not optimised as really used for debugging!
455
- // used when we want to stop drawing and log a texture..
456
- restoreRenderPass() {
457
- const descriptor = this._renderer.renderTarget.adaptor.getDescriptor(
458
- this._renderer.renderTarget.renderTarget,
459
- false,
460
- [0, 0, 0, 1],
461
- this._renderer.renderTarget.mipLevel,
462
- this._renderer.renderTarget.layer
463
- );
464
- this.renderPassEncoder = this.commandEncoder.beginRenderPass(descriptor);
465
- const boundPipeline = this._boundPipeline;
466
- const boundVertexBuffer = { ...this._boundVertexBuffer };
467
- const boundIndexBuffer = this._boundIndexBuffer;
468
- const boundBindGroup = { ...this._boundBindGroup };
469
- this._clearCache();
470
- const viewport = this._renderer.renderTarget.viewport;
471
- this.renderPassEncoder.setViewport(viewport.x, viewport.y, viewport.width, viewport.height, 0, 1);
472
- this.setPipeline(boundPipeline);
473
- for (const i in boundVertexBuffer) {
474
- this._setVertexBuffer(i, boundVertexBuffer[i]);
475
- }
476
- for (const i in boundBindGroup) {
477
- this.setBindGroup(i, boundBindGroup[i], null);
478
- }
479
- this._setIndexBuffer(boundIndexBuffer);
480
- }
481
- _clearCache() {
482
- for (let i = 0; i < 16; i++) {
483
- this._boundBindGroup[i] = null;
484
- this._boundVertexBuffer[i] = null;
485
- }
486
- this._boundIndexBuffer = null;
487
- this._boundPipeline = null;
488
- }
489
- destroy() {
490
- this._renderer = null;
491
- this._gpu = null;
492
- this._boundBindGroup = null;
493
- this._boundVertexBuffer = null;
494
- this._boundIndexBuffer = null;
495
- this._boundPipeline = null;
496
- }
497
- contextChange(gpu) {
498
- this._gpu = gpu;
499
- }
500
- }
501
- GpuEncoderSystem.extension = {
502
- type: [ExtensionType.WebGPUSystem],
503
- name: "encoder",
504
- priority: 1
505
- };
506
- class GpuLimitsSystem {
507
- constructor(renderer) {
508
- this._renderer = renderer;
509
- }
510
- contextChange() {
511
- this.maxTextures = this._renderer.device.gpu.device.limits.maxSampledTexturesPerShaderStage;
512
- this.maxBatchableTextures = this.maxTextures;
513
- }
514
- destroy() {
515
- }
516
- }
517
- GpuLimitsSystem.extension = {
518
- type: [
519
- ExtensionType.WebGPUSystem
520
- ],
521
- name: "limits"
522
- };
523
- class GpuStencilSystem {
524
- constructor(renderer) {
525
- this._renderTargetStencilState = /* @__PURE__ */ Object.create(null);
526
- this._renderer = renderer;
527
- renderer.renderTarget.onRenderTargetChange.add(this);
528
- }
529
- onRenderTargetChange(renderTarget) {
530
- let stencilState = this._renderTargetStencilState[renderTarget.uid];
531
- if (!stencilState) {
532
- stencilState = this._renderTargetStencilState[renderTarget.uid] = {
533
- stencilMode: STENCIL_MODES.DISABLED,
534
- stencilReference: 0
535
- };
536
- }
537
- this._activeRenderTarget = renderTarget;
538
- this.setStencilMode(stencilState.stencilMode, stencilState.stencilReference);
539
- }
540
- setStencilMode(stencilMode, stencilReference) {
541
- const stencilState = this._renderTargetStencilState[this._activeRenderTarget.uid];
542
- stencilState.stencilMode = stencilMode;
543
- stencilState.stencilReference = stencilReference;
544
- const renderer = this._renderer;
545
- renderer.pipeline.setStencilMode(stencilMode);
546
- renderer.encoder.renderPassEncoder.setStencilReference(stencilReference);
547
- }
548
- destroy() {
549
- this._renderer.renderTarget.onRenderTargetChange.remove(this);
550
- this._renderer = null;
551
- this._activeRenderTarget = null;
552
- this._renderTargetStencilState = null;
553
- }
554
- }
555
- GpuStencilSystem.extension = {
556
- type: [
557
- ExtensionType.WebGPUSystem
558
- ],
559
- name: "stencil"
560
- };
561
- const WGSL_ALIGN_SIZE_DATA = {
562
- i32: { align: 4, size: 4 },
563
- u32: { align: 4, size: 4 },
564
- f32: { align: 4, size: 4 },
565
- f16: { align: 2, size: 2 },
566
- "vec2<i32>": { align: 8, size: 8 },
567
- "vec2<u32>": { align: 8, size: 8 },
568
- "vec2<f32>": { align: 8, size: 8 },
569
- "vec2<f16>": { align: 4, size: 4 },
570
- "vec3<i32>": { align: 16, size: 12 },
571
- "vec3<u32>": { align: 16, size: 12 },
572
- "vec3<f32>": { align: 16, size: 12 },
573
- "vec3<f16>": { align: 8, size: 6 },
574
- "vec4<i32>": { align: 16, size: 16 },
575
- "vec4<u32>": { align: 16, size: 16 },
576
- "vec4<f32>": { align: 16, size: 16 },
577
- "vec4<f16>": { align: 8, size: 8 },
578
- "mat2x2<f32>": { align: 8, size: 16 },
579
- "mat2x2<f16>": { align: 4, size: 8 },
580
- "mat3x2<f32>": { align: 8, size: 24 },
581
- "mat3x2<f16>": { align: 4, size: 12 },
582
- "mat4x2<f32>": { align: 8, size: 32 },
583
- "mat4x2<f16>": { align: 4, size: 16 },
584
- "mat2x3<f32>": { align: 16, size: 32 },
585
- "mat2x3<f16>": { align: 8, size: 16 },
586
- "mat3x3<f32>": { align: 16, size: 48 },
587
- "mat3x3<f16>": { align: 8, size: 24 },
588
- "mat4x3<f32>": { align: 16, size: 64 },
589
- "mat4x3<f16>": { align: 8, size: 32 },
590
- "mat2x4<f32>": { align: 16, size: 32 },
591
- "mat2x4<f16>": { align: 8, size: 16 },
592
- "mat3x4<f32>": { align: 16, size: 48 },
593
- "mat3x4<f16>": { align: 8, size: 24 },
594
- "mat4x4<f32>": { align: 16, size: 64 },
595
- "mat4x4<f16>": { align: 8, size: 32 }
596
- };
597
- function createUboElementsWGSL(uniformData) {
598
- const uboElements = uniformData.map((data) => ({
599
- data,
600
- offset: 0,
601
- size: 0
602
- }));
603
- let offset = 0;
604
- for (let i = 0; i < uboElements.length; i++) {
605
- const uboElement = uboElements[i];
606
- let size = WGSL_ALIGN_SIZE_DATA[uboElement.data.type].size;
607
- const align = WGSL_ALIGN_SIZE_DATA[uboElement.data.type].align;
608
- if (!WGSL_ALIGN_SIZE_DATA[uboElement.data.type]) {
609
- throw new Error(`[Pixi.js] WebGPU UniformBuffer: Unknown type ${uboElement.data.type}`);
610
- }
611
- if (uboElement.data.size > 1) {
612
- size = Math.max(size, align) * uboElement.data.size;
613
- }
614
- offset = Math.ceil(offset / align) * align;
615
- uboElement.size = size;
616
- uboElement.offset = offset;
617
- offset += size;
618
- }
619
- offset = Math.ceil(offset / 16) * 16;
620
- return { uboElements, size: offset };
621
- }
622
- function generateArraySyncWGSL(uboElement, offsetToAdd) {
623
- const { size, align } = WGSL_ALIGN_SIZE_DATA[uboElement.data.type];
624
- const remainder = (align - size) / 4;
625
- const data = uboElement.data.type.indexOf("i32") >= 0 ? "dataInt32" : "data";
626
- return `
627
- v = uv.${uboElement.data.name};
628
- ${offsetToAdd !== 0 ? `offset += ${offsetToAdd};` : ""}
629
-
630
- arrayOffset = offset;
631
-
632
- t = 0;
633
-
634
- for(var i=0; i < ${uboElement.data.size * (size / 4)}; i++)
635
- {
636
- for(var j = 0; j < ${size / 4}; j++)
637
- {
638
- ${data}[arrayOffset++] = v[t++];
639
- }
640
- ${remainder !== 0 ? `arrayOffset += ${remainder};` : ""}
641
- }
642
- `;
643
- }
644
- function createUboSyncFunctionWGSL(uboElements) {
645
- return createUboSyncFunction(
646
- uboElements,
647
- "uboWgsl",
648
- generateArraySyncWGSL,
649
- uboSyncFunctionsWGSL
650
- );
651
- }
652
- class GpuUboSystem extends UboSystem {
653
- constructor() {
654
- super({
655
- createUboElements: createUboElementsWGSL,
656
- generateUboSync: createUboSyncFunctionWGSL
657
- });
658
- }
659
- }
660
- GpuUboSystem.extension = {
661
- type: [ExtensionType.WebGPUSystem],
662
- name: "ubo"
663
- };
664
- const minUniformOffsetAlignment = 128;
665
- class GpuUniformBatchPipe {
666
- constructor(renderer) {
667
- this._bindGroupHash = /* @__PURE__ */ Object.create(null);
668
- this._buffers = [];
669
- this._bindGroups = [];
670
- this._bufferResources = [];
671
- this._renderer = renderer;
672
- this._batchBuffer = new UboBatch({ minUniformOffsetAlignment });
673
- const totalBuffers = 256 / minUniformOffsetAlignment;
674
- for (let i = 0; i < totalBuffers; i++) {
675
- let usage = BufferUsage.UNIFORM | BufferUsage.COPY_DST;
676
- if (i === 0) usage |= BufferUsage.COPY_SRC;
677
- this._buffers.push(new Buffer({
678
- data: this._batchBuffer.data,
679
- usage
680
- }));
681
- }
682
- }
683
- renderEnd() {
684
- this._uploadBindGroups();
685
- this._resetBindGroups();
686
- }
687
- _resetBindGroups() {
688
- this._bindGroupHash = /* @__PURE__ */ Object.create(null);
689
- this._batchBuffer.clear();
690
- }
691
- // just works for single bind groups for now
692
- getUniformBindGroup(group, duplicate) {
693
- if (!duplicate && this._bindGroupHash[group.uid]) {
694
- return this._bindGroupHash[group.uid];
695
- }
696
- this._renderer.ubo.ensureUniformGroup(group);
697
- const data = group.buffer.data;
698
- const offset = this._batchBuffer.addEmptyGroup(data.length);
699
- this._renderer.ubo.syncUniformGroup(group, this._batchBuffer.data, offset / 4);
700
- this._bindGroupHash[group.uid] = this._getBindGroup(offset / minUniformOffsetAlignment);
701
- return this._bindGroupHash[group.uid];
702
- }
703
- getUboResource(group) {
704
- this._renderer.ubo.updateUniformGroup(group);
705
- const data = group.buffer.data;
706
- const offset = this._batchBuffer.addGroup(data);
707
- return this._getBufferResource(offset / minUniformOffsetAlignment);
708
- }
709
- getArrayBindGroup(data) {
710
- const offset = this._batchBuffer.addGroup(data);
711
- return this._getBindGroup(offset / minUniformOffsetAlignment);
712
- }
713
- getArrayBufferResource(data) {
714
- const offset = this._batchBuffer.addGroup(data);
715
- const index = offset / minUniformOffsetAlignment;
716
- return this._getBufferResource(index);
717
- }
718
- _getBufferResource(index) {
719
- if (!this._bufferResources[index]) {
720
- const buffer = this._buffers[index % 2];
721
- this._bufferResources[index] = new BufferResource({
722
- buffer,
723
- offset: (index / 2 | 0) * 256,
724
- size: minUniformOffsetAlignment
725
- });
726
- }
727
- return this._bufferResources[index];
728
- }
729
- _getBindGroup(index) {
730
- if (!this._bindGroups[index]) {
731
- const bindGroup = new BindGroup({
732
- 0: this._getBufferResource(index)
733
- });
734
- this._bindGroups[index] = bindGroup;
735
- }
736
- return this._bindGroups[index];
737
- }
738
- _uploadBindGroups() {
739
- const bufferSystem = this._renderer.buffer;
740
- const firstBuffer = this._buffers[0];
741
- firstBuffer.update(this._batchBuffer.byteIndex);
742
- bufferSystem.updateBuffer(firstBuffer);
743
- const commandEncoder = this._renderer.gpu.device.createCommandEncoder();
744
- for (let i = 1; i < this._buffers.length; i++) {
745
- const buffer = this._buffers[i];
746
- commandEncoder.copyBufferToBuffer(
747
- bufferSystem.getGPUBuffer(firstBuffer),
748
- minUniformOffsetAlignment,
749
- bufferSystem.getGPUBuffer(buffer),
750
- 0,
751
- this._batchBuffer.byteIndex
752
- );
753
- }
754
- this._renderer.gpu.device.queue.submit([commandEncoder.finish()]);
755
- }
756
- destroy() {
757
- var _a;
758
- for (let i = 0; i < this._bindGroups.length; i++) {
759
- (_a = this._bindGroups[i]) == null ? void 0 : _a.destroy();
760
- }
761
- this._bindGroups = null;
762
- this._bindGroupHash = null;
763
- for (let i = 0; i < this._buffers.length; i++) {
764
- this._buffers[i].destroy();
765
- }
766
- this._buffers = null;
767
- for (let i = 0; i < this._bufferResources.length; i++) {
768
- this._bufferResources[i].destroy();
769
- }
770
- this._bufferResources = null;
771
- this._batchBuffer.destroy();
772
- this._renderer = null;
773
- }
774
- }
775
- GpuUniformBatchPipe.extension = {
776
- type: [
777
- ExtensionType.WebGPUPipes
778
- ],
779
- name: "uniformBatch"
780
- };
781
- const topologyStringToId = {
782
- "point-list": 0,
783
- "line-list": 1,
784
- "line-strip": 2,
785
- "triangle-list": 3,
786
- "triangle-strip": 4
787
- };
788
- function getGraphicsStateKey(geometryLayout, shaderKey, state, blendMode, topology) {
789
- return geometryLayout << 24 | shaderKey << 16 | state << 10 | blendMode << 5 | topology;
790
- }
791
- function getGlobalStateKey(stencilStateId, multiSampleCount, colorMask, renderTarget, colorTargetCount) {
792
- return colorMask << 8 | stencilStateId << 5 | renderTarget << 3 | colorTargetCount << 1 | multiSampleCount;
793
- }
794
- class PipelineSystem {
795
- constructor(renderer) {
796
- this._moduleCache = /* @__PURE__ */ Object.create(null);
797
- this._bufferLayoutsCache = /* @__PURE__ */ Object.create(null);
798
- this._bindingNamesCache = /* @__PURE__ */ Object.create(null);
799
- this._pipeCache = /* @__PURE__ */ Object.create(null);
800
- this._pipeStateCaches = /* @__PURE__ */ Object.create(null);
801
- this._colorMask = 15;
802
- this._multisampleCount = 1;
803
- this._colorTargetCount = 1;
804
- this._renderer = renderer;
805
- }
806
- contextChange(gpu) {
807
- this._gpu = gpu;
808
- this.setStencilMode(STENCIL_MODES.DISABLED);
809
- this._updatePipeHash();
810
- }
811
- setMultisampleCount(multisampleCount) {
812
- if (this._multisampleCount === multisampleCount) return;
813
- this._multisampleCount = multisampleCount;
814
- this._updatePipeHash();
815
- }
816
- setRenderTarget(renderTarget) {
817
- this._multisampleCount = renderTarget.msaaSamples;
818
- this._depthStencilAttachment = renderTarget.descriptor.depthStencilAttachment ? 1 : 0;
819
- this._colorTargetCount = renderTarget.colorTargetCount;
820
- this._updatePipeHash();
821
- }
822
- setColorMask(colorMask) {
823
- if (this._colorMask === colorMask) return;
824
- this._colorMask = colorMask;
825
- this._updatePipeHash();
826
- }
827
- setStencilMode(stencilMode) {
828
- if (this._stencilMode === stencilMode) return;
829
- this._stencilMode = stencilMode;
830
- this._stencilState = GpuStencilModesToPixi[stencilMode];
831
- this._updatePipeHash();
832
- }
833
- setPipeline(geometry, program, state, passEncoder) {
834
- const pipeline = this.getPipeline(geometry, program, state);
835
- passEncoder.setPipeline(pipeline);
836
- }
837
- getPipeline(geometry, program, state, topology) {
838
- if (!geometry._layoutKey) {
839
- ensureAttributes(geometry, program.attributeData);
840
- this._generateBufferKey(geometry);
841
- }
842
- topology || (topology = geometry.topology);
843
- const key = getGraphicsStateKey(
844
- geometry._layoutKey,
845
- program._layoutKey,
846
- state.data,
847
- state._blendModeId,
848
- topologyStringToId[topology]
849
- );
850
- if (this._pipeCache[key]) return this._pipeCache[key];
851
- this._pipeCache[key] = this._createPipeline(geometry, program, state, topology);
852
- return this._pipeCache[key];
853
- }
854
- _createPipeline(geometry, program, state, topology) {
855
- const device = this._gpu.device;
856
- const buffers = this._createVertexBufferLayouts(geometry, program);
857
- const blendModes = this._renderer.state.getColorTargets(state, this._colorTargetCount);
858
- const writeMask = this._stencilMode === STENCIL_MODES.RENDERING_MASK_ADD ? 0 : this._colorMask;
859
- for (let i = 0; i < blendModes.length; i++) {
860
- blendModes[i].writeMask = writeMask;
861
- }
862
- const layout = this._renderer.shader.getProgramData(program).pipeline;
863
- const descriptor = {
864
- // TODO later check if its helpful to create..
865
- // layout,
866
- vertex: {
867
- module: this._getModule(program.vertex.source),
868
- entryPoint: program.vertex.entryPoint,
869
- // geometry..
870
- buffers
871
- },
872
- fragment: {
873
- module: this._getModule(program.fragment.source),
874
- entryPoint: program.fragment.entryPoint,
875
- targets: blendModes
876
- },
877
- primitive: {
878
- topology,
879
- cullMode: state.cullMode
880
- },
881
- layout,
882
- multisample: {
883
- count: this._multisampleCount
884
- },
885
- // depthStencil,
886
- label: `PIXI Pipeline`
887
- };
888
- if (this._depthStencilAttachment) {
889
- descriptor.depthStencil = {
890
- ...this._stencilState,
891
- format: "depth24plus-stencil8",
892
- depthWriteEnabled: state.depthTest,
893
- depthCompare: state.depthTest ? "less" : "always"
894
- };
895
- }
896
- const pipeline = device.createRenderPipeline(descriptor);
897
- return pipeline;
898
- }
899
- _getModule(code) {
900
- return this._moduleCache[code] || this._createModule(code);
901
- }
902
- _createModule(code) {
903
- const device = this._gpu.device;
904
- this._moduleCache[code] = device.createShaderModule({
905
- code
906
- });
907
- return this._moduleCache[code];
908
- }
909
- _generateBufferKey(geometry) {
910
- const keyGen = [];
911
- let index = 0;
912
- const attributeKeys = Object.keys(geometry.attributes).sort();
913
- for (let i = 0; i < attributeKeys.length; i++) {
914
- const attribute = geometry.attributes[attributeKeys[i]];
915
- keyGen[index++] = attribute.offset;
916
- keyGen[index++] = attribute.format;
917
- keyGen[index++] = attribute.stride;
918
- keyGen[index++] = attribute.instance;
919
- }
920
- const stringKey = keyGen.join("|");
921
- geometry._layoutKey = createIdFromString(stringKey, "geometry");
922
- return geometry._layoutKey;
923
- }
924
- _generateAttributeLocationsKey(program) {
925
- const keyGen = [];
926
- let index = 0;
927
- const attributeKeys = Object.keys(program.attributeData).sort();
928
- for (let i = 0; i < attributeKeys.length; i++) {
929
- const attribute = program.attributeData[attributeKeys[i]];
930
- keyGen[index++] = attribute.location;
931
- }
932
- const stringKey = keyGen.join("|");
933
- program._attributeLocationsKey = createIdFromString(stringKey, "programAttributes");
934
- return program._attributeLocationsKey;
935
- }
936
- /**
937
- * Returns a hash of buffer names mapped to bind locations.
938
- * This is used to bind the correct buffer to the correct location in the shader.
939
- * @param geometry - The geometry where to get the buffer names
940
- * @param program - The program where to get the buffer names
941
- * @returns An object of buffer names mapped to the bind location.
942
- */
943
- getBufferNamesToBind(geometry, program) {
944
- const key = geometry._layoutKey << 16 | program._attributeLocationsKey;
945
- if (this._bindingNamesCache[key]) return this._bindingNamesCache[key];
946
- const data = this._createVertexBufferLayouts(geometry, program);
947
- const bufferNamesToBind = /* @__PURE__ */ Object.create(null);
948
- const attributeData = program.attributeData;
949
- for (let i = 0; i < data.length; i++) {
950
- const attributes = Object.values(data[i].attributes);
951
- const shaderLocation = attributes[0].shaderLocation;
952
- for (const j in attributeData) {
953
- if (attributeData[j].location === shaderLocation) {
954
- bufferNamesToBind[i] = j;
955
- break;
956
- }
957
- }
958
- }
959
- this._bindingNamesCache[key] = bufferNamesToBind;
960
- return bufferNamesToBind;
961
- }
962
- _createVertexBufferLayouts(geometry, program) {
963
- if (!program._attributeLocationsKey) this._generateAttributeLocationsKey(program);
964
- const key = geometry._layoutKey << 16 | program._attributeLocationsKey;
965
- if (this._bufferLayoutsCache[key]) {
966
- return this._bufferLayoutsCache[key];
967
- }
968
- const vertexBuffersLayout = [];
969
- geometry.buffers.forEach((buffer) => {
970
- const bufferEntry = {
971
- arrayStride: 0,
972
- stepMode: "vertex",
973
- attributes: []
974
- };
975
- const bufferEntryAttributes = bufferEntry.attributes;
976
- for (const i in program.attributeData) {
977
- const attribute = geometry.attributes[i];
978
- if ((attribute.divisor ?? 1) !== 1) {
979
- warn(`Attribute ${i} has an invalid divisor value of '${attribute.divisor}'. WebGPU only supports a divisor value of 1`);
980
- }
981
- if (attribute.buffer === buffer) {
982
- bufferEntry.arrayStride = attribute.stride;
983
- bufferEntry.stepMode = attribute.instance ? "instance" : "vertex";
984
- bufferEntryAttributes.push({
985
- shaderLocation: program.attributeData[i].location,
986
- offset: attribute.offset,
987
- format: attribute.format
988
- });
989
- }
990
- }
991
- if (bufferEntryAttributes.length) {
992
- vertexBuffersLayout.push(bufferEntry);
993
- }
994
- });
995
- this._bufferLayoutsCache[key] = vertexBuffersLayout;
996
- return vertexBuffersLayout;
997
- }
998
- _updatePipeHash() {
999
- const key = getGlobalStateKey(
1000
- this._stencilMode,
1001
- this._multisampleCount,
1002
- this._colorMask,
1003
- this._depthStencilAttachment,
1004
- this._colorTargetCount
1005
- );
1006
- if (!this._pipeStateCaches[key]) {
1007
- this._pipeStateCaches[key] = /* @__PURE__ */ Object.create(null);
1008
- }
1009
- this._pipeCache = this._pipeStateCaches[key];
1010
- }
1011
- destroy() {
1012
- this._renderer = null;
1013
- this._bufferLayoutsCache = null;
1014
- }
1015
- }
1016
- PipelineSystem.extension = {
1017
- type: [ExtensionType.WebGPUSystem],
1018
- name: "pipeline"
1019
- };
1020
- class GpuRenderTarget {
1021
- constructor() {
1022
- this.contexts = [];
1023
- this.msaaTextures = [];
1024
- this.msaaSamples = 1;
1025
- }
1026
- }
1027
- class GpuRenderTargetAdaptor {
1028
- init(renderer, renderTargetSystem) {
1029
- this._renderer = renderer;
1030
- this._renderTargetSystem = renderTargetSystem;
1031
- }
1032
- copyToTexture(sourceRenderSurfaceTexture, destinationTexture, originSrc, size, originDest) {
1033
- const renderer = this._renderer;
1034
- const baseGpuTexture = this._getGpuColorTexture(
1035
- sourceRenderSurfaceTexture
1036
- );
1037
- const backGpuTexture = renderer.texture.getGpuSource(
1038
- destinationTexture.source
1039
- );
1040
- renderer.encoder.commandEncoder.copyTextureToTexture(
1041
- {
1042
- texture: baseGpuTexture,
1043
- origin: originSrc
1044
- },
1045
- {
1046
- texture: backGpuTexture,
1047
- origin: originDest
1048
- },
1049
- size
1050
- );
1051
- return destinationTexture;
1052
- }
1053
- startRenderPass(renderTarget, clear = true, clearColor, viewport, mipLevel = 0, layer = 0) {
1054
- var _a, _b;
1055
- const renderTargetSystem = this._renderTargetSystem;
1056
- const gpuRenderTarget = renderTargetSystem.getGpuRenderTarget(renderTarget);
1057
- if (layer !== 0 && ((_a = gpuRenderTarget.msaaTextures) == null ? void 0 : _a.length)) {
1058
- throw new Error("[RenderTargetSystem] Rendering to array layers is not supported with MSAA render targets.");
1059
- }
1060
- if (mipLevel > 0 && ((_b = gpuRenderTarget.msaaTextures) == null ? void 0 : _b.length)) {
1061
- throw new Error("[RenderTargetSystem] Rendering to mip levels is not supported with MSAA render targets.");
1062
- }
1063
- const descriptor = this.getDescriptor(renderTarget, clear, clearColor, mipLevel, layer);
1064
- gpuRenderTarget.descriptor = descriptor;
1065
- this._renderer.pipeline.setRenderTarget(gpuRenderTarget);
1066
- this._renderer.encoder.beginRenderPass(gpuRenderTarget);
1067
- this._renderer.encoder.setViewport(viewport);
1068
- }
1069
- finishRenderPass() {
1070
- this._renderer.encoder.endRenderPass();
1071
- }
1072
- /**
1073
- * returns the gpu texture for the first color texture in the render target
1074
- * mainly used by the filter manager to get copy the texture for blending
1075
- * @param renderTarget
1076
- * @returns a gpu texture
1077
- */
1078
- _getGpuColorTexture(renderTarget) {
1079
- const gpuRenderTarget = this._renderTargetSystem.getGpuRenderTarget(renderTarget);
1080
- if (gpuRenderTarget.contexts[0]) {
1081
- return gpuRenderTarget.contexts[0].getCurrentTexture();
1082
- }
1083
- return this._renderer.texture.getGpuSource(
1084
- renderTarget.colorTextures[0].source
1085
- );
1086
- }
1087
- getDescriptor(renderTarget, clear, clearValue, mipLevel = 0, layer = 0) {
1088
- if (typeof clear === "boolean") {
1089
- clear = clear ? CLEAR.ALL : CLEAR.NONE;
1090
- }
1091
- const renderTargetSystem = this._renderTargetSystem;
1092
- const gpuRenderTarget = renderTargetSystem.getGpuRenderTarget(renderTarget);
1093
- const colorAttachments = renderTarget.colorTextures.map(
1094
- (texture, i) => {
1095
- const context = gpuRenderTarget.contexts[i];
1096
- let view;
1097
- let resolveTarget;
1098
- if (context) {
1099
- if (layer !== 0) {
1100
- throw new Error("[RenderTargetSystem] Rendering to array layers is not supported for canvas targets.");
1101
- }
1102
- const currentTexture = context.getCurrentTexture();
1103
- const canvasTextureView = currentTexture.createView();
1104
- view = canvasTextureView;
1105
- } else {
1106
- view = this._renderer.texture.getGpuSource(texture).createView({
1107
- // Render attachments must be 2d views; for array/cube textures we select a single layer.
1108
- dimension: "2d",
1109
- baseMipLevel: mipLevel,
1110
- mipLevelCount: 1,
1111
- baseArrayLayer: layer,
1112
- arrayLayerCount: 1
1113
- });
1114
- }
1115
- if (gpuRenderTarget.msaaTextures[i]) {
1116
- resolveTarget = view;
1117
- view = this._renderer.texture.getTextureView(
1118
- gpuRenderTarget.msaaTextures[i]
1119
- );
1120
- }
1121
- const loadOp = clear & CLEAR.COLOR ? "clear" : "load";
1122
- clearValue ?? (clearValue = renderTargetSystem.defaultClearColor);
1123
- return {
1124
- view,
1125
- resolveTarget,
1126
- clearValue,
1127
- storeOp: "store",
1128
- loadOp
1129
- };
1130
- }
1131
- );
1132
- let depthStencilAttachment;
1133
- if ((renderTarget.stencil || renderTarget.depth) && !renderTarget.depthStencilTexture) {
1134
- renderTarget.ensureDepthStencilTexture();
1135
- renderTarget.depthStencilTexture.source.sampleCount = gpuRenderTarget.msaa ? 4 : 1;
1136
- }
1137
- if (renderTarget.depthStencilTexture) {
1138
- const stencilLoadOp = clear & CLEAR.STENCIL ? "clear" : "load";
1139
- const depthLoadOp = clear & CLEAR.DEPTH ? "clear" : "load";
1140
- depthStencilAttachment = {
1141
- view: this._renderer.texture.getGpuSource(renderTarget.depthStencilTexture.source).createView({
1142
- dimension: "2d",
1143
- baseMipLevel: mipLevel,
1144
- mipLevelCount: 1,
1145
- baseArrayLayer: layer,
1146
- arrayLayerCount: 1
1147
- }),
1148
- stencilStoreOp: "store",
1149
- stencilLoadOp,
1150
- depthClearValue: 1,
1151
- depthLoadOp,
1152
- depthStoreOp: "store"
1153
- };
1154
- }
1155
- const descriptor = {
1156
- colorAttachments,
1157
- depthStencilAttachment
1158
- };
1159
- return descriptor;
1160
- }
1161
- clear(renderTarget, clear = true, clearColor, viewport, mipLevel = 0, layer = 0) {
1162
- if (!clear) return;
1163
- const { gpu, encoder } = this._renderer;
1164
- const device = gpu.device;
1165
- const standAlone = encoder.commandEncoder === null;
1166
- if (standAlone) {
1167
- const commandEncoder = device.createCommandEncoder();
1168
- const renderPassDescriptor = this.getDescriptor(renderTarget, clear, clearColor, mipLevel, layer);
1169
- const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
1170
- passEncoder.setViewport(viewport.x, viewport.y, viewport.width, viewport.height, 0, 1);
1171
- passEncoder.end();
1172
- const gpuCommands = commandEncoder.finish();
1173
- device.queue.submit([gpuCommands]);
1174
- } else {
1175
- this.startRenderPass(renderTarget, clear, clearColor, viewport, mipLevel, layer);
1176
- }
1177
- }
1178
- initGpuRenderTarget(renderTarget) {
1179
- renderTarget.isRoot = true;
1180
- const gpuRenderTarget = new GpuRenderTarget();
1181
- gpuRenderTarget.colorTargetCount = renderTarget.colorTextures.length;
1182
- renderTarget.colorTextures.forEach((colorTexture, i) => {
1183
- if (colorTexture instanceof CanvasSource) {
1184
- const context = colorTexture.resource.getContext(
1185
- "webgpu"
1186
- );
1187
- const alphaMode = colorTexture.transparent ? "premultiplied" : "opaque";
1188
- try {
1189
- context.configure({
1190
- device: this._renderer.gpu.device,
1191
- usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC,
1192
- format: "bgra8unorm",
1193
- alphaMode
1194
- });
1195
- } catch (e) {
1196
- console.error(e);
1197
- }
1198
- gpuRenderTarget.contexts[i] = context;
1199
- }
1200
- gpuRenderTarget.msaa = colorTexture.source.antialias;
1201
- if (colorTexture.source.antialias) {
1202
- const msaaTexture = new TextureSource({
1203
- width: 0,
1204
- height: 0,
1205
- sampleCount: 4,
1206
- arrayLayerCount: colorTexture.source.arrayLayerCount
1207
- });
1208
- gpuRenderTarget.msaaTextures[i] = msaaTexture;
1209
- }
1210
- });
1211
- if (gpuRenderTarget.msaa) {
1212
- gpuRenderTarget.msaaSamples = 4;
1213
- if (renderTarget.depthStencilTexture) {
1214
- renderTarget.depthStencilTexture.source.sampleCount = 4;
1215
- }
1216
- }
1217
- return gpuRenderTarget;
1218
- }
1219
- destroyGpuRenderTarget(gpuRenderTarget) {
1220
- gpuRenderTarget.contexts.forEach((context) => {
1221
- context.unconfigure();
1222
- });
1223
- gpuRenderTarget.msaaTextures.forEach((texture) => {
1224
- texture.destroy();
1225
- });
1226
- gpuRenderTarget.msaaTextures.length = 0;
1227
- gpuRenderTarget.contexts.length = 0;
1228
- }
1229
- ensureDepthStencilTexture(renderTarget) {
1230
- const gpuRenderTarget = this._renderTargetSystem.getGpuRenderTarget(renderTarget);
1231
- if (renderTarget.depthStencilTexture && gpuRenderTarget.msaa) {
1232
- renderTarget.depthStencilTexture.source.sampleCount = 4;
1233
- }
1234
- }
1235
- resizeGpuRenderTarget(renderTarget) {
1236
- const gpuRenderTarget = this._renderTargetSystem.getGpuRenderTarget(renderTarget);
1237
- gpuRenderTarget.width = renderTarget.width;
1238
- gpuRenderTarget.height = renderTarget.height;
1239
- if (gpuRenderTarget.msaa) {
1240
- renderTarget.colorTextures.forEach((colorTexture, i) => {
1241
- const msaaTexture = gpuRenderTarget.msaaTextures[i];
1242
- msaaTexture == null ? void 0 : msaaTexture.resize(
1243
- colorTexture.source.width,
1244
- colorTexture.source.height,
1245
- colorTexture.source._resolution
1246
- );
1247
- });
1248
- }
1249
- }
1250
- }
1251
- class GpuRenderTargetSystem extends RenderTargetSystem {
1252
- constructor(renderer) {
1253
- super(renderer);
1254
- this.adaptor = new GpuRenderTargetAdaptor();
1255
- this.adaptor.init(renderer, this);
1256
- }
1257
- }
1258
- GpuRenderTargetSystem.extension = {
1259
- type: [ExtensionType.WebGPUSystem],
1260
- name: "renderTarget"
1261
- };
1262
- class GpuShaderSystem {
1263
- constructor() {
1264
- this._gpuProgramData = /* @__PURE__ */ Object.create(null);
1265
- }
1266
- contextChange(gpu) {
1267
- this._gpu = gpu;
1268
- }
1269
- getProgramData(program) {
1270
- return this._gpuProgramData[program._layoutKey] || this._createGPUProgramData(program);
1271
- }
1272
- _createGPUProgramData(program) {
1273
- const device = this._gpu.device;
1274
- const bindGroups = program.gpuLayout.map((group) => device.createBindGroupLayout({ entries: group }));
1275
- const pipelineLayoutDesc = { bindGroupLayouts: bindGroups };
1276
- this._gpuProgramData[program._layoutKey] = {
1277
- bindGroups,
1278
- pipeline: device.createPipelineLayout(pipelineLayoutDesc)
1279
- };
1280
- return this._gpuProgramData[program._layoutKey];
1281
- }
1282
- destroy() {
1283
- this._gpu = null;
1284
- this._gpuProgramData = null;
1285
- }
1286
- }
1287
- GpuShaderSystem.extension = {
1288
- type: [
1289
- ExtensionType.WebGPUSystem
1290
- ],
1291
- name: "shader"
1292
- };
1293
- const GpuBlendModesToPixi = {};
1294
- GpuBlendModesToPixi.normal = {
1295
- alpha: {
1296
- srcFactor: "one",
1297
- dstFactor: "one-minus-src-alpha",
1298
- operation: "add"
1299
- },
1300
- color: {
1301
- srcFactor: "one",
1302
- dstFactor: "one-minus-src-alpha",
1303
- operation: "add"
1304
- }
1305
- };
1306
- GpuBlendModesToPixi.add = {
1307
- alpha: {
1308
- srcFactor: "src-alpha",
1309
- dstFactor: "one-minus-src-alpha",
1310
- operation: "add"
1311
- },
1312
- color: {
1313
- srcFactor: "one",
1314
- dstFactor: "one",
1315
- operation: "add"
1316
- }
1317
- };
1318
- GpuBlendModesToPixi.multiply = {
1319
- alpha: {
1320
- srcFactor: "one",
1321
- dstFactor: "one-minus-src-alpha",
1322
- operation: "add"
1323
- },
1324
- color: {
1325
- srcFactor: "dst",
1326
- dstFactor: "one-minus-src-alpha",
1327
- operation: "add"
1328
- }
1329
- };
1330
- GpuBlendModesToPixi.screen = {
1331
- alpha: {
1332
- srcFactor: "one",
1333
- dstFactor: "one-minus-src-alpha",
1334
- operation: "add"
1335
- },
1336
- color: {
1337
- srcFactor: "one",
1338
- dstFactor: "one-minus-src",
1339
- operation: "add"
1340
- }
1341
- };
1342
- GpuBlendModesToPixi.overlay = {
1343
- alpha: {
1344
- srcFactor: "one",
1345
- dstFactor: "one-minus-src-alpha",
1346
- operation: "add"
1347
- },
1348
- color: {
1349
- srcFactor: "one",
1350
- dstFactor: "one-minus-src",
1351
- operation: "add"
1352
- }
1353
- };
1354
- GpuBlendModesToPixi.none = {
1355
- alpha: {
1356
- srcFactor: "one",
1357
- dstFactor: "one-minus-src-alpha",
1358
- operation: "add"
1359
- },
1360
- color: {
1361
- srcFactor: "zero",
1362
- dstFactor: "zero",
1363
- operation: "add"
1364
- }
1365
- };
1366
- GpuBlendModesToPixi["normal-npm"] = {
1367
- alpha: {
1368
- srcFactor: "one",
1369
- dstFactor: "one-minus-src-alpha",
1370
- operation: "add"
1371
- },
1372
- color: {
1373
- srcFactor: "src-alpha",
1374
- dstFactor: "one-minus-src-alpha",
1375
- operation: "add"
1376
- }
1377
- };
1378
- GpuBlendModesToPixi["add-npm"] = {
1379
- alpha: {
1380
- srcFactor: "one",
1381
- dstFactor: "one",
1382
- operation: "add"
1383
- },
1384
- color: {
1385
- srcFactor: "src-alpha",
1386
- dstFactor: "one",
1387
- operation: "add"
1388
- }
1389
- };
1390
- GpuBlendModesToPixi["screen-npm"] = {
1391
- alpha: {
1392
- srcFactor: "one",
1393
- dstFactor: "one-minus-src-alpha",
1394
- operation: "add"
1395
- },
1396
- color: {
1397
- srcFactor: "src-alpha",
1398
- dstFactor: "one-minus-src",
1399
- operation: "add"
1400
- }
1401
- };
1402
- GpuBlendModesToPixi.erase = {
1403
- alpha: {
1404
- srcFactor: "zero",
1405
- dstFactor: "one-minus-src-alpha",
1406
- operation: "add"
1407
- },
1408
- color: {
1409
- srcFactor: "zero",
1410
- dstFactor: "one-minus-src",
1411
- operation: "add"
1412
- }
1413
- };
1414
- GpuBlendModesToPixi.min = {
1415
- alpha: {
1416
- srcFactor: "one",
1417
- dstFactor: "one",
1418
- operation: "min"
1419
- },
1420
- color: {
1421
- srcFactor: "one",
1422
- dstFactor: "one",
1423
- operation: "min"
1424
- }
1425
- };
1426
- GpuBlendModesToPixi.max = {
1427
- alpha: {
1428
- srcFactor: "one",
1429
- dstFactor: "one",
1430
- operation: "max"
1431
- },
1432
- color: {
1433
- srcFactor: "one",
1434
- dstFactor: "one",
1435
- operation: "max"
1436
- }
1437
- };
1438
- class GpuStateSystem {
1439
- constructor() {
1440
- this.defaultState = new State();
1441
- this.defaultState.blend = true;
1442
- }
1443
- contextChange(gpu) {
1444
- this.gpu = gpu;
1445
- }
1446
- /**
1447
- * Gets the blend mode data for the current state
1448
- * @param state - The state to get the blend mode from
1449
- * @param count - The number of color targets to create
1450
- */
1451
- getColorTargets(state, count) {
1452
- const blend = GpuBlendModesToPixi[state.blendMode] || GpuBlendModesToPixi.normal;
1453
- const targets = [];
1454
- const target = {
1455
- format: "bgra8unorm",
1456
- writeMask: 0,
1457
- blend
1458
- };
1459
- for (let i = 0; i < count; i++) {
1460
- targets[i] = target;
1461
- }
1462
- return targets;
1463
- }
1464
- destroy() {
1465
- this.gpu = null;
1466
- }
1467
- }
1468
- GpuStateSystem.extension = {
1469
- type: [
1470
- ExtensionType.WebGPUSystem
1471
- ],
1472
- name: "state"
1473
- };
1474
- const gpuUploadBufferImageResource = {
1475
- type: "image",
1476
- upload(source, gpuTexture, gpu, originZOverride = 0) {
1477
- const resource = source.resource;
1478
- const total = (source.pixelWidth | 0) * (source.pixelHeight | 0);
1479
- const bytesPerPixel = resource.byteLength / total;
1480
- gpu.device.queue.writeTexture(
1481
- { texture: gpuTexture, origin: { x: 0, y: 0, z: originZOverride } },
1482
- resource,
1483
- {
1484
- offset: 0,
1485
- rowsPerImage: source.pixelHeight,
1486
- bytesPerRow: source.pixelWidth * bytesPerPixel
1487
- },
1488
- {
1489
- width: source.pixelWidth,
1490
- height: source.pixelHeight,
1491
- depthOrArrayLayers: 1
1492
- }
1493
- );
1494
- }
1495
- };
1496
- const blockDataMap = {
1497
- "bc1-rgba-unorm": { blockBytes: 8, blockWidth: 4, blockHeight: 4 },
1498
- "bc2-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
1499
- "bc3-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
1500
- "bc7-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
1501
- "etc1-rgb-unorm": { blockBytes: 8, blockWidth: 4, blockHeight: 4 },
1502
- "etc2-rgba8unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
1503
- "astc-4x4-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 }
1504
- };
1505
- const defaultBlockData = { blockBytes: 4, blockWidth: 1, blockHeight: 1 };
1506
- const gpuUploadCompressedTextureResource = {
1507
- type: "compressed",
1508
- upload(source, gpuTexture, gpu, originZOverride = 0) {
1509
- let mipWidth = source.pixelWidth;
1510
- let mipHeight = source.pixelHeight;
1511
- const blockData = blockDataMap[source.format] || defaultBlockData;
1512
- for (let i = 0; i < source.resource.length; i++) {
1513
- const levelBuffer = source.resource[i];
1514
- const bytesPerRow = Math.ceil(mipWidth / blockData.blockWidth) * blockData.blockBytes;
1515
- gpu.device.queue.writeTexture(
1516
- {
1517
- texture: gpuTexture,
1518
- mipLevel: i,
1519
- origin: { x: 0, y: 0, z: originZOverride }
1520
- },
1521
- levelBuffer,
1522
- {
1523
- offset: 0,
1524
- bytesPerRow
1525
- },
1526
- {
1527
- width: Math.ceil(mipWidth / blockData.blockWidth) * blockData.blockWidth,
1528
- height: Math.ceil(mipHeight / blockData.blockHeight) * blockData.blockHeight,
1529
- depthOrArrayLayers: 1
1530
- }
1531
- );
1532
- mipWidth = Math.max(mipWidth >> 1, 1);
1533
- mipHeight = Math.max(mipHeight >> 1, 1);
1534
- }
1535
- }
1536
- };
1537
- const FACE_ORDER = ["right", "left", "top", "bottom", "front", "back"];
1538
- function createGpuUploadCubeTextureResource(uploaders) {
1539
- return {
1540
- type: "cube",
1541
- upload(source, gpuTexture, gpu) {
1542
- const faces = source.faces;
1543
- for (let i = 0; i < FACE_ORDER.length; i++) {
1544
- const key = FACE_ORDER[i];
1545
- const face = faces[key];
1546
- const uploader = uploaders[face.uploadMethodId] || uploaders.image;
1547
- uploader.upload(face, gpuTexture, gpu, i);
1548
- }
1549
- }
1550
- };
1551
- }
1552
- const gpuUploadImageResource = {
1553
- type: "image",
1554
- upload(source, gpuTexture, gpu, originZOverride = 0) {
1555
- const resource = source.resource;
1556
- if (!resource) return;
1557
- if (globalThis.HTMLImageElement && resource instanceof HTMLImageElement) {
1558
- const canvas = DOMAdapter.get().createCanvas(resource.width, resource.height);
1559
- const context = canvas.getContext("2d");
1560
- context.drawImage(resource, 0, 0, resource.width, resource.height);
1561
- source.resource = canvas;
1562
- warn("ImageSource: Image element passed, converting to canvas and replacing resource.");
1563
- }
1564
- const width = Math.min(gpuTexture.width, source.resourceWidth || source.pixelWidth);
1565
- const height = Math.min(gpuTexture.height, source.resourceHeight || source.pixelHeight);
1566
- const premultipliedAlpha = source.alphaMode === "premultiply-alpha-on-upload";
1567
- gpu.device.queue.copyExternalImageToTexture(
1568
- { source: resource },
1569
- { texture: gpuTexture, origin: { x: 0, y: 0, z: originZOverride }, premultipliedAlpha },
1570
- {
1571
- width,
1572
- height
1573
- }
1574
- );
1575
- }
1576
- };
1577
- const gpuUploadVideoResource = {
1578
- type: "video",
1579
- upload(source, gpuTexture, gpu, originZOverride) {
1580
- gpuUploadImageResource.upload(source, gpuTexture, gpu, originZOverride);
1581
- }
1582
- };
1583
- class GpuMipmapGenerator {
1584
- constructor(device) {
1585
- this.device = device;
1586
- this.sampler = device.createSampler({ minFilter: "linear" });
1587
- this.pipelines = {};
1588
- }
1589
- _getMipmapPipeline(format) {
1590
- let pipeline = this.pipelines[format];
1591
- if (!pipeline) {
1592
- if (!this.mipmapShaderModule) {
1593
- this.mipmapShaderModule = this.device.createShaderModule({
1594
- code: (
1595
- /* wgsl */
1596
- `
1597
- var<private> pos : array<vec2<f32>, 3> = array<vec2<f32>, 3>(
1598
- vec2<f32>(-1.0, -1.0), vec2<f32>(-1.0, 3.0), vec2<f32>(3.0, -1.0));
1599
-
1600
- struct VertexOutput {
1601
- @builtin(position) position : vec4<f32>,
1602
- @location(0) texCoord : vec2<f32>,
1603
- };
1604
-
1605
- @vertex
1606
- fn vertexMain(@builtin(vertex_index) vertexIndex : u32) -> VertexOutput {
1607
- var output : VertexOutput;
1608
- output.texCoord = pos[vertexIndex] * vec2<f32>(0.5, -0.5) + vec2<f32>(0.5);
1609
- output.position = vec4<f32>(pos[vertexIndex], 0.0, 1.0);
1610
- return output;
1611
- }
1612
-
1613
- @group(0) @binding(0) var imgSampler : sampler;
1614
- @group(0) @binding(1) var img : texture_2d<f32>;
1615
-
1616
- @fragment
1617
- fn fragmentMain(@location(0) texCoord : vec2<f32>) -> @location(0) vec4<f32> {
1618
- return textureSample(img, imgSampler, texCoord);
1619
- }
1620
- `
1621
- )
1622
- });
1623
- }
1624
- pipeline = this.device.createRenderPipeline({
1625
- layout: "auto",
1626
- vertex: {
1627
- module: this.mipmapShaderModule,
1628
- entryPoint: "vertexMain"
1629
- },
1630
- fragment: {
1631
- module: this.mipmapShaderModule,
1632
- entryPoint: "fragmentMain",
1633
- targets: [{ format }]
1634
- }
1635
- });
1636
- this.pipelines[format] = pipeline;
1637
- }
1638
- return pipeline;
1639
- }
1640
- /**
1641
- * Generates mipmaps for the given GPUTexture from the data in level 0.
1642
- * @param {module:External.GPUTexture} texture - Texture to generate mipmaps for.
1643
- * @returns {module:External.GPUTexture} - The originally passed texture
1644
- */
1645
- generateMipmap(texture) {
1646
- const pipeline = this._getMipmapPipeline(texture.format);
1647
- if (texture.dimension === "3d" || texture.dimension === "1d") {
1648
- throw new Error("Generating mipmaps for non-2d textures is currently unsupported!");
1649
- }
1650
- let mipTexture = texture;
1651
- const arrayLayerCount = texture.depthOrArrayLayers || 1;
1652
- const renderToSource = texture.usage & GPUTextureUsage.RENDER_ATTACHMENT;
1653
- if (!renderToSource) {
1654
- const mipTextureDescriptor = {
1655
- size: {
1656
- width: Math.ceil(texture.width / 2),
1657
- height: Math.ceil(texture.height / 2),
1658
- depthOrArrayLayers: arrayLayerCount
1659
- },
1660
- format: texture.format,
1661
- usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_SRC | GPUTextureUsage.RENDER_ATTACHMENT,
1662
- mipLevelCount: texture.mipLevelCount - 1
1663
- };
1664
- mipTexture = this.device.createTexture(mipTextureDescriptor);
1665
- }
1666
- const commandEncoder = this.device.createCommandEncoder({});
1667
- const bindGroupLayout = pipeline.getBindGroupLayout(0);
1668
- for (let arrayLayer = 0; arrayLayer < arrayLayerCount; ++arrayLayer) {
1669
- let srcView = texture.createView({
1670
- baseMipLevel: 0,
1671
- mipLevelCount: 1,
1672
- dimension: "2d",
1673
- baseArrayLayer: arrayLayer,
1674
- arrayLayerCount: 1
1675
- });
1676
- let dstMipLevel = renderToSource ? 1 : 0;
1677
- for (let i = 1; i < texture.mipLevelCount; ++i) {
1678
- const dstView = mipTexture.createView({
1679
- baseMipLevel: dstMipLevel++,
1680
- mipLevelCount: 1,
1681
- dimension: "2d",
1682
- baseArrayLayer: arrayLayer,
1683
- arrayLayerCount: 1
1684
- });
1685
- const passEncoder = commandEncoder.beginRenderPass({
1686
- colorAttachments: [{
1687
- view: dstView,
1688
- storeOp: "store",
1689
- loadOp: "clear",
1690
- clearValue: { r: 0, g: 0, b: 0, a: 0 }
1691
- }]
1692
- });
1693
- const bindGroup = this.device.createBindGroup({
1694
- layout: bindGroupLayout,
1695
- entries: [{
1696
- binding: 0,
1697
- resource: this.sampler
1698
- }, {
1699
- binding: 1,
1700
- resource: srcView
1701
- }]
1702
- });
1703
- passEncoder.setPipeline(pipeline);
1704
- passEncoder.setBindGroup(0, bindGroup);
1705
- passEncoder.draw(3, 1, 0, 0);
1706
- passEncoder.end();
1707
- srcView = dstView;
1708
- }
1709
- }
1710
- if (!renderToSource) {
1711
- const mipLevelSize = {
1712
- width: Math.ceil(texture.width / 2),
1713
- height: Math.ceil(texture.height / 2),
1714
- depthOrArrayLayers: arrayLayerCount
1715
- };
1716
- for (let i = 1; i < texture.mipLevelCount; ++i) {
1717
- commandEncoder.copyTextureToTexture({
1718
- texture: mipTexture,
1719
- mipLevel: i - 1
1720
- }, {
1721
- texture,
1722
- mipLevel: i
1723
- }, mipLevelSize);
1724
- mipLevelSize.width = Math.ceil(mipLevelSize.width / 2);
1725
- mipLevelSize.height = Math.ceil(mipLevelSize.height / 2);
1726
- }
1727
- }
1728
- this.device.queue.submit([commandEncoder.finish()]);
1729
- if (!renderToSource) {
1730
- mipTexture.destroy();
1731
- }
1732
- return texture;
1733
- }
1734
- }
1735
- class GPUTextureGpuData {
1736
- constructor(gpuTexture) {
1737
- this.textureView = null;
1738
- this.gpuTexture = gpuTexture;
1739
- }
1740
- /** Destroys this GPU data instance. */
1741
- destroy() {
1742
- this.gpuTexture.destroy();
1743
- this.textureView = null;
1744
- this.gpuTexture = null;
1745
- }
1746
- }
1747
- class GpuTextureSystem {
1748
- constructor(renderer) {
1749
- this._gpuSamplers = /* @__PURE__ */ Object.create(null);
1750
- this._bindGroupHash = /* @__PURE__ */ Object.create(null);
1751
- this._renderer = renderer;
1752
- renderer.gc.addCollection(this, "_bindGroupHash", "hash");
1753
- this._managedTextures = new GCManagedHash({
1754
- renderer,
1755
- type: "resource",
1756
- onUnload: this.onSourceUnload.bind(this),
1757
- name: "gpuTextureSource"
1758
- });
1759
- const baseUploaders = {
1760
- image: gpuUploadImageResource,
1761
- buffer: gpuUploadBufferImageResource,
1762
- video: gpuUploadVideoResource,
1763
- compressed: gpuUploadCompressedTextureResource
1764
- };
1765
- this._uploads = {
1766
- ...baseUploaders,
1767
- cube: createGpuUploadCubeTextureResource(baseUploaders)
1768
- };
1769
- }
1770
- /**
1771
- * @deprecated since 8.15.0
1772
- */
1773
- get managedTextures() {
1774
- return Object.values(this._managedTextures.items);
1775
- }
1776
- contextChange(gpu) {
1777
- this._gpu = gpu;
1778
- }
1779
- /**
1780
- * Initializes a texture source, if it has already been initialized nothing will happen.
1781
- * @param source - The texture source to initialize.
1782
- * @returns The initialized texture source.
1783
- */
1784
- initSource(source) {
1785
- var _a;
1786
- return ((_a = source._gpuData[this._renderer.uid]) == null ? void 0 : _a.gpuTexture) || this._initSource(source);
1787
- }
1788
- _initSource(source) {
1789
- if (source.autoGenerateMipmaps) {
1790
- const biggestDimension = Math.max(source.pixelWidth, source.pixelHeight);
1791
- source.mipLevelCount = Math.floor(Math.log2(biggestDimension)) + 1;
1792
- }
1793
- let usage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST;
1794
- if (source.uploadMethodId !== "compressed") {
1795
- usage |= GPUTextureUsage.RENDER_ATTACHMENT;
1796
- usage |= GPUTextureUsage.COPY_SRC;
1797
- }
1798
- const blockData = blockDataMap[source.format] || { blockWidth: 1, blockHeight: 1 };
1799
- const width = Math.ceil(source.pixelWidth / blockData.blockWidth) * blockData.blockWidth;
1800
- const height = Math.ceil(source.pixelHeight / blockData.blockHeight) * blockData.blockHeight;
1801
- const textureDescriptor = {
1802
- label: source.label,
1803
- size: { width, height, depthOrArrayLayers: source.arrayLayerCount },
1804
- format: source.format,
1805
- sampleCount: source.sampleCount,
1806
- mipLevelCount: source.mipLevelCount,
1807
- dimension: source.dimension,
1808
- usage
1809
- };
1810
- const gpuTexture = this._gpu.device.createTexture(textureDescriptor);
1811
- source._gpuData[this._renderer.uid] = new GPUTextureGpuData(gpuTexture);
1812
- const added = this._managedTextures.add(source);
1813
- if (added) {
1814
- source.on("update", this.onSourceUpdate, this);
1815
- source.on("resize", this.onSourceResize, this);
1816
- source.on("updateMipmaps", this.onUpdateMipmaps, this);
1817
- }
1818
- this.onSourceUpdate(source);
1819
- return gpuTexture;
1820
- }
1821
- onSourceUpdate(source) {
1822
- const gpuTexture = this.getGpuSource(source);
1823
- if (!gpuTexture) return;
1824
- if (this._uploads[source.uploadMethodId]) {
1825
- this._uploads[source.uploadMethodId].upload(source, gpuTexture, this._gpu);
1826
- }
1827
- if (source.autoGenerateMipmaps && source.mipLevelCount > 1) {
1828
- this.onUpdateMipmaps(source);
1829
- }
1830
- }
1831
- onUpdateMipmaps(source) {
1832
- if (!this._mipmapGenerator) {
1833
- this._mipmapGenerator = new GpuMipmapGenerator(this._gpu.device);
1834
- }
1835
- const gpuTexture = this.getGpuSource(source);
1836
- this._mipmapGenerator.generateMipmap(gpuTexture);
1837
- }
1838
- onSourceUnload(source) {
1839
- source.off("update", this.onSourceUpdate, this);
1840
- source.off("resize", this.onSourceResize, this);
1841
- source.off("updateMipmaps", this.onUpdateMipmaps, this);
1842
- }
1843
- onSourceResize(source) {
1844
- source._gcLastUsed = this._renderer.gc.now;
1845
- const gpuData = source._gpuData[this._renderer.uid];
1846
- const gpuTexture = gpuData == null ? void 0 : gpuData.gpuTexture;
1847
- if (!gpuTexture) {
1848
- this.initSource(source);
1849
- } else if (gpuTexture.width !== source.pixelWidth || gpuTexture.height !== source.pixelHeight) {
1850
- gpuData.destroy();
1851
- this._bindGroupHash[source.uid] = null;
1852
- source._gpuData[this._renderer.uid] = null;
1853
- this.initSource(source);
1854
- }
1855
- }
1856
- _initSampler(sampler) {
1857
- this._gpuSamplers[sampler._resourceId] = this._gpu.device.createSampler(sampler);
1858
- return this._gpuSamplers[sampler._resourceId];
1859
- }
1860
- getGpuSampler(sampler) {
1861
- return this._gpuSamplers[sampler._resourceId] || this._initSampler(sampler);
1862
- }
1863
- getGpuSource(source) {
1864
- var _a;
1865
- source._gcLastUsed = this._renderer.gc.now;
1866
- return ((_a = source._gpuData[this._renderer.uid]) == null ? void 0 : _a.gpuTexture) || this.initSource(source);
1867
- }
1868
- /**
1869
- * this returns s bind group for a specific texture, the bind group contains
1870
- * - the texture source
1871
- * - the texture style
1872
- * - the texture matrix
1873
- * This is cached so the bind group should only be created once per texture
1874
- * @param texture - the texture you want the bindgroup for
1875
- * @returns the bind group for the texture
1876
- */
1877
- getTextureBindGroup(texture) {
1878
- return this._bindGroupHash[texture.uid] || this._createTextureBindGroup(texture);
1879
- }
1880
- _createTextureBindGroup(texture) {
1881
- const source = texture.source;
1882
- this._bindGroupHash[texture.uid] = new BindGroup({
1883
- 0: source,
1884
- 1: source.style,
1885
- 2: new UniformGroup({
1886
- uTextureMatrix: { type: "mat3x3<f32>", value: texture.textureMatrix.mapCoord }
1887
- })
1888
- });
1889
- return this._bindGroupHash[texture.uid];
1890
- }
1891
- getTextureView(texture) {
1892
- const source = texture.source;
1893
- source._gcLastUsed = this._renderer.gc.now;
1894
- let gpuData = source._gpuData[this._renderer.uid];
1895
- if (!gpuData) {
1896
- this.initSource(source);
1897
- gpuData = source._gpuData[this._renderer.uid];
1898
- }
1899
- gpuData.textureView || (gpuData.textureView = gpuData.gpuTexture.createView({ dimension: source.viewDimension }));
1900
- return gpuData.textureView;
1901
- }
1902
- generateCanvas(texture) {
1903
- const renderer = this._renderer;
1904
- const commandEncoder = renderer.gpu.device.createCommandEncoder();
1905
- const canvas = DOMAdapter.get().createCanvas();
1906
- canvas.width = texture.source.pixelWidth;
1907
- canvas.height = texture.source.pixelHeight;
1908
- const context = canvas.getContext("webgpu");
1909
- context.configure({
1910
- device: renderer.gpu.device,
1911
- usage: GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC,
1912
- format: DOMAdapter.get().getNavigator().gpu.getPreferredCanvasFormat(),
1913
- alphaMode: "premultiplied"
1914
- });
1915
- commandEncoder.copyTextureToTexture({
1916
- texture: renderer.texture.getGpuSource(texture.source),
1917
- origin: {
1918
- x: 0,
1919
- y: 0
1920
- }
1921
- }, {
1922
- texture: context.getCurrentTexture()
1923
- }, {
1924
- width: canvas.width,
1925
- height: canvas.height
1926
- });
1927
- renderer.gpu.device.queue.submit([commandEncoder.finish()]);
1928
- return canvas;
1929
- }
1930
- getPixels(texture) {
1931
- const webGPUCanvas = this.generateCanvas(texture);
1932
- const canvasAndContext = CanvasPool.getOptimalCanvasAndContext(webGPUCanvas.width, webGPUCanvas.height);
1933
- const context = canvasAndContext.context;
1934
- context.drawImage(webGPUCanvas, 0, 0);
1935
- const { width, height } = webGPUCanvas;
1936
- const imageData = context.getImageData(0, 0, width, height);
1937
- const pixels = new Uint8ClampedArray(imageData.data.buffer);
1938
- CanvasPool.returnCanvasAndContext(canvasAndContext);
1939
- return { pixels, width, height };
1940
- }
1941
- destroy() {
1942
- this._managedTextures.destroy();
1943
- for (const k of Object.keys(this._bindGroupHash)) {
1944
- const key = Number(k);
1945
- const bindGroup = this._bindGroupHash[key];
1946
- bindGroup == null ? void 0 : bindGroup.destroy();
1947
- }
1948
- this._renderer = null;
1949
- this._gpu = null;
1950
- this._mipmapGenerator = null;
1951
- this._gpuSamplers = null;
1952
- this._bindGroupHash = null;
1953
- }
1954
- }
1955
- GpuTextureSystem.extension = {
1956
- type: [
1957
- ExtensionType.WebGPUSystem
1958
- ],
1959
- name: "texture"
1960
- };
1961
- class GpuGraphicsAdaptor {
1962
- constructor() {
1963
- this._maxTextures = 0;
1964
- }
1965
- contextChange(renderer) {
1966
- const localUniforms = new UniformGroup({
1967
- uTransformMatrix: { value: new Matrix(), type: "mat3x3<f32>" },
1968
- uColor: { value: new Float32Array([1, 1, 1, 1]), type: "vec4<f32>" },
1969
- uRound: { value: 0, type: "f32" }
1970
- });
1971
- this._maxTextures = renderer.limits.maxBatchableTextures;
1972
- const gpuProgram = compileHighShaderGpuProgram({
1973
- name: "graphics",
1974
- bits: [
1975
- colorBit,
1976
- generateTextureBatchBit(this._maxTextures),
1977
- localUniformBitGroup2,
1978
- roundPixelsBit
1979
- ]
1980
- });
1981
- this.shader = new Shader({
1982
- gpuProgram,
1983
- resources: {
1984
- // added on the fly!
1985
- localUniforms
1986
- }
1987
- });
1988
- }
1989
- execute(graphicsPipe, renderable) {
1990
- const context = renderable.context;
1991
- const shader = context.customShader || this.shader;
1992
- const renderer = graphicsPipe.renderer;
1993
- const contextSystem = renderer.graphicsContext;
1994
- const {
1995
- batcher,
1996
- instructions
1997
- } = contextSystem.getContextRenderData(context);
1998
- const encoder = renderer.encoder;
1999
- encoder.setGeometry(batcher.geometry, shader.gpuProgram);
2000
- const globalUniformsBindGroup = renderer.globalUniforms.bindGroup;
2001
- encoder.setBindGroup(0, globalUniformsBindGroup, shader.gpuProgram);
2002
- const localBindGroup = renderer.renderPipes.uniformBatch.getUniformBindGroup(shader.resources.localUniforms, true);
2003
- encoder.setBindGroup(2, localBindGroup, shader.gpuProgram);
2004
- const batches = instructions.instructions;
2005
- let topology = null;
2006
- for (let i = 0; i < instructions.instructionSize; i++) {
2007
- const batch = batches[i];
2008
- if (batch.topology !== topology) {
2009
- topology = batch.topology;
2010
- encoder.setPipelineFromGeometryProgramAndState(
2011
- batcher.geometry,
2012
- shader.gpuProgram,
2013
- graphicsPipe.state,
2014
- batch.topology
2015
- );
2016
- }
2017
- shader.groups[1] = batch.bindGroup;
2018
- if (!batch.gpuBindGroup) {
2019
- const textureBatch = batch.textures;
2020
- batch.bindGroup = getTextureBatchBindGroup(
2021
- textureBatch.textures,
2022
- textureBatch.count,
2023
- this._maxTextures
2024
- );
2025
- batch.gpuBindGroup = renderer.bindGroup.getBindGroup(
2026
- batch.bindGroup,
2027
- shader.gpuProgram,
2028
- 1
2029
- );
2030
- }
2031
- encoder.setBindGroup(1, batch.bindGroup, shader.gpuProgram);
2032
- encoder.renderPassEncoder.drawIndexed(batch.size, 1, batch.start);
2033
- }
2034
- }
2035
- destroy() {
2036
- this.shader.destroy(true);
2037
- this.shader = null;
2038
- }
2039
- }
2040
- GpuGraphicsAdaptor.extension = {
2041
- type: [
2042
- ExtensionType.WebGPUPipesAdaptor
2043
- ],
2044
- name: "graphics"
2045
- };
2046
- class GpuMeshAdapter {
2047
- init() {
2048
- const gpuProgram = compileHighShaderGpuProgram({
2049
- name: "mesh",
2050
- bits: [
2051
- localUniformBit,
2052
- textureBit,
2053
- roundPixelsBit
2054
- ]
2055
- });
2056
- this._shader = new Shader({
2057
- gpuProgram,
2058
- resources: {
2059
- uTexture: Texture.EMPTY._source,
2060
- uSampler: Texture.EMPTY._source.style,
2061
- textureUniforms: {
2062
- uTextureMatrix: { type: "mat3x3<f32>", value: new Matrix() }
2063
- }
2064
- }
2065
- });
2066
- }
2067
- execute(meshPipe, mesh) {
2068
- const renderer = meshPipe.renderer;
2069
- let shader = mesh._shader;
2070
- if (!shader) {
2071
- shader = this._shader;
2072
- shader.groups[2] = renderer.texture.getTextureBindGroup(mesh.texture);
2073
- } else if (!shader.gpuProgram) {
2074
- warn("Mesh shader has no gpuProgram", mesh.shader);
2075
- return;
2076
- }
2077
- const gpuProgram = shader.gpuProgram;
2078
- if (gpuProgram.autoAssignGlobalUniforms) {
2079
- shader.groups[0] = renderer.globalUniforms.bindGroup;
2080
- }
2081
- if (gpuProgram.autoAssignLocalUniforms) {
2082
- const localUniforms = meshPipe.localUniforms;
2083
- shader.groups[1] = renderer.renderPipes.uniformBatch.getUniformBindGroup(localUniforms, true);
2084
- }
2085
- renderer.encoder.draw({
2086
- geometry: mesh._geometry,
2087
- shader,
2088
- state: mesh.state
2089
- });
2090
- }
2091
- destroy() {
2092
- this._shader.destroy(true);
2093
- this._shader = null;
2094
- }
2095
- }
2096
- GpuMeshAdapter.extension = {
2097
- type: [
2098
- ExtensionType.WebGPUPipesAdaptor
2099
- ],
2100
- name: "mesh"
2101
- };
2102
- const DefaultWebGPUSystems = [
2103
- ...SharedSystems,
2104
- GpuUboSystem,
2105
- GpuEncoderSystem,
2106
- GpuDeviceSystem,
2107
- GpuLimitsSystem,
2108
- GpuBufferSystem,
2109
- GpuTextureSystem,
2110
- GpuRenderTargetSystem,
2111
- GpuShaderSystem,
2112
- GpuStateSystem,
2113
- PipelineSystem,
2114
- GpuColorMaskSystem,
2115
- GpuStencilSystem,
2116
- BindGroupSystem
2117
- ];
2118
- const DefaultWebGPUPipes = [...SharedRenderPipes, GpuUniformBatchPipe];
2119
- const DefaultWebGPUAdapters = [GpuBatchAdaptor, GpuMeshAdapter, GpuGraphicsAdaptor];
2120
- const systems = [];
2121
- const renderPipes = [];
2122
- const renderPipeAdaptors = [];
2123
- extensions.handleByNamedList(ExtensionType.WebGPUSystem, systems);
2124
- extensions.handleByNamedList(ExtensionType.WebGPUPipes, renderPipes);
2125
- extensions.handleByNamedList(ExtensionType.WebGPUPipesAdaptor, renderPipeAdaptors);
2126
- extensions.add(...DefaultWebGPUSystems, ...DefaultWebGPUPipes, ...DefaultWebGPUAdapters);
2127
- class WebGPURenderer extends AbstractRenderer {
2128
- constructor() {
2129
- const systemConfig = {
2130
- name: "webgpu",
2131
- type: RendererType.WEBGPU,
2132
- systems,
2133
- renderPipes,
2134
- renderPipeAdaptors
2135
- };
2136
- super(systemConfig);
2137
- }
2138
- }
2139
- export {
2140
- WebGPURenderer
2141
- };
2142
- //# sourceMappingURL=WebGPURenderer-kS6gO2Xc.js.map