If you have code hints enabled when you are typing ActionScript, a pop-up window appears containing relevant syntax, method, and event completion tips. This very useful tool is helpful when you are writing ActionScript because it reveals the suggested syntax of the function or method. Flash CS3's code hints, however, work best when it knows what class of object you are addressing. For example, if you name your Movie Clip instance with an _mc suffix, the Actions panel knows that the object is a MovieClip object. When writing code, the most relevant action out of several suggestions is highlighted in the code hints pop-up menu, as shown in Figure 33.1.

Figure 33.1. The Code Hints menu

If you press the Enter key at this time, the method or function is completed for you. The cursor is then positioned at the end of the line and a tooltip pops up, providing the necessary parameters for the function or method you are typing. As you type your code, the tooltip makes the parameter you are writing bold. Refer to Figure 33.2 for an example of the Code Hints tooltip.

Figure 33.2. The Code Hints tooltip indicates the correct parameters for the attachMovie() method.

If you use ActionScript 2.0's strict typing for variable declarations, you can forego the use of suffixes for your instance names. Flash CS3 can automatically show you the code hints for a class of objects if you declare the object's type. For example, if you type the following code into the Actions panel, Flash CS3 knows that holder is a MovieClip object:

var holder:MovieClip = createEmptyMovieClip("holder", 1);

Then, if you refer to holder later in your code (as shown in Figure 33.3), the code hints for the MovieClip class appear.

Figure 33.3. Code hints work for ActionScript 2.0 declared objects as well.

Code hints remove a lot of the guesswork from writing ActionScript. Using this feature is often faster than traversing the massive list of nodes in the Actions toolbox. There are a few settings you can modify to customize the way code hints work and act.

We'll walk you through the options to customize code hints:

If you prefer not to have Code Hints on all the time, you can invoke a code hint whenever needed. While typing your code in the Script pane, do one of the following:

Flash CS3 offers you the capability to choose how your ActionScript is colored. This feature is known as syntax coloring, and it helps to visually "divide" your ActionScript. There are many elements to ActionScript such as variables, functions, constants, and statements. Using syntax coloring makes it much easier to read ActionScript. Set up your Syntax color settings so that they are easy to read but also follow common "standards" in syntax highlighting.

You can modify these colors if you prefer something different — the point of these steps is to illustrate where you can change the colors of your ActionScript code and visibly see those changes on the test code we provide.

Writing online applications in Flash often requires you to write a lot of code. While writing code, it is easy to name an object or variable without thoroughly thinking it through. Naming your objects and variables descriptively is a good idea. If you don't, you will find it hard to come back to your files and remember what each object and variable is intended for. Using Search and Replace enables you to easily rename poorly or improperly named variables or objects. It enables you to identify and change the incorrect string in one step, leaving Flash to replace all occurrences of the string.

However, there are traps when doing this. The following list contains points to remember:

Step through the following example to learn how to use Search and Replace to modify a block of code:

Choosing Find Next is a good method for overcoming the problem when a string is found within a larger string. You can choose Find Next; when it finds the string on its own, you can replace it by choosing Replace. If it finds the search string within a larger string, simply choose Find Next to move forward.

Tip

You can also use the global Find and Replace feature in Flash CS3 to search your entire document for specific ActionScript terms. Choose Edit

There are several ways to position your code effectively, but first there are two considerations to make. On one hand, your code needs to be effective and work well; it must be positioned properly in order for the application to work successfully. On the other hand, you need to make the application easy to build and edit. It needs to be quick and simple in order to modify sections without being laborious and taking up valuable time better spent coding.

The project requirements also dictate how you place your code. We use the scenario that follows to explain some good coding concepts and how and where to place your code.

You are creating a coloring book aimed toward children. The requirements state the application must have a paintbrush tool with different brush styles and sizes, a line tool with different widths available and a stamp tool used to place user-defined images on the drawing canvas. Each of the tools has a corresponding button and a range of options used to modify the properties of the tool. The user clicks on the canvas to start drawing or stamping. Building this application would require a combination of different functions. Functions can be grouped into the following two main categories:

There are many places you can write code in Flash: in a frame, in and on Movie Clips, and on buttons. Your code can interact with any other object within the current movie structure including all levels and nested objects. This makes ActionScript an easy language to use for referencing and modifying objects from anywhere within a movie structure. It also allows for poor coding placement, however. It is very important to take note of where you place your code. "Spaghetti code" is a common term to describe poorly placed code residing on multiple timelines and interlinked in an unclear way. It is quite easy to run into the trap of creating such code.

