From Ajax Patterns

Contents 1 Background 2 Principles for OpenSocial Application Development 3 Patterns for OpenSocial Application Development 3.1 Gadget UI Structure 3.2 Gadget UI Elements 3.3 Gadget-To-Gadget Communication 3.4 Gadget-To-Server Communication 3.5 Gadget Preferences 3.6 Packaging and Distribution 3.7 Social Interaction 3.8 Development Process 4 Beyond scope - OpenSocial platform implementation patterns

Background

These patterns are under Construction. They are in Preparation for Tools Europe 2008 conference. Michael Mahemoff will be covering these patterns in a keynote presentation for the general conference and in more detail at a keynote presentation at the Web 2.0 patterns workshop.

Principles for OpenSocial Application Development

• Meta-Principle: Sovereign Posture
• Consistency
• Customisable
• Up-To-Date
• Easily Distributed

Patterns for OpenSocial Application Development

Gadget UI Structure

• Multiple Tabs Use multiple tabs to offer multiple features in a single space.
• Accordion Use an accordion structure to offer multiple features in a single space.
• Popup Window Launch new pages in a popup window, so that the container retains sovereign posture.
• Canvas View Offer a canvas view to deliver more complex and demanding functionality.
• Auto-Refresh Keep container content up-to-date by auto-refreshing gadget data.
• Bundle Offer pre-prepared bundles of content

Gadget UI Elements

• Read-Write Element Optimise screen real estate by morphing display elements into editors for the same underlying data.
• Collapsible Element Optimise screen real estate by allowing users to collapse (and expand) certain elements.

Gadget-To-Gadget Communication

• Inter-Gadget Drag-And-Drop Allow drag and drap of content between gadgets.

Gadget-To-Server Communication

• OAuth Call Use delegated trust protocols, OAuth in particular, to access privileged services.
• Inter-Frame Call Use inter-frame calls to access privileged services.
• Javascript Call Use Javascript calls to access public services on your server and those on third-party websites.

Gadget Preferences

• UI Customisation Offer preferences related to UI appearance, such as colour schemes, gadget height, and title.
• URL-Embedded Preferences Improve flexibility by allowing preferences to be embedded in the gadget URL.
• Autonomous Persistence Use JSON and hidden preferences to keep your gadget independent of persistence-based web services.

Packaging and Distribution

• Relative Path Reference For ease of distribution, dynamically calculate the URL of your gadget and then download scripts, stylesheets, images, and services from the same server, on demand.
• Embedded Image Employ the data: URI protocol to keep your gadget self-contained.

Social Interaction

• First Move Allow a gadget user to initiate an interaction with another individual who may not yet be using (or signed up) with the gadget.

Development Process

• Legacy URL-type Gadget For legacy web apps and older widget or portlet technology, begin gadget migration by wrapping it inside a simple URL-type gadget.
• Social Fixture Develop against a fixed social tree which you can replicate each run.
• Gadget Factory Instead of maintaining a static XML file, output your gadget from a script to stay DRY ("Don't Repeat Yourself") and improve flexibility.

Beyond scope - OpenSocial platform implementation patterns

These are patterns present in OpenSocial platforms such as Shindig and the portals - iGoogle, MySpace, Hi5, etc. They are out of scope from this project, as the project's sole audience at this time is developers of OpenSocial applications.

• Container
• Gadget Server
• OpenSocial API

• Sandboxing (distinct iframe domains, Caja)

• Feature
• Set Title Feature
• Message Feature
• ... etc. ...

• Gadget Catalogue
• Gadget Feedback
• Gadget Sharing