Flickr Browser 데모(출처: Ajaxian)
Jeff Watkins는 Cocoa 데이터 바인딩 모델이 너무 좋은 나머지 결국 이를 웹으로 옮기는 프로젝트를 시작했고 3년만에 결과물이 나왔습니다: Coherent.
몇 가지 데모를 볼 수 있는데, Flickr Browser 나 애플 스토어에서 상품 옵션 선택할 때 사용하는 Laptop configurator 등이 있습니다.
문서화도 되어 있어서 어떤 식으로 동작하는지 배울 수 있습니다. 속성과 바인딩, 위젯 작성법, and API에 대한 상세설명과 같은 자습서도 있습니다.
대부분의 작업은 HTML의 속성과 JavaScript API를 통해서 이루어집니다. 예를 들어, 이런 식으로 바인딩 할 수 있습니다:[code:js]
userController.bindNameToKeyPath("userId", "search.content.nsid");
userController.bindNameToKeyPath("userId", "search.content.nsid");
그러면 다음과 같은 HTML 에서 바인딩이 일어나게 되죠.
[code:xml]
<div id="demo">
<div id="userSearch">
<h1><span>Flickr Browser</span></h1>
<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 id="demo">
<div id="userSearch">
<h1><span>Flickr Browser</span></h1>
<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>
from Coherent: Cocoa Databinding for Ajax on Ajaxian
'[IT] Web Tech' 카테고리의 다른 글
| 빠른 스트리밍 Ajax 프록시 (0) | 2008.05.06 |
|---|---|
| 모바일 브라우저 동시성 테스트: 모바일 브라우저를 준비하세요 (0) | 2008.05.04 |
| Aptana Cloud : 클라우드로의 개발을 데스크탑에서! (0) | 2008.05.04 |
| FancyUpload : Swiff, Ajax를 만나다 (0) | 2008.05.03 |
| Coherent: Ajax를 위한 Cocoa 데이터 바인딩 (0) | 2008.05.03 |
| JavaScript로 실행하는 Java (0) | 2008.05.03 |
| Ext JS : 오픈소스 FLOSS 예외사항 (0) | 2008.05.03 |
| OpenExt : ExtJS의 포크 프로젝트 (0) | 2008.05.02 |
| Ext JS와 오픈소스 라이센스의 재밌는 점 (0) | 2008.05.02 |
댓글을 달아 주세요