Thursday, September 10, 2009

Happy birthday Griffon, your are the sultan of Swing !

Today Griffon is one year old ! For those who don' t know what is griffon here is my short blurb about this new framework :

Griffon can be considered as a clone of the grails framework, except that instead of rendering html pages on a web browser it renders a Swing application.

So all these Groovy scritps that you made but that requires a lot of interactions , inputs from the user can now be wrapped in Griffon. You don' t have anymore to type incredible long command lines to include all you parameters, even a non-IT guy can use your scripts !!!

In my opinion, griffon will firstly helps developers teams who wants to increase their productivity and to prove this I have a personal experience that I will share with you now :
I'm currently working for a customer who build educational games for children, it's written in Flex. They are a using a custom MVC framework that is quite robust and efficient but each time you start developing a new game (we build 2 games on a 3 week iteration) you have to writes about 10 actionscript classses/MXML components that all requires to implements specific interfaces, create resources bundle, CSS files etc ... Well before you can really start working on the core functionality of the game you spend at least a half day to get the skeleton right (forget to implements some methods, syntax errors etc ...) !

So I rapidly start thinking about a code generator application that could do all this stuff for my team.
These were my requirements :
- Access easily the local file system (create the files in your workspace)
- Using a simple template engine
- A friendly user interface

The same week I started my mission I discovered Griffon and it was the perfect candidate for my requirements : Swing app for the UI, Groovy templates and I have a lot of experience with the grails framework. I built the application in less than a day and show this to my project leader , he was very impressed : starting a new game project was now a matter of a few seconds instead of a half day of work ! About more than 300% productivity gain !

We are using this griffon app for each new game we start and everybody in the team is very happy to focus on the core functionality and not setting up the skeleton !

So everybody who loves groovy/grails and use it inside teams for support purpose (analyzing/extracting logs patterns), code generation etc .. I really recommend you to take a look at griffon !

Happy birthday Griffon !

Wednesday, September 2, 2009

Grails Exchange 2009




Last week I was wondering how I could convince my boss to send me to the Grails Exchange in London. I went on the grails exchange site and I saw that many slots were still empty, Then a crazy idea crossed my mind "Maybe I can send a talk proposal ?", this way I will be sure to go there.

So I sent an email to Russ Miles (the programme lead) the next day, and Oh surprise ! after a few hours I received a very enthusiastic email from Russ. (Also thanks to Wendy !)

So now I'm officially planned in : http://skillsmatter.com/event/java-jee/groovy-grails-exchange-2009/wd-231

And I also have a banner ;-)

I am very happy with this great opportunity but also a little bit stressed !It's a Premiere for me , at least for a such big audience of experts !

I announced that I will build a complete mobile web application from scratch during the presentation, that will be very cool ! I do not yet have a exact idea of the application but it will include orientation support and geolocalization ! If you have ideas, don't hesitate to post it in the comments or tweet it (@sebi2706) !

Ok , see you all in London ?

Friday, July 24, 2009

Getting started with the iWebkit grails plugin - part 1

A few weeks ago I gave a workshop for the NLGUG on using the iWebkit plugin for Grails. This plugin will help you to built web application targeted for the iPhone, but also for Android based devices !

During this workshop we built a twitter client and we had some issues with the twitter plugin which doesn' t work with the API changes twitter brings this last weeks. So I choose for this tutorial to built a twitter search client that won't use anymore the twitter plugin.

Our application will be a clone of the http://search.twitter.com/ website but designed for a mobile use. We will start with basic functionnalities and in upcoming posts we will enhance this first app.

Let's starts directly :

grails create-app TweetSearch
































































Go into your project directory and install the iWebKit plugin :


grails install-plugin iwebkit
































































Okay ! You are ready to built a real mobile web application, setting things up wasn't too hard, no ?

Now we want to use the search twitter API, a quick look on the API page shows that's it is a REST based API and that the response format can be json, nice grails&groovy are perfect candidates to implement this kind of APIs.

To have more control on the returning json response we will convert it into a custom made domain object, so let's create a new domain class :


grails create-domain-claas tweet










