Question

I have an image gallery which loads a detail image, then draws a line next to the image on one side based on image dimensions. Clicking on the image returns one back to the main image thumbnail list, then clicking a thumb loads another image into detail holder. Everything works fine with it, except that the lines, rather than disappearing upon detail image unload, accumulate. Is there a way to clear the contents of the lineDrawing MovieClip without removing it from the stage, so that I can draw a new line in it? I’ve tried removeChild on the MovieClip, but then the lines disappear entirely, same with placing lineDrawing.clear() at the top of the setupDetail function. Here is my (relevant)code so far, any assistance will be greatly appreciated, I am stumped!

var detailImage:Loader = new Loader();
var lineDrawing:MovieClip = new MovieClip();

setupDetail();

function setupDetail():void {
    detail.visible = false;
    detail.buttonMode = true;
    detail.closeMessage.mouseEnabled = false;

    detail.addChild(detailImage);

    detailImage.contentLoaderInfo.addEventListener(Event.COMPLETE, fullyLoaded);

    // make sure detail is above the gallery
    addChild(detail);

    detail.addEventListener(MouseEvent.CLICK, onCloseDetail, false, 0, true);
}

function fullyLoaded(evt:Event):void {

    var imgHeight:int = evt.target.content.height;
    var imgWidth:int = evt.target.content.width;

    var hOffset:int = imgWidth + 5 + 27;
    var vOffset:int = imgHeight + 5;

    detail.addChild(lineDrawing);

    if(imgWidth == 600) {
        lineDrawing.graphics.lineStyle(3,0x9a9345);
        lineDrawing.graphics.moveTo(28,vOffset);
        lineDrawing.graphics.lineTo(626,vOffset);
    }
    else if(imgHeight == 600) {
        lineDrawing.graphics.lineStyle(3,0x9a9345);
        lineDrawing.graphics.moveTo(hOffset, 1);
        lineDrawing.graphics.lineTo(hOffset, 599);
    }
}

function onCloseDetail(evt:MouseEvent):void {

    // only allow it to be closed if it is at least 90% opaque
    if (detailImage.alpha>.9){
      detailImage.unload();
      TweenLite.to(detail,.5, {autoAlpha:0});
      detailImage.unload();
      detail.visible = false;
    }
}

Answer 1

lineDrawing.graphics.clear()