
Building an HTML5 Twitter client with a twist
Published by Ali Sarrafi on September 29, 2011The last few months it has been very exciting here at MoSync. We have had many new features coming in every month with the aim of making MoSync an excellent mobile SDK choice for a wide range of projects. I believe the upcoming months will be even better, we are working on features that open a new world of opportunities for mobile developers.
I would like to take the opportunity to give you some hints and provide a sneak preview of some of the stuff that we are working on for the upcoming release. Imagine you are an expert Web- and JavaScript developer and want to create a shiny new JavaScript-based app for publication on a store for sale per download, then MoSync proves to be quite useful . From the next release and onwards, MoSync will contain built-in support for web-based apps and you can bundle your whole HTML5 UI and JavaScript code into your projects easily via the IDE. We are also opening doors for people who love jQuery and jQTouch, allowing them to publish apps in multiple stores using a single codebase, still with access to the rich underlying MoSync API through a unified messaging protocol.
Some people don’t have or don’t use their Twitter accounts, but like to read other people’s tweets from time to time and follow a specific user. So I decided to write a simple app that follows tweets from an specific set of favorite users without having to login to Twitter. I started googling and found a couple great designs based on jQuery and HTML5 (like the one here), but I wanted more functionality - like access to storage space on my phone - as well as to be able to create an app bundle that I can send to my friends. I started up my MoSync IDE, placed the jQTouch library and the application's HTML and JavaScript code in the project folder, reused C++ template code for opening a WebView in a MoSync program, and I could do most of the basic tweet reading and navigation functionality in JavaScript without any problems.

I wanted to be able to save favorite users in my phone's memory, so I could load them the next time the application is launched. I immediately realized that I had to only implement one function on the C++ side of my MoSync app, a function that gets called from JavaScript in order to write the user data into a file:

On the Java Script side, I just needed to call a single function which sends messages to the underlying layer:

I finished up the app, and started testing. It looked great on my Android phone thanks to the jQTouch UI, and I gave the app to a couple of my friends and they all liked it. When I tried it on an iPhone 4, it worked out of the box without hassle. This got me excited because not only can you easily port any jQtouch UI application and create application bundles from a single project for multiple platforms, but you also can access many low level features through MoSync API.
Take a look at three devices running the app (This app will be included in our next release as an example*):

This is just a tip of an iceberg, stay tuned for more news and cool features from the upcoming release. So don’t forget to check out our website in the next couple of weeks!!!
* If you want to take a look at the source code before the release, visit our Github repository here. We are continuously updating the examples for this area so stay tuned for information on more libraries and better features.