developing sleek and collaborative applications with opensocial and ajax push

Developing Sleek andCollaborative Applications withOpenSocial and AJAX Push.

S304285

Ted Goddard, Ph.D.Senior Software Architect, ICEsoft

Chris SchalkDeveloper Advocate, Google

22009 CommunityOne Conference: EAST | developers.sun.com/events/communityone

Learn the fundamentals ofOpenSocial and Ajax Push. Put itinto practice with the OpenSocialJava API and ICEfaces.


Agenda

IntroductionOpenSocial OverviewOpenSocial Protocols and APIsOpenSocial REST DemoAjax Push for Social ApplicationsAjax PushICEfaces OpenSocial DemoAjax Push Application DevelopmentConclusion


Why AJAX Push and Collaboration makes Sensecollaboration = social + push

Collaboration requires communication

Communication requires real-time updates

Communication flows through a social network

Ajax Push is the key to communication on the web


Agenda



What is OpenSocial?

“OpenSocial defines a common set of APIs based on Open Standardsfor building social applications across multiple websites”


What is OpenSocial?

Before OpenSocial…


What is OpenSocial?

Standards Based


What is OpenSocial?

Learn once… Write everywhere


Who owns OpenSocial?

OpenSocial is managed under the auspices of the“OpenSocial Foundation” - http://www.opensocial.org

No!?


Who’s Using it?


Now has over 800 Million users


Agenda



OpenSocial REST Support

As of V0.8 OpenSocial supports REST protocols

Opens new development models

• Server-to-server communication

• Multiple client types

• Server based UIs (JSP/JSF)

• Mobile devices


RESTful Protocol• 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:


• 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}

RPC Protocol• Http POST instead of GET


OpenSocial Client Libraries

17

http://code.google.com/p/opensocial-php-client http://code.google.com/p/opensocial-ruby-clienthttp://code.google.com/p/opensocial-python-clienthttp://code.google.com/p/opensocial-java-client

A set of client libraries that enabledirect communication to an OpenSocialserver.

• Client libraries exist for PHP, Ruby, Python and Java• Supports both REST and RPC protocols• Documentation Wiki pages• Sample applications provided


Sample: Fetching a user’s friends from Shindig

OpenSocialClient c = new OpenSocialClient("myhost.com");

c.setProperty(OpenSocialClient.Properties.REST_BASE_URI, "http://localhost:8080/social/rest/"); try { OpenSocialPerson p = c.fetchPerson("john.doe"); System.out.println(p.getDisplayName());

Collection<OpenSocialPerson> friends = c.fetchFriends("john.doe"); for (OpenSocialPerson friend : friends) { System.out.println(friend.getDisplayName()); }

} catch (Exception e) {

}


Agenda



OpenSocialServer-side REST accessdemonstrations


OpenSocial Facts

Originally a Google led initiative

Launched in November 2007

Serves as a set of standard APIs for build social applications

Is managed through OpenSocial.org

Current version is 0.9.

OpenSocial APIs center on 3 core areas:People, Activities, Data

Initially only resided in gadgets only

As of 0.8, RESTful APIs have been availableEnables server/desktop/mobile integrations

Over 800 million users of OpenSocial technology worldwide


Social SecurityMind what you share.

Build applications with UI security, such as with JSF• Output is escaped, avoiding cross-site scripting• Input processed by components, avoiding network attacks• Input processed by ORM, avoiding SQL injection

User data and Social model have privacy concerns

OAuth Consumer Secret and Consumer Key forauthentication


Agenda



Ajax Push for Social Applicationscollaboration = social + push

Real-time updates offer many possibilities

Friend statusPolls, surveys, voting, questions and answersCollaborative top-10 listCurrent mp3, browser URL (security risk?)AuctionsGamesFlash mobs (or just meet for coffee/lunch)And, of course, chat applications


Social Networking in the EnterpriseA valuable new form of collaboration.

duke: love the new pic lolhalf a minute ago from web · Reply · View Tweet


Social Networking in the EnterpriseA valuable new form of collaboration. Seriously.

In-house deployed system avoids distractionsWorkplace formality improves communicationSocial Application informality eases communication

Uses:• Task completion updates• Requests for information• Bug report updates, automated build/test completion• Collaborative meeting tools• Org-chart structured communications, call setup• Multi-step business processes


Agenda


282009 CommunityOne Conference: EAST | developers.sun.com/events/communityone 28

Server-mediated CollaborationThe full realization of Ajax.

Server

Chris Ted

UserAction Push


