Applying Textures and Simple Animations to Our Scene - WebGL Game Development - page 231

The textures are named blast_1.png , blast_2.png , blast_3.png , all the way to
blast_15.png . We iterate over the names and load the textures. We create a unique
key ( vartextureIndex=currentDate.getMilliseconds()+j-; ) to create
a reference to the texture object in the Stageclass'textures object. Each unique
key of the texture is pushed to the explosion.textureIndices array and the
texture object is initialized and stored via the stage.addtexture function.
function initExplosionTextures(){
for(var j=1;j<=15;++j){
var fileName="blast_"+j+".png";
var currentDate=new Date();
var textureIndex=currentDate.getMilliseconds()+j*2000;
explosion.textureIndices.push(textureIndex);
textureList[fileName]=textureIndex;
var image = new Image();
image.onload = function() { stage.addTexture(textureIndex,fileName,
image); }
image.src = "model/textures/"+fileName;
}
}
In our last change in code, the initializeExplosion function is assigned to the
grenade object. When the grenade animation finishes, it invokes this function
to create a chained animation of the explosion. It also takes the modelMatrix of
the grenade object as a parameter. This function in turn invokes the initialize
function of the explosion object.
function initializeExplosion(matrix){
explosion.initialize(matrix);
}