Friday, 20 April 2012

Primefaces Mobile - Weather App Example

As a Java developer, I usually get requests of building mobile apps. I like building Java application; enterprise, web and mobile. The latest projects that I have been involved with make heavy use of JSF and Primefaces in particular.

I am quite confortable with JSF and therefore I decided to build a mobile application using JSF and Primefaces Mobile. Primefaces Mobile wraps JQuery as a JSF component so that you do not have to write any Javascript. This approach has huge benefits: JQuery is a well tested framework used by large companies such as Google and Microsoft.

I will make this post quite brief. I wanted to know how easy it would be to recreate the demo from the Primefaces Mobile labs page.

Here is a screenshot of the final application running in Firefox 11 (Windows 7 64 Bit).





This was a simple example taken directly from the website therefore I was expecting to a short exercise to make build and make it run. Well not so fast.

I created a Maven based Java EE 6 project using Netbeans IDE 7.1.1. After browsing Google for a bit, I spent a few minutes getting the right repository and dependency in place.

Once the dependency where in the place, I had to create the beans required for the actual JSF page to work. I found the Primefaces Mobile backing beans on Google Code. So now I had everything setup and running. At first glance, the application seemed to running fine and working. Then I tried the application on my iPad and the Android Emulator, and nothing was working. The user interface was displayed but the "get forecast" button was not making any Ajax calls.

So I started to debug the application everytime I had some spare time. I also noticed that, while running on a desktop browser, the application would be able to an Ajax called and updated the screen with the values (see screenshot above) but you wanted to make another to find out the temparature of let's say London, the nothing would actually unless you refresh the page and try again. OK, so it's not working as expected but the example on Primefaces Mobile labs worked fine on my iPad, emulator and desktop browser (IE 9 excluded).

So I ran the application using the NetBeans debugger and decided to look through Firebug. The first call goes through and stops at the breakpoint but subsquent calls do not even get to the managed bean. Firebug shows that the other code are being retrieve from the cache. I manually set all the HTTP headers so that it does not cache any content but this is still the same result NOT WORKING!

I have uploaded the code to GitHub click on the link to download it.

In conclusion, it's not plug-and-play to make the examples on Primefaces.org labs work. The documentation for the examples are quite poor and I hope that the good folks from Primefaces can take look at my code and tell us what I am doing wrong.

A part from that, Primefaces is a good JSF framework that I use on a daily basis on multiple projects therefore I cannot really put them down but I wished the mobile examples work and tell us what is needed to make it work.

Please share your experience in the comments below or advice on how to fix it. Feel free to download the code from GitHub and have a look to.

Happy coding :)


15 comments:

  1. Thanks for this example. There are just a few examples on the web (primefaces' guide included).

    ReplyDelete
  2. Thank you for the sensible critique. Me and my neighbor were just preparing to do some research about this. We got a grab a book from our local library but I think I learned more from this post. I am very glad to see such great information being shared freely out there. http://scarprin.com/

    ReplyDelete
  3. A very informative article and lots of really honest and forthright comments made! This certainly got me thinking a lot about this issue so thanks a lot for posting! http://celabright.biz

    ReplyDelete
  4. This blog site is very good.

    ReplyDelete
  5. Nice information sharing for us,
    Thanks
    vTiger CRM is an open source CRM software is used mainly for small and medium enterprises.

    VTiger
    VTiger CRM
    vTiger Integration

    ReplyDelete
  6. Perhaps this is a bit off topic but in any case I have been surfing about your blog and it looks really neat. impassioned about your writing. I am creating a new blog and hard-pressed to make it appear great and supply excellent articles. I have discovered a lot on your site and I look forward to additional updates and will be back.
    www.fadeplex.com

    ReplyDelete
  7. Thanks for taking the time to discuss this I feel strongly about it and love learning more on this topic. If possible as you gain expertise would you mind updating your blog with more information? as it is extremely helpful for me.
    Canton Fitness

    ReplyDelete
  8. Its not the case that reader must be completely agreed with author's views about article. So this is what happened with me anyways its a good effort I appreciate it. Thanks
    sell house as is

    ReplyDelete
  9. This blog is about making mobile apps. Its important because apps for mobile are getting demanded day by day. In this blog, admin said that to make mobile apps we can use Primefaces Mobile - Weather App. So I found this blog a good tutorial for learning something new..
    Web Development

    ReplyDelete
  10. Hi, Thanks a lot for such example. However i'm having serious trouble regarding look and feel. In fact, when I execute my aplication (which I literally copy from your example), it looks like a "plain" web page, i am wondering if there is some sort of css I should configurate ?

    Thanks in advance.

    ReplyDelete
  11. Forex forex and trading advice
    You should never add your money to a losing trade in the forex forex and trading market. This and more advices are found in this site. Get into it now.
    forex trading

    ReplyDelete
  12. Better start with forex and after that nadex binary options learn and only then trade binary options, but i can tell you that before you can use any strategy you have to understand yourself first, how is your mind work, without it you will continue the up and down profit/loss, feeling pressure/calm.More information please visit our web Our web site is http://www.automatedbinaryoptions.co/?p=180

    ReplyDelete
  13. You can use strategies & signals and work with nadex binary options but i can tell you that before you can use any strategy you have to understand yourself first, how is your mind work, without it you will continue the up and down profit/loss, feeling pressure/calm.I also
    worte an Entire post about the winners about this site.Our web site is http://www.automatedbinaryoptions.co/?p=180

    ReplyDelete
  14. You can use strategies & signals and work with
    binary option trading
    but i can tell you that before you can use any strategy you have to understand yourself first, how is your mind work, without it you will continue the up and down profit/loss, feeling pressure/calm.I also
    worte an Entire post about the winners about this site
    Our web site is http://www.automatedbinaryoptions.co/?p=178

    ReplyDelete
  15. PHP made it conceivable for element sites to exist on the Internet. With PHP it is presently conceivable to create profoundly unpredictable custom web requisitions for sites as it might be additionally utilized Custom Application Developmet window phone apps // iPhone application development // mobile app developers

    ReplyDelete