Enterprise Google Gadgets
Luis SalaSenior 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-platformJavaScript (Controller)JavaScript (Controller)
Freemarker (View)Freemarker (View)
Alfresco Repository (Model)Alfresco Repository (Model)
Consumer / ClientConsumer / 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)JavaScript (Controller)
Freemarker (View)Freemarker (View)
Alfresco Repository (Model)Alfresco Repository (Model)
iGoogleiGoogle
HTMLAJAXJSON
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>
DEMO
03.04.08
Q&A and Resources● Any Questions?
● Resources:● wiki.alfresco.com/wiki/Google_Gadgets● code.google.com/apis/gadgets/● code.google.com/enterprise/
● Join the Content Community● alfresco.com
● Participate in the Developer Challenge● alfresco.com/partners/programme/webscripts/
●
Join the Alfresco Facebook Group● facebook.com/group.php?gid=6063383762
03.04.08
Upcoming Presentations
● Upcoming “Built in 60” Presentations:● Building a Simple Wiki● Mac Dashboard Widgets● Digital Asset Management● Facebook Integration● Video Transcoders
● Other Upcoming Webinars:● April 24: Open Source Barometer● April 29: Benchmarking with Unisys● May 7: Unisys ECM Best Practices
End
Shapes & Colors
Normal Text
● Bullet● Sub-Bullet
Normal TextNormal Text