annema.me feed

Changes to AppEngine's _from_entity

Thu, 08 Sep 2011 15:49:11 GMT

Both my blog and Enstore experienced a serious outage today. This was caused by a recent change to how App Engine initializes entities. The error was:

BadArgumentError: Cannot use key and key_name at the same time with different values

A common trick to detect wether an entity is loaded from datastore or not is to check if kwargs.get('_from_entity') == True: in the models __init__ method. Before today's change _from_entity was a bool argument and this code worked perfectly. Today's change made _from_entity a dictionary containing the entities' properties and values. Because of this the explicit check for True returned False and both Enstore and this blog started returning 500 errors.

The issues were resolved by changing :

`if kwargs.get('_from_entity') == True:`

to:

`if kwargs.get('_from_entity'):`.

The future

Tue, 19 Jul 2011 15:33:00 GMT

Most of you probably already know, but for those who don’t; the company I work at, Sofa was acquired by Facebook. For reasons I can’t disclose I was not part of the acquisition.

The last couple of weeks have been a very emotional and busy period. Over the course of two weeks I went from having a job I enjoyed, to moving to the Bay Area for a job at Facebook, to having no job at all. In other words my future was destroyed, recreated and destroyed again.

Even though Facebook wasn’t an option, I didn’t want to waste the opportunity to move to the US. I got a ton of job offers during WWDC and I spend most of my time pursuing them trying to find a job in San Francisco.

While I was interviewing at another company I got an email from Sofa’s partner in Checkout, Acclivity. They wanted me to stop by New Jersey on my way back home to talk about my future and offered me an opportunity to continue development on Enstore and Checkout. Although I had set my mind on San Francisco this was an opportunity too good to pass by.

I’ll be part of a newly formed NYC based company responsible for Enstore and Checkout. My wife and I will be moving to New York City as soon as my visa is arranged. Suggestions where to live, eat and spend our spare time are very welcome.

In closing I would like to thank all the companies that offered me a job and all the great people that helped me out trying to find a new job! The last couple of months have been a hard and emotional period, but I’m sure the future will make up for it.

My git setup

Thu, 28 Apr 2011 17:30:20 GMT

I have been using git since I started working on Cappuccino. Over time I’ve found several useful additions to my configuration that made working with it easier.

Bash additions

While working with git it’s easy to get lost in branches, tags and commits. The bash completion script included with git helps to keep track. It's core functionality is autocompletion, but it can optionally show the current branch after your prompt. Installation instructions are included in the file, which you can find in the git repository under contrib/completion/. If you change your bash prompt to show the current branch (step 3) consider using PS1='\h:\W'$RED'$(__git_ps1 "@%s")'$NONE'\$ '. It will display the current branch in red, making it much more obvious.

Aliases

Git (since version 1.4) includes support for aliasing commands. For a quick introduction see this tutorial on the git wiki.

These are the aliases I currently use:

[alias]
    co = checkout
    mg = merge
    st = status
    ci = commit
    br = branch
    df = difftool
    lg = log --graph --pretty=format:'%C(bold red)%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold green)<%an>%Creset' --abbrev-commit --date=relative
    lc = log ORIG_HEAD.. --no-merges --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit --date=relative

With the exception of lc and lg all my aliases are shortcuts for git commands. The lg alias is a shortcut for git log with custom formatting. lc is the same, but it only shows the last fetched commits. While you’re adding aliases don’t forget to alias git itself as well. I’ve added the following to ~/.bash_login:

alias g='git'
# Make the autocompleton work with the g alias
complete -o bashdefault -o default -o nospace -F _git g 2>/dev/null \
|| complete -o default -o nospace -F _git g

Editor and difftool

I’ve changed my default git editor to Textmate. This means commands that require text entry, such as commit and tag, will open Textmate. You can change the editor by running: git config --global core.editor 'mate -w' or by setting the GIT_EDITOR environment variable.

