Monday, April 28th, 2008
Coherent: Cocoa Databinding for Ajax
Category: JavaScript
, Library
Jeff Watkins is a fan of the Cocoa data binding model, and wanted to bring it to the Web. This lead him to create a projects three years ago, which comes out of the dark now: Coherent.
There are some fun demos, such as the Flickr Browser, and the Laptop configurator which mimics the Apple store look and feel for picking a product.
There is also some documentation so you can learn how it all works. There are tutorials on properties and bindings, how to write a widget, and details on the APIs.
Most of the magic is done via attributes in HTML itself, along with the JavaScript API. For example, you get binding:
JAVASCRIPT:
-
-
userController.bindNameToKeyPath("userId", "search.content.nsid");
-
and then bindings happen in HTML such as:
HTML:
-
-
<div id="demo">
-
<div id="userSearch">
-
<label for="userName">Flickr Username:</label>
-
<input id="userName" type="text" valueKeyPath="search.parameters.username"/>
-
</div>
-
-
<div id="userInfo">
-
-
<div class="queryIndicator" visibleKeyPath="user.queryInProgress">
-
<img src="images/spinner.gif" width="16" height="16"/> Loading user profile…
-
</div>
-
-
<img class="buddyIcon" srcKeyPath="user.iconUrl"/>
-
<h1 textKeyPath="user.content.realname._content">Real Name</h1>
-
<p textKeyPath="user.content.location._content">Location</p>
-
</div>
-
-
-
<div id="userTagsList">
-
<div class="queryIndicator" visibleKeyPath="userTags.queryInProgress">
-
<img src="images/spinner.gif" width="16" height="16"/> Loading tags…
-
</div>
-
</div></div>
-
3.1 rating from 14 votes
Great to see Jeff’s labor of love come live.
Lots of great stuff in there!
I’m curious to know how this compares/contrasts/integrates with http://www.jonathansaggau.com/blog/2007/03/webkit_and_cocoa_bindings.html ?
Dylan - your link refers to using WebKit within Cocoa applications; Coherent looks like a JavaScript framework very similar to SproutCore.
Dylan, thanks very much for pointing out the WebKit/Cocoa bindings work. It looks pretty cool and I wonder whether I can hook Coherent into that when its running in WebKit.
However, as the previous poster mentioned, the WebKit/Cocoa bindings bridge only works when you’re running inside a Cocoa app rather than just any Web application.
Charles has done really great work with SproutCore, he’s just had different challenges to solve. He’s chosen to focus mainly on long-lived single page applications.
Coherent is intended to be just another tool in your box. It’s great at creating loosely coupled data-bound widgets, but it really doesn’t force you to structure your application in any particular way. You can use Coherent in a long-lived single-page app (I have for several vertical Web apps) or on short-lived pages as part of a high-traffic e-commerce Web site.
Apple was fairly diligent about getting the code off the net despite it’s Apache License. A version is on github:
http://github.com/trek/coherentjs/tree/master