google devfest singapore - opensocial
Post on 13-Sep-2014
5.149 views
DESCRIPTION
Google Devfest Singapore - OpenSocialTRANSCRIPT
![Page 2: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/2.jpg)
Agenda
• OpenSocial introduction• How to build OpenSocial applications• Hosting social applications• Social applications monetization• OpenSocial containers• Becoming an OpenSocial container• Google Friend Connect• Summary
![Page 3: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/3.jpg)
http://twitter.com/googledevapac
![Page 4: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/4.jpg)
OpenSocial IntroductionPatrick Chanezon
![Page 5: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/5.jpg)
Making the web betterby making it social
What does social mean?
![Page 6: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/6.jpg)
![Page 7: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/7.jpg)
What does Social mean?
Eliette what do you do with your friends?
![Page 8: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/8.jpg)
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 9: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/9.jpg)
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 10: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/10.jpg)
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 11: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/11.jpg)
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 12: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/12.jpg)
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 13: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/13.jpg)
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 14: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/14.jpg)
Raoul: a social object for Charlotte (3 year old)
![Page 15: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/15.jpg)
![Page 16: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/16.jpg)
Jaiku’s Jyri Engeström's 5 rules for socialnetworks: social objects
1. What is your object?2. What are your verbs?3. How can people share the objects?4. What is the gift in the invitation?5. Are you charging the publishers or the spectators?http://tinyurl.com/yus8gw
![Page 17: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/17.jpg)
How do we socialize objectsonline
without having to create yetanother social network?
![Page 18: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/18.jpg)
OpenSocial
A common API for social applicationsacross multiple web sites
![Page 19: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/19.jpg)
The Trouble with Developing Social Apps
Which site do I build my app for?
![Page 20: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/20.jpg)
Let’s work on that…
Using OpenSocial, I can build apps for allof these sites!
![Page 21: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/21.jpg)
What’s offered by OpenSocial?
• Activitieso What are people up to on the web
• People/Profile Infoo Who do I know, etc.
• Persistent datastoreo Handles key/value pairs
![Page 22: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/22.jpg)
Today: 375 Million User Reach
![Page 23: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/23.jpg)
Where is OpenSocial live today?
Live to Users:• MySpace• orkut• hi5• Freebar• Friendster• Webon from Lycos• IDtail• YiQi• Netlog - New!• Hyves - New!
Live Developer Sandboxes:• iGoogle• imeem• CityIN• Tianya• Ning• Plaxo Pulse• Mail.ru• lokalisten - New!• Viadeo - New!• 51.com - New!
Individual Developer Links:http://code.google.com/apis/opensocial/gettingstarted.html
![Page 24: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/24.jpg)
OpenSocial “Containers”
![Page 25: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/25.jpg)
Containers in the region
![Page 26: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/26.jpg)
What’s in OpenSocial?
• JavaScript API - Now
• REST Protocol - New
• Templates - Prototype in Shindig
![Page 27: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/27.jpg)
OpenSocial’s JavaScript API
• OpenSocial JS API• Gadget JS API• Gadget XML schema
• OpenSocial v0.7 is live• OpenSocial v0.8 is being deployed now
• Specs and release notes: http://opensocial.org
![Page 28: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/28.jpg)
OpenSocial’s REST Protocol
• Access social data without JavaScript• Works on 3rd party websites / phones / etc• Uses OAuth to allow secure access• Open source client libraries in development
o Java, PHP, Python, <your fav language here>
• Being deployed with OpenSocial v0.8
• Spec’s available at http://opensocial.org
![Page 29: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/29.jpg)
OpenSocial Templates
• Writing JavaScript is hard• Writing templates is easy• Templates also give
o Consistent UI across containerso Easy way to localizeo More interesting content options when inlining
into container (activities, profile views)o Ability to serve millions of dynamic pages per
day without a server
![Page 30: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/30.jpg)
Design principles
Create a template language that is:
• Simpleo Easy markup for creating UI and binding data
• Fasto Supports server-side optimizations
• Extensibleo Standard reusable controls (buttons, lists, links, etc.)
• Everywhereo Only need to include a single JavaScript file
![Page 31: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/31.jpg)
Concepts:
• Markupo A set of standard tags and behaviors that provide
developers with a simple, declarative language forassembling apps.
• Templatingo A set of standard elements implemented by containers.o A method for taking structured data and rendering UI
elements in an arbitrary markup.
• Data Pipeliningo A method for grabbing OpenSocial and third-party data
declaratively (or in script) and joining it to templates.
![Page 32: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/32.jpg)
Example: os:Image
<os:Image key="http://..."/>
![Page 33: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/33.jpg)
Example: osTabs, os:ShowPerson
<os:Tabs name="tabGroup"> <tab> <title>Tab 1</title> <body>This is the first tab.</body> </tab> ... <tab> <title>Tab 3</title> <body> <os:ShowPerson person="${Viewer}"/> <div repeat="ViewerFriends"> <os:ShowPerson person="${$this}"/> </div> </body> </tab></os:Tabs>
![Page 34: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/34.jpg)
Example: Friends list (no templates)
![Page 35: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/35.jpg)
Example: Friends list (with templates)
![Page 36: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/36.jpg)
Template Status
• High-level specification complete:o http://wiki.opensocial-templates.org
• Prototype implementation available:o http://ostemplates-demo.appspot.com
• GET INVOLVED! Tag feedback/suggestions appreciated:o http://tech.groups.yahoo.com/group/os-templates/
• Code for templates is in Shindig: patches welcome:-)
![Page 37: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/37.jpg)
OpenSocial is what you make it.
• OpenSocial is an open source project.• The spec is controlled by the community.• Anyone can contribute and have a voice.• http://groups.google.com/group/opensocial/
o “OpenSocial and Gadgets spec” subgroup
• OpenSocial Foundationo Get involved to nominate and elect board repso http://www.opensocial.org/opensocial-foundation/
![Page 38: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/38.jpg)
A note on compliance
• OpenSocial is designed for many sites
• Building an app:o Technologyo Policy
• OpenSocial Compliance Testso http://code.google.com/p/opensocial-
resources/wiki/ComplianceTests
![Page 39: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/39.jpg)
OpenSocial Compliance test in orkut
![Page 40: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/40.jpg)
OpenSocial Compliance Matrix
http://opensocial-compliance.appspot.com
![Page 41: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/41.jpg)
Other comments
• Portable Contacts Alignment
• Caja for JavaScript security
![Page 42: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/42.jpg)
A standard for everyone
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
![Page 43: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/43.jpg)
How To Build OpenSocialApplications
![Page 44: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/44.jpg)
Owner and Viewer Relationship
Owner
Applicationshas views
Viewer
has
Friends
has
Friends
![Page 45: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/45.jpg)
Understanding the Gadget XML<?xml version="1.0" encoding="UTF-8" ?><Module> <ModulePrefs title="Hello World!"> <Require feature="opensocial-0.7" /> </ModulePrefs> <Content type="html"> <![CDATA[ <script> function init(){ alert("hello world"); } gadgets.util.registerOnLoadHandler(init);</script> ]]> </Content></Module>
ModulePrefs definecharacteristics of thegadget, such as title,
author, etc.
Require nodes shouldbe added for alldesired features
Module nodedefines the gadget.
Define your gadgethtml within Content
node
![Page 46: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/46.jpg)
Retrieve Friend Informationfunction getFriendData() { var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest(VIEWER), 'viewer'); req.add(req.newFetchPeopleRequest(VIEWER_FRIENDS),'viewerFriends'); req.send(onLoadFriends);}
function onLoadFriends(response) { var viewer = response.get('viewer').getData(); var viewerFriends = response.get('viewerFriends').getData(); ///More code}
Create a new datarequest object and
add the desired sub-requests.
Place anasynchronous call to
the container.
Handle the returneddata in callback
![Page 47: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/47.jpg)
Persisting Datafunction populateMyAppData() {var req = opensocial.newDataRequest();var data1 = Math.random() * 5;var data2 = Math.random() * 100;
req.add(req.newUpdatePersonAppDataRequest("VIEWER","AppField1", data1));req.add(req.newUpdatePersonAppDataRequest("VIEWER","AppField2", data2));req.send(requestMyData);}
Use anewUpdatePersonAppDa
taRequest() to updatedata.
![Page 48: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/48.jpg)
Fetching persisted datafunction requestMyData() {var req = opensocial.newDataRequest();var fields = ["AppField1", "AppField2"];
req.add(req.newFetchPersonRequest(opensocial.DataRequest.PersonId.VIEWER),"viewer");req.add(req.newFetchPersonAppDataRequest("VIEWER",fields), "viewer_data");req.send(handleReturnedData);}
function handleReturnedData(data) {var mydata = data.get("viewer_data");var viewer = data.get("viewer");me = viewer.getData();var appField1 = mydata[me.getId()]["AppField1"]; ///More code}
Use anewFetchPersonAppDataRequest() to fetch
data.
AppData is returned as a2-level Map, with person
id as the first key andpropertyname as the
next key
![Page 49: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/49.jpg)
Posting an Activityfunction postActivity(text) {var params = {};params[opensocial.Activity.Field.TITLE] = text;var activity = opensocial.newActivity(params);opensocial.requestCreateActivity(activity,opensocial.CreateActivityPriority.HIGH,callback);}
postActivity("This is a sample activity, createdat " + new Date().toString())
requestCreateActivity isa request, a specific
container may choose toignore it.
![Page 50: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/50.jpg)
How to build an OpenSocial applicationBest Practices
![Page 51: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/51.jpg)
function response(data) { if (!data.hadError()) { ...} else { if (data.get("req").hadError()) { alert(data.get("req").getErrorMessage()); } } else { alert('Unknown error occurred');};
Best practices : Check for errors• Both the request and sub-requests can have
errors, use hadError() to check.
![Page 52: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/52.jpg)
function request() { var req = opensocial.newDataRequest(); var params = {}; params[opensocial.DataRequest.PeopleRequestFields .PROFILE_DETAILS] = [ opensocial.Person.Field.PROFILE_URL ]; req.add(req.newFetchPersonRequest( opensocial.DataRequest.PersonId.VIEWER, params), "req"); req.send(response);};
Best practices : Be specific• Specify which fields you want to use:
only ID, NAME and THUMBNAIL_URL are returnedby default
![Page 53: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/53.jpg)
var supportsAboutMe = opensocial.getEnvironment().supportsField( opensocial.Environment.ObjectType.PERSON, opensocial.Person.Field.ABOUT_ME );
if (gadgets.util.hasFeature('hi5')) { mediaItem.setField( hi5.ActivityMediaItemField.LINK, "http://linkurl");}
Best practices : Capability Discovery• Check for supported features and fields
![Page 54: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/54.jpg)
Best Practises : Use the container's cache
function showImage() { imgUrl = 'http://foo.com/bar.png'; cachedUrl = gadgets.io.getProxyUrl(imgUrl); html = ['<img src="', cachedUrl, '">']; document.getElementById('dom_handle').innerHTML = html.join('');};showImage();
Use the container's content cache
• Also check outo Content-Rewriter featureo Preloadingo Using App Data as content cache
![Page 55: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/55.jpg)
Best practises : Web development 101
• Control the caching of your content, http headers:o Cache-Controlo Last-Modifiedo Expireso E-Tag
• Reduce number of http requestso Combine JS and CSS files into one fileo Combine images into single sprite + CSS positioning
• Use Google's AJAX libraries APIo <script src="http://ajax.googleapis.com/.../prototype.js
• Other techniques:o GZip contento Minify JS and CSSo See YSlow!
![Page 56: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/56.jpg)
Hosting your application
• Host it anywhere you want to, with any back-end• Keep in mind:
o Popular apps like iLike get > 200k req / minute peako Means dealing with lots of scalability issues!o DB Sharding, memcache pools, server farms..
• Why not use a cloud service like:o Google App Engineo Joyent.como Amazon EC2
![Page 57: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/57.jpg)
Specificationhttp://opensocial.org/http://groups.google.com/group/opensocial-and-gadgets-spec
Code Samples and Toolshttp://code.google.com/opensocialhttp://code.google.com/p/opensocial-resources/
Getting started guidehttp://code.google.com/apis/opensocial/articles/tutorial/tutorial-0.8.html
Application Development Resources
![Page 58: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/58.jpg)
Social Apps monetizationPatrick Chanezon
![Page 59: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/59.jpg)
OpenSocial Monetization• Ads from Ad Networks
o AdSense, RightMediao BuddyPoke, Rate My Friend
• Brand/Private Label Appo Sony Ericsson MTV Roadies app on orkut
• Sell virtual or real goods• Free -> Freemium• Referrals• Virtual currency
![Page 60: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/60.jpg)
Success Story: Buddy Poke
• #1 OpenSocial app on orkut• 8M installs for orkut, hi5, MySpace• $1-2 CPM• #1 App for App Engine w/ millions daily PV
![Page 61: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/61.jpg)
Success Story: PhotoBuzz
• 6M+ installs on hi5 and orkut• CPM $1-3, especially good on orkut• 4M buzzes per day• Small team of 4 people, profitable
![Page 62: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/62.jpg)
Container specifics
![Page 63: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/63.jpg)
Container Specific ExtensionsMySpace• photo albums• videos
hi5• status• presence• photo albums
Netlog• credits api extension• translation tool for free
Imeem• music metadata api
![Page 64: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/64.jpg)
Becoming an OpenSocial ContainerBruno Rovagnati, Globant
![Page 65: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/65.jpg)
Becoming an OpenSocial Container
• Question:o How do you become an OpenSocial container?
• Answer:o The Apache incubator project “Shindig” serves this
purpose!
![Page 66: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/66.jpg)
What is Shindig ?
• Open source reference implementation of OpenSocial &Gadgets specification
• An Apache Software Incubator project• Available in Java & PHP• http://incubator.apache.org/shindig
It’s Goal: “Shindig's goal is to allow new sites to start hosting social appsin under an hour's worth of work"
![Page 67: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/67.jpg)
Introduction to Shindig Architecture• Gadget Server• Social Data Server• Gadget Container JavaScript
![Page 68: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/68.jpg)
Gadget Server
![Page 69: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/69.jpg)
Social Server
![Page 70: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/70.jpg)
Social Server - RESTful API• Preview available on
o iGoogleo Orkuto Hi5
• New development modelso Server to server & Mobile!
• Try it out:curl http://localhost:8080/social/rest/people/john.doe/@all
![Page 71: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/71.jpg)
Shindig Server Side (Java) Architecture
![Page 72: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/72.jpg)
Shindig Client Side Libraries
![Page 73: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/73.jpg)
Opensocial – JS Library
![Page 74: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/74.jpg)
Implementing Shindig - Data sources• Integrate with your own data sources
o People Serviceo Activities Serviceo App Data Service
class MyPeopleService implements PeopleService {...}
class MyAppDataService implements AppDataService {...}
class MyActivitiesService implements ActivitiesService {...}
![Page 75: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/75.jpg)
Implementing Shindig - PHP• Implement functions
function getActivities($ids){ $activities = array(); $res = mysqli_query($this->db, ”SELECT…"); while ($row = @mysqli_fetch_array($res, MYSQLI_ASSOC)) { $activity = new Activity($row['activityId'], $row['personId']); $activity->setStreamTitle($row['activityStream']); $activity->setTitle($row['activityTitle']); $activity->setBody($row['activityBody']); $activity->setPostedTime($row['created']); $activities[] = $activity; } return $activities;}
![Page 76: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/76.jpg)
Implementing Shindig - Java
import org.apache.shindig.social.opensocial.ActivitiesService;
public class SQLActivitiesService implements ActivitiesService {
private SQLDataLayer sqlLayer;
@Inject public SQLActivitiesService(SQLDataLayer sqlLayer) { this.sqlLayer = sqlLayer; }
Code at http://chrisschalk.com/shindig_docs/io/shindig-io.html
![Page 77: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/77.jpg)
Implementing Shindig - Java public ResponseItem<List<Activity>> getActivities(List<String> ids, SecurityToken token) {
Map<String, List<Activity>> allActivities = sqlLayer.getActivities();
List<Activity> activities = new ArrayList<Activity>();
for (String id : ids) { List<Activity> personActivities = allActivities.get(id); if (personActivities != null) { activities.addAll(personActivities); } } return new ResponseItem<List<Activity>>(activities); }
![Page 78: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/78.jpg)
Implementing - Make it a platform• Add UI Elements
o App Galleryo App Canvaso App Inviteso Notification Browser
• Developer Resourceso Developer Consoleo Application Gallery
• Scale it Out!
![Page 79: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/79.jpg)
Implementing - Scale it Out!• Prevent Concurrency issues• Reduce Latency• Add Caching• Add more caching!
![Page 80: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/80.jpg)
Usage Example: Sample Container• Static html sample container• No effort to get up and running• No database or features
![Page 81: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/81.jpg)
Usage Example: Partuza• Partuza is a Example social network site, written in PHP• Allows for local gadget development & testing too• Use as inspiration (or copy) for creating your own social site• http://code.google.com/p/partuza
![Page 82: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/82.jpg)
OpenSocial for intranet, portalsSun Microsystems• Socialsite: Shindig + gadget based UI written in Java• Open Source https://socialsite.dev.java.net/
Upcoming from Impetus• Zest: Shindig + Drupal (PHP)• Zeal: Shindig + Liferay (Java)
![Page 83: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/83.jpg)
OpenSocial for the Enterprise: ExoPlatforms
![Page 84: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/84.jpg)
Summary• Become an OpenSocial Container
o Get Shindig (PHP or Java)o Look at examples & documentationo Implement Serviceso Add UIo Scale it out
• Resources & Links:o http://www.chabotc.com/gdd/
![Page 85: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/85.jpg)
What is Friend Connect?Allows any site to become an OpenSocial container by simply
copying a few snippets of code into your site
http://www.google.com/friendconnect/
![Page 86: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/86.jpg)
![Page 87: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/87.jpg)
![Page 88: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/88.jpg)
![Page 89: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/89.jpg)
![Page 90: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/90.jpg)
![Page 91: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/91.jpg)
![Page 92: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/92.jpg)
![Page 93: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/93.jpg)
![Page 94: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/94.jpg)
![Page 95: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/95.jpg)
![Page 96: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/96.jpg)
Friend Connect gives ...
• Userso ... more ways to do more things with my friends
• Site ownerso ... more (and more engaged) traffic for my site
• App developerso ... more reach for my apps
and ... make it easy
![Page 97: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/97.jpg)
OpenSocial Gadget Contest for Southeast Asia
• To support the developer community and encourage innovation on theOpenSocial platform in Southeast Asia
• Countries: Malaysia, Philippines, Singapore, Thailand, Vietnam• 4 winners per country: Nintendo Wii, Apple iPod Touch prizes• Judging panel: Google, eXo Platform, Friendster, Globant, hi5• Dates:
o Registration opens: Nov 15, 2008o Registration ends: Jan 10, 2009o Winners notified: Jan 23, 2009o Results announced: Feb 6, 2009
• The REAL reward for local developers: winning gadgets to be promoted onOpenSocial partner websites to potentially reach hundreds of millions of Internetusers worldwide
• http://code.google.com/events/apacdevfest/contest
![Page 98: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/98.jpg)
Learn morecode.google.com
![Page 99: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/99.jpg)
![Page 100: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/100.jpg)
Q & A
![Page 101: Google Devfest Singapore - OpenSocial](https://reader033.vdocuments.mx/reader033/viewer/2022061104/5414114e8d7f728a698b47e4/html5/thumbnails/101.jpg)