Lastly I’ve also changed my difftool to Kaleidoscope. This is easily done from Kaleidscope itself by going to the Integration in the Kaleidscope menu. If you don’t have Kaleidoscope already you can currently buy it for a 50% discount in the Mac app store.

Summary

This is just a summary of how I configured git. If this post has whet your appetite use Google and mix and match several setups to find your perfect git setup.

Announcing autonib2cib

Tue, 15 Mar 2011 20:20:33 GMT

Some time ago I posted a gist for a command line utility that automatically nib2cibs changed nibs. During the weekend I've rewritten the utility, making it more reliable with newly created nibs and nibs containing resources.

I've also moved the code (all 100 lines of it) from the gist to it's own github repo. If you have a feature request or find a bug, please create an issue or even better, a pull request.

Take a look at the README for installation instructions. After installing you can start monitoring your nibs by running autonib2cib <resource directory> in your terminal.

Cappuccino has been very successful at preserving the customary 'code and refresh' workflow for web developers. However, as any developer with more than a handful of cibs knows, having to manually run nib2cib breaks this workflow. Autonib2cib will solve this problem by automating the nib2cib process.

Improving the Cappuccino Theme System

Fri, 05 Nov 2010 21:13:41 GMT

I've written about the Cappuccino theming system before¹ and I have a confession to make, I don't like the current system.

Let me clarify. Being able to change every visual aspect of a view is great, but currently it's too complex.

It's complex because a it requires manual building, even during development. I should be able to make a change, refresh the browser and see the difference. Just like developing everything else on the web, including Objective-J.

Objective-J itself is also part of the complexity. setValue:forThemeAttribute:inState works great for small amounts of theme changes. But it becomes unreadable when changing large parts of a theme.

With all the talent in the Cappuccino community I'm sure we can work around these problems with the current system. It will however not fix the biggest issue. Designers won't theme as long as we're using Objective-J as our theming language.

This is a huge step backwards. Designers have been able to style websites for years using CSS. I don't see why that isn't possible for (Cappuccino) web applications.

Now is the time for the skeptics to say that this impossible or to hard to do. Well, as we say in Dutch, watch and shiver².

Obviously this application is a big hack, but it does show what is already possible. Imagine what we could do if we implemented this properly.

In the application I use a Javascript CSS parser. This prevents the need for a separate build phase during development. When the application is ready to be deployed, the CSS can still be build into an optimized format. CSS is also a far more readable theming language and most designers already know and use it.

Now to also get them to use Git.

Previous posts are Cappuccino Custom Themes and The Basics of Cappuccino Theming) ↩
The source is available here ↩

Cappuccino Custom Themes

Thu, 16 Sep 2010 19:17:35 GMT

A while ago I wrote a blog post about the basics of Cappuccino theming. Since then I've got a lot of questions about how to create fully customized themes.

The first step in building your own custom theme is to create a theme descriptor. If you've built Cappuccino from source you can create one using the following command:

capp gen -t ThemeDescriptor --build -F BlendKit [Theme name]

If you haven't installed Cappuccino from source, you can download a default theme descriptor.

You should now have a folder with the theme descriptor file, a resources directory and a Jakefile. A theme descriptor also includes a handy showcase application which you can use to preview your theme. Running the showcase is simply a matter of opening index.html or index-debug.html.

The showcase by default isn't very helpful, it only has an ugly button. If you open the theme descriptor you'll see the + (CPButton)themedButton class method. You can change the theme properties for a button by setting additional theme values in this method. How to change theme values is described in my previous blog post about Cappuccino theming.

Unfortunately theme-able properties are not documented. You'll have to take a look at Aristo's theme descriptor or check the + (id)themeAttributes method of a class and all of it's superclasses.

Theming another class is done by implementing another +(<Class>)themed<Class> method. If the class is initialized with a frame and some theme values it will automatically show in the theme showcase. Take a look at Aristo's theme descriptor to see what you can do.

