Delete specific image from loader - image

Question

I have three images all from the same loader on screen. I need to delete a specific (targeted) bitmap once clicked. I have an onClick function below, any help is greatly appreciated. Thanks!
var nb_images:int = 3;
var bmp:Bitmap = new Bitmap;
var img_margin:int = stage.stageHeight/3.5;
var img_request:URLRequest;
var img_loader:Loader;
var images_container:Sprite = new Sprite();
addChild(images_container);
function remove_all_images():void {
for (var i:int = images_container.numChildren - 1; i >= 0; i--) {
images_container.removeChildAt(i);
}
}
function load_images():void {
remove_all_images();
for (var i:int = 0; i < nb_images; i++) {
img_request = new URLRequest('../img/planet' + (int(nb_images * Math.random())) + '.png');
img_loader = new Loader();
img_loader.load(img_request);
img_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, on_img_loaded);
}
}
function on_img_loaded(e:Event):void {
e.currentTarget.removeEventListener(Event.COMPLETE, on_img_loaded);
bmp = e.currentTarget.content;
bmp.x = 600, bmp.width = bmp.height = 80;
bmp.y = images_container.numChildren * (bmp.height + img_margin);
images_container.addChild(bmp);
stage.addEventListener(MouseEvent.CLICK, onClick);
function onClick(event:MouseEvent):void {
removeChild(e.target);
}
}
load_images();

Answer 1

Okay, first thing I did here was remove var bmp:Bitmap = new Bitmap. You're creating a reference you don't really need, so let's get rid of that altogether.
Now, in your on_img_loaded method, you're going to want to create a new Bitmap for each loaded image.
var bmp:Bitmap = e.currentTarget.content;
Then, you'll need to add the event listener directly to an InteractiveObject rather than the stage. Bitmaps are not InteractiveObjects, so we'll need to wrap it in something else before adding the listener.
var sprite: Sprite = new Sprite();
sprite.addChild(bmp);
addChild(sprite);
sprite.addEventListener(MouseEvent.CLICK, onClick);
Finally, create a method to remove the clicked Bitmap from images_container (note here I removed the nested function - this prevents argument ambiguity and is generally good practice).
function onClick(e:MouseEvent):void
{
images_container.removeChild(e.currentTarget);
}
This is the relevant code in its entirety (untested).
//remove var bmp:Bitmap = new Bitmap from the beginning of the code
function on_img_loaded(e:Event):void {
e.currentTarget.removeEventListener(Event.COMPLETE, on_img_loaded);
var bmp:Bitmap = e.currentTarget.content;
bmp.x = 600, bmp.width = bmp.height = 80;
bmp.y = images_container.numChildren * (bmp.height + img_margin);
var sprite: Sprite = new Sprite();
sprite.addChild(bmp);
addChild(sprite);
images_container.addChild(sprite);
sprite.addEventListener(MouseEvent.CLICK, onClick);
}
function onClick(e:MouseEvent):void
{
e.currentTarget.removeEventListener(MouseEvent.CLICK, onClick)
images_container.removeChild(e.currentTarget as DisplayObject);
}
Hope this helps!