Due: 2014-01-21 10:30a
Important: Because this requires a resource (i.e., a textfile), submit your whole sketch directory and not just the .pde file. You can zip it if you like, or just drag the whole directory into the DROPBOX, either will work.
Today, you are going to be reading in some text from a file and transforming it into… well, hopefully something interesting (though it is unlikely to give you great insight into the actual contents of the text). The idea is that we will use the characters in the text as commands, telling us how to draw. Here is a simple example:
The heart of this exercise is a collection of rules that determine what happens when a particular character is ready to be drawn. The above drawing is the result of five rules:
Start with some code that reads in a file and prints out the first line, one character at a time. Your setup() function should initialize the font, load the strings using the loadStrings() function, set the background and call noLoop(). Your draw() function should start by translating to a random location on the screen. To give your shape the best chance of staying visible, try keeping the x dimension in the first 1/4 of the canvas, and make sure your y dimension is at least big enough to fit text at your given font size.
Now write a for loop that iterates over the length of the first string in the list of strings. Use the text() function to print the character and then translate in the x direction by the width of the character. When you have done this, the first string should print out somewhere on the screen. Possibly the end will run off the right side, but that is okay.
Now we will add some rules. The easiest way to do this is with a switch statement. If you aren’t familiar with switch statements, they are basically if statements for when we have a lot of different conditions to consider. You have seen them down in the magic code I gave you for taking screen shots. The basic syntax looks like this:
switch (test value){
case value 1:
// do 1st stuff
break;
case value 2:
// do 2nd stuff
break;
...
default:
// do default stuff
break;
}
This works out so that you do the 1st stuff when test value == value 1, 2nd stuff when test value == value 2, etc. (the … isn’t syntax, it is just to indicate you can have as many cases as you like). The version you have seen in my examples looks like this:
void keyReleased(){
switch(key){
case 'r':
redraw();
break;
case 's':
saveFrame("username_hw-####.png");
break;
}
}
Here, key is a Processing variable holding the currently pressed key, and that is our test value. We are then testing for the characters ‘r’ and ‘s’, which are value 1 and value 2 respectively. So, put the current character in for test value, and the various characters you want to match in for the various cases.
For your first case, test for a ‘ ‘ character. If you get it, translate forwards (in the x dimension) the width of the character. Then use our technique for generating a 0 or a 1 using random(). If you get a 0, rotate() π/4, if you get a 1, rotate(), -π/4. Now do the same for ‘,’ and ‘.’, following the rules listed above. Finally, the default will handle any other characters. This should display the current character (using text()) at (0,0), and then translate() forward by the width of the character.
Once you have one line working, adding additional ones is not that hard. Surround the first translate and the whole for loop with another for loop that iterates through the array of Strings. The only addition you will need to make is a pushMatrix() before the first translate, and a popMatrix at the end of the inner for loop. These reset all of the translations and rotations. This and the first translation are what implement the fifth rule. At this point you should have something that looks like my squiggles.
Okay, the process above is really just the bare bones and it doesn’t look that interesting. Get creative. You can match any character and do just about anything in response. Change the color, change the size, change and font, etc… You don’t even need to actually print out the characters, you could draw boxes where the characters go, or use them as points on a line, or make a shape out of them. If you really want to go crazy, you could go over to Project Gutenberg, grab a novel and read that in. Create some agents like the one from the Flow assignment and have each agent use a paragraph as a set of directions, interpreting every character as a different direction, and see if you get. Go crazy. I just want to see evidence that the final result is driven by the text on a character by character basis.
I would like you to name the sketch using this pattern: username_hw9.
Submit at least one image and name it using the pattern username_hw9-####.png.
Don’t forget the documentation block below at the top of your sketch. Make sure that you specify what you did that was cool and interesting.
/**
Assignment Nine
A description of the sketch.
Your name
The date
**/
I would like this code turned in in the DROPBOX on MiddFiles. You can refer to the reference on the LIS wiki to help you connect to the file server.