The document introduces OpenSocial, a set of common APIs for building social applications across different websites. It discusses why OpenSocial is important for allowing developers to write applications using a standard API that can run on multiple social networks. It provides an overview of the OpenSocial JavaScript APIs for accessing user and friend data, activities, and persistence. It also discusses the Shindig container software and plans for upcoming REST APIs. The presentation aims to explain what OpenSocial is and its potential to increase application distribution and the social aspects of the web.

2. Introducing OpenSocial “Building Social Ajax applications with OpenSocial” Chris Schalk Developer Advocate Google

8. OpenSocial solves this problem

9. OpenSocial solves this problem

15. Who’s working on OpenSocial? Over 200 other influential companies… amiando Animoto Appirio Bebo Bleacher Report BonstioNet Brad Anderson Bunchball, Inc BuyFast Cardinal Blue Software Chakpak Chronus Corporation Ci&T Inc come2play CurrentTV E-junkie Engage.com eTwine Holdings, Inc. Fendoo Ltd Flixster FotoFlexer Friendster Grimmthething Guerreiro Consult HedgeStop.com Hi5 Hungry Machine Hyves IG.com (Division of Brasil Telecom) iFamily, Inc iLike Imeem Indeed.com KlickSports, Inc. LabPixies Ltd. LimitNone LinkedIn LjmSite LoveMyGadgets LuvGoogleGadgets Mesa Dynamics, LLC Mixi MuseStorm Inc MySpace Netvibes NewsGator Nike Ning NY Times Shelfari O Globo Online Oberon Media Oracle Orkut Outside.In PayPal Plaxo PROTRADE Puxa Qloud RockYou Salesforce.com …

18. Gartner Technology Hype curve Case Study: OpenSocial Case Study: OpenSocial

19. OpenSocial Roadmap a la the “Hype curve” Case Study: OpenSocial Case Study: OpenSocial

23. Core Services - People & Friends /** * Request for friend info when the page loads. */ function getData() { var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest(VIEWER), 'viewer' ); req.add(req.newFetchPeopleRequest(VIEWER_FRIENDS), 'viewerFriends' ); req.send( onLoadFriends ); }; Getting info on you and your friends :

24. Core Services - People /** * Callback function for returned friend data. */ function onLoadFriends (response) { var viewer = response.get( 'viewer' ).getData(); var html = 'Friends of ' + viewer.getDisplayName() + ‘:<br><ul>’; var viewerFriends = response.get( 'viewerFriends' ).getData(); viewerFriends.each(function(person) { html += '<li>' + person.getDisplayName() + '</li>';}); html += '</ul>'; document.getElementById('message').innerHTML = html; }; Getting info on you and your friends : Generated output:

25. Core Services - Activities /** * Posting a simple text activity */ function postActivity(text) { var params = {}; params[opensocial.Activity.Field.TITLE] = text; var activity = opensocial.newActivity(params); opensocial.requestCreateActivity(activity, opensocial.CreateActivityPriority.HIGH, callback ); } postActivity(&quot;This is a sample activity, created at &quot; + new Date().toString()); Posting an Activity : Activities in Orkut:

26. Core Services - Persistence /** * Storing data */ function populateMyAppData() { var req = opensocial.newDataRequest(); var data1 = Math.random() * 5; var data2 = Math.random() * 100; req.add(req.newUpdatePersonAppDataRequest(&quot;VIEWER&quot;, &quot;AppField1&quot;, data1)); req.add(req.newUpdatePersonAppDataRequest(&quot;VIEWER&quot;, &quot;AppField2&quot;, data2)); req.send(requestMyData); }; Requesting to persist data:

27. Core Services - Persistence /** * Fetching data */ function requestMyData() { var req = opensocial.newDataRequest(); var fields = [&quot;AppField1&quot;, &quot;AppField2&quot;]; req.add(req.newFetchPersonRequest( opensocial.DataRequest.PersonId.VIEWER), &quot;viewer&quot;); req.add(req.newFetchPersonAppDataRequest(&quot;VIEWER&quot;, fields), &quot;viewer_data&quot;); req.send(handleReturnedData); } Requesting to persist data:

28. Core Services - Persistence /** * Displaying persisted data */ function handleReturnedData(data) { var mydata = data.get(&quot;viewer_data&quot;); var viewer = data.get(&quot;viewer&quot;); me = viewer.getData(); // me is global var var data = mydata[me.getId()]; htmlout += &quot;AppField1: &quot; + data[&quot;AppField1&quot;] + &quot;<br/>&quot;; htmlout += &quot;AppField2: &quot; + data[&quot;AppField2&quot;] + &quot;<br/>&quot;; var div = document.getElementById('content_div'); div.innerHTML = htmlout; } Displaying the fetched ( persisted ) data: Generated output:

33. Shindig in Action Running the application Request is made from Client Data is returned and rendered Application Installation Gadget XML is loaded and cached on OpenSocial Container Gadget XML Source

38. With REST APIs OpenSocial can go Mobile!

41. Questions?