Hi! I've been playing with WebGL for some time and I get stuck in a weird issue. I got a JSON file defining the position and src-image-for-texture for multiple elements. I load the positions in a 'elementPositions' array and the src-images in a 'elementImageSrcs' array. Then I have a 'elementTextures' array where I create all textures.

The problem comes when I try to initTextures() using the following line:
Code :
for (var i=0; i < numElements; i++) { elementTextures[i] = loadTexture(elementImageSrcs[i]); }
It just doesn't work; it seems loadTexture() doesn't like elementImageSrcs[i].

But if I use:
Code :
  elementImageSrcs[0] = "im/crate01.gif";
  elementImageSrcs[1] = "im/crate02.gif";
  elementImageSrcs[2] = "im/crate03.gif";
 
  elementTextures[0] = loadTexture(elementImageSrcs[0]);
  elementTextures[1] = loadTexture(elementImageSrcs[1]);
  elementTextures[2] = loadTexture(elementImageSrcs[2]);
It works perfectly.

I've spend nearly two days trying to realize what could be the problem but I didn't find the answer (maybe the JSON loading? maybe my limited knowledge of JavaScript?). Anyone knows what I'm doing wrong?

You can check the code here.