The next step is building your theme. You can do this by running jake debug or jake install inside your theme directory. The build process will take the resources and theme descriptor and build it into a theme blend. After the build is done, the theme blend can be found in: Build/[Configuration]/[Theme name].blend>. [Configuration] is either Debug or Release, depending on the jake argument used.

The theme blend is what is needed to actually load the theme in your Cappuccino application. The easiest way to load the theme is by adding the following to your application's Info.plist:

<key>CPDefaultTheme</key>
<string>[Theme name]</string>

This will automatically set the custom theme as the default theme for the application. This will override Aristo (Cappuccino's default theme) and set your theme as the default for the application.

If you load your application, you'll see there's an error; Cappuccino can't find your theme blend. This is because Cappuccino will look inside your application bundle's resource directory for the theme blend and it was built somewhere else. The easiest way to solve this is to symlink the theme blend inside the Resources directory. This also makes sure any changes to your theme are automatically applied in your application when you rebuild the theme.

As mentioned before the previously described method of loading a Theme will completely override Aristo. If you want to use Aristo in addition to your own theme you can load the theme blend manually. The following code shows how this is done:

- (void)applicationDidFinishLaunching:(CPNotification)aNotification
{
    var bundle = [CPBundle mainBundle],
        blend = [[CPThemeBlend alloc] initWithContentsOfURL:
                 [bundle pathForResource:@"<Theme name>.blend"]];

    [blend loadWithDelegate:self];
}

- (void)blendDidFinishLoading:(CPThemeBlend)theBlend
{
    // Show your application and use your custom theme
}

When using this method it's advisable to show your application after the blend finished loading. This way you'll never have flashes when the custom theme loads.

After the blend is loaded you can apply it to any view:

var customTheme = [CPTheme themeNamed:<Theme name>],
     button = [CPButton buttonWithTitle:@"Custom themed button"];

[button setTheme:customTheme];

I've wrapped up both methods of theming into separate projects. Both can be downloaded here. Please let me know if you have any questions in the comments.

Previous posts are Cappuccino Custom Themes and The Basics of Cappuccino Theming) ↩
The source is available here ↩

NSConference MINI 2010 Sessions Online

Thu, 22 Jul 2010 17:46:51 GMT

This year, European developers had a hard time attending the WWDC, Apple's developers conference. The announcement was to late, forcing developers to arrange an entire inter continental trip in a relative short amount of time. There was also the pretty steep price and of course it was sold out within just 8 days!

Luckily the community took care of us. The Mac Developer Network hosted a mini NSConference during WWDC. Wanting to help out, I gave a talk about the Cappuccino frameworks.

My session and all the others given during NSConference MINI are now available at the Mac Developer Network website. You can get all of the sessions in one pack for 50 dollars¹.

As far as I'm aware there's no way to buy individual sessions, so if you're only interested in one talk you're still going to have to pay the full sum for all the sessions. ↩
The source is available here ↩

Programmatically Scroll a UIWebView

Thu, 15 Jul 2010 06:33:14 GMT

Ever wanted to scroll a UIWebView programmatically on the iPad or iPhone? Unfortunately Apple doesn't have a public API to do this, but there is a way. A UIWebView can execute any arbitrary javascript with stringByEvaluatingJavaScriptFromString:.

Using this method we can easily scroll a web view like so:

[webView stringByEvaluatingJavaScriptFromString:@"window.scrollTo(0.0, 100.0)"];

It's also possible to save the scroll state of the web view through javascript:

CGFloat xOffset = [[[self webView] stringByEvaluatingJavaScriptFromString:@"pageXOffset"] floatValue];
CGFloat yOffset = [[[self webView] stringByEvaluatingJavaScriptFromString:@"pageYOffset"] floatValue];

I've used and tested both of these methods and haven't found any bugs or weird issues. I've filed radar bug 8184256: No API for programmatically scrolling / zooming a UIWebView. It has been marked as a duplicate of radar bug 5912563.

