@erik9994857/cag 2.0.0 → 2.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@erik9994857/cag",
-  "version": "2.0.0",
+  "version": "2.0.3",
   "description": "CaG — A code library and custom language for building 3D worlds with .cagc files, .bbmodel support, and auto UV mapping",
   "main": "src/index.js",
   "bin": {

package/src/api/model-api.js

@@ -72,14 +72,26 @@ class ModelAPI {
       valid: false
     };
 
+    let embeddedTextures = [];
+
     if (resource.model) {
       const modelData = this.parseBBModel(resource.model);
       result.geometry = modelData.geometry;
       result.uvMappings = modelData.uvMappings;
+      embeddedTextures = modelData.embeddedTextures || [];
     }
 
     if (resource.texture) {
       result.texture = this.loadTexture(resource.texture);
+    } else if (embeddedTextures.length > 0) {
+      result.texture = {
+        path: null,
+        width: result.geometry ? result.geometry.resolution.width : 16,
+        height: result.geometry ? result.geometry.resolution.height : 16,
+        format: "png",
+        size: 0,
+        dataURL: embeddedTextures[0].source
+      };
     }
 
     if (result.geometry && result.texture && result.uvMappings) {
@@ -148,7 +160,21 @@ class ModelAPI {
       geometry.bones = this.parseOutliner(data.outliner);
     }
 
-    return { geometry, uvMappings };
+    const embeddedTextures = [];
+    if (data.textures && Array.isArray(data.textures)) {
+      for (let i = 0; i < data.textures.length; i++) {
+        const tex = data.textures[i];
+        if (tex.source) {
+          embeddedTextures.push({
+            index: tex.id !== undefined ? tex.id : i,
+            name: tex.name || "texture_" + i,
+            source: tex.source
+          });
+        }
+      }
+    }
+
+    return { geometry, uvMappings, embeddedTextures };
   }
 
   parseOutliner(outliner) {
@@ -191,12 +217,16 @@ class ModelAPI {
       }
     }
 
+    const base64 = buffer.toString("base64");
+    const mime = ext === ".png" ? "image/png" : (ext === ".jpg" || ext === ".jpeg") ? "image/jpeg" : "image/" + ext.substring(1);
+
     return {
       path: filePath,
       width: width,
       height: height,
       format: ext.substring(1),
-      size: buffer.length
+      size: buffer.length,
+      dataURL: "data:" + mime + ";base64," + base64
     };
   }
 
@@ -269,6 +299,10 @@ class ModelAPI {
   isModelLoaded(name) {
     return this.loadedModels[name] !== undefined;
   }
+
+  getLoadedModels() {
+    return this.loadedModels;
+  }
 }
 
 module.exports = ModelAPI;

package/src/cli/cag-cli.js

