Mirroring/duplicate a movieclip as3 Air

Question

I'm having trouble with this one because I can't figure out the correct terminology for an effective search. Here's what I'm working on: It's a space shooter that's played on a stage in front of an audience. The big screen shows the audience the ship flying through space, shooting asteroids. At the bottom is the heads up display with health, shield, time, and ammo. The shield automatically depletes over time. Once it's at 0%, it will display a 3-digit code for the audience to call out to the pilot (the person at the computer who isn't looking at the big screen). Once he types in the code, the shield reactivates and the cycle continues. This is also true for reloading.

I'm working on an Air desktop app with Flash CC and AS3.

For now, I'm going to have the person at the computer work without a screen. The audience will be responsible for telling him which direction to go, when to fire, and the codes for reload and reshield. This is for high school students, so the goal is a lot of yelling.

I would LOVE for the pilot to be able to see everything except the HUD on his own display. Like I said, his back is to the big screen and he only has a keyboard. Is there away to copy/mirror/duplicate/display my game in another window for the pilot to view? The computer he'd be running it off of would be using a projector as an extended display. It wouldn't have to be interactive, because he'd be controlling the game that's being displayed on the big screen. This would just show him the ship flying around without the heads up display.

I hope that makes sense. Any ideas? Thanks so much for any help you guys can give me!

Tony

Answer 1

I'll try to address each of your questions separately.

In order to display something on both the projection screen and on a monitor for the pilot, you'll want to design your air application to include both screens and to run in windowed mode at the resolution of the two screens put together. Let's say your monitor runs at a resolution of 1920x1080 and your projector will push 1024x768. This is what you would want your application to look like:

You'll want to set your Air Settings to use custom chrome, this will hide the standard window chrome. You'll also want to set the initial window settings in the advanced tab:

All of this will set you up to be able to run the application on one computer and have, in essence, two separate displays.

Now, for the "duplicating" part. What you'll want to do is have a Bitmap in the pilot's view to which you'll be constantly drawing the parts that you want him to see, but not the parts you don't want him to see. This process is more commonly known as blitting.

I don't know how your application is set up exactly, but I would hope that your HUD is somewhat self-contained. So let's say that you have a MovieClip with everything in it except for the HUD, here's what you would do:

var _pilotViewCanvasData:BitmapData = new BitmapData(1920, 1080); // ideally, you would make this just big enough to display what you need to display, not the actual size of the pilot view
var pilotViewCanvas:Bitmap = new Bitmap(_pilotViewCanvas);
//add your canvas to the pilot's view area of your application
addChild(pilotViewCanvas);

//add an enter frame listener so you can repaint the canvas every frame
addEventListener(Event.ENTER_FRAME, onTick);
function onTick(e:Event):void
{
    _pilotViewCanvasData.draw(yourGameClip); // this is where you paint the canvas with your display
}

Answer 2

So this is what I did (thanks to Marcela's guidance):

To solve the dual screen issue, I ended up creating two separate Air projects. The first Air project was my game (basic space shooter with asteroid falling towards the ship). The second Air project was for the pilot. Remember, the goal of my game was to have the audience scream out to the person controlling the game with guidance (i.e. "FIRE!" "RELOAD!" "MOVE LEFT!" etc). I wanted to person controlling the ship to have their own interface that showed limited detail (allowing the audience to contribute). For the pilot project, I created a radar type background with a green outline of the ship on the stage. Using localconnection, I passed the ship's x&y coordinates from the main game to the pilot app every time the ship moved and applied them to the pilot's green outlined ship.

Every time an astroid was added to the stage, I sent another localconnection method to the pilot app with the coordinates of that asteroid. In the end, the ship, missiles, and astroids all showed up on the pilot's app in the forms of little blips. If an astroid was destroyed in the main game, I sent a localconnection method to the pilot's app telling it to remove the blip in an array at the same index as the asteroid that was just destroyed.

It works incredibly well. Thanks so much for pointing me in the right direction, Marcela!