Activate your free membership today | Log-in

Monday, April 28th, 2008

Coherent: Cocoa Databinding for Ajax

Category: JavaScript, Library

<p>Coherent Flickr Browser

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:
  1.  
  2. userController.bindNameToKeyPath("userId", "search.content.nsid");
  3.  

and then bindings happen in HTML such as:

HTML:
  1.  
  2.         <div id="demo">
  3.         <div id="userSearch">
  4.             <h1><span>Flickr Browser</span></h1>
  5.             <label for="userName">Flickr Username:</label>
  6.             <input id="userName" type="text" valueKeyPath="search.parameters.username"/>
  7.         </div>
  8.        
  9.         <div id="userInfo">
  10.  
  11.             <div class="queryIndicator" visibleKeyPath="user.queryInProgress">
  12.                 <img src="images/spinner.gif" width="16" height="16"/> Loading user profile&hellip;
  13.             </div>
  14.        
  15.             <img class="buddyIcon" srcKeyPath="user.iconUrl"/>
  16.             <h1 textKeyPath="user.content.realname._content">Real Name</h1>
  17.             <p textKeyPath="user.content.location._content">Location</p>
  18.         </div>
  19.  
  20.        
  21.         <div id="userTagsList">
  22.             <div class="queryIndicator" visibleKeyPath="userTags.queryInProgress">
  23.                 <img src="images/spinner.gif" width="16" height="16"/> Loading tags&hellip;
  24.             </div>
  25. </div></div>
  26.  

Related Content:

  • Inversion of Control Container for Cocoa & iPhone?
    The IoC container provides dependency injection to Cocoa applications. It was created with iPhone development in mind. It aims to provide some...
  • Ajax Learning Guide
    Are you a Web developer? The time has come to rethink your entire approach to developing Web applications. Find out about the Ajax approach...
  • IdeaBlade-Lite
    This freeware download provides a RAD framework for .NET that includes integrated ORM, Model vire controller architecture and UI databinding. It comes...
  • Natural for Ajax from SAP
    Software AG recently unveiled Natural for Ajax, based on its Natural 2006 programming language. The Ajax version includes drag-and-drop development...
  • Ajax gets content management framework
    MODx, an open source application framework, is touted for providing Ajax content management capabilities. Designed for the Ajax and Web 2.0 world, it...

Posted by Dion Almaer at 7:57 am
5 Comments

+++--
3.1 rating from 14 votes

5 Comments »

Comments feed TrackBack URI

Great to see Jeff’s labor of love come live.

Lots of great stuff in there!

Comment by Tobie Langel — April 28, 2008

I’m curious to know how this compares/contrasts/integrates with http://www.jonathansaggau.com/blog/2007/03/webkit_and_cocoa_bindings.html ?

Comment by Dylan Schiemann — April 28, 2008

Dylan – your link refers to using WebKit within Cocoa applications; Coherent looks like a JavaScript framework very similar to SproutCore.

Comment by tlrobinson — April 28, 2008

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.

Comment by jeffwatkins — April 29, 2008

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

Comment by trek — August 25, 2008

Leave a comment

You must be logged in to post a comment.