We will keep it simple and convert only 3 properties from the json response. Open the Tweet class and add these properties :


class Tweet {
String status
String user_id
String image_url
}

Let's grails generate all the stuff we need :

grails generate-all tweet
Now we have a standard grails project structure with controllers and views.

Let's start to write the request, we will use the fantastic Httpbuilder library that make writing httprequest as easy as pie!
To use this libray you have some options :


Make sure all dependencies are in the lib folder of your app.
The request needs only one parameter : the search criteria , so something like that will do the trick :


def list = {
def http = new HTTPBuilder( 'http://search.twitter.com')
def jsonresultshttp.request( GET, JSON ) {
uri.path = '/search.json?'
uri.query = [ q: 'grails' ]
headers.'User-Agent' = 'Mozilla/5.0 Ubuntu/8.10 Firefox/3.0.4'
response.success = { resp, json ->
jsonresults = json.results
}

response.failure = { resp ->
println "Unexpected error:${resp.statusLine.statusCode}"
}
}
List listItems = new ArrayList()
Tweet tweet
jsonresults.each {
tweet = new Tweet(status:it.text,user_id:it.user_id,image_url:it.profile_image_url)
listItems.add(tweet)
}
return [ results : listItems ]
}


Don't forget to include the imports in the controller :


import groovyx.net.http.*;
import static groovyx.net.http.ContentType.JSON
import static groovyx.net.http.Method.GET
For now as you can see we use a hardcoded search criteria "grails" to test the first part the UI : showing the list of tweets ! Let's start with the exciting stuff :

We will modify the list.gsp file to make it "mobile" compliant. The first thing you have to do is set the " iphone" layout :

 <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="layout" content="iphone" />
<title>Tweet List</title>
</head>

By setting this layout the plugin take care of :

  • Setting references to the css, javascript and images files

  • Setting the right viewport

We can now starting writing the content of the view :


<body>
<iphone:topbar title="Results"/>
<iphone:content>
<iphone:section>
<iphone:list action="show" descriptionField="status" list="${results}" customid="status"/>
</iphone:section>
</iphone:content>
</body>

As you can see we make extensive use of the iphone tag library which take care of setting the right css classes and binding stuff with our domain model and actions.

A iphone webpage will always have a structure like the code above : A topbar, then content that consists of sections. Sections can hold List , text areas etc ...

Start the application

grails run-app

and browse to http://localhost:8080/tweetsearch/tweet

You should see something like that :





That's nice no ?

But let's add some user interaction support, we will add a search input field. Go edit your view list.gsp and add this new section before the list section :


<iphone:section>
<g:formRemote name="myForm"
action="list" url="${[action:'list']}">
Search : <input type="text" name="searchTerm"/>
</g:formRemote>
</iphone:section>

Now we have to modify our list action to use the "searchTerm" parameter :

def list = {
def searchTerm = params["searchTerm"]
def http = new HTTPBuilder( 'http://search.twitter.com')
def jsonresultshttp.request( GET, JSON ) {
uri.path = '/search.json?'
uri.query = [ q: searchTerm]
headers.'User-Agent' = 'Mozilla/5.0 Ubuntu/8.10 Firefox/3.0.4
response.success = { resp, json ->
jsonresults = json.results
}
response.failure = { resp ->
println "Unexpected error:${resp.statusLine.statusCode}"
}
}
List listItems = new ArrayList()
Tweet tweet
jsonresults.each {
tweet = new Tweet(status:it.text,user_id:it.user_id,image_url:it.profile_image_url)
listItems.add(tweet)
}
return [ results : listItems ]
}


Ok restart your application, you will now see an empty list but also a search input text , enters whatever you want and submit, you should see something like this :


Okay that will be it for this first part of this serie, I encourage you to modify the show,gsp view by yourself to render a tweet in its whole ...

I hope that in the next posts I could introduce the new version of the iwebkit plugin with orientation support and also .... Geolocalization support !!!!!

Source code of this project can be found here ! The project will also soon be hosted into Github
You can follow me on twitter : twitter.com/sebi2706