@@ -72,9 +72,6 @@ class CagCLI {
 
       this.printLine("Project: " + engine.getInfo().ID);
       this.printLine("Version: " + engine.getInfo().version);
-      this.printLine("Dependencies: " + engine.getDependencies().join(", "));
-      this.printLine("Code files: " + engine.getCodeFiles().length);
-      this.printLine("Resources: " + Object.keys(engine.getResourceMap()).length);
       this.printLine("");
 
       const CagcParser = require("../parser/cagc-parser");
@@ -91,26 +88,39 @@ class CagCLI {
         const fileName = path.basename(filePath);
         const content = fs.readFileSync(filePath, "utf-8");
 
-        this.printLine("Executing: " + fileName);
-
         const parsed = cagcParser.parse(content, fileName);
         const result = executor.execute(parsed);
 
         if (result.errors && result.errors.length > 0) {
           for (let j = 0; j < result.errors.length; j++) {
-            this.printError("  " + result.errors[j]);
+            this.printError(result.errors[j]);
           }
         }
+      }
 
-        if (result.outputs && result.outputs.length > 0) {
-          for (let j = 0; j < result.outputs.length; j++) {
-            this.printLine("  > " + result.outputs[j]);
+      const registry = executor.getRegistry();
+      if (registry.has("Model.API")) {
+        const modelAPI = registry.get("Model.API");
+        const loadedModels = modelAPI.getLoadedModels();
+        const modelNames = Object.keys(loadedModels);
+        if (modelNames.length > 0) {
+          this.printLine("Reading UV mapping...");
+          for (let i = 0; i < modelNames.length; i++) {
+            const name = modelNames[i];
+            const model = loadedModels[name];
+            if (model && model.valid && model.texture) {
+              this.printSuccess("Auto Mapped Custom UV for " + name);
+            } else if (model && model.valid) {
+              this.printLine("  " + name + " (no texture paired)");
+            } else {
+              this.printError("Failed to map UV for " + name);
+            }
           }
+          this.printLine("");
         }
       }
 
-      this.printLine("");
-      this.printSuccess("Execution complete. Launching game...");
+      this.printLine("Launching game...");
       this.printLine("");
 
       const settings = ElectronRunner.extractSettings(executor);

package/src/runtime/electron-runner.js

@@ -18,35 +18,37 @@ ElectronRunner.prototype.run = function () {
 };
 
 ElectronRunner.prototype.ensureDirectories = function () {
-  if (fs.existsSync(this.tempDir)) {
-    this.removeDirectory(this.tempDir);
-  }
   fs.mkdirSync(this.tempDir, { recursive: true });
 };
 
 ElectronRunner.prototype.generateApp = function () {
-  var pkg = {
-    name: "cag-runner",
-    version: "1.0.0",
-    main: "main.js",
-    dependencies: {}
-  };
-  fs.writeFileSync(path.join(this.tempDir, "package.json"), JSON.stringify(pkg, null, 2));
+  var pkgPath = path.join(this.tempDir, "package.json");
+  if (!fs.existsSync(pkgPath)) {
+    var pkg = {
+      name: "cag-runner",
+      version: "1.0.0",
+      main: "main.js",
+      dependencies: {}
+    };
+    fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2));
+  }
   fs.writeFileSync(path.join(this.tempDir, "main.js"), this.getMainProcessSource());
   fs.writeFileSync(path.join(this.tempDir, "index.html"), this.getRendererSource());
 };
 
 ElectronRunner.prototype.installAndLaunch = function () {
-  childProcess.execSync("npm install electron@latest --save --no-audit --no-fund", {
-    cwd: this.tempDir,
-    stdio: "inherit"
-  });
-
   var electronBin = path.join(this.tempDir, "node_modules", ".bin", "electron");
   if (process.platform === "win32") {
     electronBin = electronBin + ".cmd";
   }
 
+  if (!fs.existsSync(electronBin)) {
+    childProcess.execSync("npm install electron --save --no-audit --no-fund", {
+      cwd: this.tempDir,
+      stdio: "inherit"
+    });
+  }
+
   childProcess.execSync("\"" + electronBin + "\" .", {
     cwd: this.tempDir,
     stdio: "inherit",
@@ -147,15 +149,15 @@ ElectronRunner.prototype.getRendererSource = function () {
 
   var vsSrc = [
     "attribute vec3 aPos;",
-    "attribute vec3 aColor;",
+    "attribute vec2 aUV;",
     "attribute vec3 aNormal;",
     "uniform mat4 uProj;",
     "uniform mat4 uView;",
-    "varying vec3 vColor;",
+    "varying vec2 vUV;",
     "varying vec3 vNormal;",
     "varying vec3 vWorldPos;",
     "void main() {",
-    "  vColor = aColor;",
+    "  vUV = aUV;",
     "  vNormal = aNormal;",
     "  vWorldPos = aPos;",
     "  gl_Position = uProj * uView * vec4(aPos, 1.0);",
@@ -164,9 +166,10 @@ ElectronRunner.prototype.getRendererSource = function () {
 
   var fsSrc = [
     "precision mediump float;",
-    "varying vec3 vColor;",
+    "varying vec2 vUV;",
     "varying vec3 vNormal;",
     "varying vec3 vWorldPos;",
+    "uniform sampler2D uTexture;",
     "uniform vec3 uSunDir;",
     "uniform vec3 uSunColor;",
     "uniform vec3 uAmbient;",
@@ -175,13 +178,14 @@ ElectronRunner.prototype.getRendererSource = function () {
     "uniform float uFogFar;",
     "uniform vec3 uCamPos;",
     "void main() {",
+    "  vec4 texColor = texture2D(uTexture, vUV);",
     "  vec3 norm = normalize(vNormal);",
     "  float diff = max(dot(norm, normalize(uSunDir)), 0.0);",
-    "  vec3 lit = vColor * (uAmbient + uSunColor * diff);",
+    "  vec3 lit = texColor.rgb * (uAmbient + uSunColor * diff);",
     "  float dist = length(vWorldPos - uCamPos);",
     "  float fog = clamp((dist - uFogNear) / (uFogFar - uFogNear), 0.0, 1.0);",
     "  vec3 final = mix(lit, uFogColor, fog);",
-    "  gl_FragColor = vec4(final, 1.0);",
+    "  gl_FragColor = vec4(final, texColor.a);",
     "}"
   ].join("\\n");
 
@@ -193,6 +197,33 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("var VS_SRC = \"" + vsSrc + "\";");
   js.push("var FS_SRC = \"" + fsSrc + "\";");
   js.push("");
+
+  var modelDataForRenderer = {};
+  if (s.models) {
+    var sModelNames = Object.keys(s.models);
+    for (var mi = 0; mi < sModelNames.length; mi++) {
+      var smName = sModelNames[mi];
+      var smData = s.models[smName];
+      var faceUVMap = {};
+      if (smData.uvMappings) {
+        for (var ui = 0; ui < smData.uvMappings.length; ui++) {
+          var mapping = smData.uvMappings[ui];
+          if (!faceUVMap[mapping.face]) {
+            faceUVMap[mapping.face] = mapping.uv;
+          }
+        }
+      }
+      modelDataForRenderer[smName] = {
+        textureDataURL: smData.textureDataURL || null,
+        resW: smData.resolution ? smData.resolution.width : 16,
+        resH: smData.resolution ? smData.resolution.height : 16,
+        faceUV: faceUVMap
+      };
+    }
+  }
+  js.push("var MODELS = " + JSON.stringify(modelDataForRenderer) + ";");
+  js.push("");
+
   js.push("var game = {");
   js.push("  gl: null, canvas: null, program: null,");
   js.push("  camX: " + spX + ", camY: " + spY + ", camZ: " + spZ + ",");
@@ -225,34 +256,67 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("");
 
   // Face helper
-  js.push("function addFace(pos, col, nrm, v0, v1, v2, v3, color, normal) {");
+  js.push("function addFace(pos, uvArr, nrm, v0, v1, v2, v3, fuv, normal) {");
   js.push("  pos.push(v0[0],v0[1],v0[2], v1[0],v1[1],v1[2], v2[0],v2[1],v2[2]);");
   js.push("  pos.push(v0[0],v0[1],v0[2], v2[0],v2[1],v2[2], v3[0],v3[1],v3[2]);");
+  js.push("  uvArr.push(fuv[0],fuv[1], fuv[2],fuv[1], fuv[2],fuv[3]);");
+  js.push("  uvArr.push(fuv[0],fuv[1], fuv[2],fuv[3], fuv[0],fuv[3]);");
   js.push("  for (var i = 0; i < 6; i++) {");
-  js.push("    col.push(color[0], color[1], color[2]);");
   js.push("    nrm.push(normal[0], normal[1], normal[2]);");
   js.push("  }");
   js.push("}");
   js.push("");
 
+  // UV normalization helper
+  js.push("function normUV(faceUV, resW, resH) {");
+  js.push("  if (!faceUV) return [0, 1, 1, 0];");
+  js.push("  return [faceUV[0]/resW, 1.0-faceUV[1]/resH, faceUV[2]/resW, 1.0-faceUV[3]/resH];");
+  js.push("}");
+  js.push("");
+
+  // Get UV coordinates for a model by name (case-insensitive)
+  js.push("function getModelUVs(name) {");
+  js.push("  var ln = name.toLowerCase();");
+  js.push("  var keys = Object.keys(MODELS);");
+  js.push("  for (var i = 0; i < keys.length; i++) {");
+  js.push("    if (keys[i].toLowerCase() === ln) {");
+  js.push("      var m = MODELS[keys[i]];");
+  js.push("      var f = m.faceUV || {};");
+  js.push("      return {");
+  js.push("        up: normUV(f.up, m.resW, m.resH),");
+  js.push("        down: normUV(f.down, m.resW, m.resH),");
+  js.push("        north: normUV(f.north, m.resW, m.resH),");
+  js.push("        south: normUV(f.south, m.resW, m.resH),");
+  js.push("        east: normUV(f.east, m.resW, m.resH),");
+  js.push("        west: normUV(f.west, m.resW, m.resH)");
+  js.push("      };");
+  js.push("    }");
+  js.push("  }");
+  js.push("  return { up:[0,1,1,0], down:[0,1,1,0], north:[0,1,1,0], south:[0,1,1,0], east:[0,1,1,0], west:[0,1,1,0] };");
+  js.push("}");
+  js.push("");
+
+  // Flip UV V-axis for side faces (v0/v1 are bottom vertices but addFace assigns fuv[1] to them)
+  js.push("function flipV(uv) { return [uv[0], uv[3], uv[2], uv[1]]; }");
+  js.push("");
+
   // Build mesh for a chunk
   js.push("function buildChunkMesh(blocks, blockMap) {");
-  js.push("  var pos = [], col = [], nrm = [];");
-  js.push("  var topC = [0.36, 0.63, 0.21];");
-  js.push("  var sideC = [0.50, 0.38, 0.22];");
-  js.push("  var botC = [0.45, 0.32, 0.17];");
+  js.push("  var pos = [], uvArr = [], nrm = [];");
+  js.push("  var uv = getModelUVs('Grass');");
+  js.push("  var sN = flipV(uv.north), sS = flipV(uv.south), sE = flipV(uv.east), sW = flipV(uv.west);");
   js.push("  for (var i = 0; i < blocks.length; i++) {");
   js.push("    var b = blocks[i];");
   js.push("    var x = b.x, y = b.y, z = b.z;");
   js.push("    var k = function(bx,by,bz) { return bx+','+by+','+bz; };");
-  js.push("    if (!blockMap[k(x,y+1,z)]) addFace(pos,col,nrm, [x,y+1,z],[x+1,y+1,z],[x+1,y+1,z+1],[x,y+1,z+1], topC, [0,1,0]);");
-  js.push("    if (!blockMap[k(x,y-1,z)]) addFace(pos,col,nrm, [x,y,z+1],[x+1,y,z+1],[x+1,y,z],[x,y,z], botC, [0,-1,0]);");
-  js.push("    if (!blockMap[k(x,y,z-1)]) addFace(pos,col,nrm, [x,y,z],[x+1,y,z],[x+1,y+1,z],[x,y+1,z], sideC, [0,0,-1]);");
-  js.push("    if (!blockMap[k(x,y,z+1)]) addFace(pos,col,nrm, [x+1,y,z+1],[x,y,z+1],[x,y+1,z+1],[x+1,y+1,z+1], sideC, [0,0,1]);");
-  js.push("    if (!blockMap[k(x-1,y,z)]) addFace(pos,col,nrm, [x,y,z+1],[x,y,z],[x,y+1,z],[x,y+1,z+1], sideC, [-1,0,0]);");
-  js.push("    if (!blockMap[k(x+1,y,z)]) addFace(pos,col,nrm, [x+1,y,z],[x+1,y,z+1],[x+1,y+1,z+1],[x+1,y+1,z], sideC, [1,0,0]);");
+  js.push("    if (!blockMap[k(x,y+1,z)]) addFace(pos,uvArr,nrm, [x,y+1,z],[x+1,y+1,z],[x+1,y+1,z+1],[x,y+1,z+1], uv.up, [0,1,0]);");
+  js.push("    if (!blockMap[k(x,y-1,z)]) addFace(pos,uvArr,nrm, [x,y,z+1],[x+1,y,z+1],[x+1,y,z],[x,y,z], uv.down, [0,-1,0]);");
+  js.push("    if (!blockMap[k(x,y,z-1)]) addFace(pos,uvArr,nrm, [x,y,z],[x+1,y,z],[x+1,y+1,z],[x,y+1,z], sN, [0,0,-1]);");
+  js.push("    if (!blockMap[k(x,y,z+1)]) addFace(pos,uvArr,nrm, [x+1,y,z+1],[x,y,z+1],[x,y+1,z+1],[x+1,y+1,z+1], sS, [0,0,1]);");
+  js.push("    if (!blockMap[k(x+1,y,z)]) addFace(pos,uvArr,nrm, [x+1,y,z],[x+1,y,z+1],[x+1,y+1,z+1],[x+1,y+1,z], sE, [1,0,0]);");
+  js.push("    if (!blockMap[k(x-1,y,z)]) addFace(pos,uvArr,nrm, [x,y,z+1],[x,y,z],[x,y+1,z],[x,y+1,z+1], sW, [-1,0,0]);");
   js.push("  }");
-  js.push("  return { positions: pos, colors: col, normals: nrm };");
+  js.push("  return { positions: pos, uvs: uvArr, normals: nrm };");
   js.push("}");
   js.push("");
 
@@ -286,17 +350,16 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("  var vertCount = mesh.positions.length / 3;");
   js.push("  var gl = game.gl;");
   js.push("  var vbo = gl.createBuffer();");
-  js.push("  var data = new Float32Array(vertCount * 9);");
+  js.push("  var data = new Float32Array(vertCount * 8);");
   js.push("  for (var v = 0; v < vertCount; v++) {");
-  js.push("    data[v*9+0] = mesh.positions[v*3+0];");
-  js.push("    data[v*9+1] = mesh.positions[v*3+1];");
-  js.push("    data[v*9+2] = mesh.positions[v*3+2];");
-  js.push("    data[v*9+3] = mesh.colors[v*3+0];");
-  js.push("    data[v*9+4] = mesh.colors[v*3+1];");
-  js.push("    data[v*9+5] = mesh.colors[v*3+2];");
-  js.push("    data[v*9+6] = mesh.normals[v*3+0];");
-  js.push("    data[v*9+7] = mesh.normals[v*3+1];");
-  js.push("    data[v*9+8] = mesh.normals[v*3+2];");
+  js.push("    data[v*8+0] = mesh.positions[v*3+0];");
+  js.push("    data[v*8+1] = mesh.positions[v*3+1];");
+  js.push("    data[v*8+2] = mesh.positions[v*3+2];");
+  js.push("    data[v*8+3] = mesh.uvs[v*2+0];");
+  js.push("    data[v*8+4] = mesh.uvs[v*2+1];");
+  js.push("    data[v*8+5] = mesh.normals[v*3+0];");
+  js.push("    data[v*8+6] = mesh.normals[v*3+1];");
+  js.push("    data[v*8+7] = mesh.normals[v*3+2];");
   js.push("  }");
   js.push("  gl.bindBuffer(gl.ARRAY_BUFFER, vbo);");
   js.push("  gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);");
@@ -359,7 +422,7 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("  gl.attachShader(this.program, vs);");
   js.push("  gl.attachShader(this.program, fsh);");
   js.push("  gl.bindAttribLocation(this.program, 0, 'aPos');");
-  js.push("  gl.bindAttribLocation(this.program, 1, 'aColor');");
+  js.push("  gl.bindAttribLocation(this.program, 1, 'aUV');");
   js.push("  gl.bindAttribLocation(this.program, 2, 'aNormal');");
   js.push("  gl.linkProgram(this.program);");
   js.push("  gl.useProgram(this.program);");
@@ -373,6 +436,7 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("  this.uFogNear = gl.getUniformLocation(this.program, 'uFogNear');");
   js.push("  this.uFogFar = gl.getUniformLocation(this.program, 'uFogFar');");
   js.push("  this.uCamPos = gl.getUniformLocation(this.program, 'uCamPos');");
+  js.push("  this.uTexture = gl.getUniformLocation(this.program, 'uTexture');");
   js.push("");
   js.push("  gl.uniform3f(this.uSunDir, " + sunD.x + ", " + sunD.y + ", " + sunD.z + ");");
   js.push("  gl.uniform3f(this.uSunColor, 1.0, 0.95, 0.8);");
@@ -381,6 +445,24 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("  gl.uniform1f(this.uFogNear, " + fogNear + ");");
   js.push("  gl.uniform1f(this.uFogFar, " + fogFar + ");");
   js.push("");
+  js.push("  this.blockTexture = gl.createTexture();");
+  js.push("  gl.bindTexture(gl.TEXTURE_2D, this.blockTexture);");
+  js.push("  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array([128,128,128,255]));");
+  js.push("  var texKeys = Object.keys(MODELS);");
+  js.push("  if (texKeys.length > 0 && MODELS[texKeys[0]].textureDataURL) {");
+  js.push("    var texImg = new Image();");
+  js.push("    texImg.onload = function() {");
+  js.push("      var g = game.gl;");
+  js.push("      g.bindTexture(g.TEXTURE_2D, game.blockTexture);");
+  js.push("      g.texImage2D(g.TEXTURE_2D, 0, g.RGBA, g.RGBA, g.UNSIGNED_BYTE, texImg);");
+  js.push("      g.texParameteri(g.TEXTURE_2D, g.TEXTURE_MIN_FILTER, g.NEAREST);");
+  js.push("      g.texParameteri(g.TEXTURE_2D, g.TEXTURE_MAG_FILTER, g.NEAREST);");
+  js.push("      g.texParameteri(g.TEXTURE_2D, g.TEXTURE_WRAP_S, g.CLAMP_TO_EDGE);");
+  js.push("      g.texParameteri(g.TEXTURE_2D, g.TEXTURE_WRAP_T, g.CLAMP_TO_EDGE);");
+  js.push("    };");
+  js.push("    texImg.src = MODELS[texKeys[0]].textureDataURL;");
+  js.push("  }");
+  js.push("");
   js.push("  gl.enable(gl.DEPTH_TEST);");
   js.push("  gl.enable(gl.CULL_FACE);");
   js.push("  gl.cullFace(gl.BACK);");
@@ -407,16 +489,8 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("");
   js.push("  setInterval(function () { game.fps = game.frames; game.frames = 0; }, 1000);");
   js.push("");
-  js.push("  var loadingEl = document.getElementById('loading');");
-  js.push("  loadingEl.classList.add('fade-out');");
-  js.push("  var overlayEl = document.getElementById('click-overlay');");
-  js.push("  overlayEl.style.display = 'flex';");
-  js.push("  overlayEl.addEventListener('click', function () {");
-  js.push("    overlayEl.style.display = 'none';");
-  js.push("    game.canvas.requestPointerLock();");
-  js.push("    game.started = true;");
-  js.push("    game.loop();");
-  js.push("  });");
+  js.push("  game.started = true;");
+  js.push("  game.loop();");
   js.push("};");
   js.push("");
 
@@ -495,7 +569,11 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("  gl.uniformMatrix4fv(this.uView, false, view);");
   js.push("  gl.uniform3f(this.uCamPos, this.camX, this.camY, this.camZ);");
   js.push("");
-  js.push("  var stride = 9 * 4;");
+  js.push("  gl.activeTexture(gl.TEXTURE0);");
+  js.push("  gl.bindTexture(gl.TEXTURE_2D, this.blockTexture);");
+  js.push("  gl.uniform1i(this.uTexture, 0);");
+  js.push("");
+  js.push("  var stride = 8 * 4;");
   js.push("  var keys = Object.keys(this.chunks);");
   js.push("  for (var i = 0; i < keys.length; i++) {");
   js.push("    var chunk = this.chunks[keys[i]];");
@@ -505,35 +583,13 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("    gl.enableVertexAttribArray(1);");
   js.push("    gl.enableVertexAttribArray(2);");
   js.push("    gl.vertexAttribPointer(0, 3, gl.FLOAT, false, stride, 0);");
-  js.push("    gl.vertexAttribPointer(1, 3, gl.FLOAT, false, stride, 12);");
-  js.push("    gl.vertexAttribPointer(2, 3, gl.FLOAT, false, stride, 24);");
+  js.push("    gl.vertexAttribPointer(1, 2, gl.FLOAT, false, stride, 12);");
+  js.push("    gl.vertexAttribPointer(2, 3, gl.FLOAT, false, stride, 20);");
   js.push("    gl.drawArrays(gl.TRIANGLES, 0, chunk.vertCount);");
   js.push("  }");
   js.push("};");
   js.push("");
 
-  // HUD
-  js.push("game.updateHUD = function () {");
-  js.push("  var pcx = Math.floor(this.camX / CHUNK_SIZE);");
-  js.push("  var pcz = Math.floor(this.camZ / CHUNK_SIZE);");
-  js.push("  var loadedCount = Object.keys(this.chunks).length;");
-  js.push("  var sprint = this.keys['ShiftLeft'] || this.keys['ShiftRight'];");
-  js.push("  var html = '<div class=\"hud-title\">' + INFO_ID + '</div>';");
-  js.push("  html += '<div>v' + INFO_VERSION + '</div>';");
-  js.push("  html += '<div class=\"hud-sep\"></div>';");
-  js.push("  html += '<div>FPS: ' + this.fps + '</div>';");
-  js.push("  html += '<div>Triangles: ' + Math.floor(this.totalVerts / 3) + '</div>';");
-  js.push("  html += '<div>Blocks: ' + this.totalBlocks + '</div>';");
-  js.push("  html += '<div>Chunks: ' + loadedCount + '</div>';");
-  js.push("  html += '<div class=\"hud-sep\"></div>';");
-  js.push("  html += '<div>X: ' + this.camX.toFixed(1) + '</div>';");
-  js.push("  html += '<div>Y: ' + this.camY.toFixed(1) + '</div>';");
-  js.push("  html += '<div>Z: ' + this.camZ.toFixed(1) + '</div>';");
-  js.push("  html += '<div>Chunk: ' + pcx + ', ' + pcz + '</div>';");
-  js.push("  html += '<div class=\"hud-sep\"></div>';");
-  js.push("  html += '<div>Sprint: ' + (sprint ? 'ON' : 'OFF') + '</div>';");
-  js.push("  document.getElementById('hud-info').innerHTML = html;");
-  js.push("};");
   js.push("");
 
   // Game loop
@@ -543,35 +599,18 @@ ElectronRunner.prototype.getRendererSource = function () {
   js.push("  game.update();");
   js.push("  updateChunks();");
   js.push("  game.render();");
-  js.push("  game.updateHUD();");
   js.push("};");
   js.push("");
 
-  // Loading animation
-  js.push("var bar = document.getElementById('bar-inner');");
-  js.push("var status = document.getElementById('load-status');");
-  js.push("setTimeout(function () { bar.style.width = '25%'; status.textContent = 'Compiling shaders...'; }, 200);");
-  js.push("setTimeout(function () { bar.style.width = '50%'; status.textContent = 'Generating chunks...'; }, 600);");
-  js.push("setTimeout(function () { bar.style.width = '75%'; status.textContent = 'Building meshes...'; }, 1000);");
-  js.push("setTimeout(function () { bar.style.width = '100%'; status.textContent = 'Ready!'; status.style.color = '#4ecca3'; }, 1400);");
-  js.push("setTimeout(function () { game.init(); }, 1800);");
+  js.push("game.init();");
 
   var html = "<!DOCTYPE html>\n<html>\n<head>\n";
   html += "<meta charset='utf-8'>\n";
   html += "<title>" + windowTitle + " - CaG Engine</title>\n";
   html += "<style>\n" + css + "\n</style>\n";
   html += "</head>\n<body>\n";
-  html += "<div id='loading'>\n";
-  html += "  <h1>CaG</h1>\n";
-  html += "  <h2>" + infoID + "</h2>\n";
-  html += "  <div id='load-status'>Starting...</div>\n";
-  html += "  <div id='bar-outer'><div id='bar-inner'></div></div>\n";
-  html += "  <div class='version-tag'>v" + infoVer + "</div>\n";
-  html += "</div>\n";
-  html += "<div id='click-overlay' style='display:none'><div class='play-icon'><div class='play-triangle'></div></div><span>CLICK TO PLAY</span></div>\n";
   html += "<div id='crosshair' style='display:none'></div>\n";
-  html += "<div id='hud'><div id='hud-box'><div id='hud-info'></div></div></div>\n";
-  html += "<div id='controls-hint'><b>WASD</b> Move &nbsp; <b>Mouse</b> Look &nbsp; <b>Space</b> Jump &nbsp; <b>Shift</b> Sprint &nbsp; <b>F11</b> Fullscreen &nbsp; <b>Esc</b> Release</div>\n";
+  html += "";
   html += "<canvas id='cag-canvas'></canvas>\n";
   html += "<script>\n" + js.join("\n") + "\n</script>\n";
   html += "</body>\n</html>";
@@ -638,6 +677,32 @@ ElectronRunner.extractSettings = function (executor) {
     settings.renderDistance = chunkAPI.renderDistance;
   }
 
+  if (registry.has("Model.API")) {
+    var modelAPI = registry.get("Model.API");
+    var loadedModels = modelAPI.getLoadedModels();
+    settings.models = {};
+    if (loadedModels) {
+      var modelNames = Object.keys(loadedModels);
+      for (var mi = 0; mi < modelNames.length; mi++) {
+        var mName = modelNames[mi];
+        var model = loadedModels[mName];
+        if (model && model.valid) {
+          var texW = model.texture ? model.texture.width : 0;
+          var texH = model.texture ? model.texture.height : 0;
+          if (!texW || !texH) {
+            texW = model.geometry ? model.geometry.resolution.width : 16;
+            texH = model.geometry ? model.geometry.resolution.height : 16;
+          }
+          settings.models[mName] = {
+            uvMappings: model.uvMappings || [],
+            resolution: { width: texW, height: texH },
+            textureDataURL: model.texture && model.texture.dataURL ? model.texture.dataURL : null
+          };
+        }
+      }
+    }
+  }
+
   return settings;
 };