Development: Fix bugs preventing the use of app.js

All the small fixes here are being committed at the same time to allow
the use of app.js for development.

Layout: Switch back to strings for TYPES
----------------------------------------

Layout TYPES need to be strings because they're used to index into a
GLRenderingContext. I put a switch case in the Layout constructor to
calculate the gl type size in bytes.

Mesh: Add `makeIndexBufferDataForMaterials` to Mesh
---------------------------------------------------

The current behavior of `makeIndexBufferData` will make an index buffer
for only one material which is strange at best and difficult-to-use at
worst. I've added here a method to build an index buffer given any
number of materials.

downloadMtlTextures: Don't fetch directory listings when filename doesn't exist
-----------------------------------------------------------------

When filename is empty for texture map data, don't try downloading the
root directory.

development/app.js

@@ -127,7 +127,7 @@ function initShaders() {
             }
             const layoutKey = attrs[attrName];
             if (shaderProgram.attrIndices[attrName] != -1) {
-                const attr = layout[layoutKey];
+                const attr = layout.attributeMap[layoutKey];
                 gl.vertexAttribPointer(
                     shaderProgram.attrIndices[attrName],
                     attr.size,
@@ -203,7 +203,7 @@ function initBuffers() {
         // Create the index buffer for this mesh
         var indexBuffer = gl.createBuffer();
         gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
-        var indexData = app.meshes[mesh].makeIndexBufferData();
+        var indexData = app.meshes[mesh].makeIndexBufferDataForMaterials(...Object.values(app.meshes[mesh].materialIndices));
         gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, indexData, gl.STATIC_DRAW);
         indexBuffer.numItems = indexData.numItems;
         app.meshes[mesh].indexBuffer = indexBuffer;

src/layout.ts

@@ -1,9 +1,9 @@
 export enum TYPES {
-    "BYTE" = 1,
-    "UNSIGNED_BYTE" = 1,
-    "SHORT" = 2,
-    "UNSIGNED_SHORT" = 2,
-    "FLOAT" = 4,
+    "BYTE" = "BYTE",
+    "UNSIGNED_BYTE" = "UNSIGNED_BYTE",
+    "SHORT" = "SHORT",
+    "UNSIGNED_SHORT" = "UNSIGNED_SHORT",
+    "FLOAT" = "FLOAT",
 }
 
 export interface AttributeInfo {
@@ -63,7 +63,21 @@ export class Attribute {
      *        For type "FLOAT", this parameter has no effect.
      */
     constructor(public key: string, public size: number, public type: TYPES, public normalized: boolean = false) {
-        this.sizeOfType = this.type;
+        switch(type) {
+            case "BYTE":
+            case "UNSIGNED_BYTE":
+                this.sizeOfType = 1;
+                break;
+            case "SHORT":
+            case "UNSIGNED_SHORT":
+                this.sizeOfType = 2;
+                break;
+            case "FLOAT":
+                this.sizeOfType = 4;
+                break;
+            default:
+                throw new Error(`Unknown gl type: ${type}`);
+        }
         this.sizeInBytes = this.sizeOfType * size;
     }
 }

src/mesh.ts

@@ -738,6 +738,13 @@ export default class Mesh {
         return buffer;
     }
 
+    makeIndexBufferDataForMaterials(...materialIndices : Array<number>): Uint16ArrayWithItemSize {
+        const indices : number[] = new Array<number>().concat(...materialIndices.map((mtlIdx) => this.indicesPerMaterial[mtlIdx]));
+        const buffer: Uint16ArrayWithItemSize = new Uint16Array(indices);
+        buffer.numItems = indices.length;
+        return buffer;
+    }
+
     addMaterialLibrary(mtl: MaterialLibrary) {
         for (const name in mtl.materials) {
             if (!(name in this.materialIndices)) {

src/utils.ts

@@ -25,10 +25,9 @@ function downloadMtlTextures(mtl: MaterialLibrary, root: string) {
 
         for (const attr of mapAttributes) {
             const mapData = (material as any)[attr] as TextureMapData;
-            if (!mapData) {
+            if (!mapData || !mapData.filename) {
                 continue;
             }
-
             const url = root + mapData.filename;
             textures.push(
                 fetch(url)