Test drive data pipelining and OpenSocial templates

OpenSocial v0.9 is coming right along, and we've prototyped some new features so that app developers can try them out. This stage in the iterative process is crucial to ensuring that containers are improving their OpenSocial platforms by adding the features that will make your apps more successful. Make your voice heard, and help improve the OpenSocial spec!

The first two prototypes to check out are data pipelining and OpenSocial templates. Data pipelining allows you to specify the data you want to use in your app, while templates let you describe how to render the app--all using a markup language (that's right, no JavaScript necessary!). Using data pipelining and templates will reduce the number of round trips between the container and your server, making your app render more quickly. Template values are also HTML-escaped, plugging many XSS vulnerabilities automatically.

Data Pipelining
To use data pipelining, add <Require feature="opensocial-data"> to the ModulePrefs in your gadget spec. Then you can specify the data that you want by adding request tags to a <Content> section of your gadget spec. For example, to access the viewer's friends, include a tag like this:

<script xmlns:os="http://ns.opensocial.org/2008/markup" type="text/os-data">
 <os:PeopleRequest key="friends" userId="@viewer" groupId="@friends">
</script>

Note that you set the key attribute in the os:PeopleRequest so that you can access the data returned. You can use the data to render a template (as shown below) or access the data using JavaScript like this: opensocial.data.getContext().getDataSet('friends').

OpenSocial Templates
Once you've specified the data you need, you can use a template to display it. To enable templates in your app, include the following tags in your ModulePrefs:

<Require feature="opensocial-templates">
 <Param name="process-on-server">true</param>
</Require>

Now you can add templates that define how to render social data. For example, to access the data specified above and print a list of the viewer's friends, include a template like this:

<script type="text/os-template">
  <ul>
   <li repeat="${friends}">
     <span class="name" id="id${Context.Index}">${Cur.name.givenName}</span>
   </li>
  </ul>
</script>

This example illustrates several special variables in OpenSocial templates:

• repeat - iterate over the 'friends' object by adding the repeat attribute to the element.
• Context.Index - an index for the object being repeated.
• Cur - a reference to the current object. In this case that object is a JSON representation of a person so you can access fields directly.

These new features are currently available on the orkut sandbox, so you can try them out today. For more information (including a full example), visit the OpenSocial Templates page on the OpenSocial wiki. Once you've had a chance to check it out, please send a note to the spec list -- OpenSocial templates are designed to make app development easier, so let us know if we hit the mark.

Posted by Lane LiaBraaten, OpenSocial Team