Preloading images with MoviecClipLoader

Hey guys. I’m a Flash newbie. I’m creating a slideshow of my girlfriend and I. Accompanied with it is an mp3. I have successfully preloaded the mp3 so that when it starts playing, the slideshow begins. Now I would like to preload the images (I have about 50, all 400x300). I would like to display the percentage of the images loaded. Then I’d like to check if both the mp3 and all the images have been downloaded into the cache before the slideshow starts playing. But I’m not sure how to tackle this.

I figured I’d use the MovieClipLoader class. I have an array called “imageArray” that contains all images read from an XML file. I used LoadVars to call a php script reads all the images filesizes’ and returns the totalsize, then set that in a variable “images_bytestotal”. I have another variable “images_bytesloaded” that I know I have to update as each image is being downloaded to reflect the percentage that has already been downloaded ((images_bytesloaded/images_bytestotal)*100). But I’m not sure how to correctly update it. Any help would be greatly appreciated. Thanks! Here’s a snippet of my code:

var images_bytestotal = 0;
     var images_bytesloaded = 0;
     
     // Get filesizes of all images
     images_lv = new LoadVars();
     images_lv.onLoad = function(success) {
     	if(success) {
     		images_bytestotal = this.total;
     		trace(images_bytestotal);
     	}
     };
     images_lv.load("images_totalsize.php"); // returns "total=2346985"
     
     
     // Images preloader
     imagepreloaderMCL = new MovieClipLoader();
     imagepreloaderListener = new Object();
     imagepreloaderListener.onLoadStart = function(targetMC) {
     	trace(targetMC._name + " download started");
     };
     imagepreloaderListener.onLoadComplete = function(targetMC) {
     	trace(targetMC._name + " download complete");
     };
     imagepreloaderListener.onLoadProgress = function (targetMC, loadedBytes, totalBytes) {
     	images_bytesloaded += loadedBytes;
     	var percent = Math.round((images_bytesloaded/images_bytestotal) * 100);
     	preload_status = percent; // Textfield with variable "preload_status"
     };
     imagepreloaderListener.onLoadInit = function(targetMC) {
     	targetMC.removeMovieClip();
     };
     function preloadImages() {
     	for(var i=0; i<imageArray.length; i++) {
     		var mc = preloader_mc.createEmptyMovieClip("image"+i+"_mc", i);
     		mc._visible = false;
     		mc._alpha = 0;
     		imagepreloaderMCL.loadClip(imageArray*.path , mc);
     	}
     }
     imagepreloaderMCL.addListener(imagepreloaderListener);
     
     preloadImages(); // call after XML has been loaded