Interoperable Ajax Tools And Mashups Ferraiolo
-
Upload
rajivmordani -
Category
Technology
-
view
1.024 -
download
0
Transcript of Interoperable Ajax Tools And Mashups Ferraiolo
![Page 1: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/1.jpg)
Interoperable Ajax Tools and Mashups
Jon FerraioloIBM and OpenAjax AllianceOctober 20, 2008
![Page 2: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/2.jpg)
Interoperable Ajax Tools and Mashups 2
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 3: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/3.jpg)
Interoperable Ajax Tools and Mashups 33
The Ajax explosion (2005-2007)
Huge amount of hype
~200 Ajax toolkits appear almost instantlyMicrosoft Atlas (now called ASP.NET AJAX)
• Helps contribute to legitimacy
Several other major “proprietary” Ajax frameworks• Adobe/Spry, Backbase, ICEsoft, Nexaweb, Sun/jMaki, TIBCO, …
Several major open source projects• Prototype/Scriptaculous, Dojo, Yahoo, DWR, Google GWT, jQuery,…
Why so many so quickly? Simply rebrand DHTML to Ajax
Huge amount of hype
~200 Ajax toolkits appear almost instantlyMicrosoft Atlas (now called ASP.NET AJAX)
• Helps contribute to legitimacy
Several other major “proprietary” Ajax frameworks• Adobe/Spry, Backbase, ICEsoft, Nexaweb, Sun/jMaki, TIBCO, …
Several major open source projects• Prototype/Scriptaculous, Dojo, Yahoo, DWR, Google GWT, jQuery,…
Why so many so quickly? Simply rebrand DHTML to Ajax
![Page 4: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/4.jpg)
Interoperable Ajax Tools and Mashups 44
Why OpenAjax Alliance?
A rich but fragile ecosystemInteroperability shortcomingsEducational/marketing shortcomingsDependence on browsers companies for technical advances
Ajax vendors motivated to work together (united we stand, divided we fall)
Ajax technology layer not addressed by other industry groups
A rich but fragile ecosystemInteroperability shortcomingsEducational/marketing shortcomingsDependence on browsers companies for technical advances
Ajax vendors motivated to work together (united we stand, divided we fall)
Ajax technology layer not addressed by other industry groups
Browser
Ajax toolkit(s)
Ajax appHTML app
![Page 5: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/5.jpg)
Interoperable Ajax Tools and Mashups 5
OpenAjax Alliance Formation
Kick-off meeting May 200630 companies Objectives, process, scope, and initial tasks
Scope of activitiesInteroperabilityEducationalHelp shape the future of the Ajax ecosystem
What we produceDocuments (e.g., specs)Open source (mostly JavaScript)
Kick-off meeting May 200630 companies Objectives, process, scope, and initial tasks
Scope of activitiesInteroperabilityEducationalHelp shape the future of the Ajax ecosystem
What we produceDocuments (e.g., specs)Open source (mostly JavaScript)
![Page 6: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/6.jpg)
Interoperable Ajax Tools and Mashups 6
OpenAjax Alliance Areas of Focus
InteroperabilityAjax runtime libraries (OpenAjax Hub, OpenAjax Registry)Ajax IDEs (OpenAjax Metadata)Mashups and widgets (Hub 1.1, Metadata)Mobile Ajax (Mobile Device APIs)
Marketing, education and evangelism7 White papers
Future browsersBrowser wishlist initiative
InteroperabilityAjax runtime libraries (OpenAjax Hub, OpenAjax Registry)Ajax IDEs (OpenAjax Metadata)Mashups and widgets (Hub 1.1, Metadata)Mobile Ajax (Mobile Device APIs)
Marketing, education and evangelism7 White papers
Future browsersBrowser wishlist initiative
![Page 7: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/7.jpg)
Interoperable Ajax Tools and Mashups 7
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 8: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/8.jpg)
Interoperable Ajax Tools and Mashups 8
What should be possible?
Intelligent code assist for APIs in Ajax librariesWhat Aptana does with APIs
Visual design using widgets from Ajax librariesWhat jMaki/Netbeans does with widgets
So what’s the problem?NxM problem (~200 Ajax toolkits, ~15 Ajax IDEs)Each toolkit documents APIs and widgets their own way
Intelligent code assist for APIs in Ajax librariesWhat Aptana does with APIs
Visual design using widgets from Ajax librariesWhat jMaki/Netbeans does with widgets
So what’s the problem?NxM problem (~200 Ajax toolkits, ~15 Ajax IDEs)Each toolkit documents APIs and widgets their own way
![Page 9: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/9.jpg)
Interoperable Ajax Tools and Mashups 9
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 10: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/10.jpg)
Interoperable Ajax Tools and Mashups 10
Solution: OpenAjax Metadata
OpenAjax Metadata for JavaScript APIsEmbraced an industry leader (Aptana ScriptDoc XML)Standard stuff: <class>, <namespace>, <method>, <parameter>, etc.Open source
• JSDoc to OpenAjax Metadata (extension to JSDoc Toolkit)• Aptana ScriptDoc XML to OpenAjax Metadata (and probably vice versa)
OpenAjax Metadata for WidgetsEmbraced an industry leader (Adobe Dreamweaver submission)Standard stuff: <widget>, <content>, <require>, <author>, <icon>, etc.Markup designed for strong alignment with Google GadgetsOpen source
• Sample widgets• Reference implementation of a simple mashup editor
OpenAjax Metadata for JavaScript APIsEmbraced an industry leader (Aptana ScriptDoc XML)Standard stuff: <class>, <namespace>, <method>, <parameter>, etc.Open source
• JSDoc to OpenAjax Metadata (extension to JSDoc Toolkit)• Aptana ScriptDoc XML to OpenAjax Metadata (and probably vice versa)
OpenAjax Metadata for WidgetsEmbraced an industry leader (Adobe Dreamweaver submission)Standard stuff: <widget>, <content>, <require>, <author>, <icon>, etc.Markup designed for strong alignment with Google GadgetsOpen source
• Sample widgets• Reference implementation of a simple mashup editor
![Page 11: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/11.jpg)
Interoperable Ajax Tools and Mashups 11
OpenAjax Metadata for JavaScript APIsSample JavaScript with JSDoc
/*** Processes a method found in the JSDoc data structure.* Produces an OpenAjax 'method' element.* @param {object} method JSDoc object that holds info on this method* @param {number} indent Current indent level for pretty printing*/this.method_element = function(method, indent) { … }
Corresponding OpenAjax Metadata
<method name="method_element"><description>
Processes a method found in the JSDoc data structure.Produces an OpenAjax 'method' element.
</description><parameter name="method" datatype="Object" usage="required">
<description>JSDoc object that holds info on method</description></parameter><parameter name="indent" datatype="Number" usage="required">
<description>Current indent level for pretty printing</description></parameter>
</method>
Sample JavaScript with JSDoc/*** Processes a method found in the JSDoc data structure.* Produces an OpenAjax 'method' element.* @param {object} method JSDoc object that holds info on this method* @param {number} indent Current indent level for pretty printing*/this.method_element = function(method, indent) { … }
Corresponding OpenAjax Metadata
<method name="method_element"><description>
Processes a method found in the JSDoc data structure.Produces an OpenAjax 'method' element.
</description><parameter name="method" datatype="Object" usage="required">
<description>JSDoc object that holds info on method</description></parameter><parameter name="indent" datatype="Number" usage="required">
<description>Current indent level for pretty printing</description></parameter>
</method>
![Page 12: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/12.jpg)
Interoperable Ajax Tools and Mashups 12
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
![Page 13: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/13.jpg)
Interoperable Ajax Tools and Mashups 13
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget> is the root element.
![Page 14: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/14.jpg)
Interoperable Ajax Tools and Mashups 14
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<require> elements specify the various resources that the widget needs to run successfully
![Page 15: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/15.jpg)
Interoperable Ajax Tools and Mashups 15
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<property> elements specify the list of widget parameters that should appear in property editor dialogs.
You can say whether a given property should participate in cross-widget message via ‘publish’ and ‘subscribe’attributes. (Also, there is a <topic> element)
![Page 16: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/16.jpg)
Interoperable Ajax Tools and Mashups 16
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<content> element contains the HTML snippet for the visual rendering of the widget.
![Page 17: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/17.jpg)
Interoperable Ajax Tools and Mashups 17
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<javascript> elements are mainly for initialization logic. The “this” object will be set to the widget instance.
![Page 18: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/18.jpg)
Interoperable Ajax Tools and Mashups 18
Standards improve industry efficiency and unleash innovation
Ajax libraries can produce one format (OAM) for their APIsTheir library will now be compatible with many IDEsIf the library uses JSDoc, then auto-generation of OpenAjax MetadataWe are investigating auto-generation for other inline documentation formats, such as what Dojo uses
Ajax IDEs can consume one format (OAM)That IDE will now support dozens of Ajax libraries
By unifying the industry around a single XML file, IDEs can now innovate and compete in other areas
Ajax libraries can produce one format (OAM) for their APIsTheir library will now be compatible with many IDEsIf the library uses JSDoc, then auto-generation of OpenAjax MetadataWe are investigating auto-generation for other inline documentation formats, such as what Dojo uses
Ajax IDEs can consume one format (OAM)That IDE will now support dozens of Ajax libraries
By unifying the industry around a single XML file, IDEs can now innovate and compete in other areas
![Page 19: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/19.jpg)
Interoperable Ajax Tools and Mashups 19
IDE WG Participants
Aptana Studio (chair of the WG)
Adobe Dreamweaver (Spry toolkit)
Microsoft Visual Studio (ASP.NET AJAX toolkit)
Eclipse ATF and JSDT
Sun jMaki/Netbeans
TIBCO (GI toolkit)
OpenLink SW (OAT framework)
Aptana Studio (chair of the WG)
Adobe Dreamweaver (Spry toolkit)
Microsoft Visual Studio (ASP.NET AJAX toolkit)
Eclipse ATF and JSDT
Sun jMaki/Netbeans
TIBCO (GI toolkit)
OpenLink SW (OAT framework)
![Page 20: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/20.jpg)
Interoperable Ajax Tools and Mashups 20
Current status
SpecificationWe have a complete draft spec for OpenAjax MetadataNow in the implementation phase (see 2008 InteropFest, subsequent slide)
Schema (in RelaxNG) and validator
Open source implementationOpenAjax’s open source mashup tool implements the widget formatEclipse JSDT has implemented the JavaScript API featuresVersion 0.1 of JSDoc to OpenAjax Metadata is available
Commercial implementationAdobe Dreamweaver is implementing the widget features in the spec Aptana Studio is implementing the JavaScript APIs features
SpecificationWe have a complete draft spec for OpenAjax MetadataNow in the implementation phase (see 2008 InteropFest, subsequent slide)
Schema (in RelaxNG) and validator
Open source implementationOpenAjax’s open source mashup tool implements the widget formatEclipse JSDT has implemented the JavaScript API featuresVersion 0.1 of JSDoc to OpenAjax Metadata is available
Commercial implementationAdobe Dreamweaver is implementing the widget features in the spec Aptana Studio is implementing the JavaScript APIs features
![Page 21: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/21.jpg)
Interoperable Ajax Tools and Mashups 21
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 22: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/22.jpg)
Interoperable Ajax Tools and Mashups 22
Mashups – the self-service business pattern
![Page 23: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/23.jpg)
Interoperable Ajax Tools and Mashups 23
Business value of mashups• Faster, cheaper delivery of applications
• Save time and money through reuse and lightweight integration techniques
• Lower skill set needed to assembly new applications
• Support innovation and new business opportunities• Users empowered to innovate and explore
• Gain valuable insights• Due to remixing enterprise and web
information• Better align IT and business
• Do-it-yourself IT will be expected by Facebook generation
• Extend reach and value of SOA• Service reuse illuminates the business value
of SOA
![Page 24: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/24.jpg)
Interoperable Ajax Tools and Mashups 24
Mashup software
• Mashup tools• Widget and feed discovery• Application assembly• Instant deployment
• Widgets • Pre-packaged, remixable mini-applications• Usually tied to a back-end web service
• Sometimes leveraging previous investment in SOA
• Public or company-private• Key enabler of the long tail
![Page 25: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/25.jpg)
Interoperable Ajax Tools and Mashups 25
Widget innovation – no shortage
![Page 26: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/26.jpg)
Interoperable Ajax Tools and Mashups 26
Industry challenges
InteroperabilityDozens of proprietary technologiesGood news: many use the “Web Runtime” (i.e., Ajax)!Bad news: even when using the Web Runtime, widgets are not interoperable
SecurityThe power of mashups – comes largely from discovering and integrating great widgets from 3rd partiesBut 3rd party widgets might be malicious
InteroperabilityDozens of proprietary technologiesGood news: many use the “Web Runtime” (i.e., Ajax)!Bad news: even when using the Web Runtime, widgets are not interoperable
SecurityThe power of mashups – comes largely from discovering and integrating great widgets from 3rd partiesBut 3rd party widgets might be malicious
![Page 27: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/27.jpg)
Interoperable Ajax Tools and Mashups 27
Security vulnerabilities
Web browserURL: http://example.com/mashup_builder/my_mashup1
Widget-C Widget-E
Widget-A
Communicates in the background with one of the company’s web
servers
Company server
Communicates in the background with a public web server
(trusted)
Message passing between
the widgets
Public server
Communicates in the background with a public web server
(untrusted)
Public server
What if one of the widgets is malicious?
(untrusted)
![Page 28: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/28.jpg)
Interoperable Ajax Tools and Mashups 28
OpenAjax – Addressing the challenges
Web browserURL: http://example.com/mashup_builder/my_mashup1
Widget-C Widget-E
Widget-A
Communicates in the background with one of the company’s web
servers
Company server
Communicates in the background with a public web server
(trusted)
Message passing between
the widgets
Public server
Communicates in the background with a public web server
(untrusted)
Public server
(untrusted)
(1) OpenAjax Hub 1.1provides framework for
loading/isolating widgets and secure message
management
(4) Open source mini-mashup application
shows how to use all of these technologies
(2) OpenAjax Metadatadefines an industry
standard widget wrapper format
(3) Open source transcodersconvert popular existing
proprietary gadget formats into OpenAjax Metadata
![Page 29: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/29.jpg)
Interoperable Ajax Tools and Mashups 29
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 30: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/30.jpg)
Interoperable Ajax Tools and Mashups 30
OpenAjax Hub 1.0
What is it?Small bit of standard JavaScript (< 3K after compaction)Enables multiple Ajax runtimes to work together
Key use case: Developer mashupsWhere a professional developer mashes up components using HTML+JavaScript+…
Version 1.0 featuresAjax library registration
• OpenAjax.hub.registerLibrary() Simple publish/subscribe engine (the pub sub hub)
• OpenAjax.hub.publish(topicName, payload)• OpenAjax.hub.subscribe(topicName, callbackFunction)
What is it?Small bit of standard JavaScript (< 3K after compaction)Enables multiple Ajax runtimes to work together
Key use case: Developer mashupsWhere a professional developer mashes up components using HTML+JavaScript+…
Version 1.0 featuresAjax library registration
• OpenAjax.hub.registerLibrary() Simple publish/subscribe engine (the pub sub hub)
• OpenAjax.hub.publish(topicName, payload)• OpenAjax.hub.subscribe(topicName, callbackFunction)
![Page 31: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/31.jpg)
Interoperable Ajax Tools and Mashups 31
OpenAjax Hub 1.0 – an example
OpenAjax Hub 1.0 ExampleThis is a mockup of a Web application that uses UI controls from multiple Ajax toolkits.
Assume multiple Ajax toolkits:• UTILS.js – Various utils, inc. XHR
• CALENDAR.js – Calendar control
• DATAGRID.js – Powerful tables
• CHARTS.js – Charting utilitiesThe visual controls need to react to new server data and to each other and update their views appropriately.
![Page 32: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/32.jpg)
Interoperable Ajax Tools and Mashups 32
Example – under the hood
<html><head>
...<script type="text/javascript" src="OpenAjax.js"/><script type="text/javascript" src="UTILS.js"/><script type="text/javascript" src="CALENDAR.js"/><script type="text/javascript" src="CHARTS.js"/><script type="text/javascript" src="DATAGRID.js"/><script type="text/javascript">...function MyCalendarCallback(...) {
OpenAjax.hub.publish("myapp.newdate", newdate);}...function NewDateCallback(eventname, publisherData, subscriberData) {
...update the given visualization widget...}OpenAjax.hub.subscribe("myapp.newdate", NewDateCallback);...
</script></head>...
![Page 33: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/33.jpg)
Interoperable Ajax Tools and Mashups 33
OpenAjax InteropFest
Objectives: Allows OpenAjax Alliance to verify that OpenAjax Hub is reliable, performant, and suitableAllows members to verify that they are OpenAjax Conformant
Objectives: Allows OpenAjax Alliance to verify that OpenAjax Hub is reliable, performant, and suitableAllows members to verify that they are OpenAjax Conformant
12 toolkits participatedhttp://www.openajax.org/member/wiki/InteropFest_2007_March
Jan-March 2007 July-Sept 2007
14 organizations, 20 toolkits participatedhttp://www.openajax.org/member/wiki/InteropFest_1.0
![Page 34: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/34.jpg)
Interoperable Ajax Tools and Mashups 34
InteropFest Demos
For people who are just looking at the slide deck, some InteropFest demos can be found at:
http://www.openajax.org/member/wiki/InteropFest_1.0
For people who are just looking at the slide deck, some InteropFest demos can be found at:
http://www.openajax.org/member/wiki/InteropFest_1.0Participating organizations Participating toolkits
24SevenOfficeApache XAPDojo FoundationIBMILOGDWR/GetaheadIT MillLightstreamerMicrosoftNexawebOpenLink SWOpen SpotSoftware AGSun MicrosystemsTIBCO
AjaxEngineApache XAPDojo ToolkitExtILOG JViewsIT Mill ToolkitjMakiJQueryLightstreamerMicrosoft Ajax LibraryNexaweb Ajax ClientOAT: OpenLink AJAX ToolkitOpenSpot CalcDeskPrototypescript.aculo.usSoftware AG's webMethods/CAFTIBCO General Interface24SevenOffice ViliYUI
![Page 35: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/35.jpg)
Interoperable Ajax Tools and Mashups 35
OpenAjax Hub 1.0
StatusApproved
Specificationhttp://www.openajax.org/member/wiki/OpenAjax_Hub_1.0_Specification
Reference implementation at SourceForgehttp://openajaxallianc.sourceforge.net
StatusApproved
Specificationhttp://www.openajax.org/member/wiki/OpenAjax_Hub_1.0_Specification
Reference implementation at SourceForgehttp://openajaxallianc.sourceforge.net
![Page 36: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/36.jpg)
Interoperable Ajax Tools and Mashups 36
OpenAjax Hub 1.1 – New features
OpenAjax Hub 1.0Key use case: Developer mashupsKey technology: pub/sub within a single browser frame
OpenAjax Hub 1.1Key use case: Secure end-user mashupsKey technologies
• Widget isolation (for security)• Pub/sub across browser frames • Security manager mediates all cross-widget messages
OpenAjax Hub 1.0Key use case: Developer mashupsKey technology: pub/sub within a single browser frame
OpenAjax Hub 1.1Key use case: Secure end-user mashupsKey technologies
• Widget isolation (for security)• Pub/sub across browser frames • Security manager mediates all cross-widget messages
![Page 37: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/37.jpg)
Interoperable Ajax Tools and Mashups 37
Security vulnerabilities
Web browserURL: http://example.com/mashup_builder/my_mashup1
Widget-C Widget-E
Widget-A
Communicates in the background with one of the company’s web
servers
Company server
Communicates in the background with a public web server
(trusted)
Message passing between
the widgets
Public server
Communicates in the background with a public web server
(untrusted)
Public server
What if one of the widgets is malicious?
(untrusted)
![Page 38: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/38.jpg)
Interoperable Ajax Tools and Mashups 38
Browser Security
Browser same-origin policyIFRAMEs isolation - IFRAMEs from different domains (and subdomains) cannot communicate with each other via DOM bridging or JavaScript bridgingImplemented in all popular Web browsers today
Today’s tricks for cross-domain mashupsDynamic SCRIPT tag to another serverServer-side proxies“IFrame proxy” (window.location fragment identifier)New browsers: W3C postMessage() and Access Control
Browser same-origin policyIFRAMEs isolation - IFRAMEs from different domains (and subdomains) cannot communicate with each other via DOM bridging or JavaScript bridgingImplemented in all popular Web browsers today
Today’s tricks for cross-domain mashupsDynamic SCRIPT tag to another serverServer-side proxies“IFrame proxy” (window.location fragment identifier)New browsers: W3C postMessage() and Access Control
![Page 39: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/39.jpg)
Interoperable Ajax Tools and Mashups 39
SMash
SMash stands for “Secure Mashups”Secure handling of 3rd party mashup componentsRuns in today’s browsers (without plugins)
Designed and implemented at IBM™ Research (beginning of 2007)
Open-sourced (openajaxallianc.sourceforge.net) in August 2007Research Paper describing SMash in WWW 2008 Conference
High-level APIs, independent of implementation technology
Fragment communication, HTML5 postMessage, Java™ platform, Flash etc.Will still work when browsers add native support for secure cross-frame messaging
SMash stands for “Secure Mashups”Secure handling of 3rd party mashup componentsRuns in today’s browsers (without plugins)
Designed and implemented at IBM™ Research (beginning of 2007)
Open-sourced (openajaxallianc.sourceforge.net) in August 2007Research Paper describing SMash in WWW 2008 Conference
High-level APIs, independent of implementation technology
Fragment communication, HTML5 postMessage, Java™ platform, Flash etc.Will still work when browsers add native support for secure cross-frame messaging
![Page 40: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/40.jpg)
Interoperable Ajax Tools and Mashups 40
OpenAjax Hub 1.1: Plug-in communication providers
Hub 1.1 Code
HTML5 postMessage provider
smash (FIM) provider
SPI
inline provider
Mashup assembly toolHub 1.1 Code
FIM provider
Widget 1
Hub 1.1 Code
inline provider
Widget 2
Hub 1.1 Code
HTML5 provider
Widget 3
![Page 41: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/41.jpg)
Interoperable Ajax Tools and Mashups 41
OpenAjax Hub 1.1: Simple exampleWeb browser
URL: http://example.com/mashup_builder/my_mashup1
Widget-C Widget-E
Widget-A
Mashup container
Hub 1.1smash provider
Hub 1.1 (Managed Hub)
inline provider
smash provider
Security manager
Broadcast an event usingconnHandle.publish()
Invoke the callback function
Subscribe to a topic and register a callback function using connHandle.subscribe()
Hub 1.1inline provider
Hub 1.1smash provider
![Page 42: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/42.jpg)
Interoperable Ajax Tools and Mashups 42
OpenAjax Hub 1.1: the stepsWeb browser
URL: http://example.com/mashup_builder/my_mashup1
Widget-C Widget-E
Widget-A
Mashup container
Hub 1.1smash provider
Hub 1.1 (Managed Hub)
inline provider
smash provider
Security manager
Broadcast an event usingconnHandle.publish()
Invoke the callback function
Subscribe to a topic and register a callback function using connHandle.subscribe()
Initialize and create a “Managed Hub”
Load the widgets used in the mashup
Hub 1.1inline provider
Hub 1.1smash provider
1 2
3
4
568
97
10
11
12
![Page 43: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/43.jpg)
Interoperable Ajax Tools and Mashups 43
Hub 1.1 status
SpecificationFirst draft spec – far alonghttp://www.openajax.org/member/wiki/OpenAjax_Hub_1.1_Specification
Reference implementation at SourceForgeFirst implementation (far along)http://openajaxallianc.sourceforge.net
Timeline for Hub 1.1August-October 2008: 2008 InteropFestEnd of 2008: Finalize and approve
SpecificationFirst draft spec – far alonghttp://www.openajax.org/member/wiki/OpenAjax_Hub_1.1_Specification
Reference implementation at SourceForgeFirst implementation (far along)http://openajaxallianc.sourceforge.net
Timeline for Hub 1.1August-October 2008: 2008 InteropFestEnd of 2008: Finalize and approve
![Page 44: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/44.jpg)
Interoperable Ajax Tools and Mashups 44
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 45: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/45.jpg)
Interoperable Ajax Tools and Mashups 45
Widget innovation – no shortage
![Page 46: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/46.jpg)
Interoperable Ajax Tools and Mashups 46
OpenAjax Metadata
Mashup shortcomings todayWidget interoperability
• Many widget formats (Google, Yahoo, Apple, Microsoft…)• Widget developers usually have to build different versions of their widgets
to work with different containers
Security• No comprehensive, standards-based approach to widget isolation
OpenAjax Metadata addresses these two shortcomingsWidget interoperability
• OpenAjax Metadata defines industry standard XML for mashup widgets• Very close to Google Gadgets (easy to transcode with XSLT)
Security• OpenAjax Metadata designed to work with OpenAjax Hub 1.1 (which
provides a secure mashup runtime)
Mashup shortcomings todayWidget interoperability
• Many widget formats (Google, Yahoo, Apple, Microsoft…)• Widget developers usually have to build different versions of their widgets
to work with different containers
Security• No comprehensive, standards-based approach to widget isolation
OpenAjax Metadata addresses these two shortcomingsWidget interoperability
• OpenAjax Metadata defines industry standard XML for mashup widgets• Very close to Google Gadgets (easy to transcode with XSLT)
Security• OpenAjax Metadata designed to work with OpenAjax Hub 1.1 (which
provides a secure mashup runtime)
![Page 47: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/47.jpg)
Interoperable Ajax Tools and Mashups 47
OpenAjax Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
![Page 48: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/48.jpg)
Interoperable Ajax Tools and Mashups 48
OpenAjax Metadata for Widgets
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<widget name="Calendar" id="…" spec="0.1" jsClass="Calendar"sandbox="true" xmlns="http://openajax.org/metadata">
<requires><require type="library" name="dojo" version="1.1" copy="false"/> <require type="javascript" src="calendar.js"/><require type="css" library="dojo" src="dojo/resources/dojo.css"/> <require type="css" library="dojo" src="dijit/themes/tundra/tundra.css"/> <require type="css" src="../../lib/dijit/themes/tundra/tundra_rtl.css"/>
</requires><properties>
<property name='date' datatype='Date' publish='true' topic='date'/></properties> <content type='fragment'>
<![CDATA[ <input ID="__WID___calendar" class='tundra' lang="en-us"
style="background-color:#f5f5f5" dojoType="dijit._Calendar"/> ]]>
</content><javascript location="atEnd">
this.init();</javascript>
</widget>
<property> elements specify the list of widget parameters that should appear in property editor dialogs.
You can say whether a given property should participate in cross-widget message via ‘publish’ and ‘subscribe’attributes. (Also, there is a <topic> element)
![Page 49: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/49.jpg)
Interoperable Ajax Tools and Mashups 49
Widget Isolation and Security
Widget content is either a stand-alone HTML snippet (a DIV) or an entire HTML page
Container manages the widgetWidget loading and unloadingWidget isolation (e.g., widget in its own IFRAME)Inter-widget communication – container provides connection handle
• connHandle.publish()• connHandle.subscribe()
Container implements pub/sub securityContainer includes a “policy manager” (who can pub/sub to what)Widget is oblivious to message passing technology
• fragment identifiers, postMessage, window.Name or whatever
Widget content is either a stand-alone HTML snippet (a DIV) or an entire HTML page
Container manages the widgetWidget loading and unloadingWidget isolation (e.g., widget in its own IFRAME)Inter-widget communication – container provides connection handle
• connHandle.publish()• connHandle.subscribe()
Container implements pub/sub securityContainer includes a “policy manager” (who can pub/sub to what)Widget is oblivious to message passing technology
• fragment identifiers, postMessage, window.Name or whatever
![Page 50: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/50.jpg)
Interoperable Ajax Tools and Mashups 50
OpenAjax Metadata and Google Gadgets
Google GadgetsThe gorilla is the “Web Widget” space (tens of thousands of Gadgets)Solid technology
OpenAjax Metadata strategyMatch Google Gadgets wherever possibleOpen source XSLT transcoders to/from Google Gadgets
Google GadgetsThe gorilla is the “Web Widget” space (tens of thousands of Gadgets)Solid technology
OpenAjax Metadata strategyMatch Google Gadgets wherever possibleOpen source XSLT transcoders to/from Google Gadgets
![Page 51: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/51.jpg)
Interoperable Ajax Tools and Mashups 51
OpenAjax Metadata status
SpecificationFirst draft spec - far alonghttp://www.openajax.org/member/wiki/OpenAjax_Metadata_Specification
Open sourceMini mashup applicationIncludes support for Google Gadgets (via transcoder)
Timeline for OpenAjax MetadataAugust-October 2008: 2008 InteropFestFall 2008: Finalize and approve
SpecificationFirst draft spec - far alonghttp://www.openajax.org/member/wiki/OpenAjax_Metadata_Specification
Open sourceMini mashup applicationIncludes support for Google Gadgets (via transcoder)
Timeline for OpenAjax MetadataAugust-October 2008: 2008 InteropFestFall 2008: Finalize and approve
![Page 52: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/52.jpg)
Interoperable Ajax Tools and Mashups 52
OpenAjax – Addressing the challenges
Web browserURL: http://example.com/mashup_builder/my_mashup1
Widget-C Widget-E
Widget-A
Communicates in the background with one of the company’s web
servers
Company server
Communicates in the background with a public web server
(trusted)
Message passing between
the widgets
Public server
Communicates in the background with a public web server
(untrusted)
Public server
(untrusted)
(1) OpenAjax Hub 1.1provides framework for
loading/isolating widgets and secure message
management
(4) Open source mini-mashup application
shows how to use all of these technologies
(2) OpenAjax Metadatadefines an industry
standard widget wrapper format
(3) Open source transcodersconvert popular existing
proprietary gadget formats into OpenAjax Metadata
![Page 53: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/53.jpg)
Interoperable Ajax Tools and Mashups 53
OpenAjax Mashups in action
![Page 54: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/54.jpg)
Interoperable Ajax Tools and Mashups 54
2008 InteropFest
ObjectivesTest OpenAjax Metadata interoperability across multiple vendorsTest OpenAjax Hub 1.1 for reliability, performance, and suitability
WhenAugust – October, 2008
ObjectivesTest OpenAjax Metadata interoperability across multiple vendorsTest OpenAjax Hub 1.1 for reliability, performance, and suitability
WhenAugust – October, 2008
http://www.openajax.org/member/wiki/2008_InteropFesthttp://www.openajax.org/2008_InteropFest/mashupapp
![Page 55: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/55.jpg)
Interoperable Ajax Tools and Mashups 55
Agenda
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
Introducing OpenAjax Alliance
Ajax IDEs
OpenAjax Metadata (for Ajax Libraries)
Mashups
OpenAjax Hub 1.1
OpenAjax Metadata (for Widgets)
Summary
![Page 56: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/56.jpg)
Interoperable Ajax Tools and Mashups 56
Summary
Ajax IDEs aren’t realizing their potential yetInteoperability challenges
Mashups aren’t realizing their potential yetSecurity challengesInteroperability challenges
OpenAjax Alliance is addressing the challengesFor Ajax IDEs
• OpenAjax Metadata addresses IDE interop challenges
For mashups• OpenAjax Hub 1.1 addresses security challenges• OpenAjax Metadata addresses widget interop challenges
Ajax IDEs aren’t realizing their potential yetInteoperability challenges
Mashups aren’t realizing their potential yetSecurity challengesInteroperability challenges
OpenAjax Alliance is addressing the challengesFor Ajax IDEs
• OpenAjax Metadata addresses IDE interop challenges
For mashups• OpenAjax Hub 1.1 addresses security challenges• OpenAjax Metadata addresses widget interop challenges
![Page 57: Interoperable Ajax Tools And Mashups Ferraiolo](https://reader033.fdocuments.net/reader033/viewer/2022052821/55492484b4c905a54c8b9ccf/html5/thumbnails/57.jpg)
Interoperable Ajax Tools and Mashups 57
Thank you!
For more information:
Web site: http://www.openajax.org
Wiki: http://www.openajax.org/member/wiki
Blog: http://www.openajax.org/blog
Mail list: [email protected]
Email: Jon Ferraiolo <[email protected]>
For more information:
Web site: http://www.openajax.org
Wiki: http://www.openajax.org/member/wiki
Blog: http://www.openajax.org/blog
Mail list: [email protected]
Email: Jon Ferraiolo <[email protected]>