O'Reilly logo

Programming Social Applications by Jonathan LeBlanc

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Putting It All Together

Now that you have the knowledge you need to leverage a gadget’s social features, we’ll put it to use in a sample gadget. This gadget will display the activity stream of the viewer’s friends, display their profile images, and then provide a method for the viewer to add a new activity to his stream.

First, we need to build the gadget markup. In this example, we’ll just need the lightweight osapi JavaScript library, so we’ll include that feature in the gadget. We then define the view in which the Content node will be loaded:

<?xml version="1.0" encoding="UTF-8"?>
<Module>
   <ModulePrefs title="Chapter 4 Example"
                description="Display social information fetch and push abilities">
      <Require feature="opensocial-0.9"/>
      <Require feature="osapi" />
   </ModulePrefs>
   <Content type="html" view="canvas">
      <![CDATA[
      <!-- view content -->
      ]]>
   </Content>
</Module>

We now need to include our styles and markup in the Content node. For this example, we use styles to position the page elements and set their font, colors, and spacing. This markup will build a container with two columns. The left column will display the recent updates of the viewer’s friends, and the right column will display profile images for 12 of those friends. Below the photos is a form to allow the user to input a title, description, and URL to push out a new activity ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required