class BookController {
    def list() {
        def books = Book.list()
        withFormat {
            html bookList: books
            json { render books as JSON }
        }
    }
}

Both of the formats in the withFormat block are working with the same list of books, just rendering them differently. We can use the same after filter trick to clean this up a bit:

jsonify(controller: '*', action: '*') {
    after = { Map model ->
        def accept = request.getHeader('Accept')
        if (!accept.contains('application/json')) { return true }

        // find our controller to see if the action is jsonified
        def artefact = grailsApplication
            .getArtefactByLogicalPropertyName("Controller", controllerName)
        if (!artefact) { return true }

        // check if our action is jsonified
        def isJsonified = artefact.clazz.declaredFields.find {
            it.name == 'jsonify' && isStatic(it.modifiers)
        } != null

        def jsonified = isJsonified ? artefact.clazz?.jsonify : []
        if (actionName in jsonified || '*' in jsonified) {
            // check if we can unwrap the model (such in the case of a show)
            if (model.size() == 1) {
                def nested = model.find { true }.value
                render nested as JSON
            } else {
                render model as JSON
            }
            return false
        }
        return true
    }
}

This filter has a similar structure as the ajaxify one. Instead of looking for an AJAX request, we check to see if the Accept header is ‘application/json‘. Next we check whether the controller has a static jsonify = [...] declaration that includes the action being called. If so, we render the model as JSON. The filter also tries to be a bit smart. If the model only has a single key, e.g. [bookInstance: book], it’ll render just the value. This results in a more natural output:

{"title":"The Stand","author":"Stephen King"}

vs

{"bookInstance":{"title":"The Stand","author":"Stephen King"}}

With the filter, our controller actions can go back to their standard, unadulterated form in favor of a jsonify declaration:

class BookController {
    static jsonify = ['list', 'show']

    def list() {
        [bookList: Book.list()]
    }
    ...
}

Conclusion

This is another way to use filters to keep your controller actions cleaner. It should be noted that the withFormat looks at more than just the Accept header when deciding what format was requested. It also looks at the URL for an explicit format=json URL parameter and for a filename extension, e.g. /book/show/1.js. The filter as written only uses the Accept header, which is common practice when building APIs, but you should evaluate whether that will fit your needs.

The @synchronized directive is a convenient way to create mutex locks on the fly in Objective-C code. The @synchronized directive does what any other mutex lock would do—it prevents different threads from acquiring the same lock at the same time.

Using @synchronized is super easy

@synchronized(key) {
// thread-safe code goes here
}

Examples!

First we’re going to create an NSMutableArray and fill it with garbage.

bigArray = [NSMutableArray arrayWithCapacity:5];
 for (int i = 0; i < 5; i++) {
  [bigArray addObject:[NSString stringWithFormat:@"object-%i", i]];
}

And a method to display/modify the array.

- (void)updateBigArray:(NSString *)value {
 for (int j = 0; j < bigArray.count; j++) {
  NSString *currentObject = [bigArray objectAtIndex:j];

  [bigArray replaceObjectAtIndex:j withObject:[currentObject stringByAppendingFormat:@"-%@", value]];

  NSLog(@"%@", [bigArray objectAtIndex:j]);
 }
}

Now let’s call our method on two separate threads. Notice I’m sending foo in for both of them. I’ll explain why in a bit.

NSString *foo = @"foo";

dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
 [self updateBigArray:foo];
});

dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
 [self updateBigArray:foo];
});

This gives us the output:

object-0-foo
object-0-foo
object-1-foo-foo
object-1-foo
object-2-foo
object-2-foo
object-3-foo
object-3-foo
object-4-foo-foo
object-4-foo

Both threads are working over the top of each other which could lead to app crashes depending on what you’re doing. So let’s update our method to use @synchronized with value as our lock key.

- (void)updateBigArray:(NSString *)value {
 @synchronized (value) {
  for (int j = 0; j < bigArray.count; j++) {
   NSString *currentObject = [bigArray objectAtIndex:j];

   [bigArray replaceObjectAtIndex:j withObject:[currentObject stringByAppendingFormat:@"-%@", value]];

   NSLog(@"%@", [bigArray objectAtIndex:j]);
  }
 }
}

object-0-foo
object-1-foo
object-2-foo
object-3-foo
object-4-foo
object-0-foo-foo
object-1-foo-foo
object-2-foo-foo
object-3-foo-foo
object-4-foo-foo

