Shindig for Blogs and Wikis

72
ApacheCon EU 2009 Shindig for Blogs & Wikis Dave Johnson Thursday, March 26, 2009

description

ApacheCon EU 2009 presentation on using Shindig to add social features to blogs, wikis and other web applications

Transcript of Shindig for Blogs and Wikis

Page 1: Shindig for Blogs and Wikis

ApacheCon EU 2009

Shindig for Blogs & WikisDave Johnson

Thursday, March 26, 2009

Page 2: Shindig for Blogs and Wikis

ApacheCon EU 2009

Agenda

• Social networking as a platform

• What OpenSocial is and what it provides

• Options for social blogs & wikis

• What Shindig is and what it provides

• Integrating Shindig into your blog or wiki

• Social blogs & wikis with Project SocialSite

ApacheCon EU 2009Thursday, March 26, 2009

Page 3: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social networking as a platform

ApacheCon EU 2009

Thursday, March 26, 2009

Page 4: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Thursday, March 26, 2009

Page 5: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Thursday, March 26, 2009

Page 6: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs

Thursday, March 26, 2009

Page 7: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs

LiveJournal

blogger.com

WordpressJSPWiki

Thursday, March 26, 2009

Page 8: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs AtomPubRSS 0.9 RSS 1.0 RSS 2.0

LiveJournal

blogger.com

WordpressJSPWiki

Thursday, March 26, 2009

Page 9: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs

Friendster MySpace Facebook

AtomPubRSS 0.9 RSS 1.0 RSS 2.0

LiveJournal

blogger.com

WordpressJSPWiki

Thursday, March 26, 2009

Page 10: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs

Friendster MySpace Facebook

Flickr

del.icio.us

twitterdopplr

AtomPubRSS 0.9 RSS 1.0 RSS 2.0

LiveJournal

blogger.com

WordpressJSPWiki

Thursday, March 26, 2009

Page 11: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs

Friendster MySpace Facebook

Flickr

del.icio.us

twitterdopplr

AtomPubRSS 0.9 RSS 1.0 RSS 2.0

LiveJournal

blogger.com

WordpressJSPWiki

Thursday, March 26, 2009

Page 12: Shindig for Blogs and Wikis

ApacheCon EU 2009

The social web

1995 1997 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008

Wikis Blogs

Friendster MySpace Facebook

Flickr

del.icio.us

twitterdopplr

Yoursite!

AtomPubRSS 0.9 RSS 1.0 RSS 2.0

LiveJournal

blogger.com

WordpressJSPWiki

Thursday, March 26, 2009

Page 13: Shindig for Blogs and Wikis

ApacheCon EU 2009

What is a Platform?

There are two interesting dictionary definitions: "a raised horizontal surface of wood, stone or metal" or "a statement of principals and policies, especially of a political party." I think both definitions contain elements of what makes something a platform.

- Dave Winer

Thursday, March 26, 2009

Page 14: Shindig for Blogs and Wikis

ApacheCon EU 2009

What’s in a social networking platform?

Thursday, March 26, 2009

Page 15: Shindig for Blogs and Wikis

ApacheCon EU 2009

Authentication

Social Network platform provides...

Thursday, March 26, 2009

Page 16: Shindig for Blogs and Wikis

ApacheCon EU 2009

Authorization

Social Network platform provides...

Thursday, March 26, 2009

Page 17: Shindig for Blogs and Wikis

ApacheCon EU 2009

Profiles

Social Network platform provides...

Thursday, March 26, 2009

Page 18: Shindig for Blogs and Wikis

ApacheCon EU 2009

Relationships

Social Network platform provides...

Thursday, March 26, 2009

Page 19: Shindig for Blogs and Wikis

ApacheCon EU 2009

Activities

Social Network platform provides...

Thursday, March 26, 2009

Page 20: Shindig for Blogs and Wikis

ApacheCon EU 2009

Shared applications

Social Network platform provides...

Thursday, March 26, 2009

Page 21: Shindig for Blogs and Wikis

ApacheCon EU 2009

is ...

Thursday, March 26, 2009

Page 22: Shindig for Blogs and Wikis

ApacheCon EU 2009

A “Standard” set of Social Network APIs

OpenSocial is...

Thursday, March 26, 2009

Page 23: Shindig for Blogs and Wikis

ApacheCon EU 2009

Write once, test everywhere for

social applications

OpenSocial is...

Thursday, March 26, 2009

Page 24: Shindig for Blogs and Wikis

ApacheCon EU 2009

Supported by (just about) everybody

but Facebook

OpenSocial is...