Centralized code is the key to making an application easy to use and edit. Centralized code does not necessarily mean all of your code should be written on frame 1 of the Main Timeline. Creating centralized code means making observations about what the code is being used for, where it applies, how often it will be used, and how many objects will use the code.

Creating centralized code is different for each project. Here is a list of key concepts to follow when centralizing your code:

A naming convention is a method and style used to name objects, variables, frames, symbol instances, and many other aspects of Flash development. You can have different naming conventions for each area, such as frames and variables. However, you should keep this practice to a minimum and use it only if necessary. There are common naming conventions used by most ActionScript and JavaScript code writers. Here is a list of rules that you may use to help you to create a naming convention:

A particular problem with writing ActionScript is returning to your code to modify it at a later date — most of us don't have computer-like memories. Commenting your ActionScript while writing it is an excellent idea that overcomes this problem by helping you remember how the code is constructed and/or works.

It may take slightly longer to write your code with commenting, but it is worth the trouble. Follow these rules to effectively comment your code:

As you have seen earlier in this chapter and other chapters in the book, the ActionScript 2.0 language can use strong data type declarations. If you are starting a project from scratch in Flash CS3 for Flash Player 6 or higher, we strongly recommend that you try to use ActionScript 2.0 and strong typing. If you're an experienced programmer, we'd further encourage you to use Flash Player 9 and ActionScript 3.0. Strong typing simply means that you declare variables with data types. If you try to perform an illegal operation with a specific data typed variable or object, Flash CS3 will inform you in the Output panel — this is a definite bonus for developers during the debugging process.

Add the code shown in Listing 33.2 to frame 1 of an otherwise empty Flash document. If you click the Check Syntax button in the toolbar of the Actions panel, you'll see the following error in the Output panel:

**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 1: Type mismatch in
   assignment statement: found Number where String is required.
     var nPercent:String = (nLoaded/nTotal)*100;

var loaded:Number = this.getBytesLoaded();
var total:Number = this.getBytesTotal();
var percent:String = (loaded/total)*100;

The error message tells you that the expression used to set the value of percent returns a Number data type, not a String. If you change the data type of percent to a Number, then the code will not return an error:

var percent:Number = (loaded/total)*100;

Declaring data types with your variable declarations forces you to think clearly about how your code will be used.

The Output panel is not only used by Flash CS3 to send syntax error messages to you, but you can also use it to view any data while testing a movie.

Using the trace() action can be a valuable tool when you debug your code. It is very simple to use and is sometimes better to use than the Debugger panel, which we discuss later in this chapter. Each time you call the trace() action, a new line is created and nothing is replaced. This makes it a great asset when you are debugging code such as for() loops. You can also save all data sent to the Output panel to a text file and review it later. A debugging session with the Debugger panel can't be saved.

In this exercise, you create a simple frame loop and repeatedly send some information to the output window.

Tip

You can slow down the rate of trace() messages for this example by changing the movie's frame rate in the Modify

The trace() action can also send expressions to the Output panel. In this example, you write an expression inside the trace() action and the result is sent to the Output panel.

Although these are simple examples, the trace() action can be used to send the result of almost any equation that can be written on one line to the Output panel, assuming all variables referenced in the expression have been predefined.

The Output panel is used for troubleshooting, displaying syntax errors, and viewing trace() action values. It can also be used to view all objects or variables currently in your movie.

The List Object and List Variables commands, available in the Debug menu of the Test Movie environment, are very useful when debugging large applications in Flash CS3.

Follow these steps to test the List Objects and List Variables commands:

While you are testing, you can use the Debugger panel to view or modify all variables in your movie. This is very useful because you will see the results of any change in a variable's value straightaway, as your movie is running.

Using the Debugger panel to monitor the value of multiple variables can get quite confusing, especially if you need to compare variables that exist on different timelines. Employing the Watch list is an easy way to monitor the value of certain variables in a manageable way.

After you have added a variable to the Watch list, you can view it regardless of which Movie Clip you have selected in the Movie Clip list.

The Properties tab of the Debugger panel displays the properties of all the Movie Clip instances, including the Main Timeline (_root, displayed as _level0) in your movie. Follow these steps to view and edit movie properties while debugging.

Perform these steps to view the properties of any Movie Clip timeline in the movie:

