Start

Multiple Colors

The text is now displayed in multiple colors! There is a new *variable* named *letterColors* with a list of color variables inside brackets ([])separated by commas (,). The displayed text in the browser panel will cycle through the values in letterColors in order when *drawName()* is called with *letterColors*. Each color is represented by *three numbers* between []. Try *changing numbers*, running your code, and observing the result. *Try experimenting with the first number in the list between brackets. For instance, to turn red into a greenish color, change the first number to 130:*

Message Variable

This line creates a *message variable* and stores the "Change the message!" text in it.

Change Physics

Three variables let you experiment with the animation physics: *mouseResponseThreshold*, *friction*, and *rotationForce*. *mouseResponseThreshold* affects how close the mouse pointer needs to be to affect the dots that make up the letters. The *larger the number*, the *more powerful* the effect of the mouse interaction. Experiment with changing the mouseResponseThreshold to different numbers and running your code. *friction value* You'll probably want to keep friction between *0 and 1*. *rotationForce* value. This variable represents how much each animated dot will try to rotate when interacting with the mouse. Try keeping this value *small*, maybe around *0.01*.

Function

We can call the function, or *ask the program to run that code*, and pass in different values to see different responses. *drawName() is a set of *repeatable code* that we've defined elsewhere *You already did this when you changed the value of the variables that you used to call drawName(). When you call *drawName with two different values*, you can set the message and the display color. In addition to red, we've defined variables that represent some other colors for you to use. *Change the 2nd variable from red to one of the other variable color names defined in the code editor.*

Variables

are used to store some kind of data in a program that can be referenced elsewhere (often more than once).

What JavaScript looks like

1. writing variables 2. messages variables 3. functions 4. multiple colors 5. changing the physics