Step 6. More rooms

This one is simple: make an arrow or something that you click on to move onto a different room. Turn to movieClip and give an instance name. Do the same type of code that is used for the start button.

(probably the ugliest thing I’ve ever made in Flash)

To make another room, go inside the game MovieClip and create an empty frame while keeping the inventory.

(Zoomed to see the frame labels better)

Now, on this new frame (with a label), draw whatever the next room is going to be and repeat the same steps as before.

Draw

Turn to the symbol twice

Then, back in the first room’s code:

this.arrowHallway1.addEventListener(MouseEvent.CLICK, enterHallway1);

function enterHallway1(event:MouseEvent):void {
	Object(root).game.gotoAndStop(“hallway1”);
}

Want the arrows to have a fancy hover like the ones in Riddle School? First, convert your arrow into a symbol so you can animate it growing in size (make sure to call the new one the same thing as the old one and call the old one nothing)

Make the old arrow’s instance name EMPTY

The new arrow’s instance name should be the same as the old one.

Give the arrow an animation. I gave it a basic growing animation with a glow.

Back in the room code, make another eventListener, but this time make it an ENTER_FRAME

this.arrowHallway1.addEventListener(Event.ENTER_FRAME, hoverarrowHallway1);

function hoverarrowHallway1(event: Event): void {

}

We will be using a function called hitTestPoint(); It has 3 inputs: an X input, a Y input, and a ShapeFlag that doesn’t matter right now. What Flash does is check to see if the object X and Y points match up to the inputs X and Y points, hence the name hitTestPoint. It needs to be spelled exactly like this, and it should turn to a different color whenever you type it correctly.

this.arrowHallway1.addEventListener(Event.ENTER_FRAME, hoverarrowHallway1);

function hoverarrowHallway1(event: Event): void {

if (this.arrowHallway1.hitTestPoint(stage.mouseX, stage.mouseY, true)) {

this.arrowHallway1.nextFrame();

} else {

this.arrowHallway1.prevFrame();

}

}

Our inputs will be the player's mouse cursor and the true means we check the actual pixels of the object, instead of its bounding box (false). If you care, and are a nerd, you can read more about it here: DisplayObject - ActionScript 3.0 Language Reference

What this function does is, every frame, it will check if the mouse’s x and y points are touching the arrow's points. If it does, then do whatever is inside the brackets; if it doesn't, do the else. In this case, if they are touching, go to the next frame. Since this is being checked every frame, it will look like it's growing until it’s reached its last frame. Once they are no longer touching, it will go back a frame, making it look like it’s shrinking until reaching the first frame.

If you don’t want to do this, you can just make the arrow a simple button. 

Next, it’s time to discuss something that you have to face one way or another.