AS3: Why is a line created with .graphics appearing in two different places and when removed with parent.visible = false, only one goes?

Question

Nobody seems to have this question already so I asked it because I've spent a few hours trying to debug this and can't find a solution;

Essentially, I have a function called draw, which is declared in my document class:

public function draw(Target: MovieClip,mX: int,mY: int,lX: int,lY: int):void {
    Target.graphics.clear();
    Target.graphics.lineStyle(1,0x000000,1);
    Target.graphics.moveTo(mX,mY);
    Target.graphics.lineTo(lX,lY);  
}

I call it later to draw two lines, on two different MovieClips:

draw(Line,Line.mX,Line.mY,Mirror.x + (Mirror.width / 2),Line.lY);
draw(nextLine,(Mirror.x + (Mirror.width / 2)),200,(Mirror.x + (Mirror.width / 2)),0);

where

var Line: MovieClip = new MovieClip();
var Mirror: MovieClip = new mirror();

and Mirror is draggable, so Mirror.x changes whenever it is dragged.

Line is a line made using .graphics and Line.mX is equal to the Line.graphics.moveTo X value last time it was modified. Line.mY is the same, but for the Y coordinate. I set these values by doing this:

Line.mX = 0;
Line.mY = 200;
Line.lX = 550; 
Line.lY = 200;

But with whatever values I want to draw the line, with lX and lY being equal to the X and Y coordinates of Line.graphics.lineTo. Then I draw Line using my draw function like this:

draw(Line,Line.mX,Line.mY,Line.lX,Line.lY);

Then it gets more complex because, actually, Line is just one line in an array of lines, created like this:

public var lines = [line0,line1,line2,line3,line4,line5,line6,line7,line8];

