Next Class

I lieu of next quiz: Recreate the Hangman Movie. Due next Wednesday.

Review from Monday

fruitNames = ["apple",
"orange",
"lemon",
"avocado"];

fruitColors = ["red",
"orange",
"yellow",
"green"];

counter=0

searchString="lemon"

// look for searchString

while(fruitNames[counter]
!= searchString
&& fruitNames[counter]
< fruitNames.length) {

//Loop jumps out when it finds the
//string which leaves counter with
//the number of the position.

while(fruitNames[counter]
!= searchString
&& counter
< fruitNames.length) {

counter++;

}

// respond with searchString's color

if (fruitNames[counter]
== searchString) {

trace(searchString + " color is: "
+ fruitColors[counter]);

}else{

trace("there is no match for "
+ searchString);

}

I lieu of next quiz: Recreate the Hangman Movie.

Summary

"while" loops

"for" loops

searching arrays

Cross-indexing arrays

Building a movie of movieclips

A practical application of arrays

The _visible movieclip property

Checking progress with trace();

Getting a random number with the Math object (don't worry about it yet)

Setting the scope of a callback

Using a movieclip to show the state of the game

Building Functions

Functions are completely customizable tools that you build. If done right, you only have to build them once. And, you get to use them over and over.

Re-usability!!! Once written, you (theoretically) never have to write it again.

Centralization!

Easier maintenance

Greater legibility

First, declare a function

myCustomCode = function() {

statement

statement

statement

etc...

}

Look, no events!

Examples

sayHi = function() {

trace("Hi there!");

}

moveClip = function() {

myClip_mc._x += 10;

myClip_mc._y += 10;

}

hideAllMonsters = function() {

for(i=0; i<numberOfMonsters; i++){

_root["monster" + i + "_mc"]._visible = false;

}

trace("Monsters hidden!");

}

Another Way

function moveClip () {

myClip_mc._x += 10;

myClip_mc._y += 10;

}

Subtle difference: First one is a callback, which stores the function in a variable container called "moveClipEvent". Second creates a function called "moveClipEvent".

Why should you care? Callbacks allow you to swap out the function with different functions. Rarely useful, but you never know. Call backs are the "preferred method" for Flash MX coding.

We might have a situation in a "for" loop that called for hundreds of lines of code! It's easier to write AND to debug if you break it up into digestible generalizable pieces.

For example:

for(i=0; i<20; i++){

// 500 statements that go "shopping"

statement1;

statement2;

statement3;

...

statement 100;

}

Could become:

for(i=0; i<20; i++){

goShopping();

}

But goShopping() is still 500 lines long! Better to break it down some more:

for(i=0; i<20; i++){

walkToStore();

findItems();

walkToCheckout();

findCost();

payForGoods();

checkChange();

walkHome();

}

Pass It Along With Parameters

myCustomCode = function() {

statements...

}

Becomes...

myCustomCode = function(param1, param2, param3,...paramn) {

statements...

}

Examples

say=function(msg){

trace(msg);

}

moveClip = function(theClip, xDist, yDist){

theClip._x += xDist;

theClip._y += yDist;

}

swapVis = function(theClip) {

theClip._visible = !theClip._visible;

}

And to make things more generic than our walkToStore function above, how about:

walk = function(destination) {

// var makes destination a variable only within the walk function.

var destination;

gotoAndStop(destination);

}

So, an even better go shopping loop might be:

for(i=0; i<20; i++){

walk("store");

findItems("bread", "milk);

walk("checkout");

findCost("bread","milk");

payForGoods();

checkChange();

walk("home");

}

What Goes Around, Comes Around

"return" returns, turns back, exits, ends the function.

As in: "You called me from somewhere, now be gone with you! Return!"

say=function(msg){

return;

trace(msg); // this line is never reached

}

Why?

Comes in handy in a "testing" situation:

var correctPass="cactus";

enterSite = function(pass){

if (pass != correctPass) {

return;

}

gotoAndPlay("intro);

}

Equivalence

This:

myFunc=function(){

statement;

return;

}

Is the same as this:

myFunc=function(){

statement;

}

Many programming languages require a "return" at the end of a function.

myFunc=function(){

return expression;

}

Examples:

combine=function(firstVal,secVal){

return firstVal + secVal;

}

squareIt=function(thisValue){

return thisValue*thisValue

}

trace(squareIt(4));

var a=3;

var b=4;

var hypotenuse = Math.sqrt(squareIt(a) + squareIt(b));

trace(hypotenuse);

Function Scope/Availability

A function can only talk directly to code that is:

Attached to the timeline of the movieClip that bears the function declaration

Attached to a button on the timeline of the movieClip that bears the function declaration

Direct conversation within the same timeline:

myFunction();

Talking to other functions that aren't in the same timeline...

Remember Scope? Make calls through the path dot syntax structure.

From the root timeline to clipB_mc's timeline:

clipA_mc.clipB_mc.myFunction();

From the clip2_mc to the root timeline:

_root.myFunction();

From the clip2_mc's timeline to clipB_mc's timeline:

_root.clipA_mc.clipB_mc.myFunction();

From the clipB_mc's timeline to clip2_mc's timeline:

_root.clip1_mc.clip2_mc.myFunction();

A Gotcha!

You must always declare the scope of any element of a statement if it is not within the same clip's timeline.

Calling clipB_mc from the root timeline

clipA_mc.clipB_mc.
myFunction(clipA_mc.clipB_mc.
myVariable);

And

Calling clipB_mc's function to use with clip2_mc's variable from the root timeline

clipA_mc.clipB_mc.myFunction
(_root.clip1_mc.clip2_mc.myVariable);

Variables assigned to a function's local scope are called "local variables". The keyword "var" identifies a local variable.

Test...

myFunction=function() {

var temp ="This is a local";

trace(temp);

}

trace(temp);

At the end of the function, the variable dies.

myFunction=function() {

temp = "This isn't local"

trace(temp);

}

trace(temp);

Question: Where does temp live?

Why is it useful?

Frees up memory

Makes code more readable by not having to come up with a special variable name for each function

Does This Look Familiar?

Notice how a custom function looks like an actionScript command?

Sometimes they just do something:

play();

Sometimes they do something, but need a parameter to do it:

gotoAndPlay(numberOrLabel);

Sometimes they do something, require a parameter, and return a result:

getBytesLoaded(movieClip)

That's because some commands are functions.

Quiz Two

Target start time: 5:00 PM

Announced in class

Exercises

Write a function that adds two numbers together, then divides them by a third number.

Use parameters in your function for the three numbers

Use trace() to output the result

Make a movie with a button that calls on a function to move a movieClip to a specific location on the screen.

Use a callback for the button

Enhance that movie with another button that calls on a function to move the movieClip clip up and to the left.

Use a callback for the button

Use a parameter to define which movieClip is effected

Use a parameter to define how far it moves up

Use a parameter to define how far it moves left

Make a movie with a button that sets the output text to the same as the input text, but repeats the input text twice.

Use a callback for the button

Use variables for the dynamic and input text fields

Make the movieClip toggle between it's start position and the target position.