2009-09-24

opensocial-jquery templates 0.1.0 is available. It's HTML DOM based JavaScript template library for OpenSocial Application.

Hello,

My name is Nobuhiro Nakajima, Japanese programmer.

I'm afraid my expressions may be rude or hard to read, because I'm not so good at English. But please, please be patient! I will try hard to learn English!

opensocial-jquery templates 0.1.0 is available.
http://code.google.com/p/opensocial-jquery/

opensocial-jquery templates is HTML DOM based JavaScript template library for OpenSocial Application. It is based on implementation of Apache Shindig and has compatibility with subset of OpenSocial Templates.

opensocial-jquery templates supports the following markup in OSML:

* ${Expr} variables and expressions into a element text and a attribute
* Set of special variables: Top, Cur, Context.index, Context.Count and Msg
* Set of special attributes: if, repeat, and var

This example is fetching and rendering a group of people using Ajax and Template.



The HTML template is as follows:
<div id="wrapper" style="display:none;">
<div repeat="${people}" class="person">
<img alt="${Cur.displayName}" src="${Cur.thumbnailUrl}" />
<a title="${Cur.displayName}" href="${Cur.profileUrl}">${Cur.displayName}</a>
</div>
<div if="${people.length > 0}" class="pager">
Showing friends from ${people.startIndex + 1}
to ${people.startIndex + people.length }
of ${people.totalResults}
</div>
<div if="${people.length == 0}" class="pager">
There's no friend yet.
</div>
</div>
The JavaScript is as follows:
$.getData('/people/@owner/@friends', function(data) {
$('#wrapper').render({ people: data }).show();
});
View of the finished source code

opensocial-jquery templates is usable with the container which does
not support OpenSocial v0.9. And different from OpenSocial Templates of the XML base, you can edit opensocial-jquery templates by an HTML authoring tool visually. It will make a programmer and a designer happy.

Thank you.

0 件のコメント: