Webcenter Sites Google Gadget Development Techniques

WEBCENTER SITES GOOGLE GADGET DEVELOPMENT TECHNIQUES JOHN BRUNSWICK

702

•  Common Gadget Use Cases

•  Gadget Capabilities

•  Reference Architecture for Gadgets

•  Sites Server, Gadget Server and Data Sources

•  Live Development of Gadget that Surfaces Backend Data

•  General Developer Tips and Tricks

•  Q&A OUR

JOUR

NEY

•  Understand the WebCenter Sites Gadget capabilities and structure

•  Explain reference architecture to surface information via the WebCenter Sites Gadget from another source system

•  Develop WebCenter Sites Gadgets that connect to backend systems and surface data within WebCenter Sites interface LE

ARN

ING

OB

JECT

IVES

OMG! These Gadgets are

amazing!

USE CASES

•  Reusable Dynamic Application Component

•  Similar to “Portlets” – Client Side, Platform Agnostic

•  SDLC not tied to Content Server lifecycle

•  Resource isolation

•  “Instance configurability”

GADG

ET

USE

CASE

S

CAPABILITIES

GADG

ET IN

A

CTIO

N

GADG

ET IN

PR

EFER

ENCE

S

GADG

ET IN

A

CTIO

N

OPEN SOCIAL?

•  API Capabilities for Social Networking

•  Some advanced APIs like persistence

•  Google Gadgets are a component within the OpenSocial capabilities W

HA

T A

BOUT

OP

EN S

OCIA

L?

ARCHITECTURE

•  Industry Standards

•  HTML

•  Javascript GADG

ET

ARC

HIT

ECTU

RE

GADG

ET

AUT

HEN

TICA

TION

GADG

ET

XM

L DO

CUM

ENT

STRU

CTUR

E

GADG

ET

DESC

RIPT

OR

GADG

ET

BASI

C

GADG

ET

INTE

RMED

IATE

•  Content area will always leverage a CDATA block for type HTML

GADG

ET

FORM

AT

GADG

ET

ASS

ETS

CORE GADGET FUNCTIONALITY

1. Standard HTML header, opening tag and tag. information is optional. Gadgets run in browser quirks mode.

2. Core gadgets JavaScript libraries and any additional libraries specified in the gadget. The server SHOULD consolidate all librariess into a single request to minimize the number of HTTP requests made by the client browser. This MAY be followed by JavaScripte required to initialize the included libraries.

3. Results from parsing the Gadget XML file and processing the sections that match the specified View name.

GADG

ET

PROC

ESS

1

1. A single call to gadgets.util.runOnLoadHandlers().

2. Standard HTML closing tags.

3. Containers must also be able to process Data Pipelining (Section 13) and Templating [OpenSocial­Templating] elements in the gadget XML spec. GA

DGET

PR

OCES

S 2

User Preferences

•  Set by user

•  Save information specific to a given user

Gadget Preferences

•  Set by Developer

•  Information like sizing, start node of a dynamic query of content, etc

•  OpenSocial offers a more extensive persistence API - http://wiki.opensocial.org/index.php?title=The_Persistence_API

PREF

EREN

CE

BASI

CS

Once you have a preference object

prefs.set(‘mypref’, ‘some value’);

or…

prefs.setArray(‘myPrefArray’, [‘Sites’, ’Content’, ‘Portal’]); SETT

ING

PREF

EREN

CES

GETT

ING

PREF

EREN

CES

•  Must include <Require feature=”pubsub”/> in your <ModulePrefs>

PUB

SUB

SITES SERVER GADGET SERVER DATA SOURCES

GADG

ET

DATA

WC Sites Runtime

GADGET JS Library (JQuery,

etc)

J SON

REST Services JDBC

GET / POST

•  Client side JS calls into RESTful services on server

•  Authentication via OAuth2, etc

•  Manually iterate over response object from server

•  JQuery and other JS frameworks provide elegant handling of the call and iteration

GADG

ET

DATA

TOOLS AND TIPS

CROS

S SI

TE

SCRI

PTIN

G

DEVE

LOPM

ENT

TOOL

S

•  Eclipse Plugin Includes Gadget / Social API Harness

•  Run HTTP Server Locally

•  Debug via Chrome Developer Tools

DEVE

LOPM

ENT

RUN

TIM

E TI

PS

LIVE CODE REVIEW & DEMONSTRATION

•  WebCenter Sites Developer’s Guide for Creating Gadgets http://docs.oracle.com/cd/E29495_01/doc.1111/developer_guide_for_creating_gadgets_11gr1.pdf

•  Google Gadgets – Development Fundamentals https://developers.google.com/gadgets/docs/fundamentals

•  Google Gadgets – Creating a User Interface https://developers.google.com/gadgets/docs/ui

•  Google Gadgets – Gadgets XML Reference https://developers.google.com/gadgets/docs/xml_reference

•  OAuth – Getting Started http://oauth.net/

FURT

HER

REA

DIN

G

Session 702 - Webcenter Sites Google Gadget Development Techniques http://www.johnbrunswick.com/2012/10/webcenter-sites-gadget-development-concepts-quickstart/ SO

URCE

DO

WN

LOA

D

Q&A

LET’S CONNECT

@johnbrunswick  

www.johnbrunswick.com  

www.linkedin.com/in/johnbrunswick  

youtube.com/johnbrunswick  

profiles.google.com/johnbrunswick  

WWW