A quick introduction and tutorial
1 / 13

Presentation for OpenSocial - PowerPoint PPT Presentation

  • Updated On :

A Quick Introduction and Tutorial. Open Social. What is Open-Social in a Nutshell?. Open-Social provides a API specification for social networking sites  This allows all applications / gadgets to work across every site that implements the specification (in theory)

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about 'Presentation for OpenSocial' - Jeffrey

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

What is open social in a nutshell l.jpg
What is Open-Social in a Nutshell?

  • Open-Social provides a API specification for social networking sites 

  • This allows all applications / gadgets to work across every site that implements the specification (in theory)

    So you build a gadget for iGoogle, and it works on:


    (but not Facebook, sorry)

What i m going to show l.jpg
What I'm going to show:

  • How to make a simple open-social gadget

  • How to get current user information

  • How to get friends information

  • How to store and return custom application data

  • Then I'm going to give you something to do on your own!

How to make an open social gadget l.jpg

Here is a hello-world application:

<?xml version="1.0" encoding="UTF-8" ?>


  <ModulePrefs title="Hello World!">

    <Require feature="opensocial-0.7" />


  <Content type="html">


      <p>Hello, world!</p>




And here it is working in iGoogle (that means demo it)

How to Make an Open-Social Gadget

  • You provide a simple XML file which contains your gadget HTML and JavaScript code

  • Thats it!

The demo tools to be used l.jpg

And these sites:






The Demo: Tools to be used

  • We're going to use these tools:

    • A Text Editor

    • VMWare Player

    • Apache Shindig

    • Partuza

The demo take a look at your vm l.jpg
The Demo: Take a look at your VM

  • The Virtual machine has two web-applications installed

    • Apache Shindig (http://local.shindig)

    • Partuza (http://partuza) - a full social networking site

      We can use these two web-apps to test out gadgets.

      For example navigate to:




      You can load any gadget into either page in order to test it.

      Lets do that with out hello-world xml file....

The demo getting social data l.jpg
The Demo: Getting Social Data

  • I'll be using some stuff covered here:

  • http://code.google.com/apis/opensocial/articles/tutorial/tutorial-0.8.html

  • Note: We do everything in javascript. (sorry!)

  • We fetch data using an object called the DataRequest object

  • var req = opensocial.newDataRequest();

  • Then we 'add' a bunch of data requests to this object which represent what we want to retrieve 

  • req.add(some_request_for_data);

  • Then we send it along with the name of a function that will handle the callback:

  • req.send(callback_function);

The demo getting social data8 l.jpg
The Demo: Getting Social Data

  • So to get information about a person (in this case the current user) we do this:

  • var req = opensocial.newDataRequest();

  • req.add(req.newFetchPersonRequest(opensocial.DataRequest.PersonId.VIEWER), 'viewer');

  • req.send(someCallBackFunction);

  • You can see more request types here:

  • http://wiki.opensocial.org/index.php?title=Opensocial.DataRequest_(v0.8)

The demo getting social data9 l.jpg
The Demo: Getting Social Data

  • Let me do this for real....

The demo getting social data10 l.jpg
The Demo: Getting Social Data

  • Wow! It worked! (hopefully)

The demo getting social data11 l.jpg
The Demo: Getting Social Data

  • Obviously its more useful if you also have friend information. Getting your friends-list is similar:

  • var req = opensocial.DataRequest();

  • req.add(req.getPeopleRequest(idSpec, parameters), 'friend-data');

  • The 'idSpec' object just describes what people you want information for, and the 'parameters' object just specifices things like the number to retrieve, for example:

  • var idSpec = opensocial.newIdSpec({ "userId" : "VIEWER", "groupId" : "FRIENDS" });

  • var parameters = {};

  • parameters['max'] = 30;

The demo getting application data l.jpg
The Demo: Getting Application Data

  • The javascript API also allows you to store application-data at the social network using the same DataRequest object.

  • It provides three methods, for fetch, store, and delete.

  • For example, to fetch basic data stored by the viewer:

  • var idSpec = opensocial.newIdSpec({"userId" : "VIEWER"});

  • req.add(req.newFetchPersonAppDataRequest(idSpec, 'numberOfHelloes'), 'appData');

  • Or to add / update some information we could do something like this:

  • var req = opensocial.newDataRequest();req.add(req.newUpdatePersonAppDataRequest("VIEWER", 'numberOfHelloes', 5)); req.send();

Time to do stuff yourselves l.jpg
Time to Do Stuff Yourselves!

  • I showed you how to retrieve application data for the current user, but how do you retrieve application data from other users?

  • Your goals for the rest of the session:

    • Make an application where you can click a 'hello' button and it increments a hello count, which it sends to the server. When the application loads it should show you how many times you said hello.

    • Make an application that shows a list of your friends and you can say hello to each of them. For example, if I said 'hello' three times to bob, when bob loads the application it will say '3 hellos received from Matthew'

      These links will be useful: