INFO 424 SCHEDULE

Olympic medals, Phase 8 - Change text

Phase 8:
Make the text change

At this point (having completed phase 7), you can hover over either circle and the info box will appear. In this phase, you will make the text in the info box change depending upon which circle you're hovering over.

a. Save Medals_7_infoBox.fla as Medals_8_text.fla.

I'm going to give you a little less guidance for writing the code for this phase to give you a chance to learn how to figure it out for yourself. If you're stuck, you can check my answer at the end (but you'll learn more if can do without, so try no to).

As you work, test your movie frequently and, if there are problems, use trace statements liberally to test things out and figure out where problems are. Here are some sample trace statements that you can refer to as models when you need them:

trace("the thing to print in the output window");
//will print this text in the output window when
//this line is reached
//good for figuring out if a function is running
// or an 'if statement' is being tested

trace(myVariable);
//will print the value of the variable -
//good if you think the variable is being populated
//incorrectly

trace(myButton.visible);
//to test a property

Here is the table of data that you will be putting in the infoBox at the appropriate times (you don't need this info yet, but you will as you start writing your code):

Japan:

Canada:

In your code, you have a function "showInfoBox" which currently makes the infoBox visible. You'll be expanding that function to change the text in the info box before making it visible.

The logic: To know which set of data needs to appear in the info box, you need to know 2 things:

1. which country
2. which year

b. Use the data above, and the hints below to write the code that will make the correct info appear in the info box:

HINT 1. Start by testing which circle the mouse is over

Look at how you make the tabs change appearance based on which was active (in the "switchTabs" function). You can use the same strategy to figure out which circle has been hovered over (the instructions were in Phase 4, if that helps).

HINT 2. Then test which year has been selected

You'll need to know which year has been selected in order to enter the correct data. The most direct way to do this is to look at the position of the slider. (As you're trying to figure this out, use a trace statement to see what the slider value is - date_slider_mc.value, when you move it to either date.)

HINT 3. Figure out how to change the text in the text boxes

The dynamic text boxes are "children" of the info box (the info box is the "parent" of the text boxes). You can refer to the text boxes in this way:

<parent>.<child>

...where you replace <parent> and <child> with the names of those objects.

As a reminder, these are the names you gave your text boxes:

• countryName_txt
• NoOfMedals_txt
• NoGold_txt
• NoSilver_txt
• NoBronze_txt

This helps you refer to the text box as an object. It doesn't refer to the actual text within that object. To do that, you need to get to the"text" property of the text box object. You can set it the same way you set the "visible" propert of an object (meaning that you can use infoBox.visible = true as a model for the syntax).

********** SPOILER ********** ANSWER BELOW *********** SPOILER ***************

You might have noticed some warning messages suggesting that you embed your fonts. What that means is that a copy of the font is included in the swf file so you don't have to worry if the person viewing the file doesn't have the font you're using.

c. Go to Text ->Font Embedding. You'll see a dialog box which includes this:

We're using Arial Bold and Arial Regular text so we want to include both of those.

d. Type a name, then select "Arial" for the Family and "Regular" for the Style, and check the "All" check box since you'll use both upper/lower case letters and numerals:

e. Now click on the plus symbol to make this font appear in the box on the left in the dialog box:

f. Do the same for Arial Bold.

g. Now when you text your movie, you shouldn't see the warning message about embedding fonts.

FINAL PRODUCT: Medals_8_text.fla

SUMMARY

Parent/Child relationships

Objects can 'belong' to each other. The main object is referred to as the 'parent' and the object or objects that belong to it are the 'chidren'

The text property of a text box

The property which contains the text to be displayed in a text box

Referring to children of an object

Use the dot notation to refer to children of an object on the stage