Thursday, March 26, 2009

Page 25: Shindig for Blogs and Wikis

ApacheCon EU 2009

OpenSocial defines...

Thursday, March 26, 2009

Page 26: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social Networking platform APIs

• Authentication

• Authorization

• Profiles

• Relationships

• Activities

• Shared applications

OpenSocial defines...

Thursday, March 26, 2009

Page 27: Shindig for Blogs and Wikis

ApacheCon EU 2009

APIs in several forms

• JavaScript API

• For Gadgets with I/O, authentication, batching, etc.

• JSON-RPC API

• For Gadget-to-Server communication

• REST API

• For Server-to-Server communication

• Template Language

• For use in Gadgets

OpenSocial defines...

Thursday, March 26, 2009

Page 28: Shindig for Blogs and Wikis

ApacheCon EU 2009

OpenSocial capabilities

• On behalf of an authenticated user:

• Retrieve detailed profile information

• Retrieve lists of friends

• Retrieve lists of groups

• CRUD on Activities

• CRUD on App Data

Thursday, March 26, 2009

Page 29: Shindig for Blogs and Wikis

ApacheCon EU 2009

JavaScript Container (sits in a web page)

Google Gadgets API & extensions

co

re

co

re.io

vie

ws

tab

s

op

en

so

cia

l ...

YourGadget

A JavaScript API for Gadgets

A gadget is defined by XML file that with:- metadata- HTML/CSS- JavaScript

OpenSocial defines...

Thursday, March 26, 2009

Page 30: Shindig for Blogs and Wikis

ApacheCon EU 2009

A JSON-RPC API for Gadget-to-Server calls

OpenSocial defines...

JavaScript Container (sits in a web page)

Google Gadgets API & extensions

co

re

co

re.io

vie

ws

tab

s

op

en

so

cia

l

YourGadget

Social Network Service

JSON-RPC end-point

People

Activities

App Data

Thursday, March 26, 2009

Page 31: Shindig for Blogs and Wikis

ApacheCon EU 2009

REST API for Server-to-Server calls

OpenSocial defines...

OpenSocial REST API- Based in AtomPub- With XML and JSON- OAuth authentication- No batch support (yet)

JavaScript Container (sits in a web page)

Google Gadgets API & extensions

core

core

.io

vie

ws

tabs

opensocia

l

YourGadget

Social Network Service

JSON-RPC end-point

People

Activities

App Data

Proxy

REST end-point

Your

Server

Your REST end-point

Thursday, March 26, 2009

Page 32: Shindig for Blogs and Wikis

ApacheCon EU 2009

Example Gadget codeHello World

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

<Module>

<ModulePrefs title="Hello World!">

<Require feature="opensocial-0.8" />

</ModulePrefs>

<Content type="html">

<![CDATA[

Hello, world!

]]>

</Content>

</Module>

Thursday, March 26, 2009

Page 33: Shindig for Blogs and Wikis

ApacheCon EU 2009

Example Gadget codeFriends 1/2

<?xml version="1.0" encoding="UTF-8" ?><Module> <ModulePrefs title="List Friends Example"> <Require feature="opensocial-0.8"/> </ModulePrefs> <Content type="html"> <![CDATA[ <script type="text/javascript"> function request() { var idspec = opensocial.newIdSpec({ "userId" : "OWNER", "groupId" : "FRIENDS" }); var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest( opensocial.IdSpec.PersonId.OWNER), "get_owner"); req.add(req.newFetchPeopleRequest(idspec), "get_friends"); req.send(response); };

Thursday, March 26, 2009

Page 34: Shindig for Blogs and Wikis

ApacheCon EU 2009

Example Gadget codeFriends 2/2

function response(dataResponse) { var owner = dataResponse.get('get_owner').getData(); var friends = dataResponse.get('get_friends').getData(); var html = 'Friends of ' + owner.getDisplayName(); html += ':<br><ul>'; friends.each(function(person) { html += '<li>'+person.getDisplayName()+'</li>'; }); html += '</ul>'; document.getElementById('message').innerHTML = html; }; gadgets.util.registerOnLoadHandler(request); </script> <div id="message"></div> ]]> </Content></Module>

Thursday, March 26, 2009

Page 35: Shindig for Blogs and Wikis

ApacheCon EU 2009

Example REST API code (1/2)posting an activity with OpenSocial

// gather information needed for calldef userId = "roller";def restUri = "http://example.com/social/social/rest"; def consumerKey = "f8794f974bd03644f60f59d8fbe44a5f";def consumerSecret = "4b31a601-9299-4709-9faa-c5134d278a87";

