🐈

index.js

@@ -1,17 +1,18 @@
+// index.js
+
 import { mat4 } from 'https://webgpufundamentals.org/3rdparty/wgpu-matrix.module.js';
 import { initializeWebGPU } from './wgpu-device.js';
 import { createState } from './wgpu-state.js';
 import { initializeTiming } from './wgpu-timing.js';
 import { createPipeline } from './wgpu-pipeline.js';
 import { generateGlyphTextureAtlas, createTextureFromSource } from './wgpu-utility.js';
-import { fetchShaderCode, InitializeShaders } from './wgpu-shader.js';
-import { GenerateVertexDataAndTexture } from './wgpu-texture.js'; 
-import { generateGlyphVerticesForText } from './wgpu-text.js'; 
+import { InitializeShaders } from './wgpu-shader.js';
+import { GenerateVertexDataAndTexture } from './wgpu-texture.js';
+import { generateGlyphVerticesForText } from './wgpu-text.js';
 import { config } from './wgpu-config.js';
 import { CANVAS, CTX, COLORS, RENDER_PASS_DESCRIPTOR } from './wgpu-constants.js';
 import { CreateBuffers } from './wgpu-buffer.js';
 
-// State initialization
 const state = createState(config);
 
 async function Main() {
@@ -23,14 +24,11 @@ async function Main() {
     state.webgpu.context = context;
     state.webgpu.presentationFormat = presentationFormat;
 
-    // Initialize timing properties
     initializeTiming(state);
 
-    // Initialize Shaders and Resources
     await InitializeShaders(state);
     await InitializeResources(state);
 
-    // Start the game loop
     GameLoop(state);
 }
 
@@ -38,7 +36,7 @@ async function InitializeResources(state) {
     const vertexSize = config.floatsPerVertex * 4;
 
     state.webgpu.pipeline = await createPipeline(state.webgpu.device, state.webgpu.presentationFormat, vertexSize, state.webgpu.shaderCode);
-    
+
     const glyphCanvas = generateGlyphTextureAtlas(CANVAS, CTX, config);
     document.body.appendChild(glyphCanvas);
     glyphCanvas.style.backgroundColor = '#222';
@@ -49,19 +47,18 @@ async function InitializeResources(state) {
 }
 
 function GameLoop(state) {
-    function Tick() {
+    function Tick(state) {
         state.timing.currentTime = performance.now();
         state.timing.frameTime = (state.timing.currentTime - state.timing.lastTime) / 1000;
         state.timing.lastTime = state.timing.currentTime;
-
         state.timing.deltaTime = Math.min(state.timing.frameTime, state.timing.maxFrameTime);
         state.timing.accumulator += state.timing.deltaTime;
 
         while (state.timing.accumulator >= state.timing.fixedDeltaTime) {
-            FixedUpdate(state.timing.fixedDeltaTime, state);
+            FixedUpdate(state);
             state.timing.accumulator -= state.timing.fixedDeltaTime;
         }
-
+        
         Render(state);
 
         setTimeout(() => Tick(state), state.timing.frameDuration);
@@ -70,8 +67,8 @@ function GameLoop(state) {
     Tick(state);
 }
 
-function FixedUpdate(deltaTime, state) {
-    state.timing.time += deltaTime;
+function FixedUpdate(state) {
+    state.timing.time += state.timing.fixedDeltaTime;
 }
 
 function Render(state) {
@@ -81,7 +78,6 @@ function Render(state) {
     const viewMatrix = mat4.lookAt([0, 0, 5], [0, 0, 0], [0, 1, 0]);
     const viewProjectionMatrix = mat4.multiply(projectionMatrix, viewMatrix);
     RENDER_PASS_DESCRIPTOR.colorAttachments[0].view = state.webgpu.context.getCurrentTexture().createView();
-
     const encoder = state.webgpu.device.createCommandEncoder();
     const pass = encoder.beginRenderPass(RENDER_PASS_DESCRIPTOR);
     pass.setPipeline(state.webgpu.pipeline);

wgpu-texture.js

@@ -25,7 +25,6 @@ export function GenerateVertexDataAndTexture(state, glyphCanvas, generateGlyphVe
         ],
     });
 
-    // Update state with glyph details
     state.glyphs.numGlyphs = glyphData.numGlyphs;
     state.glyphs.width = glyphData.width;
     state.glyphs.height = glyphData.height;