Goals:

Make a little flash program to make a call to the Twitter Search API and display the two latest tweets.

Required Knolwedge:

basic AS3 (variables, loops, listeners).

Step 1- Downloads:

First go to the SWX Downloads page and grab the latest version of the swx format.

Step 2- File setup:

Make a new folder labeled twitter to act as your project folder. Then from the folder you just downloaded grab the AS3 org folder (Library>v2>AS3>org) and move it into your project folder. Open Flash and create a new AS3 project named myTwitter and save it in the project folder.

Step 3- Create Layers:

Once the project is open, create a few layers. Name the top one "Actions", the second "Interface", the third "Text", and finally "Bg". These names are arbitrary but I find it helps me to keep my objects organized depending on what I'm working on, styling or functionality. The Actions will hold all of our actionscript, interface will hold all of our clickable assets, text will hold the information we accuire from Twitter, and Bg will hold any backgrounds you want to add later for style.

Step 4- Create text objects:

Select the Text layer and create a text field. Keep in mind that the field will have to hold 128 characters of whatever font style and size you choose. It might be helpful to fill the field temporarily with 128 'W's to get an idea at the size the field will need to be. In the properties window, change the text box to a dynamic text box and name it tweet1Message. Now make another smaller dynamic text box and name it tweet1Name. Finally add one more dynamic text box and name it tweet1Date. Once you get these positioned how you would like them, select all 3 boxes and duplicate them, renaming each so that the 1 becomes a 2. These are the containers that will hold the information from twitter.
.

step 5- Set up Imports:

The time has come to open up that actions panel. First we will import all the dependancies we need.
//IMPORT
import org.swxformat.*;
import flash.events.TimerEvent;
import flash.utils.Timer;
//END IMPORT

step 6- Set up SWX call:

Now we can add the swx object and adjust the variables that will control our call to the swx gateway.

//twitter vars
var swx:SWX = new SWX();
swx.gateway = "http://www.swxformat.org/php/swx.php";//this is the default gateway, it is possible to set up your own server to do this.
swx.encoding = "POST";
swx.debug = false;//if set to true will read out more information during the call.
swx.timeout = 5;//time before timeout occurs in seconds
//end twitter vars


Step 7- Array and Timer:

Now we will create an array to hold our new tweets and create a timer to periodically call onTick which will make our server call.

//array to hold the tweets
var newTweets:Array;
//timer object
var minuteTimer:Timer = new Timer(15000);
//timer event
minuteTimer.addEventListener(TimerEvent.TIMER, onTick);//listener for server call function


Step 8- Call Parameter and timeoutHandler:

Before we create the onTick function, we need to set up the parameters for the swx call as well as add a handler that will tell us if we failed to connect and we time out.

// set up the parameters for the swx call
var callParameters:Object =
{
serviceClass: "Twitter",
method: "search",
args: ["@makeitplayit"],//change this to the string you want searched
timeout: [this, timeoutHandler],
resultHandler: resultHandler
}
function timeoutHandler(e:Object) : void {
trace("Call timeout");
}


Step 9- Results Handler:

Here we add the results handler. This code will fire after our application has gotten its information.

function resultHandler(e:Object) : void {
try {
//populate the array
newTweets = e.result.results;
//assign data to text boxes
tweet1Name.text = newTweets[0].from_user;
tweet1Message.htmlText = newTweets[0].text;
tweet1Date.text = newTweets[0].created_at;
name2.tweet2Name.text = newTweets[1].from_user;
tweet2Message.htmlText = newTweets[1].text;
tweet2Date.text = newTweets[1].created_at;
trace("Call complete");
}
catch(error:Error) {
trace("There was an error: "+error);
}
}


Step 10- onTick function:

Now here is the all important onTick function. This function allows our twitter to be updated life without having to refresh the page.

//Timer function
function onTick(event:TimerEvent):void {
//we want the application to fail quietly if there is an error as to not disrupt the user experience so we use the try/catch
try {
//Make the call to the server
swx.call(callParameters);
}
catch (error:Error){
trace("There was an error.");
}
}
//END TIMER EVENTS


Step 11: Start the Timer:

Finally, all we need to do is add a line to make a call immediately upon load and a line to start our timer.


//make the swx call
swx.call(callParameters);
//start the timer
minuteTimer.start();


And that should do it! When you run the program you may be alerted that "Flash has attempted a potentially unsafe operation." To solve this, enter settings. A browser window should open up. Add the myTwitter.swf to the list and select always trust.

Here is all of the AS3 together:


//IMPORT
import org.swxformat.*;
import flash.events.TimerEvent;
import flash.utils.Timer;
//END IMPORT
//twitter vars
var swx:SWX = new SWX();
swx.gateway = "http://www.swxformat.org/php/swx.php";//this is the default gateway, it is possible to set up your own server to do this.
swx.encoding = "POST";
swx.debug = false;//if set to true will read out more information during the call.
swx.timeout = 5;//time before timeout occurs in seconds
//end twitter vars
//array to hold the tweets
var newTweets:Array;
//timer object
var minuteTimer:Timer = new Timer(15000);
//timer event
minuteTimer.addEventListener(TimerEvent.TIMER, onTick);//listener for server call function
// set up the parameters for the swx call
var callParameters:Object =
{
serviceClass: "Twitter",
method: "search",
args: ["@makeitplayit"],//change this to the string you want searched
timeout: [this, timeoutHandler],
resultHandler: resultHandler
}
function timeoutHandler(e:Object) : void {
trace("Call timeout");
}
function resultHandler(e:Object) : void {
try {
//populate the array
newTweets = e.result.results;
//assign data to text boxes
tweet1Name.text = newTweets[0].from_user;
tweet1Message.htmlText = newTweets[0].text;
tweet1Date.text = newTweets[0].created_at;
tweet2Name.text = newTweets[1].from_user;
tweet2Message.htmlText = newTweets[1].text;
tweet2Date.text = newTweets[1].created_at;
trace("Call complete");
}
catch(error:Error) {
trace("There was an error: "+error);
}
}
//Timer function
function onTick(event:TimerEvent):void {
//we want the application to fail quietly if there is an error as to not disrupt the user experience so we use the try/catch
try {
//Make the call to the server
swx.call(callParameters);
}
catch (error:Error){
trace("There was an error.");
}
}
//END TIMER EVENTS
//make the swx call
swx.call(callParameters);
//start the timer
minuteTimer.start();