QTVR Flash Map Tutorial

Mar 28, 2003

Please note that this movie is broken if you have Quicktime 7.3 or later installed.

This tutorial will show you how to make a Quicktime VR movie with an embedded Flash map, with buttons that let you click on the map to jump directly to any node. You can download the project file for this movie by visiting the downloads section. This movie was wired using VRHotwires.

This is the second in a series of tutorials covering various techniques to create interactivity between Quicktime and Flash. The first tutorial shows how to send variables from Quicktime To Flash, allowing you to create animated Flash compasses. The above movie works by sending the value of a variable in the Flash track to Quicktime.


Step 1: Wire Up The Multinode

It might seem like the wrong order to do things but when making multinode movies the wiring has to go in first. The reason for this is that when a flash track gets added, that track covers the full duration of the movie. This means that the durations of each individual node get obscured, and the wiring processor can't embed each nodes code properly. But there is no reason why the Flash-related wiring can't be embedded before the Flash track is added.





To wire up the QT movie just open the Script window in VRHotwires. If the movie is a multinode the window should show a list of the nodes in the movie. The code for each node has to be entered between these headings. When the wiring is entered, click 'Script To Movie'. To checked that everything has worked properly, click 'Movie To Script'. VRH will read the embedded wiring from the movie and display it in the script window. If everything is the same as what you typed in, then the movie has been successfully wired. If nothing comes out or it comes out different, check your code and try again (since naturally you copied it all before clicking 'Movie to Script').

The 'On Idle' handler is where the Flash variable detection happens. 'On Idle' means that this code will get executed as the movie idles, or in other words as it plays each frame. As soon as the specified variables are set in Flash, the conditional in the 'On Idle' handler will be triggered and the QT movie will jump to the specified node. The first two arguments in 'theFlashTrackVariable' refer to the path to the variable (an instance named 'map') and the name of the variable ('node').

When a new node is entered, 'FlashTrackSetFlashVariable' is used to reset the 'node' variable in Flash to 0. This means that when you leave the node via a hotspot, you won't get instantly sent back to the node you came from. This code is executed in the 'On NodeEntry' event handler.

Step 2: Embed the Flash Track

The main timeline of the movie has only 2 layers, one with the VR and one with an instance of the map, named 'map'. The main timeline must be the same length as the the VR movie. To determine this, add frames to the timeline on the layer with the VR until the movie gets replaced with an 'x'. Trim it back again until the VR reappears. Also, if you want the end result to work in QT 5, make sure you set the publish settings of the movie to 'Flash 4'. The Flash track is going to be running under QT, and QT 5 onlys understands Flash 4.





This is the Flash movie that was prepared a little earlier. Here you can see the map movie clip. The movie clip contains three buttons, which have the following actionscript attached;


on (release){
node = 1;
}


Set the value of node to 2 or 3 for the other two buttons. That is all the actionscript that is needed. To finish the movie, make sure that the wired version of the movie is that one that you have imported, and go to File-Export Movie. Select 'Quicktime' as the file type. In the Quicktime export dialogue box which follows, set the movie type to 'Quicktime VR'. All the others settings should work fine as they are.

Comment On This Post

Comments are moderated by the site admin. It's nothing personal - just trying to keep out the spam. Any reasonably relevant comment will probably be published.

Posted By;
Comment;
Are You Human? If so enter the code;