1. Developing Grid User Interface Components Portlets, gadgets, etc.

2. Under the Hood: Building Components OGCE portlets use the Java COG Abstraction Layer to access Grid services. Provides a buffer over different Grid toolkits and versions. Provides ability to compose graph-based workflows. Tutorial in itself Portlets can be built with our Apache Velocity bridge. “Template” or “steal this code” approach. We have also developed Grid Tag Libraries and Beans (GTLAB) to simplify this process.

3. GTLAB Features Extends Java Server Faces. o Tag components wrap major COG Abstraction Layer features Allows you to do standalone development. Use JSF portlet bridge to convert into portlets  No new coding, just change, add config files and jars. Or forget about portlets and o Convert into Google Gadgets o Develop as a Facebook application o Etc. o Status: GTLAB is under active development, can be used to build simple things, but still has many loose ends. o You need to be technically adept to work with it now. o But you are welcome to give feedback or contribute.

4. Installing GTLAB You need to install the OGCE portal o GTLAB depends on many shared jars. Download the release code from www.collab-ogce.org or check out from SVN:www.collab-ogce.org o svn checkout https://ogce.svn.sourceforge.net/svnroot/ogce/GTLAB https://ogce.svn.sourceforge.net/svnroot/ogce/GTLAB Edit GTLAB/jsf_standalone/pom.xml o should point to your OGCE portal server. Edit GTLAB/jsf_standalone/src/main/resources/resources.properti es. Run “mvn clean install” in GTLAB/jsf_standalone/

5. Levels of Abstraction in GTLAB code You can use prepackaged gadgets/portlets. You can mix and match repeatable sections of tags via “include” statements. You can develop new applications using existing tag libraries. You can hack the code Note JSF is compatible with JSP, so you can mix and match. And you can embed JavaScript YUI, Scriptaculous user interface goodies. Google and Facebook APIs.

6. MyProxy Example <o:submit id="submit" value="Submit" binding="#{builder.body}" action="#{builder.junkAction}" > <o:myproxy id="mypr" hostname="#{resource.myproxyHostname}" lifetime="2" password="#{resource.password}" port="7512" username="#{resource.username}"/>

7. Show the Proxy Credential <h:dataTable value="#{myproxy.storedProxyList}" border="1" binding="#{myproxy.storedProxyTable}" var="proxyEntry" id="proxyTable"> <h:commandButton id="deleteProxy" value="Remove” actionListener="#{myproxy.deleteCredential}"/>

8. Executing Multiple Task <o:submit id="submit" value="Submit" binding="#{builder.body}" action="#{builder.junkAction}" > <o:multitask id="multi" persistent="true" taskname="#{resource.taskname}"> <o:jobsubmit id="js" myfaces="true" arguments="#{resource.arguments}" executable="#{resource.executable}" hostname="#{resource.hostname}" provider="#{resource.provider}" stdout="#{resource.stdout}"/> <o:filetransfer id="ft" myfaces="true" from="#{resource.from}" to="#{resource.to}" />

9. GTLAB ExampleDescription MyProxyExampleGet a credential and store in OGCE global proxy store. JobSubmitExamplesVarious examples showing how to submit a grid job and get output. Dashboard ExamplesRuns showq on Big Red, Cobalt, and Mercury and formats output. DirectoryBrowserDisplays and downloads files on a remote host via GridFTP MultipleTaskExampleShows how to couple file transfers, operations, and TaskMonitorExampleView task state and metadata. These will work as gadgets, portlets, or standalone applications

10. GTLAB Gadgets Code Base GTLAB Portlets Code Base Tomcat Web Server Tomcat Web Server + Portlet Container iGoogle Client Aggregator Compile and deploy into server Decorate with bridge and container jars, xml config files. GTLAB gadgets can also run as portlets with no code changes by using the JSF portlet bridge.

11. Tomcat + Portlets and Container Grid and Web Services (TeraGrid, OSG, etc) Grid and Web Services (TeraGrid, OSG, etc) Grid and Web Services (TeraGrid, OSG, etc) HTML/HTTP SOAP/HTTP Common science gateway architecture. Aggregation is in the portlet container. Users have limited selections of components.

12. Other Gadgets Providers Tomcat + GTLAB Gadgets Grid and Web Services (TeraGrid, OSG, etc) Other Gadgets Providers Social Network Services (Orkut, LinkedIn,etc) RSS Feed, Cloud, etc Services Gadget containers aggregate content from multiple providers. Content is aggregated on the client by the user. Nearly any web application can be a simple gadget (as Iframes)

13. Making GTLAB Gadgets into Portlets Do all development in jsf_standalone. When you are ready to convert: cd GTLAB/transition mvn clean process-resources cd GTLAB/portlets mvn clean install You will need to manually edit portlet.xml, group.xml, and layout.xml in GTLAB/portlet/src/main/webapp/WEB-INF/ That’s it.

14. Making GTLAB Google Gadgets A Gadget is a standalone application that is integrated into your personal iGoogle display. They can run on your Web server. You can use SSL/HTTPS Google Gadgets have two versions http: these use Google’s JavaScript APIs url: these wrap external applications with IFrames. Limitations: Not much real estate (but location, location, location) Cookies manage state on gadgets from the same server but we need a way to integrate multiple independent servers.

15. Click “Add stuff” and then “Add feed or gadget”. Type the URL of your gadget.

16. GTLAB Applications as Google Gadgets: MOAB dashboard, remote directory browser, and proxy management.

17. Various GTLAB applications deployed as portlets: Remote directory browsing, proxy management, and LoadLeveler queues.

18. Example Gadget Config File <ModulePrefs title="MyProxy Gadget Example" scrolling="true" height="500"/> <Content type="url" href="http://…/:8080/GTLAB/examples/MyProxyExample.jsf"> Save this as MyProxy.xml and place in a Web accessible place.

19. Some Web 2.0 Resources See recent tutorials by Geoffrey Fox and me: http://grids.ucs.indiana.edu/ptliupages/pres entations/Web2.0Tutorial.ppt http://grids.ucs.indiana.edu/ptliupages/pres entations/Web2.0Tutorial.ppt http://grids.ucs.indiana.edu/ptliupages/pres entations/CTSTechFutures_May19-08.pptx http://grids.ucs.indiana.edu/ptliupages/pres entations/CTSTechFutures_May19-08.pptx Includes material on Google Gdata, Facebook API, Open Social, Microformats, etc. See also full examples at http://communitygrids.blogspot.com http://communitygrids.blogspot.com