An example of using the Twitter API library on AIR

In this topic, I want to give an example of using my Twitter API for ActionScript 3.0 for Adobe AIR. Twitter supports 2 authentication methods: Basic Auth not recommended for use and OAuth preferred. The library implements OAuth authentication.
The example will describe the implementation of an AIR application that uses OAuth for authentication and allows you to send tweets and view friend status.


To begin with, we will create mxml structure necessary for us. We need two windows in ViewStack 'e. The first window is the authorization window (with HTML component and a PIN code entry field).

1. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
2. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
3. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
4. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
5. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
6. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
7. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
8. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >
9. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >

The second window is a list with friends tweets and a tweet box.

1. <mx: VBox width = "100%" height = "100%" id = "twitterScreen" >
2. <mx: List width = "100%" height = "100%" dataProvider = "{twitterStatuses}" id = "tweetsList" >
3. <mx: itemRenderer >
4. <mx: Component >
5. <mx: HBox width = "100%" height = "100" borderStyle = "solid" >
6. <mx: Image height = "100%" source = "{data.user.profileImageUrl}" />
7. <mx: VBox height = "100%" width = "100" >
8. <mx: Text width = "100%" text = "{data.user.screenName}" />
9. <mx: Text width = "100%" text = "{data.createdAt}" />
10. </ mx: vbox >
11. <mx: Text width = "100%" height = "100%" text = "{data.text}" />
12. </ mx: HBox >
13. </ mx: Component >
14. </ mx: itemRenderer >
15. </ mx: List >
16. <mx: HBox width = "100%" horizontalAlign = "center" verticalAlign = "middle" >
17. <mx: TextArea width = "100%" height = "100%" id = "tweetTextInput"
18. textInput = "tweetTextInput_textInputHandler (event)" />
19. <mx: Button label = "Send" click = "sendTweetButton_clickHandler (event)"
20. enabled = "{tweetTextInput.text! = ''}"
21. height = "100%"
22. id = "sendTweetButton" />
23. </ mx: HBox >
24. </ mx: vbox >

The OAuth authentication algorithm for desktop applications is as follows:

• We receive Request Token. This requires CONSUMER_KEY and CONSUMER_SECRET , which can be obtained here .
• In the browser, you need to open the authorization window, where the user must allow the application access to his profile. To do this, he should enter his data and get a PIN code. (The URL for the authorization window is obtained from the received Token's request).
• If the entered PIN is correct, then the application returns Access Token, which is used for all further operations with the service.

All interaction with the Twitter API occurs through the TwitterAPI class.

1. var twitterApi : TwitterAPI = new TwitterAPI ( ) ;

And OAuth authentication is done via the twitterApi.connection property.

1. // Listen to the Token Request receipt event
2. twitterApi.connection. addEventListener ( OAuthTwitterEvent.REQUEST_TOKEN_RECEIVED, handleRequestTokenReceived ) ;
3. // Listen to the Token Request Request Error event
4. twitterApi.connection. addEventListener ( OAuthTwitterEvent.REQUEST_TOKEN_ERROR, handleRequestTokenError ) ;
5. // Listen to the Access Token receive error event
6. twitterApi.connection. addEventListener ( OAuthTwitterEvent.ACCESS_TOKEN_ERROR, handleAccessTokenError ) ;
7. // Listen to the successful authorization event
8. twitterApi.connection. addEventListener ( OAuthTwitterEvent.AUTHORIZED, handleAuthorized ) ;
9. // Log in
10. twitterApi.connection.authorize ( CONSUMER_KEY, CONSUMER_SECRET ) ;

After successfully receiving the Request Token, you need to show the user the Twitter access window.


This is done like this:

1. protected function handleRequestTokenReceived ( event : OAuthTwitterEvent ) : void
2. {
3. authHTML.location = twitterApi.connection.authorizeURL;
4. }

After the user has entered the PIN, you need to send it back to the API.

1. protected function pinOkButton_clickHandler ( event : MouseEvent ) : void
2. {
3. twitterApi.connection.grantAccess ( pinTextInput. text ) ;
4. }

When authorization is successful, we switch to the twitterScreen window and load tweets.

1. // Initialize status loading operation
2. var op : TwitterOperation = new LoadHomeTimeline ( ) ;
3. // Listen to the command completion event
4. var handler : Function = function ( event : TwitterEvent ) : void
5. {
6. op. removeEventListener ( TwitterEvent. COMPLETE , handler ) ;
7. if ( event.success )
8. {
9. // Operation completed successfully
10. status = "Tweets loaded" ;
11. // Get the list of downloaded tweets
12. twitterStatuses = event. data as ArrayCollection;
13. }
14. else
15. {
16. // The operation completed with an error
17. status = "Loading error:" + event. data . toString ( ) ;
18. }
19. } ;
20. op. addEventListener ( TwitterEvent. COMPLETE , handler ) ;
21. // Start the operation
22. twitterApi.post ( op ) ;

We send tweets as follows:

1. var text : String = tweetTextInput. text ;
2. // Initialize status update operation
3. var op : TwitterOperation = new UpdateStatus ( text ) ;
4. var handler : Function = function ( event : TwitterEvent ) : void
5. {
6. op. removeEventListener ( TwitterEvent. COMPLETE , handler ) ;
7. if ( event.success )
8. {
9. // Operation completed successfully
10. status = "Tweet sent" ;
11. loadTweets ( ) ;
12. tweetTextInput. text = "" ;
13. }
14. else
15. {
16. // The operation completed with an error
17. status = "Error of status sending:" + event. data . toString ( ) ;
18. }
19. } ;
20. op. addEventListener ( TwitterEvent. COMPLETE , handler ) ;
21. // Start the operation
22. twitterApi.post ( op ) ;

Any operation can be performed via the twitterApi.post (operation, postType, priority) method. Moreover, they can be performed both sequentially with a given priority of each command, and immediately after the execution of the post () method without completing the previous operation. For this, the postType field must be POST_TYPE_NORMAL or POST_TYPE_ASYNC, respectively. A list of all supported operations is here: dev.dborisenko.com/twitter-actionscript-api/docs/commands-summary.html
')
Example source : dev.dborisenko.com/twitter-actionscript-api/examples/TwitterAIRDemo/srcview
Compiled example: twitter-actionscript-api.googlecode.com/files/TwitterAIRDemo.air
Library link: twitter-actionscript-api.googlecode.com/files/TwitterAPI_v1.2.swc
Library Documentation: dev.dborisenko.com/twitter-actionscript-api/docs
The Google Code Library itself: code.google.com/p/twitter-actionscript-api