Perform these steps to edit a specific property of a timeline or object in the Debugger panel:

You can set, delete, or remove all breakpoints in the Actions panel while authoring a Flash document.

Follow these steps to apply a breakpoint to a specific line of ActionScript code:

Perform the following steps to delete a breakpoint from a line of code in the Actions panel:

After you have started debugging your movie, you can add and remove breakpoints. You can remove a single breakpoint or remove all breakpoints.

Follow these steps to add a breakpoint in the Debugger panel:

To remove a breakpoint in the Debugger panel, follow these steps. This example continues from above. You should use the same file, so make sure you are still in Debug Movie mode.

Using breakpoints and the Debugger panel, you can step through lines of your code while the movie is playing. This is a very powerful feature, enabling you to pinpoint the exact position of a problem in your code.

When you start a debugging session by choosing Debug

Macromedia has successfully deployed Flash Player technology over the years. You can now find the Flash Player on many platforms, including Windows, Mac, and Linux, but it also exists on devices such as the Pocket PC (PDA handhelds), mobile phones, and the Sony PlayStation.

With the availability of the Flash Player on many platforms and devices, it is very important that you test your Flash movies across all possible mediums. Thoroughly testing your movie on multiple player versions is a crucial step in planning a successful application built with Flash CS3. Doing this can save you much trouble further down the road if your application is more successful than you initially planned.

Figure 33.10 shows an example of a testing matrix. Such matrices should be used before a launch of any commercial application. Testing across all of these different configurations can be a little time consuming but it ensures maximum compatibility of your application. There is little point to releasing a product that doesn't correctly work for your target audiences.

Regular testing of your product, both at the end of the development and especially during the development cycle, will ensure an easier transition from development to release.

Figure 33.10. You could use this matrix for Flash movies that will be viewed and used within a browser. It covers a wide range of available and commercially used browsers.

Once you have an .as file to use in a project, it is easy to make the ActionScript within the file available to your movie. The #include command is used to load any code from an external file and put it in the Flash movie file (.swf) published or tested by Flash CS3. If you edit the .as file included in your movie, the changes will not automatically become part of an already published Flash movie file (.swf). The #include command is only executed at the time you publish or test the .swf file.

This simple example shows you how to include an external ActionScript file in a movie.

Now that you know how to use the #include directive, you can start to store larger amounts of code within .as files. One of the primary benefits of using .as files is that you can easily share the same ActionScript code from one Flash document to another.

If you prefer not to use the #include command to incorporate the code in your Flash movie file (.swf) at runtime, you can simply import the file directly into Flash 8 using the Actions panel.

Just as you can import the contents of an external file, you can export the contents of the Script pane to an .as file. This will enable you to take advantage of the editing capabilities in the Actions panel while still leveraging the usefulness of external ActionScript files.

When working with a team of developers on one project, it can get quite difficult to manage the development of an application. Many "newbie" applications are built within one .fla file, which poses a problem because only one person can work on the file at any given time. It can become very confusing and file versioning errors may occur.

A great way to reduce dependency on other team members is to break the .fla file up as much as possible. This may include breaking a project into several Flash document files (.fla), which are then combined using the loadMovie() method command at runtime. Another effective method is to use external code files for storing data. For each block of code performing a separate task, or each custom object you are using in your application, you can store the ActionScript in an external file. This makes it easy for many people to work simultaneously on one application.

With Flash CS3, you can build ActionScript routines (and even your own custom classes) suitable for re-use across a variety of situations. For instance, you may have a block of code that you use to initiate a connection to a server-side script, or an Adobe Flash Media Server application. Storing such code in external code files is an easy way to include them in your next project without much effort.

An ActionScript library is a set of code used for a specific purpose. It can be any block of ActionScript, from simple variable declarations to more advanced ActionScript objects. This sort of code is well suited for being stored in an external text file, and easily included in many projects.

The following list will help you alleviate the need for troubleshooting your movie and prevent many problems from occurring:

The following is a list of guidelines that you should follow when you are not too sure where your movie is faulting. Both developers and designers should read these general guidelines; often, simple mistakes cause problems in your structure and ActionScript.

This checklist is a simple guide to problems relating to the structure and layout of your movies.

This is a list of common problems that may occur when you are writing ActionScript. Problems in your project can spread far and wide; these might also be caused by one or more trouble areas that we covered in the general or designer guideline sections. It is to your advantage to read all the troubleshooting areas to maximize your chance of solving problems.