Smilie-O-Mat
Objective Complete - Mini Debriefing
For this task, we added three sliders that change the values of our control variables. We didn't use any existing GUI libraries; we created the sliders from scratch by mapping the values of our variables that fall within the interval 0 to 1024 to the length of the slider and drawing two rectangles.
We also implemented three callback functions to make the sliders react to mouse events. In the mousePressed() method, we test whether the mouse pointer is on one of our sliders, and if it is, we set the Boolean variable for this slider to true. In the mouseDragged() method, we change the value of our control variables if the Boolean variable for this parameter is true. When the mouse button is released, we set all Boolean variables to false in the mouseReleased() method.
Hello Twitter
Task 3 of our mission is to create a Processing sketch that is able to change our current Twitter status. We will use the Java library Twitter4J from twitter4j.org, which encapsulates all the Twitter API calls into convenient Java objects to set the status. We will also use the Twitter developer website to create the necessary application keys and learn how to ask the user for permission to post a status update.
Prepare for Lift Off
To complete this and the following task of our current mission, you will need a Twitter account to post the tweets and access to the Twitter developer site. If you are already using Twitter, you are fulfilling the prerequisites for this task, as Twitter doesn't distinguish between normal and developer accounts; every Twitter user has the permission to create and register applications. If you have no Twitter account yet, go to twitter.com and register for one.
Engage Thrusters
Let's tweet a bit:
1.Go to the Twitter developer pages at https://dev.twitter.com/ and log in with your Twitter account.
2.Now click on your account and select My applications from the pop-up menu in the upper-right corner, as can be seen in the following screenshot:
94
Project 4
3.Now register a new application by clicking on Create a new Application and filling out the registration form.
4.Switch to the Settings tab and change the Application Type to Read and Write to allow our app to post tweets.
5.Now switch back to the Details tab and create the consumer key in Consumer key and the Consumer Secret key by clicking on Recreate my access token. The following screenshot shows the Details page for my Smilie-O-Mat application:
95 
Smilie-O-Mat
6.Copy the two keys to a text file named keys.txt; place each key on a new line and make sure that there are no blank spaces at the end of each line.
7.For this task, we need the Twitter4J library. Go to http://twitter4j.org, download the twitter4j-3.0.3.zip file, and unzip it. We need the twitter4jcore.jar file from the lib folder of the ZIP package.
8.Create a new Processing sketch and add the jar file you just extracted from the ZIP file by dragging it to the sketch window or by using the Add File ... option under the
Sketch menu.
9.Drag the keys.txt file we created in step 6 to the sketch window, or add it using the Add File ... option under the Sketch menu.
10.Now add a draw() and a setup() method to our sketch.
void setup() {
}
void draw() {
}
11.To use the Twitter4J library, we need to import it and define a twitter object. We also need to define a string array, which will contain some Twitter messages that we want to send.
import twitter4j.*;
Twitter twitter; String[] tweets = {
"tweet tweet #test", "test 1 2 3 #test", "microphone test #test"
};
12.In our setup() method, we need to initialize the twitter object and provide the consumer key and the consumer secret key that we stored in the keys.txt file. We also need an access token and an access token secret to get the permission to post to a user's feed. To get these two access keys, we need to trigger a browser window to open to ask the user for his/her permission.
void setup() { size(300,100); noLoop();
textFont( createFont( "Georgia", 24 ));
String[] keys = loadStrings( "keys.txt" );
96
Project 4
try {
twitter = TwitterFactory.getSingleton(); twitter.setOAuthConsumer( keys[0], keys[1] ); RequestToken requestToken =
twitter.getOAuthRequestToken(); AccessToken at = null;
if ( System.getProperty("os.name").toLowerCase(). indexOf("win")>=0) {
link(requestToken.getAuthorizationURL());
}
else { open(requestToken.getAuthorizationURL());
}
}catch ( Exception e ) { e.printStackTrace();
}
}
This is the page that opens when our sketch doesn't find a key:
97 
Smilie-O-Mat
13.When the user clicks on Authorize app, Twitter generates a pin like the one shown in this screenshot:
14.Now we need the user to enter the pin from the website and use this pin to fetch our access token keys from Twitter.
void setup() { size(300,100); noLoop();
textFont( createFont( "Georgia", 24 ));
String[] keys = loadStrings( "keys.txt" );
try {
twitter = TwitterFactory.getSingleton(); twitter.setOAuthConsumer( keys[0], keys[1] ); RequestToken requestToken =
twitter.getOAuthRequestToken(); AccessToken at = null;
if ( System.getProperty("os.name").toLowerCase(). indexOf("win")>=0) {
link(requestToken.getAuthorizationURL());
}
else {
98
Project 4
open(requestToken.getAuthorizationURL());
}
String preset=""; String
pin=javax.swing.JOptionPane.showInputDialog(frame, "Enter your pin",preset);
at = twitter.getOAuthAccessToken(requestToken, pin);
}catch ( Exception e ) { e.printStackTrace();
}
}
15.Here you can see a screenshot of the dialog we created in the previous step:
16.We need to ask for the user's permission only once. If we already have access to the keys, we can reuse them. We store the consumer keys and the access token keys in the keys.txt file and use them when our sketch is run the next time.
void setup() { size(300,100); noLoop();
textFont( createFont( "Georgia", 24 ));
String[] keys = loadStrings( "keys.txt" ); try {
twitter = TwitterFactory.getSingleton(); twitter.setOAuthConsumer( keys[0], keys[1] ); RequestToken requestToken= twitter.getOAuthRequestToken(); AccessToken at = null;
if ( System.getProperty("os.name").toLowerCase(). indexOf("win")>=0) {
link(requestToken.getAuthorizationURL());
}
else {
99 
Smilie-O-Mat
open(requestToken.getAuthorizationURL());
}
String preset="";
String pin=javax.swing.JOptionPane.showInputDialog(frame, "Enter your pin",preset);
at = twitter.getOAuthAccessToken(requestToken, pin);
String[] newKeys = new String[4]; newKeys[0] = keys[0];
newKeys[1] = keys[1]; newKeys[2] = at.getToken();
newKeys[3] = at.getTokenSecret();
saveStrings( "data/keys.txt", newKeys |
); |
}catch ( Exception e ) { e.printStackTrace();
}
}
17.If the keys.txt file already contains four keys because we already have the user's permission to tweet, we can use a configuration builder to create the Twitter object.
void setup() { size(300,100); noLoop();
textFont( createFont( "Georgia", 24 ));
String[] keys = loadStrings( "keys.txt" );
if (keys.length <= 2) { try {
twitter = TwitterFactory.getSingleton(); twitter.setOAuthConsumer( keys[0], keys[1] );
RequestToken requestToken = twitter.getOAuthRequestToken(); AccessToken at = null;
if ( System.getProperty("os.name").toLowerCase(). indexOf("win")>=0) {
link(requestToken.getAuthorizationURL());
}
else { open(requestToken.getAuthorizationURL());
}
100
Project 4
String preset="";
String pin=javax.swing.JOptionPane.showInputDialog(frame, "Enter your pin",preset);
at = twitter.getOAuthAccessToken(requestToken, pin);
String[] newKeys = new String[4]; newKeys[0] = keys[0];
newKeys[1] = keys[1]; newKeys[2] = at.getToken();
newKeys[3] = at.getTokenSecret();
saveStrings( "data/keys.txt", newKeys |
); |
}catch ( Exception e ) { e.printStackTrace();
}
}else {
ConfigurationBuilder cb = new ConfigurationBuilder(); cb.setOAuthConsumerKey( keys[0] ); cb.setOAuthConsumerSecret( keys[1] ); cb.setOAuthAccessToken( keys[2] ); cb.setOAuthAccessTokenSecret( keys[3] );
twitter = new TwitterFactory( cb.build()).getInstance();
}
}
18.In our draw()method, we set the background and fill color and display a text message to make sure the user knows what to do.
void draw() { background(255); fill(0);
text( "click here to tweet", 40, 60 );
}
19.Now we add a mouseClicked() method to our sketch and create a StatusUpdate object. We choose a random tweet from the list of messages we created at the beginning and use the updateStatus() method of our Twitter object to send it.
void mouseClicked() { try {
StatusUpdate status = new StatusUpdate(
tweets[ int(random( tweets.length ))] );
101