Hi Shri
Very good question :)
The array of images is just to display more than one image. Could be useful, for example, if you wanted a static background jpeg, and an animated spinner type of thing (gif) on top of it.
When wade is waiting for a file to load, it doesn't really update the simulation of the game, it's all stopped until all the files that are being loaded have finished loading. That's why that array is only intended for static images.
However...
It isn't difficult to create a mini wade scene that you load immediately and display (with animations and all that) while loading all the files of your game. The trick is to use the preload functions, rather than the load one, so wade.preloadImage, wade.preloadJson, etc.
Those "preload" functions run in the background, without interfering with the game simulation and rendering. And all those functions can be called with a 'callback' parameter to execute a custom function when each asset is finished loading. So you could do something like this:
App = function(){ this.init = function() { wade.loadScene('miniSceneToShowWhileLoading.json', false, function() { var imagesToLoadForTheGame = ['a.jpg', 'b.jpg', 'c.jpg']; var numImagesLoaded = 0; for (var i=0; imagesToLoadForTheGame.length; i++) { wade.preloadImage(imagesToLoadForTheGame[i], function() { if (++numImagesLoaded == imagesToLoadForTheGame.length) { wade.clearScene(); wade.app.startGame(); } }); } }); }; this.startGame() { };};
Now that you make me think about it, having a wade.preloadScene() function would be quite handy, so you could load the first scene with wade.loadScene() and while that's running you could use wade.preloadScene() to load the second one.
I'll try to get that in for the next release.