Web DevCenter
oreilly.comSafari Books Online.Conferences.
MySQL Conference and Expo April 14-17, 2008, Santa Clara, CA

Sponsored Developer Resources

Web Columns
Adobe GoLive
Essential JavaScript
Megnut

Web Topics
All Articles
Browsers
ColdFusion
CSS
Database
Flash
Graphics
HTML/XHTML/DHTML
Scripting Languages
Tools
Weblogs

Atom 1.0 Feed RSS 1.0 Feed RSS 2.0 Feed

Learning Lab






Firing Up Director MX
Pages: 1, 2

Scripting the Action

At this point, your score should look exactly like this:

Figure 3

  1. Before we start scripting, let's see how the movie runs as-is. Hit the Rewind button directly underneath the Stage. Notice that the playhead obediently jumps to the first frame. Making sure that the Loop Playback button is selected (5 buttons to the right of the Rewind button), hit the Play button below the Stage, and watch both the Stage and Score for a little while and then press the Stop button below the Stage. Annoying, no? What's happening is that the playhead is whipping through the frames, returning to the beginning when it gets to the end and then continuing. It hasn't been told otherwise. We'll soon address this problem.

  2. Double-click in the Script channel of Frame 1, directly above the 1 in the Score. A scripting pane will open that contains the code:

    1 on exitFrame me
    2	
    3 end
  3. A blinking cursor will appear in the blank line 2, and at that prompt enter "go to the frame" (without quotes), name the script "Hold", which you do by entering the name in the blank field at the top of the scripting window, and close the window. You'll see a new Cast member in the Cast Window, and its number will appear in the scripting channel. So what does that accomplish? It's telling Director that as the playhead leaves frame 1 it should go to the frame its currently on. So the playhead remains paused at that frame, waiting for further instructions.

    Script
    A Simple Script. The Script window has menus that call up many lines of prefabricated code, making it easy to experiment.

    Why "me"? You may have noticed the tiny word "me" in line 1 of the above. That simply means "this frame". Though it doesn't seem necessary, that's what the script says by default, so I figured I'd just leave it alone.

  4. We're going to need this exact script again, on frame 12, but instead of typing it out again, just drag it from the Cast to the Scripting channel of the score at frame 12.

  5. Click in the gray area directly above the Scripting Channel for the 2nd frame. A triangle will appear with the text "New Marker". Replace that text with the name "VidStart" (without quotes). Why are we doing this? When we write the button scripts, we'll refer to this marker.

    Tip: In a script, referring to specific frames is a bad idea. What if you changed things around a bit and inserted media into various frames of your movie? All the frame numbers would be wrong. You'd have to change each and every script. If you use a marker, and you make changes, you just move the marker; there's no need to touch your scripts!

  6. We're going to write one more short frame script before we script the buttons. Double-click in the Script channel of the 2nd frame, the one under the VidStart marker, and type the following script:

    1. on exitFrame me
    2.  sprite(2).movieRate = 1
    3.  sprite(1).movieRate = 1
    4. end

    Name the script "Resume" and close the window.

    This script will ensure that whether a user presses Play for the first time, or presses Play after pressing Pause, the video (actually both videos) will continue playing right where they left off.

Scripting the Buttons

  1. Click on the FullButton on the Score and then click the Behavior tab on the Property Inspector. Click the plus-sign button to call up the Behavior Popup and scroll to select New Behavior. Name the behavior "Full View" and click OK. Click the scroll icon above the new behavior to call up the Script Window; at the prompt, type the following code and close the window:

    1. on MouseUp me
    2. set the blend of sprite(2) to 100
    3. end MouseUp 
  2. Repeat Step 1 for the FeetButton, naming the new behavior "Feet View". The script for Feet View is exactly the same as Full View, but line 2 of Feet View contains the code "set the blend of sprite(2) to 0" (without quotes).

    What we're doing here is making the video in Channel 2 transparent (where the blend = 0) or opaque (where the blend = 100). So when a user clicks the Feet View button, even though the video of the Full View is transparent, they still hear the exact same audio, and since the two videos begin and end at the same point relative to the music, the feet keep time with the music from the other video.

  3. Follow the same steps for PlayButton, PauseButton, and RewindButton, naming the behaviors Play, Pause, and Rewind, and using the following scripts for each:

    PlayButton:
    1. on MouseUp me
    2. go to frame "VidStart"
    3. end
    PauseButton:
    1. on MouseUp me
    2.  sprite(2).MovieRate = 0
    3.  sprite(1).MovieRate = 0
    4.  end
    Rewind Button:
    1. On MouseUp me
    2.  sprite(2).movieTime = 0
    3.  sprite(2).movieRate = 0
    4.  sprite(1).movieTime = 0
    5.  sprite(1).movieRate = 0
    6.  end
    

    What just happened? We told each of these buttons that after you click on them (MouseUp) several things should happen to several sprites. The MovieRate property says, "The video is playing (1)" or "The video is not playing (0)." And the MovieTime property says "When the MovieTime is 0, the video is at the beginning."

  4. We're almost there. Click the Rewind button below the Stage and then the Play button (also below the Stage). The movie will present the first frame and then pause, waiting for input. Click the Play button in your movie and watch both the stage and the score. The film plays from beginning to end and then pauses at the final frame. However, the video clip should play for about 30 seconds, and we're only getting about 5 seconds out of it. The problem is that the video has an independent timing from that of the playhead. To get around this problem, add the following script in the Script channel of frame 11, and name it Video Loop:

    1. on exitFrame me
    2.	myMember = sprite(2).member
    3.	myDuration = member(myMember).duration
    4.	myMovietime = sprite(2).movieTime
    5.	if myDuration > myMovietime then
    6.	go to the frame
    7.	else
    8.	go to the frame + 1
    9.	end if
    10. end

    This is a very long-winded way of saying that if the video is over, proceed to the next frame, but if the video is not over, that is, if "My Movie's Time" is less than the duration of the video, then keep playing the video. Lines 2 through 3 set up the variables that are calculated in line 5. How did I, a non-programmer, come up with code such as this? I copied it verbatim from Macromedia's Help file, substituting "sprite(2)" for the sprite name. Because the navigation ensures that both movies will always play simultaneously, I need only reference one of the videos, in this case, the video playing in Channel 2.

  5. All that remains is one little detail: the Replay button in frame 12. But because we want it to do the exact same thing as the Play button in frames 1 through 11, we won't have to rewrite the script. Just select the ReplayButton in the Score (12th frame, 2nd channel), hit the Behavior pop-up button on the Property Inspector as you did before, but instead of creating a new behavior, just scroll down and select Play.

  6. Creating a Shockwave version of this file required a few extra steps that go beyond the scope of this tutorial. But to create a self-running version of the movie for distribution (a "projector"), choose Create Projector from the file menu and follow the steps to create a projector of your .dir file (to quit the projector, hit Command-Q). When you distribute the projector, include copies of the QuickTime movies in the same folder; these aren't included in the packaging process.

And with that, you're done. Hit Rewind and Play in the control strip below the stage and then hit Play in the movie. Switch between Full View and Feet View. Experiment with Pause, Rewind, and Replay. And now that you've learned all there is to know about Samba, get up from the computer and hit that dance floor!

David Weiss is an Oakland, California based freelance writer. He's worked as a senior editor at Macworld magazine, and as the lead editor of MacHome Journal. Read more about David at www.davidweiss.net.


Return to the Web Development DevCenter.