Making of Twitica Mobile for Android pt.2

After I got the UI in place, and the timeline loaded correctly now I have to make it human-readable.

I designed the tweet display to be similar to Twitica Desktop, but I added Geolocation support. Desktop’s implementation is just a pin, while I shouldn’t do that in Mobile because it would be slow to know where that user is so I need to fire Google’s reverse geocoding server. (Too bad, while searching for the docs I found GMapsv3 docs instead and included full Google Maps system in.) To do reverse-geocoding, just call the [API](http://code.google.com/apis/maps/documentation/geocoding/#ReverseGeocoding) with lat,lon of the tweet and it just return the result. Desktop use granularity to the street level, but I think it’s too much so I decided to use district level result to display. When clicked, it would show the map just like in Desktop. This can be accomplished easily by just navigate the browser to Google Maps and Android will handle the rest. (I learned this trick while making Twitica Desktop for Android)

Also, I moved the time to under user’s avatar which I copied from [Yak for webOS](http://www.precentral.net/review-yak)

**Today’s tip (& what I’ve learned):** Pass –disable-web-security to Chrome and it will allow cross domain XHR. I use this to test Twitica Mobile.

Current screenshot
Hopefully this menu will work soon

*Twitica Mobile (PhoneGap) is open source, you can fork it at [http://github.com/whs/Twitica-Mobile](http://github.com/whs/Twitica-Mobile)*

Making of Twitica Mobile for Android pt.1

I just finished the authorization system of Twitica Mobile so I think I should write this down.

I want to create Twitica Mobile, because I think my own client would looks cool on my phone. (No more reasons) So I spent few hours getting [PhoneGap](http://phonegap.com), which is a framework for HTML based phone applications to work correctly. After that, I draw the UI on my notebook. Few weeks passed and I started working on the code.

Of course, I use the same practice to create the mobile version by drawing the interfaces first. PhoneGap’s nature of being HTML allow me to test with Google Chrome before compile it to the device. (I hate Android emulator because it is very slow) Then, I asked Twitter for XAuth permission. (Actually, OAuth would just enough but the interface is not so user friendly when compared to other mobile clients) I got it approved in 3 days after sending screenshot of Twitica Desktop.

Of course the next to be done is coding. I start with the authentication system. Luckily, I’ve implemented XAuth before in Twitica Desktop, so I just copy and paste the code. To make the code clean, I split the Twitter framework to be in seperated file, and it also use OOP system. However, JavaScript’s nature is asynchronous and I found that when the token is received I cannot save it in the Twitter object. Again, I’ve found solution in this problem when coding Twitica Mobile for webOS so I copied part of [Prototype](http://prototypejs.org) and use the bind() function to create closure. (Note that in jQuery, bind() is to add an event handler while Prototype’s bind() is to create closure) After few debugging, my app can login and save the token correctly.

The next part is the tweet display. Because I’ve created twitter framework I just fire it to load the home_timeline like ordinary XHR request.

Latest version's screenshot

*Twitica Mobile (PhoneGap) is open source, you can fork it at [http://github.com/whs/Twitica-Mobile](http://github.com/whs/Twitica-Mobile)*