Figure #. A T20 snowball de longueur with textual elements and changes to the x, y, and rotation properties

3.iv. Snowball #3

Code for Snowball_3.as

1   package {
2    
3      import flash.display.Sprite;
4      import flash.text.TextField;
5      import flash.text.TextFormat;
6    
7      public class Snowball_1 extends Sprite {
8    
9         public function Snowball_1() {
11            var mydb:Array = new Array();
12               mydb[0] = "computers";
13               mydb[1] = "writing";
14               mydb[2] = "Rhet";
15               mydb[3] = "Oulipo";
16               mydb[4] = "constraint";
17               mydb[5] = "software";
18               mydb[6] = "studies";
19    
20            var counter:int = 0;
21            var odo:int = 1;
22            var mag:int = 20;
23            var lf:Calibri = new Calibri();
24            var tf:TextFormat = new TextFormat();
25               tf.font = lf.fontName;
26               tf.align = "center";
27               tf.size = 10;
28               tf.color = 0x000000;
29    
30            for(var r:int = 0; r <= mag; r++) {
31               for(var c:int = 0; c < r; c++) {
32                  var t:TextField = new TextField();
33                  t.defaultTextFormat = tf;
34                  t.height = 19;
35                  t.embedFonts = true;
36                  t.text = mydb[counter];
37    
38                  t.x = (1 - odo) + ((t.width / 2) * c);
39                  t.y = 1 + ((t.height / 3) * r) + 5;
40                  t.rotation = odo + 10;
41    
42                  addChild(t);
43                  odo++;
44    
45                  if(counter == mydb.length - 1) {
46                     counter = 0;
47                  }
48                  else {
49                     counter++;
50                  }
51               }
52            }
53         }
54      }
55   }


Explanation of the Code

Our third and final example of a snowball looks markedly different from the first one, but, again, the difference in the code is not that significant. The most significant difference in this program is the use of text, which I’ll go over shortly. The differences in the on-screen appearance of the original snowball can be traced to three lines, 38-39, which are the three lines that define the location and rotation of the textfields on the screen.

Snowball #1:
27                  t.x = 1 + ((t.width + 5) * c);
28                  t.y = 1 + ((t.height + 5) * r);
Snowball #2:
27                  t.x = (1 + odo) + ((t.width + 5) * c);
28                  t.y = (1 - odo) + ((t.height + 5) * r);
29                  t.rotation = r * c * Math.random();
Snowball #3:
38                  t.x = (1 - odo) + ((t.width / 2) * c);
39                  t.y = 1 + ((t.height / 3) * r) + 5;
40                  t.rotation = odo + 10;

In Line 38 of the third snowball, it is the x or horizontal value that is reduced with each addition to the value of odo. The statement, t.width + 5, has been replaced with t.width / 2, which is considerably shorter, too. Figure 13 below, which is a numerical version of the snowball in Figure 12, illustrates the way in which the manipulation of the x value has changed the look of the snowball on the screen.


Figure 13. A numerical version of the T20 snowball de longueur in Figure 12

With a few keystrokes, the lines appear to be curving back as well as folding over each other. A third dimension is simulated by the rotation and curvature of the textfields.

Line 39 has also been changed, although not as dramatically. Essentially, the space beween the rows has been reduced.

In addition to the dramatic on-screen changes introduced by Line 38, the change in the rotational values added to Line 40 has transformed the look of the on-screen text. Especially when we look at the role of rotation in Figure 12, the lines appear to be forming a twisting, horizontal column in the middle of the textual iteration.

Finally, the other significant difference in our third snowball is the introduction of text. We have finally moved beyond numerical representations. Lines 11-18 represent an Array.

11            var mydb:Array = new Array();
12               mydb[0] = "computers";
13               mydb[1] = "writing";
14               mydb[2] = "Rhet";
15               mydb[3] = "Oulipo";
16               mydb[4] = "constraint";
17               mydb[5] = "software";
18               mydb[6] = "studies";

In their reference guide to AS3 titled ActionScript 3.0 Bible, Roger Brainstein, et al introduce the array as a complex data type. They explain that it is “a lot like a numbered list of items” (153). In fact, they encourage their readers to visualize an array as a “set of numbered cubbyholes, each containing a single item” (154). Variables like mag, odo, r, and c are “primitive,” because they can only hold one value at a time, an array contains numerous values. An array is complex because it can contain hundreds of values in an ordered list-like structure.

Lines 12-18 constitute a 7-item list of strings or words. They ordered numerical beginning with 0. In order to access one of the items in an array, I place the number at which the value is listed in square brackets to the right of the name of the array.

36                  t.text = mydb[counter];

Line 36 does not have a number in the square brackets to the right of mydb, but a quick review of Line 20 shows us the reason: counter is a variable that I created and typed as an integer. It’s initial value is 0, which means that the very first word published to the screen will be “computers.”

20            var counter:int = 0;

The last series of lines that need to be introduced are 45-50.

45                  if(counter == mydb.length - 1) {
46                     counter = 0;
47                  }
48                  else {
49                     counter++;
50                  }

These lines demonstrate the use of an if-else statement. I use it to reset counter to 0 when it reaches a value of 6. The reason is that there are only 7 elements in mydb; so, if the counter has a value beyond 6, it would try to access a slot in the array that doesn’t exist. mydb[6] is the last element in that array. mydb.length has a value of 7, but the first slot is a 0, which means that the highest value counter can contain is 6, which is why I evaluate for the value of mydb.length – 1.

The basic structure of an if-else statement can be summarized in the abstract as follows:

if(true) {
execute these instructions;
}
else {
execute these instructions, instead;
}

Braunstein, et al explain that the if-else conditional statement is one of the most basic ways to introduce decision-making in a software program (19).

Based on this abstraction, let’s assume that the value of counter is 6.

if(6 == (mydb.length – 1) {
change the value of counter to 0;
}

Since the value of mydb.length – 1 is 6, counter will be reassigned a value of 0. By constrast, if the value of counter is 2, which means that the parenthetical statement to the right of if is false, an additional value of 1 will be added to counter (i.e., counter++).