Enterprise Google Gadgets Integrated with Alfresco - Open Source ECM

Enterprise Google Gadgets Luis Sala Senior Director of Solutions Engineering www.alfresco.com

Introductions

Luis Sala, Senior Director of Solutions Engineering

Former Chief Solutions Architect at Epicentric

and Principal SE at Vignette

Agenda

About Google Gadgets

Developing Gadgets

Web Script Overview

Alfresco Gadgets for the Enterprise

Bonus: Google OneBox Integration

Quick Demonstration

Q & A

What are Google Gadgets?

Embeddable UI components that offer varying functionality.

Lightweight.

Until recently, focused on the mass market.

Google promoting gadgets for the enterprise.

What are the Benefits?

Easy to build.

Many Sites

Including Google Apps for the Enterprise

Wide Reach

Millions of users!

Google for the Enterprise

Google Search Appliance

Includes Google OneBox

Google Apps

iGoogle Start Page

Mail

Sites (Wiki)

Docs, Spreadsheets and Presentations

Calendar

IM

Google Apps

Developing Gadgets

Gadgets require a Module Descriptor

Certain Google JavaScript libraries

Retrieve preferences.

Customize the gadget UI.

Inline HTML

Externally hosted web application

Invoked via an IFRAME.

Still has access to preferences via the JavaScript libraries.

Hello World Gadget

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

<Module>

<ModulePrefs title="hello world example" />

<Content type="html"> <![CDATA[

Hello, world!

]]> </Content>

</Module>

Inline Gadget…

IFRAME Gadget <?xml version="1.0" encoding="UTF-8"?> <Module> <ModulePrefs title="hello world example" /> <Content type="url" href="http://www.example.com/hello.php"/> </Module>

Storing User Preferences <?xml version="1.0" encoding="UTF-8"?> <Module> <ModulePrefs title="hello world example" /> <UserPref name="mychoice" display_name="List Params?" datatype="bool"/> <UserPref name="myname" display_name="Name" required="true"/> <UserPref name="mycolor" display_name="Color" default_value="Blue" datatype="enum”> <EnumValue value="Red"/> <EnumValue value="Blue"/> <EnumValue value="Green"/> </UserPref> </Module>

Developer Tools Developer Gadget: Google Gadget Editor:

Open for Business

What are Web Scripts? Web Scripting

Agile Script-Driven MVC

Multiple uses

Roll your own API

Create new UI components

Create portlets/widgets

Expose WCM/AVM features

Script-based implementation

Server-side JavaScript

Freemarker

Limited only by your imagination

Integration: Create a mashup

Search: Exposed to other systems.

Rich Internet Applications

Cross-language

Cross-platform

JavaScript (Controller) Freemarker (View) Alfresco Repository (Model) Consumer / Client

Components of a Web Script

XML Descriptor

URI Templates

Authentication Requirements

Transactional Requirements

One or more server-side JavaScript files (Controller)

One for each HTTP method (GET, PUT, POST, etc.)

One or more Freemarker templates (View)

One for each HTTP method and desired output type (HTML, XML, JSON, etc.)

Two types of Web Scripts…

Data Web Script

RESTstyle / RESTful URL

Returns structured data:

XML

JSON

CSV

UI Web Script

Renders self-contained UI.

Can leverage Data Web Scripts.

Web Scripts as Gadgets

Virtually any Web Script can be a gadget by using its URL.

http:// HOST : PORT /alfresco/wcs/ SCRIPT

Developers have many choices:

HTML

AJAX

JavaScript

JSON

Any combination of the above.

JavaScript (Controller) Freemarker (View) Alfresco Repository (Model) iGoogle HTML AJAX JSON

Alfresco Gadgets

Search

Space Browser

Tasks

Alfresco Gadgets

Space Browser Gadget

User Preferences

Upload

Download

Space Creation

Delete

Folder Gadget Definition <?xml version="1.0" encoding="UTF-8"?> <Module> <ModulePrefs title="Alfresco Browser" description="Alfresco Document and Folder Browser" author="Alfresco Software" scrolling="true" height="350"> </ModulePrefs> <UserPref name="path" display_name="Starting Folder" required="false" /> <UserPref name="sortby" display_name="Sort By" default_value="Name" datatype="enum" > <EnumValue value="Name" /> <EnumValue value="Date" /> <EnumValue value="Size" /> </UserPref> <Content type="url” href="http:// HOST : PORT /alfresco/wcservice/aggadget/folder/?dummy=1" /> </Module>

Hello World Gadget - Descriptor

hello.get.desc.xml

<webscript> <shortname>Hello World Google Gadget</shortname>

<description>Sample demonstrating a simple Google Gadget</description>

<url>/goog/hello/</url> <url>/goog/hello</url>

<format default="html">argument</format>

<authentication>guest</authentication>

<transaction>required</transaction>

</webscript>

Hello World Gadget - JavaScript

hello.get.js

// Get "name" parameter as supplied by iGoogle

var name = args["up_name"];

if (name == undefined) {

name = "Name Not Set"

}

// Pass "name" to Freemarker template via the model

model.name = name;

Hello World Gadget - Freemarker

hello.get.html.ftl

<html>

<head>

<title>Alfresco Google Gadget</title>

</head>

<body>

<h1> Hello ${name} </h1>

</body>

</html>

Hello World Gadget – Module

hello.get.xml.ftl

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

<Module>

<ModulePrefs title="hello world example" />

<UserPref name="name" display_name="Your Name" default_value="Not Set"/>

<Content type="url" href="http:// HOST : PORT /alfresco/wcs/goog/hello?guest=true"/>

</Module>

Google Search Appliance Integration

Simple and fast integration with Google OneBox

http://www.google.com/enterprise/gsa/onebox.html

Google OneBox Integration

Customizable Formatting.

Google OneBox Web Script <?xml version="1.0" encoding="UTF-8"?> <OneBoxResults> <resultCode>${resultCode}</resultCode> <Diagnostics>${diagnostics}</Diagnostics> <provider>${provider}</provider> <title> <urlText>${numResults} results found in Alfresco</urlText> <urlLink>${alfBaseUrl}${url.serviceContext}/api/search/keyword.html?q=${query}&ticket=${ticket}</urlLink> </title> <IMAGE_SOURCE>${alfBaseUrl}${url.context}/images/logo/AlfrescoLogo32.png</IMAGE_SOURCE> <#if results?exists> <#list results as result> <MODULE_RESULT> <U>${alfBaseUrl}${url.context}/navigate/showDocDetails/workspace/SpacesStore/${result.id}?ticket=${ticket}</U> <title><#if result.title?exists>${result.title}<#else>${result.properties.name}</#if></title> <Field name="description"><#if result.description?exists> - ${result.description?substring(0, 25)}...</#if></Field> <Field name="path">${result.displayPath}</Field> <Field name="owner">${result.properties.creator}</Field> <Field name="modified">${result.properties.modified?datetime}</Field> <Field name="size">${result.size} bytes</Field> </MODULE_RESULT> </#list> </#if> </OneBoxResults>