Canvas Games: Part II - HTML5 Canvas - page 771

largeRockTiles = new new Image ();

largeRockTiles . src = "largerocks.png" ;
largeRockTiles . onload = itemLoaded ;

mediumRockTiles = new new Image ();

mediumRockTiles . src = "mediumrocks.png" ;
mediumRockTiles . onload = itemLoaded ;

smallRockTiles = new new Image ();

smallRockTiles . src = "smallrocks.png" ;
smallRockTiles . onload = itemLoaded ;

particleTiles = new new Image ();

particleTiles . src = "parts.png" ;
particleTiles . onload = itemLoaded ;

switchGameState ( GAME_STATE_WAIT_FOR_LOAD );

}

Notice that we must create and preload three instances of each sound, even though they share
the same sound file (or files). In this function, we also load our tile sheets. The application
scope itemsToLoad variable checks against the application scope loadCount variable in the
load event callback itemLoaded() function, which is shared by all assets to be loaded. This
makes it easy for the application to change state so that it can start playing the game when all
assets have loaded. Let's briefly look at the itemLoaded() function now:

function function itemLoaded ( event ) {

loadCount ++ ;
//console.log("loading:" + loadCount)
iif ( loadCount >= itemsToLoad ) {

shootSound . removeEventListener ( "canplaythrough" , itemLoaded , false false );

shootSound2 . removeEventListener ( "canplaythrough" , itemLoaded , false false );

shootSound3 . removeEventListener ( "canplaythrough" , itemLoaded , false false );

explodeSound . removeEventListener ( "canplaythrough" , itemLoaded , false

false );
explodeSound2 . removeEventListener ( "canplaythrough" , itemLoaded , false

false );
explodeSound3 . removeEventListener ( "canplaythrough" , itemLoaded , false false );

saucershootSound . removeEventListener ( "canplaythrough" , itemLoaded , false false );

saucershootSound2 . removeEventListener ( "canplaythrough" , itemLoaded , false

false );
saucershootSound3 . removeEventListener ( "canplaythrough" , itemLoaded , false false );

soundPool . push ({ name : "explode1" , element : explodeSound , played : false false });

soundPool . push ({ name : "explode1" , element : explodeSound2 , played : false false });