As far as I'm aware there's no way to buy individual sessions, so if you're only interested in one talk you're still going to have to pay the full sum for all the sessions. ↩
The source is available here ↩

The Basics of Cappuccino Theming

Tue, 06 Apr 2010 08:02:38 GMT

This is the second post of a series of posts about Cappuccino where I explain the subjects I talked about during my CocoaHeads Amsterdam presentation. The first post can be found here.

Cappuccino and Cocoa have a lot of similarities, but there are some differences. Most prominent is probably Cappuccino's theming engine. Web developers are accustomed to a certain level of customization that Cocoa does not provide. The theming engine provides this freedom to Cappuccino developers.

The theming engine let's you customize any theme-able attribute of CPView. Every subclass of CPView can declare it's own theme-able attributes by implementing the themeAttributes class method and returning a CPDictionary with the attribute names as keys and their default value as values.

Theme states

Before going into theming you'll have to know something about theme states. Basically every Cappuccino view has a theme state. The current theme state can be found by calling the themeState method on any view.

The themeState method itself is not extremely useful since you'll only get a unsigned integer back, it's up to you to find the actual theme state. Far more useful is the currentValueForThemeAttribute: method. This methods takes a string, the name of the theme-attribute, and returns it's current value.

Changing theme states is done through the setThemeState: and unsetThemeState: method. They both take a string with the state name or the CPThemeState itself as their only argument.

Changing theme-attributes

Most (if not all) of the state changing is handled by Cappuccino. Unless you are creating a custom control, you won't need to touch any of the the above methods. Far more important is the setValue:forThemeAttribute:inState: method. Let's take a look at changing the left and right content inset of a CPButton:

[button setValue:CGInsetMake(0.0, 50.0, 0.0, 50.0) forThemeAttribute:@"content-inset"];

Since we don't want the text to jump around when changing states we don't explicitly name the state, this effectively sets a fallback value. When a control is in a state with no defined value, the control will fall back to using this value.

Let's also take a look at setting theme-attributes for different states:

[button setValue:buttonBezel forThemeAttribute:@"bezel-color" inState:CPThemeStateBordered];

[button setValue:highlightedButtonBezel forThemeAttribute:@"bezel-color" inState:CPThemeStateBordered | CPThemeStateHighlighted];
[button setValue:disabledButtonBezel forThemeAttribute:@"bezel-color" inState:CPThemeStateBordered | CPThemeStateDisabled];

Assuming the bezel colors are defined, the above sets the bezel color for the normal, highlighted and disabled state.

During my presentation I used an example of a large button to show how the theming engine works. All the code used in this post came from that example. The project can be downloaded here.

These are the basics of the theming engine. In my own code I often use:

setValue:forThemeAttribute:inState:

to quickly change small details¹. I don't recommend creating your own, fully custom, themes this way. It will only result in a lot of clutter in your code. If you want to create your own theme, you should take a look at theme descriptors².

The last thing I talked about during my CocoaHeads presentation is data availability. Cappuccino and Cocoa both assume data to be available when the application launches. I'll discuss this problem in more detail in the next, and last, post of the series.

Like issues with text in a control with odd height, resulting in the text appearing a pixel off center. ↩
I tried to find a good post about theme descriptors to link to, but unfortunately I couldn't find one. If you know of one, I'd be happy to link to it. ↩

As far as I'm aware there's no way to buy individual sessions, so if you're only interested in one talk you're still going to have to pay the full sum for all the sessions. ↩
The source is available here ↩

Objective-J Explained:
Toll-Free Bridges

Fri, 19 Mar 2010 22:34:25 GMT

Last week I gave a talk on the Cappuccino frameworks during a Cocoaheads Amsterdam meeting. This post is the first in a series in which I’ll explain several of the subjects I talked about during my presentation. I didn’t have a lot of slides and they won’t make much sense without explanation but for those that are interested you can download them here. All of the examples used in this post can be downloaded here.