and each of those lines is created like this (with 0 being replaced by the line's number, respectively):

public var line0: MovieClip = new MovieClip();

then I give each line a number and a name, add them to the stage and hide them like this:

for each(var setupLine:MovieClip in lines) {
    setupLine.num = (lines.indexOf(setupLine));
    setupLine.name = ('line' + setupLine.num);

    addChild(setupLine);
    setupLine.visible = false;
}

Then, after making line0 visible, because I need to see it at the start, I loop through each line in a function that runs on ENTER_FRAME, and set the value of nextLine to a different value each time I run the loop like this:

for each(var Line:MovieClip in lines) {
    nextLine = this['line' + (Line.num + 1)];
}

Within that loop, I then loop through a few other arrays, then check for a collision with the selected Line and another selected MovieClip from another array, which I wont go into or this question will be longer than the code for node.js.

So essentially, if the collision with the two MovieClips is present, I draw the line that I mentioned at the top of my question. But for some reason, although Line draws correctly, nextLine draws correctly, but a duplicate of it is drawn across the Y axis at 0, and stops where nextLine is on the Y axis (nextLine is vertical, so it has the same Y value at the start as at the end).

Even stranger, when I try to hide nextLine if the collision with the two MovieClips is no longer present, using this code:

nextLine.visible = false;

it only hides the version of nextLine that runs along the top of the stage, which I didn't even intend to create in the start.

---

EDIT

---

here is a link to the current source code
Here is a link to the entire project files with the original source code
copy/paste the new source code from the pastebin link to get the new version

---

Thanks in advance,

-Raph

Answer 1

I figured out how to do this, code is

package {

    import flash.events.*;
    import flash.utils.*;
    import flash.display.*;

    [SWF(backgroundColor="0xbdc3c7")]
    public class LightStage extends MovieClip {

        //import classes
        public var globeClass:Globe = new Globe();
        public var mirrorClass:Mirror = new Mirror();
        public var lineClass:Line = new Line();

        //create all stage objects
        public var curLine:Line
        public var nextLine:Line;

        public var curMirror:Mirror;

        //create containers
        public var mirrors:Vector.<Mirror> = new Vector.<Mirror>(); //a vector is an array, but every member has to be (or subclass) the specified class
        public var globes:Vector.<Globe> = new Vector.<Globe>();
        public var lines:Vector.<Line> = new Vector.<Line>();

        trace('lightstage: working');
        //create level object
        public var curLevel:int = -1;

        //create dependent variables
        public var kill: Boolean = true;

        //init function
        public function LightStage() {
            //setup MovieClips

            var i:int = 0;

            for (i = 0; i < 4; i++) {
                mirrors.push(new Mirror());
            }

            for (i = 0; i < 4;i++ ) {
                globes.push(new Globe());
            }

            var tmpLine:Line;
            for (i = 0; i < 10; i++) {
                tmpLine = new Line();
                lines.push(tmpLine);

                addChild(tmpLine);
                tmpLine.visible = false;
            }

            //create ENTER_FRAME listener
            stage.addEventListener(Event.ENTER_FRAME,enterFrame);

            //start the game
            levelUp();
        }


        //levelUp function
        public function levelUp() {
            curLevel++;

            curLine = lines[curLevel]; //set line to the current level 

            curLine.curX = 0; 
            curLine.curY = 200;
            curLine.draw(550, 200);

            curLine.visible = true;

            //show and position mirrors and globes
            curMirror = mirrors[curLevel];
            addChild(curMirror);
            curMirror.x = 250;
            curMirror.y = 350;

            var curGlobe:Globe = globes[curLevel];
            addChild(curGlobe);
            curGlobe.x = 100;
            curGlobe.y = 50;

            //set mirror types
            curMirror.gotoAndStop(2);

            trace("you are now on level " + (curLevel + 1) + "!");

        }

        //ENTER_FRAME function
        public function enterFrame(event:Event) {
            //line1.visible = true;

            for (var i:int = 0; i < lines.length;i++){
                if (i < lines.length - 1) nextLine = lines[i + 1]; //check for out of bounds before assignment next line

                if (lines[i].visible == true) {
                    kill = true;
                    for each(var mirror:Mirror in mirrors) {
                        if (lines[i].visible && mirror.stage && mirror.hitTestObject(lines[i])) {  //for efficiency, do the hit test last in the if statement
                            for each(var globe:Globe in globes) {
                                //Looped through Mirrors and Lines and checked for collision - if collision is present, we loop through globes here

                                if (nextLine && nextLine.stage) {
                                    addChild(nextLine);
                                }

                                //check for active globes
                                if (lines[i].visible && lines[i].hitTestObject(globe)) {
                                    //check if the selected line touches the selected globe - if it does then we will start the timer for that globe
                                    if (!globe.running){
                                        globe.start();
                                        //trace('timing');
                                        kill = false;
                                    }
                                }
                                else {
                                    globe.reset();
                                }

                                switch(mirror.currentFrame) {
                                    case 1:
                                        break;

                                    case 2:
                                        //trace('live a life you will remember' + Math.random());
                                        if(nextLine) nextLine.visible = true;
                                        lines[i].draw(mirror.x + (mirror.width / 2),lines[i].curY);
                                        if (nextLine) {
                                            nextLine.curX = mirror.x + (mirror.width / 2);
                                            nextLine.curY = 200;
                                            nextLine.draw(mirror.x + (mirror.width / 2), 0);
                                        }
                                        kill = false;
                                        break;
                                    case 3:
                                    case 4:
                                    case 5:
                                    case 6:
                                    case 7:
                                    case 8:
                                    case 9:
                                    case 10:
                                    case 11:
                                    case 12:
                                        trace(mirror.currentFrame);
                                        kill = false;
                                        break;
                                }
                            }
                        }
                        else if (lines[i].visible && mirror.stage && lines[i].stage){
                            if (kill && nextLine){
                                nextLine.graphics.clear();
                                nextLine.visible = false;
                            }
                        }
                    }
                }
            }
        }
    }

}

//MIRROR CLASS DECLARATION
import flash.events.MouseEvent;
class Mirror extends MovieClip {
    trace('mirror: working');
    public function Mirror() {
        this.addEventListener(MouseEvent.MOUSE_DOWN,onDown,false,0,true);
    }

    private function onDown(e:MouseEvent):void {
        //add the mouse up listener on the stage, that way it's consistent even if the user drags so fast that the mouse leaves the bounds of the mirror
        stage.addEventListener(MouseEvent.MOUSE_UP, onUp, false, 0, true);
        this.startDrag();
    }

    private function onUp(e:MouseEvent):void {
        //we need to remove the listener from the stage now
        stage.removeEventListener(MouseEvent.MOUSE_UP, onUp, false);

        this.stopDrag();
    }
}

//LINE CLASS DECLARATION
import flash.display.Graphics;
class Line extends MovieClip {
    trace('line: working');
    public var curX:int;
    public var curY:int;

    public function Line():void {

    }

    public function draw(toX:int,toY:int):void {
        graphics.clear();
        graphics.lineStyle(1,0x000000,1);
        graphics.moveTo(curX,curY);
        graphics.lineTo(toX, toY);

        curX = toX;
        curY = toY;
    }
}

//GLOBE CLASS DECLARATION
import flash.display.MovieClip;
import flash.events.TimerEvent;
import flash.utils.Timer;
class Globe extends MovieClip {
    trace('globe: working');
    private var timer:Timer = new Timer(3 * 100, 5);

    public function Globe():void {
        timer = new Timer(300, 5);
        timer.addEventListener(TimerEvent.TIMER, repeatShine, false, 0, true);
    }

    public function reset():void {
        timer.reset();
    }

    public function start():void {
        timer.start();
    }

    public function get running():Boolean { return timer.running; };

    private function repeatShine(e:TimerEvent):void {

    }
}