wgpu-texture.js

// 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;
}