That looks a lot better. What’s happening is that our @synchronized block effectively pauses one thread, allowing the other thread access to the block, then un-pauses it once the first has finished.

So what about the key?

This is where it gets interesting. If you pass the same object to @synchronized as the key, it will get paused (which we just saw). However, if you send a different object than the key it will get through. Remember when we passed foo through twice? Let’s pass something else the second time instead.

NSString *foo = @"foo";
NSString *bar = @"bar";

dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
 [self updateBigArray:foo];
});

dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
 [self updateBigArray:bar];
});

object-0-foo
object-0-bar
object-1-foo
object-1-bar
object-2-foo
object-2-foo-bar
object-3-foo
object-3-foo-bar
object-4-foo
object-4-foo-bar

There could be reasons why you would want to lock on value, but in this case it would be smarter to use a different key.
Let’s use

 @synchronized (bigArray) {
...

instead of

 @synchronized (value) {
...

object-0-foo
object-1-foo
object-2-foo
object-3-foo
object-4-foo
object-0-foo-bar
object-1-foo-bar
object-2-foo-bar
object-3-foo-bar
object-4-foo-bar

In the end

@synchronized is a great shorthand mutex lock. It may not be the most efficient lock, but chances are you won’t notice. If you’re just getting started with threading, I highly recommend getting more familiar with it.

def create() {
    def book = new Book()
    if (request.xhr) {
        render(template: 'createAjax', model: [instance: book])
    } else {
        [instance: book]
    }
}

This same pattern was repeated in every action I wanted to expose. It worked but was not very DRY, so I set out to find a better way. Since it’s the same model but routed to a different view for AJAX requests, I figured I might leverage the magic of Grails Filters. Filters give us a chance to intercept requests before they go to the controller (before), after the controller but before it gets passed to the view (after), and after the view is rendered (afterView). An after filter is just the ticket:

ajaxify(controller: '*', action: '*') {
    after = { Map model ->
        // only intercept AJAX requests
        if (!request.xhr) { return true }

        // find our controller to see if the action is ajaxified
        def artefact = grailsApplication
            .getArtefactByLogicalPropertyName("Controller", controllerName)
        if (!artefact) { return true }

        // check if our action is ajaxified
        def isAjaxified = artefact.clazz.declaredFields.find {
            it.name == 'ajaxify' && isStatic(it.modifiers)
        } != null

        def ajaxified = isAjaxified ? artefact.clazz?.ajaxify : []
        if (actionName in ajaxified || '*' in ajaxified) {
            render(template: "/${controllerName}/${actionName}Ajax",
                model: model)
            return false
        }
        return true
    }
}

The filter intercepts AJAX requests after they are processed by the controller. It looks in the controller to see if it declares a ‘ajaxify‘ static field. If so, and if the current action is listed in the ajaxify list, the filter takes the returned model and renders a template using the naming convention of: _<action>Ajax.gsp.

With this filter, the only change we need to make in a controller to expose actions is to declare them in a static field. The actions themselves remain unchanged:

class BookController {
    static ajaxify = ['create', 'edit']

    def create() {
        [bookInstance: new Book()]
    }
    ...
}

We also need to make sure that an appropriate template exists for the action, e.g. grails-app/views/book/_createAjax.gsp.

Bonus

As a bonus, here’s a quick little Javascript trick we use with this modal technique. The user should be able to perform their action even if something goes wrong with the AJAX request or if Javascript is disabled. To support this, we use a standard link to the controller action and then add a special CSS class for the links we want to trigger a modal:

<g:link controller="project" action="create"
    class="ajax-modal">Add Project</g:link>

We then use a little Javascript to progressively enhance the ajax-modal links to pop open a modal dialog instead of following the link:

$('.ajax-modal').live('click', function() {
    var url = $(this).attr('href');
    $('.modal').load(url, function() {
        // using the Twitter Bootstrap modal here
        $(this).modal({ show: true });
    });
    return false;
});

If all works well, the user will see the create/edit/etc. form in a modal dialog. If something goes wrong with the Javascript or AJAX request, the browser should take the user to the linked page.

Conclusion

While nothing earth-shattering, these little tricks have helped to DRY up a couple of my codebases. Hopefully they highlight the power of filters in Grails and are of use to you.

“Sorry *you* don’t get it, it’s about elimination, not automation”, is what I wanted to say. I didn’t. Don’t get me wrong, where appropriate, automation is a good thing, but it begs a *bigger* question: why? This is a good time to pull out the “5 Whys” from our Lean toolkit, which originated with the Toyota Production System. It’s *really* simple, just ask ‘why?’ five times.

The 5 Why’s is a simple, but not easy, tool to use to get to a root cause. You start by asking “why are we doing x”, wait for a response, to which you respond with a “why?”, followed by a response. This iterates for three more cycles of “why?” followed by responses – you know, like a 5-year-old.

What is the first “why” we should be asking? If you said “why are we automating?”, you’d be wrong. The correct answer is…..

“Why are we doing this at all, is this a value add activity?”

Value add means – is the customer willing to pay for this? It’s time to be brutally honest here, and it’s especially difficult for Corporate America’s IT organizations to answer. They are far too separated from the customer. I would venture the response to this question is something along the lines of “this is how we do that” or “it says in our process document”.

“Why?”

At this point, we start to get into institutional disfunction, and culture problems (which often manifest themselves as technical debt). This process needs to be honest, candid, and without political motivation. Tough to do in Corporate America, but many companies have implemented Lean, why shouldn’t IT be the same?

You’ve got 3 more “whys” to ask… If, at the end of each of these 5 whys, you don’t receive responses that indicate there are good reasons to be performing an activity, you shouldn’t be doing it. Activities that aren’t value-added should be eliminated.

What does this typically say about IT Operations? What activities in your development team and process are value-added?

Even in startup companies, what features of your product are value-add? The highest value-added should really be what your MVP is about. The lowest, don’t do them.

Eliminate where possible, automate if you can’t eliminate.

Adding the font to your project

Drag the .ttf file to your project.

Make sure “Add to targets” is checked.

Verify the font is in the project. There are two places you can do this.

By selecting the font, and verifying “Target Membership” in the Utilities area.

And By selecting your apps target, selecting the “Build Phases” tab, and verifying that your font is in the “Copy Bundle Resources” section.

And finally, add the font to your Info.plist. Note that most apps change the name of their plist to something like <ProjectName>-Info.plist. Add a key of “Fonts provided by application”, and make sure it’s an array, then add your font file name as an item in the array. Make sure you use the exact file name, and that your file name has an all-lowercase extension (.TTF apparently doesn’t work on iPhones, but .ttf does).

Knowing your font

This is where I had some issues. When you add your font you use the file name, but when you use your font you use the font name… The EXACT font name. If you ctrl + click on the .ttf file and select “Get Info”, you can find the “Full Name”. That seems to work with a lot of fonts, but the font I’m using doesn’t work that way. I had to open the .ttf file in the Font Book application, and look at the window header.

Using this name, you can log what font names you have available by using the fontNamesForFamilyName method like so:


NSLog(@"tt0001m_: %@",
[UIFont fontNamesForFamilyName:@"Swis721 Lt BT"]
);


Which gives the output:
2012-08-24 11:25:10.968 GenericKeychain[7260:c07] tt0001m_: (
"Swiss721BT-Light"
)

Using your font programmatically

Say you have a UILabel:

UILabel *myLabel = [[UILabel alloc] init];
[myLabel setText:@"Label Text"];


We set the font of our label by creating a UIFont, and setting it to our label with setFont.

UIFont *swissLight = [UIFont
fontWithName:@"Swiss721BT-Light"
size:myLabel.font.pointSize];
[myLabel setFont:swissLight];


Using your font in Interface Builder

This is an interesting solution that I got from stackoverflow. First you need to create a subclass of UILabel. Hit Cmd + N (or go to File > New > File…), select “Cocoa Touch” > “Objective-C class”, and hit “Next”. Name your class something like CustomFontSwissLightLabel and choose UILabel in the “Subclass of” section. Open your CustomFontSwissLightLabel.m file and override the awakeFromNib method like so:

- (void)awakeFromNib {
[super awakeFromNib];
self.font = [UIFont fontWithName:@"Swiss721BT-Light"
size:self.font.pointSize];
}

Now add a UILabel to you .xib file. In the “Utilities” area, under the “Identity Inspector” tab change the Class from UILabel to CustomFontSwissLightLabel.

That’s all there is to it. 

It really is pretty easy, but there are a handful of things that can trip you up, and I wrote this blog post because I got tripped up on every one of them :)

Scott will be jumping into a project that we’re very excited about: SmartThings. He’ll be working on the mobile clients of SmartThings. Scott is particularly proud of his work developing Garmin’s Pilot for iOS product. He also enjoyed development of the Android app, MyCast, which he worked on for the past 3 years.

Welcome Scott!

The real interesting part to me is that there is a free plan you can use to test your applications. The free plan currently includes unlimited number of applications, as long as you only use 2 GB of RAM. There is a 50 GB data transfer limit, and a 1 GB database limit. If the free plan is not quite enough, they have paid plans starting at $100/month.

AppFog and Grails

If you have a Grails application that you want to deploy to AppFog, it can be a little confusing the first time, but once you go through the process once, following these steps, it should be fairly straight-forward.
Set Up the Application in AppFog

1. Create an account with AppFog
2.  Click the Create App button:
3.  Choose Java Grails:
4.  Choose an infrastructure (AWS for example):
5. Pick a subdomain
6.  Click Create App:

At this point it does some initialization, including creating and starting a default grails application. You could go to your new URL and see a Grails application running.

Upload Your Grails App

1. Create a war file for your application (grails war)
2. Navigate to the /target directory where the .war file was built
3. The first time, you will have to install the “af” ruby gem. In your app console on AppFog there are instructions under “Update Source Code” for different platforms (or more detailed information here)
4. Login from the console with the command “af login”. You will have to enter your email and password.
5. Upload your application with the command “af update <project name>”. This will take a minute or two depending on the size of your application (even a basic Grails application is over 20 MB)

If you have multiple .war files in the /target directory, it appears to just take the first one it finds. You may want to do some clean-up in that directory if the wrong .war is being uploaded.

Adding a Database

You will probably need to configure a database. First you have to add the database (as a service) to your AppFog console. For this example I’ll be using MySQL:

1. Go to your console
2. Click “Services”
3. Click “MySQL” button, give it a name, and click “Create”
4. Then you may have to “bind” this to your application, so click the “Bind” button.

Configuring the Database

With MySQL (and the other databases), AppFog stores all the login information in a system environment variable called “VCAP_SERVICES”. To use that you will have to update your DataSource.groovy file. Here is an example of how I configured a production datasource:

production {
   def envVar = System.env.VCAP_SERVICES
   def credentials = envVar?grails.converters.JSON.parse(envVar)["mysql-5.1"][0]["credentials"]:null

   dataSource {
      pooled = true
      dbCreate = "update"
      driverClassName = "com.mysql.jdbc.Driver"
      url =  credentials?"jdbc:mysql://${credentials.hostname}:${credentials.port}/${credentials.name}?useUnicode=yes&characterEncoding=UTF-8":""
      username = credentials?credentials.username:""
      password = credentails?credentials.password:""
   }
}

Summary

Getting your application configured the first time does take a little work. Hopefully this guide makes it a little bit easier. The free plan seems like a good platform to use for testing/proof-of-concept type applications.

One of our clients wanted a transition for a marketing video that mimics the tile animation in their mobile app. There are a few options to accomplish this. FCPx ships with a few similar transitions like “Mosaic”, but they don’t offer granular control over the grid configuration, or the direction of the animation. There are also paid third party plugins, but they don’t seem to have been updated to work within FCPx. So here’s one possible 10 minute solution:

Open Motion 5 and from the project browser, open a new blank Final Cut Transition template. Within the template, you’ll notice a group with two layers is created for you automatically. The top layer (“Transition A”) represents the clip you’ll be transitioning from, and “Transition B” represents the clip you’ll be transitioning to. Since we want our transition to start revealing the underlying layer right away, drag each transition so that they cover the entire timeline.

Next, using the shape tool, create the shape you want to tile. In my case this is just a square. The position of the shape doesn’t matter, since it will only be used as a reference.

Once you have your shape selected, click the “Create Replicator” button with the atom-like icon on the right side. This automatically creates a 5 x 5 grid of our select shape. Drag and position the grid container to fill the screen. With the replicator layer selected, open the Inspector in the upper left. Set the number of columns and rows to produce a full grid. Below the “Replicator Controls”, the “Cell Controls” modify the shapes properties. Bump up the shape’s “Scale” until there are no gaps in the grid. Because we want the tile to “flip” in 3D space, check the “3D” box within Replicator Controls. From there you can specify the “Origin” of the animation (Lower Left, Upper Right… etc) as well as the “Build Style” (Across, By Row, By Column… etc)

Nothing moves yet. So to make it animate, select the shape layer and click on the “Behaviors” button with the gear icon and select “Replicators » Sequence Replicator”. In the “Behaviors” tab on the left, we can add parameters that will make our grid animate. Since we want to “flip” the tiles, pull open the “Add” menu and select “Rotation”. Expand the rotation dialogue and change the Y axis to 90 degrees. Then add an opacity parameter and set it to 0%. As you scrub the playhead thru the timeline, you’ll see that we told Motion to rotate each of our tiles in turn and animate the opacity to 0% at the end of each rotation. To spread the animation out more evenly, modify the “Spread” slider and set easing to taste under the “Traversal” dialogue.

Now we want to get this animated grid to affect the transition layers underneath. Right-click “Transition A” and select “Add Image Mask”. Drag the Replicator layer onto the blank image mask and Motion will hide the replicator layer and use it as a reference for the transition layer.

At this point, the transition is done. However, if you want to be able to modify parameters from within FCPx, select “Publish” from the pull down menu next to each parameter you want to be able to modify. Save the project, and the transition will show up automatically in FCPx.

class Group {
    static constratints = {}
}

When I ran my application I got this not-exactly-helpful error:

| Compiling 1 source files....
| Running Grails application
| Error 2012-08-14 09:30:01,325 [pool-5-thread-1] ERROR hbm2ddl.SchemaExport - Unsuccessful: create table group (id bigint generated by default as identity, version bigint not null, primary key (id))
| Error 2012-08-14 09:30:01,325 [pool-5-thread-1] ERROR hbm2ddl.SchemaExport - Syntax error in SQL statement "CREATE TABLE GROUP[*] (ID BIGINT GENERATED BY DEFAULT AS IDENTITY, VERSION BIGINT NOT NULL, PRIMARY KEY (ID)) "; expected "identifier"; SQL statement:
create table group (id bigint generated by default as identity, version bigint not null, primary key (id)) [42001-164]
| Server running. Browse to http://localhost:8080/test

I should say that once I figured out the problem, then the error message did make sense. The problem turned out to be that I was trying to use a reserved word for the H2 database, in this case “Group”. And you cannot create a table with the same name as a keyword.

Luckily, this is pretty easy to fix and still use the same domain class. Just add a “static mapping” block so your class looks like this:

class Group {
    static constratints = {}
    static mapping = { table 'my_group' }
}

This will vary based on your database implementation. For H2, here are the list of keywords you cannot use (from H2 documentation):

CROSS, CURRENT_DATE, CURRENT_TIME, CURRENT_TIMESTAMP, DISTINCT, EXCEPT, EXISTS, FALSE, FOR, FROM, FULL, GROUP, HAVING, INNER, INTERSECT, IS, JOIN, LIKE, LIMIT, MINUS, NATURAL, NOT, NULL, ON, ORDER, PRIMARY, ROWNUM, SELECT, SYSDATE, SYSTIME, SYSTIMESTAMP, TODAY, TRUE, UNION, UNIQUE, WHERE

This week was the United States GR8Conf, and we were lucky enough to have it right here in Minneapolis. GR8Conf is a conference focusing on Groovy and Grails and is held in the US, Europe, and Australia. Refactr was one of the sponsors this year as well.

The conference started off on Sunday with a few introductory sessions to get attendees up to speed on Groovy and Grails. Monday and Tuesday had 4 different tracks of presentations over 5 sessions for a grand total of 40 different presentations. There were also 3 keynote addresses from Graeme Rocher on the current state and future of Grails, Dr. Venkat Subramaniam on the rise and fall of programming languages, and Dierk König having some fun with Groovy.

There seemed to be a focus on using Grails for mobile development, using Async and REST interfaces, and developing for the cloud. There also seemed to be some crowd favorites like “Contributing Back to Grails” by Bobby Warner, “Future-proof scaffolding with the Fields plugin” by Rob Fletcher, and “Git Core Concepts” by Ted Naleid.

The slides and code samples from the talks are being collected on github here. There was also talk of delivering some videos of the presentations on the GR8Conf website.

Shaun Jurgemeyer and everyone else did a great job of organizing this event and I’m looking forward to next year.