Server-initiated UpdatesStocks, sensors, and status.

Server

Chris Ted

External Application

Push Push


Ajax Push (Long Polling)HTTP message flow inversion.

GET /auctionMonitor/block/receive-updates?icefacesID=1209765435HTTP/1.1Accept: */*Cookie: JSESSIONID=75CF2BF3E03F0F9C6D2E8EFE1A6884F4Connection: keep-aliveHost: vorlon.ice:18080

HTTP/1.1 200 OKContent-Type: text/xml;charset=UTF-8Content-Length: 180Date: Thu, 27 Apr 2009 16:45:25 GMTServer: GlassFish/v3

<updates> <update address="_id0:_id5:0:chatText"> <span id="_id0:_id5:0:chatText">Howdy</span> </update></updates>

Chat message “Howdy”


Ajax Push ServerOne connection is all you need.

ICEfacesApplication

Ajax PushServer

ApplicationServer

Asy

nchr

onou

s C

onne

ctio

ns

ICEfacesApplicationJMS

http:// host / ajaxpush /


Agenda



ICEfaces OpenSocialOpenSocial Activities with Ajax Push


Agenda



JavaServer Faces for AjaxA language for Developers and Designers

public class PageBean { String message;

public String getMessage() { return message; }

public void setMessage(String message) { this.message = message; }

}

<f:view xmlns:f=“http://java.sun.com/jsf/core” xmlns:h=“http://java.sun.com/jsf/html” >

<html> <body> <h:form> <h:inputText value=“#{pageBean.message}” /> </h:form> </body> </html>

</f:view>

PageBean.java Page.xhtml


Render-based PushAjax Push in two lines of code with ICEfaces.

To keep track of groups of users:

SessionRenderer.addCurrentSession(personName);

Asynchronously and elsewhere in the application ...

socialClient.createActivity(title, body);SessionRenderer.render(“javaone”);

The JSF lifecycle runs, updating each user’s page from thecomponent tree and current model state.


Socializing Ajax PushImplementing Push on top of OpenSocial.

OpenSocial is a RESTful protocol• Push is not built-in• OpenSocial servers do not provide notification

Add Ajax Push to your web application front-end• This technique used in the demo

Implement notification in an activity handler

Define blocking semantics for OpenSocial REST?


ActivityBean.java (Initialization)

OpenSocialProvider shindig;OpenSocialClient socialClient;

private void init() {

SessionRenderer.addCurrentSession(personName);

socialClient = new OpenSocialClient(shindig);

socialClient.setProperty( OpenSocialClient.Property.TOKEN, “owner:” + personName + “:appid:domain:apprul:module:container” );

}

Java


ActivityBean.java (Input)

public String activate() {

socialClient.createActivity(newTitle, newBody);

SessionRenderer.render(personName);

return "success";

}

<ice:form >

<ice:inputText value="#{activityBean.newTitle}" /> <ice:inputText value="#{activityBean.newBody}" /> <ice:commandButton value="Post” action="#{activityBean.activate}" />

</ice:form>

Java

XHTML


ActivityBean.java (Output)

public ArrayList getActivityList() {

return socialClient. fetchActivitiesForPerson( personName );

}

<ice:dataTable value="#{activityBean.activityList}" var="activity” >

<ice:column> <ice:outputText value="#{activity.title}"/> </ice:column>

<ice:column> <ice:outputText value="#{activity.body}"/> </ice:column>

</ice:dataTable>

Java

XHTML


Agenda



Summary

OpenSocial provides standard protocols and APIs forbuilding social networking applicationsSocial Applications can benefit the enterpriseJavaServer Faces is the standard for Java webapplicationsAjax Push makes social applications interactiveICEfaces is the easy way to add Ajax Push


For More Information

Social-Enable Your Web Apps with OpenSocial @ 4:00

Adding Ajax Push (Lightning Talk)

Tips and Tricks for Ajax Push and Comet ApplicationsTue @ 3:20

Scaling the Asynchronous Web Tue @ 8:30

Creating Server-Side and Mobile Mashups withOpenSocial's Java Client Libraries: Tue @ 6:00

Developing Sleek andCollaborative Applications withOpenSocial and AJAX Push.S304285

Ted Goddard, Ph.D.Senior Software Architect, ICEsoft

Chris SchalkDeveloper Advocate, Google

developing sleek and collaborative applications with opensocial and ajax push

Technology

social networkajax push

opensocial apis center

social applicationsis

client http

example people

given user

users friends

authenticated user