View
7.431
Download
1
Tags:
Embed Size (px)
DESCRIPTION
State of opensocial and how it applies for education.
Citation preview
1
OpenSocial a standard for the social web
Patrick Chanezon [email protected]
Montreal March 19 2009
Colloque MATI - Le Web 2.0 et l'éducation
2
OpenSocial’s goal: Make the web more social
2
Making the web better by making it social
What does social mean?
4
What does “social” mean?
“Eliette, what do you do with your friends?”
5
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
What does “social” mean?
6
“We look at each other”
7
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
What does “social” mean?
8 8
“Talking”
9
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
What does “social” mean?
10 10
“Laughing”
11
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
What does “social” mean?
12 12
“We help each other”
13
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
What does “social” mean?
14 14
“We read together”
15
This work by Eliette Chanezon is licensed under a Creative Commons Attribution-Share Alike 3.0 License
What does “social” mean?
16 16
“We do projects together”
Raoul: a social object for Charlotte (3 year old)
Jaiku’s Jyri Engeström's 5 rules for social networks: 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
How do we socialize objects online
without having to create yet another social network?
21
The social internet
A social website.. • Provides a feature that becomes more engaging as the number of users grows. • Uses relationships between people to present users interesting information.
22
The social internet Some social websites...
23
The social internet A social website.. • Has overhead to manage users and relationships. • Grows slowly because users must sign up to use the site.
What if we remove the overhead? • Developers can focus on providing features, not managing users.
24
The social internet A social network.. • Manages large numbers of users and relationships. • Is slow to add new features.
25
The social internet Many social networks...
26
The social internet How do we add new features to social networks? • Make the social network a platform. • Give creative developers the tools to add the features themselves.
27
The social internet A social application... • Lets the social network manage users and relationships. • Adds new features to the social network. • Lets users “install” the application without signing up for new accounts. • Grows quickly because users are already communicating with each other.
28
The social internet Lots of social apps...
29 29
Need for a social API How do we put apps in social networks?
30
A day in the life of a social app developer
31
A day in the life of a social app developer
32
A day in the life of a social app developer
33
A day in the life of a social app developer
34
A day in the life of a social app developer
35
A day in the life of a social app developer
36
Introduction to OpenSocial Numbers: • 19+ implemented Containers • 40+ committed Containers • 3000+ applications • 400,000,000+ of users
In Thailand:
8 M users
37 Today: 600 Million User Reach
38
OpenSocial “Containers”
39
Where is OpenSocial live today?
• Live to Users: • MySpace • orkut • hi5 • Freebar • Friendster • Webon from Lycos • IDtail • YiQi • Netlog • Hyves • LinkedIn • Ning
Live Developer Sandboxes: • iGoogle • imeem • CityIN • Tianya • Plaxo Pulse • Mail.ru • lokalisten • Viadeo • 51.com – • MyAOL! -
Full List: http://opensocial.org/
40
The OpenSocial APIs
Client-side: • Gadgets XML • Gadgets JavaScript • OpenSocial JavaScript
Server-side: • RESTful protocol • RPC protocol
Versions: • 0.6 - Client-side APIs introduced • 0.7 - Server-side APIs introduced • 0.81 (current) - Server-side APIs finalized
41 41
Gadgets Not widgets, not sprockets, not gidgets, not wadgets
42
Gadgets A gadget spec: • Is an XML file. • Defines metadata about an OpenSocial app. • Is highly cacheable and does not need a high performance server.
Gadgets use existing web standards • XML to define metadata. • HTML for markup. • JavaScript for interactivity. • CSS for presentation.
43
Gadgets A gadget server: • Takes the gadget spec as input. • Performs optimizations on the gadget spec. • Outputs HTML, JavaScript, and CSS as one document.
44
Gadgets
A container: • Displays the social network’s user interface. • Opens an IFrame to the rendered gadget.
Containers and gadget servers are both run by the social network, but do not need to be on the same machine, or even domain.
45
Gadgets Example gadget XML spec: • Uses HTML to print “Hello World”. • Colors the text red with CSS. • Dynamically adjusts the height of the gadget with JavaScript.
<?xml version="1.0" encoding="UTF-8" ?><Module> <ModulePrefs title="Hello World!"> <Require feature="dynamic-height" /> </ModulePrefs> <Content type="html"> <![CDATA[ <h1>Hello World</h1>
<style type="text/css"> h1 { color: #dd0000; } </style> <script type="text/javascript"> gadgets.window.adjustHeight();
</script> ]]> </Content></Module>
46
Gadgets Requesting the gadget XML spec: 1. The client requests an app to be rendered.
47
Gadgets Requesting the gadget XML spec: 1. The client requests an app to be rendered. 2. The container fetches the gadget XML spec from its host.
48
Gadgets Requesting the gadget XML spec: 1. The client requests an app to be rendered. 2. The container fetches the gadget XML spec from its host. 3. The container renders the gadget into HTML, which is displayed to the client.
49
Gadgets Requesting the gadget XML spec: • Because the gadget spec is simple, it can be cached easily. • Caching reduces the load on your server, great when you have millions of users.
50
Gadgets Requesting a cached gadget XML spec: 1. The client requests an app to be rendered. The container already has a copy of the spec stored in its cache.
51
Gadgets Requesting a cached gadget XML spec: 1. The client requests an app to be rendered. The container already has a copy of the spec stored in its cache. 2. The container renders the gadget into HTML, which is displayed to the client.
52
Gadgets What kind of rewriting is done by the gadget server? • Rewrite links to use content proxies. • Rewrite relative links to full paths (some containers). • Return only content for the current view.
53
Gadgets What are views? • Gadgets can render in different locations on a container. • Rendering area changes from small to large. • Certain pages might be public, some are private. • Containers may have different policies depending on the page, especially when the gadget displays ads. • Views provide a way for gadgets to provide different functionality depending on where it is rendered.
54
Gadgets
iGoogle "home" view: • On iGoogle, the "home" view is a small, private page that does not allow ads.
55
Gadgets
55
iGoogle "canvas" view: • Large private view, allows ads.
56
Gadgets Working with views in the gadget XML: • <Content> sections are repeated for each view. • Add a view="view name" attribute to each section. • Content sections may support multiple views, for example view="home,canvas"
<?xml version="1.0" encoding="UTF-8" ?><Module> <ModulePrefs title="Hello World!"> <Require feature="dynamic-height" /> </ModulePrefs> <Content type="html" view="home"> <![CDATA[ ... ]]> </Content> <Content type="html" view="canvas"> <![CDATA[ ... ]]> </Content></Module>
57
Gadgets
JavaScript utility functions for gadgets: • gadgets.io.makeRequest() Make cross-domain AJAX calls to remote servers. • gadgets.json.parse() and gadgets.json.stringify() Native JSON support. • gadgets.util.escapeString() Make text safe for display via innerHTML. • gadgets.util.registerOnLoadHandler() Execute code when the page is finished loading.
58
Gadgets
gadgets.io.makeRequest(): • Make cross-domain AJAX calls to remote servers.
Remote content: • Most interesting gadgets will need to work with content stored on different servers. • AJAX cannot cross domains, so you cannot request content from your own server. • JSONP is only really good for one-way data transfer. • Gadgets with millions of users can overwhelm a remote site.
59
Gadgets Requesting remote content: 1. The rendered app calls gadgets.io.makeRequest() to fetch remote content. This call is sent to the container.
60
Gadgets Requesting remote content: 1. The rendered app calls gadgets.io.makeRequest() to fetch remote content. This call is sent to the container. 2. The container requests content from the specified URL.
61
Gadgets Requesting remote content: 1. The rendered app calls gadgets.io.makeRequest() to fetch remote content. This call is sent to the container. 2. The container requests content from the specified URL. 3. The container returns the response to the application, which renders the data.
62
Gadgets
Add extra features to your gadget: • dynamic-height - Change the size of your gadget in the container. • views - Navigate between different surfaces of the container. • skins - Make your gadget change its styles to match the container. • Containers may offer custom features...
<?xml version="1.0" encoding="UTF-8" ?><Module> <ModulePrefs title="Hello World!"> <Require feature="dynamic-height" /> </ModulePrefs> <Content type="html"> <![CDATA[ ... ]]> </Content></Module>
63
Gadgets
<?xml version="1.0" encoding="UTF-8" ?><Module> <ModulePrefs title="Hello Social!"> <Require feature="opensocial-0.8" /> </ModulePrefs> <Content type="html"> <![CDATA[ ... ]]> </Content></Module>
The OpenSocial JavaScript API is a gadget feature, too!
64 64
The OpenSocial JavaScript API “It's people!”
65
The OpenSocial JavaScript API Representing users: • Client-side, users must work with the VIEWER and the OWNER.
66
The OpenSocial JavaScript API
Multiple personalities: • When you visit your own profile, you are both the VIEWER and the OWNER.
67
The OpenSocial JavaScript API OpenSocial requests: • An OpenSocial DataRequest is created. • Requests are added to the DataRequest. • The DataRequest is sent to the server asynchronously. • When the request finishes, the supplied callback will be called.
function request() { var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest("OWNER"), "get_owner"); req.add(req.newFetchPersonRequest("VIEWER"), "get_viewer"); req.add(req.newFetchActivitiesRequest("VIEWER"), "vactivities"); req.add(req.newFetchPersonAppDataRequest("OWNER", "*"), "odata"); ... req.send(response);};
function response(data) { ... };
gadgets.util.registerOnLoadHandler(request);
68
The OpenSocial JavaScript API OpenSocial responses: • Responses are bundled according to the keys specified in the request. • Check for an error at the global response level. • Check for an error at the specific response level. • Use getData() to retrieve the actual information in a request.
function response(data) { if (data.hadError()) { if (data.get("get_owner").hadError()) { ... } if (data.get("get_viewer").hadError()) { ... } ... } var owner = data.get("get_owner").getData(); var viewer = data.get("get_viewer").getData(); };
69
The OpenSocial JavaScript API Working with people:
• opensocial.Person - JavaScript representation of a user.
70
The OpenSocial JavaScript API Request one person:
req.add(req.newFetchPersonRequest(idspec, opt_params), "key");
• idspec can be either “VIEWER”, “OWNER” or an ID number. • opt_params contains extra request parameters, such as which profile
fields to fetch.
newFetchPersonRequest responses:
var owner = data.get("key").getData(); alert(owner.getDisplayName());
• Data contains a single opensocial.Person object.
• Person objects can contain lots of information, such as addresses, companies, phone numbers, favorite movies, and thumbnail urls.
71
The OpenSocial JavaScript API Methods available on an OpenSocial Person:
• getDisplayName() Gets a text display name for this person; guaranteed to return a useful string. getField(key, opt_params) Gets data for this person that is associated with the specified key. getId() Gets an ID that can be permanently associated with this person. isOwner() Returns true if this person object represents the owner of the current page. isViewer() Returns true if this person object represents the currently logged in user.
72
• ABOUT_MEACTIVITIESADDRESSESAGEBODY_TYPEBOOKSCARSCHILDRENCURRENT_LOCATIONDATE_OF_BIRTHDRINKEREMAILSETHNICITYFASHIONFOODGENDERHAPPIEST_WHENHAS_APPHEROESHUMORIDINTERESTS
• JOB_INTERESTSJOBSLANGUAGES_SPOKEN •
LIVING_ARRANGEMENTLOOKING_FORMOVIESMUSICNAMENETWORK_PRESENCENICKNAMEPETSPHONE_NUMBERSPOLITICAL_VIEWSPROFILE_SONGPROFILE_URLPROFILE_VIDEOQUOTESRELATIONSHIP_STATUSRELIGIONROMANCESCARED_OFSCHOOLS
The OpenSocial JavaScript API An OpenSocial Person's fields:
• SEXUAL_ORIENTATION • SMOKER • SPORTSSTATUSTAGS • THUMBNAIL_URL • TIME_ZONETURN_OFFSTURN_ONSTV_SHOWSURLS
73
The OpenSocial JavaScript API Working with people:
• A Collection represents many opensocial.Person objects.
74
The OpenSocial JavaScript API Request many people:
var idspec = opensocial.newIdSpec({ “userId” : “OWNER”, “groupId” : “FRIENDS” }); req.add(req.newFetchPeopleRequest(idspec, opt_params), "key");
• idspec is an object that can represent groups of people. “userId” can be “VIEWER” or “OWNER” or an ID, and “groupId” can be “SELF”, “FRIENDS”, or the name of a group.
• opt_params contains extra request parameters, such as which profile fields to fetch, and how to order or filter the returned people.
newFetchPersonRequest responses: var owner_friends = data.get("key").getData(); owner_friends.each(function (person) { alert(person.getDisplayName()); });
• Data contains a Collection of opensocial.Person objects. Iterate over these by using the each() method.
75
The OpenSocial JavaScript API Working with data:
• Persistent data gives apps key, value storage directly on the container. • String only, but conversion to JSON allows for storage of complex objects. • Storage per app per user - scales well with growth. • Ideal for settings, customizations.
76
The OpenSocial JavaScript API Set persistent data:
req.add(req.newUpdatePersonAppDataRequest(idspec, key, value));
• idspec can only be “VIEWER”. • key is the name under which this data will be stored. • value is a string representing the data to store.
77
The OpenSocial JavaScript API Fetch persistent data:
var idspec = opensocial.newIdSpec({ "userId" : "OWNER", "groupId" : "SELF" }); req.add(req.newFetchPersonAppDataRequest(idspec, keys), "key"); req.add(req.newFetchPersonRequest("OWNER"), "ownerkey");
• idspec is an object that can represent groups of people, the same as newFetchPeopleRequest.
• keys is a list of persistent data keys to retrieve the data for. • The owner is requested because the data returned is indexed by user ID
and we want the owner’s data.
newFetchPersonAppDataRequest responses:
var app_data = data.get("key").getData(); var value = app_data[owner.getId()][key];
78
The OpenSocial JavaScript API Fetch persistent data:
{ "1234567890" : { "key1" : "value1" }, "2345678901" : { "key1" : "value2" } }
• Data is returned as an object indexed by ID number, then as an object indexed by key name, even if there is only data returned for one user!
{ "1234567890" : { "key1" : "value1" } }
• Multiple people:
{ "1234567890" : { "key1" : "value1", "key2" : "value2" } }
• One person, multiple keys:
79
The OpenSocial JavaScript API Working with activities:
• API to post information about what users are doing with your app. • Many containers have support for images and some HTML. • Channel to grow your application.
orkut MySpace hi5
80
The OpenSocial JavaScript API Post an activity:
function postActivity(text) { var params = {}; params[opensocial.Activity.Field.TITLE] = text; var activity = opensocial.newActivity(params); opensocial.requestCreateActivity(activity, opensocial.CreateActivityPriority.HIGH, callback); };
• Assign the activity text to the TITLE field. • Call opensocial.newActivity() to create a new Activity instance. • Call opensocial.requestCreateActivity() to post the activity to the
container.
81 81
RESTful and RPC protocols Servers talking to servers
82
RESTful and RPC protocols Opens new development models • Background processing. • Easier Flash integration. • Mobile applications.
83
RESTful and RPC protocols Communication methods: • RESTful (Representational State Transfer) • RPC (Remote Procedure Call)
Formats: • XML • JSON • AtomPub
84
RESTful and RPC protocols REST: • Resources are URLs.
/people/{guid}/@all
• All people connected to the given user: Example - People:
/people/{guid}/@friends
• All friends of the given user:
/people/{guid}/@self
• Profile of the given user:
/people/@me/@self
• Profile of the authenticated user:
/people/@supportedFields
• Supported Person fields:
85
RESTful and RPC protocols
• Response format (JSON, XML, AtomPub)
• Request extra fields
• Filtering:
• Paging:
fields={-join|,|field}.
filterBy={fieldname} filterOp={operation}filterValue={value} updatedSince={xsdDateTime} networkDistance={networkDistance}
count={count} sortBy={fieldname} sortOrder={order} startIndex={startIndex}
format={format}
Querystring parameters customize requests:
86
<person xmlns="http://ns.opensocial.org/2008/opensocial"> <id></id> <displayName></displayName> <name> <unstructured>Jane Doe</unstructured> </name> <gender>female</gender></person>
RESTful and RPC protocols REST responses (Person):
{ "id" : "example.org:34KJDCSKJN2HHF0DW20394", "displayName" : "Janey", "name" : {"unstructured" : "Jane Doe"}, "gender" : "female"}
• JSON:
• XML:
87
RESTful and RPC protocols REST responses (Person):
• AtomPub:
<entry xmlns="http://www.w3.org/2005/Atom"> <content type="application/xml"> <person xmlns="http://ns.opensocial.org/2008/opensocial"> <name> <unstructured>Jane Doe</unstructured> </name> <gender>female</gender> </person> </content> <title/> <updated>2003-12-13T18:30:02Z</updated> <author/> <id>urn:guid:example.org:34KJDCSKJN2HHF0DW20394</id></entry>
88
RESTful and RPC protocols REST: • Perform operations using different HTTP methods on each URL.
CRUD: • Create • Retrieve • Update • Delete
HTTP: • POST • GET • PUT • DELETE
89
RESTful and RPC protocols REST has some disadvantages: • Batch support requires multiple HTTP requests, or a contrived URL scheme. • Specifying multiple users via querystring is difficult. Is ?uid=1234,5678 the same resource as ?uid=5678,1234 ?
90
RESTful and RPC protocols RPC: • One endpoint - parameters specify methods to call. • Batch support. • Specify collections of users through passed arguments, not URLs.
POST /rpc HTTP/1.1Host: api.example.orgAuthorization: <Auth token>Content-Type: application/json{ "method" : "people.get", "id" : "myself" "params" : { "userid" : "@me", "groupid" : "@self" }}
Example - Fetch current user: • Request
HTTP/1.x 207 Multi-StatusContent-Type: application/json{ "id" : "myself" "result" : { "id" : "example.org:34KJDCSKJN2HHF0DW20394", "name" : { "unstructured" : "Jane Doe"}, "gender" : "female" }}
• Response
91
RESTful and RPC protocols Authentication: • Both protocols use OAuth to identify users and apps. • Depending on what the application needs to do, it can use two-legged or three-legged OAuth. Two-legged OAuth: • The application authenticates directly with the container. • Perform non-user specific operations:
• Update persistent data for app users. • Can request information for users who have shared their profile
information with the app. Three-legged OAuth: • The user tells the container to give profile access to the application. • Perform user specific operations:
• Post activities. • Fetch friends of the current user.
92
RESTful and RPC protocols Client libraries are being created for PHP, Java, and Python. • Help you connect to OpenSocial containers, and work with social data on your server.
Sample: log into a container:
93
RESTful and RPC protocols
93
RESTful and RPC use OAuth for authentication • OAuth is an open standard. • Client libraries will help make this process easier for developers.
Sample: use OAuth to get an access token for a user:
94
RESTful and RPC protocols • Once OAuth is used, you can store a user token for later access.
Sample: use an existing token:
95
RESTful and RPC protocols • Once authentication has happened, requests are easy:
Sample: Fetch the current user:
96
RESTful and RPC protocols
Sample: Fetch the current user’s friends:
97 97
Development Models How OpenSocial apps are built
98 98
OpenSocial Tools What sets us apart from the animals
99
Shindig Writing a gadget server is difficult: • Fast changing API - hard to keep up. • Standardization is hard to get right. • Costs ¥ / 元 !
100
Shindig Apache Shindig to the rescue! • Open Source project. • Available in Java and PHP. • Run by itself and connect to an existing social site to add OpenSocial support. • Goal: Launch a new (simple) container in under an hour’s worth of work
http://incubator.apache.org/shindig/
101
OpenSocial Dev App Development tool to test out JS code in different containers
http://osda.appspot.com
102 102
Upcoming Features Caja and Templates
103
Caja When JavaScript goes bad • Gadgets can be a new vector for phishing, spam, malware.Social spread of gadgets can spread bad gadgets too.Caja reduces threats with a JavaScript sanitizer as an additional "sandbox" on top of iFrame protection.
104
Caja
• A capability-based Javascript sanitizer.An Open Source project from Google.Optional but recommended for OpenSocial containers.Will eventually be secure enough to run gadgets inline instead of in iframes.
Caja is:
http://code.google.com/p/google-caja/
105
Templates Need for a templating language: • Developers need a simple way to convert OpenSocial data to HTML. • DOM manipulation is slow and ugly. • innerHTML is unsafe.
106
Templates
http://ostemplates-demo.appspot.com/
<script type="text/javascript" src="http://ostemplates-demo.appspot.com/ostemplates.js"></script> <script type="text/os-template"> <b>${owner.displayName}'s friends</b> <ul> <li repeat="friends">${displayName}</li> </ul> </script> <script type="text/javascript"> function loadData() { var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest('OWNER'), 'owner'); var idSpecFriends = opensocial.newIdSpec( {'userId':'OWNER', 'groupId':'FRIENDS'}); req.add(req.newFetchPeopleRequest(idSpecFriends), 'friends'); req.send(function(data) { os.Container.processDocument(data); }); } gadgets.util.registerOnLoadHandler(loadData); </script>
107
Templates
http://ostemplates-devapp.appspot.com/
Templates developer application available:
108 108
The OpenSocial specification process “We can fix it, we have the technology”
109
The OpenSocial specification process
http://opensocial.org/
A social Network for the OpenSocial developer community
110
The OpenSocial specification process
111
The OpenSocial specification process
112
The OpenSocial specification process
113
The OpenSocial specification process
Container Specific Extensions MySpace
• photo albums • videos
hi5
• status • presence
• photo albums Netlog
• credits api extension • translation tool for free
Imeem • music metadata api
115 115
Challenges Nobody said this was going to be easy
116
Challenges
This lumberjack will thank anyone who
helps solve the following problems...
David Glazer, Director of Engineering, Google OpenSocial Foundation board member
117
Challenges Cross container development is still tricky: • Containers may not follow the standard. • Containers may follow the standard but have different policies. • Follow best practices: http://tinyurl.com/4nuzll
118
Challenges No central directory • Hard for apps to spread to many containers. • Apps need to work with different install processes. • Directory approval requirements vary from container to container.
119
Challenges Scaling is hard: • Easy to start and get some users.
120
Challenges Scaling is hard: • Being popular on one social network can push your server to the limit...
121 121
Scaling is hard: • ...being popular on many networks will push you right over.
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 peak o Means dealing with lots of scalability issues! o DB Sharding, memcache pools, server farms..
• Why not use a cloud service like: o Google App Engine o Joyent.com o Amazon EC2
123 123
OpenSocial Apps Monetization
OpenSocial Monetization • Ads from Ad Networks
o AdSense, RightMedia o BuddyPoke, Rate My Friend
• Brand/Private Label App o Sony Ericsson MTV Roadies app on orkut
• Sell virtual or real goods • Free -> Freemium • Referrals
Technology • Virtual currency platforms: socialgold • New opensocial payment api proposal
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
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
127 127
Shindig
Becoming an OpenSocial Container
• Question: o How do you become an OpenSocial container?
• Answer: o The Apache incubator project “Shindig” serves this
purpose!
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 apps in under an hour's worth of work"
Introduction to Shindig Architecture • Gadget Server • Social Data Server • Gadget Container JavaScript
Gadget Server
Social Server
Social Server - RESTful API • Preview available on
o iGoogle o Orkut o Hi5
• New development models o Server to server & Mobile!
• Try it out: curl http://localhost:8080/social/rest/people/john.doe/@all
Shindig Server Side (Java) Architecture
Shindig Client Side Libraries
Opensocial – JS Library
Implementing Shindig - Data sources • Integrate with your own data sources
o People Service o Activities Service o App Data Service
class MyPeopleService implements PeopleService { ... }
class MyAppDataService implements AppDataService { ... }
class MyActivitiesService implements ActivitiesService { ... }
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; }
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
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); }
Implementing - Make it a platform • Add UI Elements
o App Gallery o App Canvas o App Invites o Notification Browser
• Developer Resources o Developer Console o Application Gallery
• Scale it Out!
Implementing - Scale it Out! • Prevent Concurrency issues • Reduce Latency • Add Caching • Add more caching!
Usage Example: Sample Container • Static html sample container • No effort to get up and running • No database or features
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
OpenSocial for intranet, portals Sun 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)
OpenSocial for the Enterprise: Exo Platforms
Summary • Become an OpenSocial Container
o Get Shindig (PHP or Java) o Look at examples & documentation o Implement Services o Add UI o Scale it out
• Resources & Links: o http://www.chabotc.com/gdd/
148 148
Google Friend Connect
What is Friend Connect? Google Friend Connect lets a site owner instantly awaken and
strengthen the community that visits their web site…
…and it’s very easy to use. simply copying a few snippets of code into your site
http://www.google.com/friendconnect/
Friend Connect gives ...
• Users o ... more ways to do more things with my friends
• Site owners o ... more (and more engaged) traffic for my site
• App developers o ... more reach for my apps
and ... make it easy
Friend Connect is a hub Social Networks can plug one or more of the following into it
• Login • Profile • Friends List • Activities
Users can leverage all their existing online social ressources: openid logins, friend’s graphs, activity stream sinks
Friend Connect APIs...for all tastes
• Non developers • Source a script to add OpenSocial
gadgets on the page • Client side developers
• JS API (like Maps & Search): use OpenSocial directly in the page
• Server side developers • REST API
154 154
Conclusion
Open Stack
Conclusion • OpenSocial is mature and successful • An open stack is emerging on the server:
oauth, openid, portable contacts • 2009 will be the year of the activity stream:
• Twitter’s rise • Facebook redesign • Friendfeed is the best in that category
today • ActivityStream workgroup to standardize the
pipes
157 157
Resources
158
Resources
• OpenSocial Tutorial: http://rurl.org/ss3
• OpenSocial Spec, Foundation, Reference: http://opensocial.org
• Caja: http://code.google.com/p/google-caja/
• Shindig: http://incubator.apache.org/shindig/
• My opensocial links: http://delicious.com/chanezon/opensocial
• OpenSocial Templates: http://ostemplates-demo.appspot.com/
• OpenSocial Dev App: http://osda.appspot.com
• Partuza: http://partuza.nl
• OpenSocial Specification Proposals: http://groups.google.com/group/opensocial-and-gadgets-spec/topics
158
159
Learn more
code.google.com