fixed import for texture CDI

index.js

@@ -4,7 +4,8 @@ import { createState } from './wgpu-state.js';
 import { generateGlyphTextureAtlas, createTextureFromSource } from './wgpu-utility.js';
 import { createPipeline } from './wgpu-pipeline.js';
 import { fetchShaderCode } from './wgpu-shader.js';
-import { generateGlyphVerticesForText } from './wgpu-text.js';
+import { GenerateVertexDataAndTexture } from './wgpu-texture.js'; // Import the function
+import { generateGlyphVerticesForText } from './wgpu-text.js'; // Corrected import statement
 import { config } from './wgpu-config.js';
 import { CANVAS, CTX, COLORS, RENDER_PASS_DESCRIPTOR } from './wgpu-constants.js';
 
@@ -82,40 +83,6 @@ function GenerateIndices(maxGlyphs) {
     });
 }
 
-// Function to generate vertex data and texture
-function GenerateVertexDataAndTexture(state, glyphCanvas, generateGlyphVerticesForText, COLORS, config, createTextureFromSource) {
-    const glyphData = generateGlyphVerticesForText('Hello\nworld!\nText in\nWebGPU!', COLORS, config, glyphCanvas);
-    state.device.queue.writeBuffer(state.vertexBuffer, 0, glyphData.vertexData);
-
-    state.texture = createTextureFromSource(state.device, glyphCanvas, { mips: true });
-    state.sampler = state.device.createSampler({
-        minFilter: 'linear',
-        magFilter: 'linear',
-    });
-
-    state.uniformBuffer = state.device.createBuffer({
-        label: 'uniforms for quad',
-        size: config.uniformBufferSize,
-        usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
-    });
-
-    state.matrix = state.uniformValues.subarray(0, 16);
-
-    state.bindGroup = state.device.createBindGroup({
-        layout: state.pipeline.getBindGroupLayout(0),
-        entries: [
-            { binding: 0, resource: state.sampler },
-            { binding: 1, resource: state.texture.createView() },
-            { binding: 2, resource: { buffer: state.uniformBuffer } },
-        ],
-    });
-
-    // Update state with glyph details
-    state.numGlyphs = glyphData.numGlyphs;
-    state.width = glyphData.width;
-    state.height = glyphData.height;
-}
-
 // Game loop function
 function GameLoop(context) {
     let lastTime = performance.now();

wgpu-texture.js

@@ -0,0 +1,34 @@
+// wgpu-texture.js
+
+export function GenerateVertexDataAndTexture(state, glyphCanvas, generateGlyphVerticesForText, COLORS, config, createTextureFromSource) {
+    const glyphData = generateGlyphVerticesForText('Hello\nworld!\nText in\nWebGPU!', COLORS, config, glyphCanvas);
+    state.device.queue.writeBuffer(state.vertexBuffer, 0, glyphData.vertexData);
+
+    state.texture = createTextureFromSource(state.device, glyphCanvas, { mips: true });
+    state.sampler = state.device.createSampler({
+        minFilter: 'linear',
+        magFilter: 'linear',
+    });
+
+    state.uniformBuffer = state.device.createBuffer({
+        label: 'uniforms for quad',
+        size: config.uniformBufferSize,
+        usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
+    });
+
+    state.matrix = state.uniformValues.subarray(0, 16);
+
+    state.bindGroup = state.device.createBindGroup({
+        layout: state.pipeline.getBindGroupLayout(0),
+        entries: [
+            { binding: 0, resource: state.sampler },
+            { binding: 1, resource: state.texture.createView() },
+            { binding: 2, resource: { buffer: state.uniformBuffer } },
+        ],
+    });
+
+    // Update state with glyph details
+    state.numGlyphs = glyphData.numGlyphs;
+    state.width = glyphData.width;
+    state.height = glyphData.height;
+}