empaempa
commented
12 years ago Thanks for pointing this out and I understand what you mean. However, this is more or less by design. GLOW is merely a WebGL-wrapper, taking care of the low-level WebGL API stuff for you. I suggest using GLOW.Load() instead of creating a texture with a URL (which I guess you're doing right now). Something like...
new GLOW.Load( { myTexture: "theTexture.png", onLoadComplete: function( theLoadedData ) {
var myShaderConfig = {
// ...your primitives and indices here
data: {
uTexture: new GLOW.Texture( { data: theLoadedData.myTexture } )
// ...your other data here
}
};
var myShader = new GLOW.Shader( myShaderConfig );
} );The best part of GLOW.Loader is that it's capable of loading and parsing .glsl files, so you can have your shaders in separate files. It can also load videos and JSON-files (with geometry data) and all in one go - simply add more key-value-pairs to the object passed to the constructor. Also, there's a "onLoadContext" which you can use to set "this" to the object taking care of the onLoadComplete function. For example...
new GLOW.Load( { texture: "texture.png", shaderDiffuse: "shaderDiffuse.glsl", shaderPhong: "shaderPhong.glsl", onLoadComplete: onLoadHandler.onLoadComplete, onLoadContext: onLoadHandler } );This will call the onLoadComplete function on your onLoadHandler object, setting "this" to onLoadHandler. The data passsed to onLoadComplete will look like:
{
texture: ...an HTMLImageElement,
shaderDiffuse: {
fragmentShader: ...a string with the fragment shader code
vertexShader: ...a string with the vertex shader code
},
shaderPhong: {
fragmentShader: ...a string with the fragment shader code
vertexShader: ...a string with the vertex shader code
}
}
Hope that helps and thanks for trying GLOW :D
psulat
Thank you for making the code available. I'm new to webgl and javascript and it helping a lot.
When I tried doing anything simple with textures I'm getting all back textures. This can be repeated by using the hellocube sample code and changing setInterval( render, 1000 / 60) to just render(). You will see a black cube rendered. When I looked into this I found that the texture calls were being done after the draw call. The GL texture loading commands do not get called until the texture image has been fetched. However, there is nothing that makes the draw call wait for the texture loading to complete. You normally don't see this error because many rendering are done and only first one is not visible. In either case, there is a dependency here that is not being accounted for.