def reqUri = "http://example.com/social/oauth/requestToken";def authzUri = "http://example.com/social/oauth/authorize";def accessUri = "http://example.com/social/oauth/accessToken";

// use OAuth capable REST client (I wrote my own)def strategy = new OAuthStrategy(userId, consumerKey, consumerSecret, reqUri, authzUri, accessUri);

def rest = new RestClientImpl(strategy);

Thursday, March 26, 2009

Page 36: Shindig for Blogs and Wikis

ApacheCon EU 2009

Example REST API code (2/2)posting an activity with OpenSocial

// create OpenSocial Activity in JSON formJSONObject activityData = new JSONObject();activityData.put("title", "This is an activity title");activityData.put("body", "This is an activity body");

// fetch XRDS file by calling restUri with header:// “Accepts: application/xrds+xml"// use that to figure the Activity collection URI

// post activity to Activity collection URIresponse = rest.post("${restUri}/activities/${userId}/@self", null, null, activityData.toString(), "application/json");

Thursday, March 26, 2009

Page 37: Shindig for Blogs and Wikis

ApacheCon EU 2009

Options for social blogs and wikis

Thursday, March 26, 2009

Page 38: Shindig for Blogs and Wikis

ApacheCon EU 2009

Use a social software suite or a service

Thursday, March 26, 2009

Page 39: Shindig for Blogs and Wikis

ApacheCon EU 2009

Hook into an existing social network

Thursday, March 26, 2009

Page 40: Shindig for Blogs and Wikis

ApacheCon EU 2009

Thursday, March 26, 2009

Page 41: Shindig for Blogs and Wikis

ApacheCon EU 2009

There are other options...

Thursday, March 26, 2009

Page 42: Shindig for Blogs and Wikis

ApacheCon EU 2009

Apache Shindig* is...

* incubating

Thursday, March 26, 2009

Page 43: Shindig for Blogs and Wikis

ApacheCon EU 2009

Reference Implementation of

OpenSocial

Thursday, March 26, 2009

Page 44: Shindig for Blogs and Wikis

ApacheCon EU 2009

Open Source! and in the

Thursday, March 26, 2009

Page 45: Shindig for Blogs and Wikis

ApacheCon EU 2009

Active and growing! Thursday, March 26, 2009

Page 46: Shindig for Blogs and Wikis

ApacheCon EU 2009

In productionThursday, March 26, 2009

Page 47: Shindig for Blogs and Wikis

ApacheCon EU 2009

Apache Shindig* provides...

* incubating

Thursday, March 26, 2009

Page 48: Shindig for Blogs and Wikis

ApacheCon EU 2009

Google Gadgets server with all Features

*in Java and PHP

Thursday, March 26, 2009

Page 49: Shindig for Blogs and Wikis

ApacheCon EU 2009

OpenSocial JavaScript container

implementation

* in JavaScript. Duh!

Thursday, March 26, 2009

Page 50: Shindig for Blogs and Wikis

ApacheCon EU 2009

OpenSocial data server implementation

with stub interfaces

*in Java and PHP

Thursday, March 26, 2009

Page 51: Shindig for Blogs and Wikis

ApacheCon EU 2009

Shindig is not a complete solution

Thursday, March 26, 2009

Page 52: Shindig for Blogs and Wikis

ApacheCon EU 2009

Who provides what

Your Web Application

JSON-RPC end-point

People interface

Activities interface

App Data interface

Proxy

REST end-point

GadgetsGadget

Renderer

Activities

Table

People

Table

App Data

Table

Profile

Pages

Group

PagesHome

Pages

User Interface

Persistence

Your application provides

Shindig provides

Thursday, March 26, 2009

Page 53: Shindig for Blogs and Wikis

ApacheCon EU 2009

Integrating Shindig into your blog or wiki

Thursday, March 26, 2009

Page 54: Shindig for Blogs and Wikis

ApacheCon EU 2009

Why integrate Shindig?

• You want social features like

• Profile Pages

• Friending

• Activities

• And / or you want Gadgets

Thursday, March 26, 2009

Page 55: Shindig for Blogs and Wikis

ApacheCon EU 2009

But... adding social features not so easy

Thursday, March 26, 2009

Page 56: Shindig for Blogs and Wikis

ApacheCon EU 2009

How to integrate

• Easy

• Add Shindig Servlets & Filters

• Implement security token

• Add Shindig Container to pages

• Not so easy

• Add user interface for friending, groups, etc.

• Add social data to your application

Thursday, March 26, 2009

Page 57: Shindig for Blogs and Wikis