I'm going to start of this series at the basis of the Cappuccino framework, Javascript. In the end Cappuccino and Objective-J are build on top of this one language and that allows for some pretty cool things. Cool things which will look familiar to Cocoa developers and cool things that can make the transition for Javascript developers easier.

The following code shows an example:

// 1 Declare a javascript array
var array = [];
CPLog.debug(@"Step 1: %@", array);
// >

// 2 Call an Objective-J method on it
[array addObject:@"first object"];
CPLog.debug(@"Step 2: %@", array);
// > first object
// 3 Call a Javascript function
array.push(@"SECOND OBJECT");
CPLog.debug(@"Step 3: %@", array);
// > first object,SECOND OBJECT
// 4 Mix it up
array[0] === [array objectAtIndex:0];
CPLog.debug(@"Step 4: %@", array[0] === [array objectAtIndex:0]);
// > true
// 5 Do something wacky
array[[array indexOfObject:@"SECOND OBJECT"]] = [array objectAtIndex:[array indexOfObject:@"SECOND OBJECT"]].toLowerCase();
CPLog.debug(@"Step 5: %@", array);
// > first object,second object

All of the above code is perfectly valid. This is an example of a toll-free bridge. A toll-free bridged object is both an instance of a regular Javascript and an instance of an Objective-J object. In Objective-J CPArray and CPString are toll-free bridged to their Javascript equivalents.

As you see you can mix and match both syntaxes as you feel fit. A word of caution. The above example (especially step 5) is contrived, I do not recommend mixing syntax like this in production code since it can make your code very hard to read and maintain. Personally I only use Javascript literal array notation to create arrays because it's shorter and more readable than [CPArray array]. I also use regular Javascript objects in stead of CPDictionaries because CPDictionary is not toll-free bridged with the Javascript object.

// 1. Create a regular javascript object using literal notation
var object = {};
// > {}

// 2. Add a key value pair to it using javascript
object['key1'] = 'value1';
// > {"key1": "value1"}
// 3. Attempt to add another key value pair using Objective-J
[object setValue:@"value2" forKey:@"key2"];
// > TypeError: Result of expression 'isa' [undefined] is not an object.

If you prefer using CPDictionaries over Javascript objects you can transform it into a CPDictionary like so:

// 1. Create the object from the previous example
var object = {@"key1": @"value1"}
// > {"key1": "value1"}

// 2. Make a CPDictionary out of it
var dictionary = [CPDictionary dictionaryWithJSObject:object recursively:YES];
// > {"key1": "value1"}
// 3. Attempt to add the key value pair using Objective-J again
[dictionary setValue:@"value2" forKey:@"key2"];
// > {"key1": "value1", "key2": "value2"}

I personally never do this because, to me:

{@"key1":@"value1", @"key2":@"value2"}

is far more readable than:

[CPDictionary dictionaryWithObjectsAndKeys:
    @"value1", @"key1", @"value2", @"key2"]

As you've seen, Objective-J and Javascript differ in syntax a lot, but are still very much the same thing.

As I've said earlier, this post is the start of a series of posts about Cappuccino. The next one will be about Theming, make sure you don't miss it by subscribing to my feed or following me on Twitter.

As far as I'm aware there's no way to buy individual sessions, so if you're only interested in one talk you're still going to have to pay the full sum for all the sessions. ↩
The source is available here ↩

Welcome!

Mon, 08 Mar 2010 20:27:15 GMT

After some delay it's finally here. Welcome to my blog! I intend to post here whenever I learn something new and interesting. I don't have a specific subject in mind, but it will certainly have to do with usability, design and software.

The reason for me to start this blog is that I like talking about things I learn. Of course it's also kind of mandatory to have a blog nowadays.

I intend to talk about the things I'm currently working on, provided I can talk about them. For now, this post will have to do. Thanks for stopping by and I hope to see you again soon!

As far as I'm aware there's no way to buy individual sessions, so if you're only interested in one talk you're still going to have to pay the full sum for all the sessions. ↩
The source is available here ↩