ApacheCon EU 2009

There’s a better way...

Thursday, March 26, 2009

Page 58: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social blogs & wikis with Project SocialSite

Thursday, March 26, 2009

Page 59: Shindig for Blogs and Wikis

ApacheCon EU 2009

SocialSite is...

Thursday, March 26, 2009

Page 60: Shindig for Blogs and Wikis

ApacheCon EU 2009

SocialSite is...• A centralized Social Graph Server

• Persistent Social Graph

• Headless except for Admin Console

• Web services

• Full support for all OpenSocial APIs

• Extensions for comprehensive Social Graph access

• A set of Gadgets

• Complete Social Networking UI in OpenSocial Gadget form

• Profile, Profile Editor, Groups, Friends, Dashboard and more

Thursday, March 26, 2009

Page 61: Shindig for Blogs and Wikis

ApacheCon EU 2009

SocialSite architectureSocialSite ServerYour Web Application

SocialSite Profile Widget

SocialSite Gadgetizer

SocialSite Friends Widget

SocialSite Face Widget

Gadget #1Gadget #1

OpenSocial /SocialSiteREST API

OpenSocial /SocialSiteJSON-RPC API

SocialSite Admin Console

Persistent

Social Graph

Proxy

Your application'sREST API

Thursday, March 26, 2009

Page 62: Shindig for Blogs and Wikis

ApacheCon EU 2009

Authentication DelegationGadget in a

social-enabled Web application

AuthenticationDelegate at

example.com

SocialSite Server

Gadget requests social data, passes assertions of page owner and page viewer

SocialSite asks for confirmation of assertions

Delegate confirms assertions

SocialSite returns data requested

Assertions sent in JSON format

<rules>

<rule>

<sources>

<direct>

http://example.com/ss.jsp

</direct>

</sources>

<assertions>

<accept>*</accept>

</assertions>

</rule>

</rules>

Server checks list of trustedAuthenticationDelegates

{

'timeout': 30,

'assertions': {

'containerId':

'rollerweblogger.org',

'viewer': 'otto',

'owner': 'otto',

}

}

Thursday, March 26, 2009

Page 63: Shindig for Blogs and Wikis

ApacheCon EU 2009

How to use SocialSite

• Install SocialSite server on Tomcat, Glassfish, etc.

• Create Authentication Delegate page

• Configure Authentication Delegate page

• Add SocialSite Context and Gadgets to the pages of your web application

• Create Gadgets to interact with your application

Thursday, March 26, 2009

Page 64: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social Roller & JSP Wiki

Thursday, March 26, 2009

Page 65: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social Blogs & Wikis

• Social Dashboard in Blog server

• Personal Profile pages within Blog server

• Group Profile pages within Wiki server

• Posting of activities for blog posts

For more details and screenshots: http://rollerweblogger.org/roller/entry/socialsite_on_rollerwebloggerorg

Thursday, March 26, 2009

Page 66: Shindig for Blogs and Wikis

ApacheCon EU 2009

Demo...

• Steps to setup SocialSite and include Gadgets in pages of a Roller blog

Thursday, March 26, 2009

Page 67: Shindig for Blogs and Wikis

ApacheCon EU 2009

Demo...

• Social features in Roller

• Dashboard with friending, messages, etc.

• Profile page with variety of gadgets

• Social features in JSPWiki

• Group profile page

Thursday, March 26, 2009

Page 68: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social Roller: an Open Social Application

• An example OpenSocial Application

• Can be installed into a Profile in Roller

• Posts an Activity for each blog you post

• Uses OAuth for all authentication

For more details and source code:http://rollerweblogger.org/roller/entry/oauth_everywherehttp://rollerweblogger.org/roller/entry/oauth_everywhere_continued

Thursday, March 26, 2009

Page 69: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social Roller’s two parts

• An Open Social Gadget that allows you to authorize the App to post to your Profile

• A Roller Task that uses the OpenSocial REST API to post activities

Thursday, March 26, 2009

Page 70: Shindig for Blogs and Wikis

ApacheCon EU 2009

Social Roller & OAuth

Thursday, March 26, 2009

Page 71: Shindig for Blogs and Wikis

ApacheCon EU 2009

Demo...

• Social features in Roller

• Social features in JSPWiki

Thursday, March 26, 2009

Page 72: Shindig for Blogs and Wikis

ApacheCon EU 2009

Summary

• The web is going social

• OpenSocial provides a standard API

• Options for blogs and wikis, easiest to hardest

• Friend Connect

• SocialSite

• Shindig

Thursday, March 26, 2009