Download - Www.eu-etics.org INFSOM-RI-026753 The ETICS Web Portal WP5 activity Tomasz Kokoszka CERN/WP5
www.eu-etics.org
INFSOM-RI-026753
The ETICS Web PortalThe ETICS Web PortalWP5 activityWP5 activity
Tomasz KokoszkaTomasz Kokoszka
CERN/WP5CERN/WP5
INFSOM-RI-026753
Agenda
• Motivation and goals for the ETICS web-portalMotivation and goals for the ETICS web-portal• ArchitectureArchitecture• Technology behind (GWT)Technology behind (GWT)• Current status of workCurrent status of work
• 15 slides, ~20minutes15 slides, ~20minutes
INFSOM-RI-026753
Motivation, goals
• Single start point for all web base applicationsSingle start point for all web base applications• Common look and behaviorCommon look and behavior• Implementation of common functionality, likeImplementation of common functionality, like
– AuthenticationAuthentication– Web-service accessWeb-service access– Mail sendingMail sending– Exception handlingException handling– Common UI componentsCommon UI components– Configuration file handlingConfiguration file handling
• Interaction between applicationsInteraction between applications
• That is exactly what ETICS portal is aboutThat is exactly what ETICS portal is about
INFSOM-RI-026753
Example
• https://etics-test.cern.ch:8443/eticsPortal/https://etics-test.cern.ch:8443/eticsPortal/banner
user information
Tabs to select an application (portlet)
Selected application
Common UI components
INFSOM-RI-026753
Embedded applications (portlets)
• User self registrationUser self registration• AdministrationAdministration• Web ClientWeb Client• ETICS Repository browserETICS Repository browser• My ETICSMy ETICS
INFSOM-RI-026753
Architecture - client-server
Web browser Application server Remote services
Rich client
technology:
GWT
Java Script
CSS
Server
technology:
GWT, Java
Web-Service
build-system
Web-Service
repository
Real simple
RPC
(GWT)
INFSOM-RI-026753
Implementation based on GWT
• Google Web ToolkitGoogle Web Toolkit is a framework to program client is a framework to program client side of web applications and interaction between client side of web applications and interaction between client and server side using Java language.and server side using Java language.
• Provides a compiler from Java 1.4 (with limitations) to Provides a compiler from Java 1.4 (with limitations) to JavaScript:JavaScript:– Generates separate sets of JS files for every supported browserGenerates separate sets of JS files for every supported browser– During execution time loads one proper for remote browserDuring execution time loads one proper for remote browser
INFSOM-RI-026753
Implementation based on GWT
• Main advantages:Main advantages:– Great performance and browser compatibilityGreat performance and browser compatibility– Static code checking (compilation), types, build-in serialization Static code checking (compilation), types, build-in serialization
mechanismmechanism– Isolates from HTML, all visual components and actions wrapped Isolates from HTML, all visual components and actions wrapped
inside GWT widgets (similar to SWING approach)inside GWT widgets (similar to SWING approach)– Look customized by CSSLook customized by CSS
• GWT Real Simple RPC mechanism:GWT Real Simple RPC mechanism:– Automatic object serialization/deserialization (similar to Automatic object serialization/deserialization (similar to
java.io.Serializable)java.io.Serializable)– Only asynchronous callsOnly asynchronous calls– Communication initiated only by client sideCommunication initiated only by client side
INFSOM-RI-026753
Architecture - components
portal
portlet 1
portlet 2
portlet N commons
BA
Module A depends on B
INFSOM-RI-026753
Architecture - components
• PortalPortal– Starting point:Starting point:
– Authenticates remote user, initializes server sideAuthenticates remote user, initializes server side– Initializes registered portlets, organizes portlets in tabsInitializes registered portlets, organizes portlets in tabs– Provides information exchange mechanism for portletsProvides information exchange mechanism for portlets
– ETICS component name: org.etics.portal.new-applicationETICS component name: org.etics.portal.new-application– Artifact: eticsPortalWA.warArtifact: eticsPortalWA.war
INFSOM-RI-026753
Architecture - components
• CommonsCommons– Provides common functionality:Provides common functionality:
– Reusable UI components + CSSReusable UI components + CSS– Wrapper for build web-service based on 2 design pattern: faWrapper for build web-service based on 2 design pattern: faççade & ade &
transport objectstransport objects– Mail senderMail sender– Configuration file loaderConfiguration file loader– AuthenticationAuthentication
– ETICS component name: org.etics.portal.web-commonsETICS component name: org.etics.portal.web-commons– Artifact: eticsWebCommons.jarArtifact: eticsWebCommons.jar
INFSOM-RI-026753
Architecture - components
• Portlet:Portlet:– Emended application providing starting point in form of a Java Emended application providing starting point in form of a Java
class implementing dedicated interfaceclass implementing dedicated interface– Implements both client & server sideImplements both client & server side– ETICS component name: org.etics.*.web-portletETICS component name: org.etics.*.web-portlet– Artifact: etics*Portlet.jarArtifact: etics*Portlet.jar
INFSOM-RI-026753
Status
• Portal:Portal:– Prototype availablePrototype available– Missing parts:Missing parts:
– Mechanism to exchange information between portletsMechanism to exchange information between portlets
– Mechanism to automatically add new portletsMechanism to automatically add new portlets
– DocumentationDocumentation
• Commons:Commons:– Prototype availablePrototype available– Missing parts:Missing parts:
– Major UI components, like ETICS module hierarchy, Wizard creator etc.Major UI components, like ETICS module hierarchy, Wizard creator etc.
– CSS compliant with ETICS color schemeCSS compliant with ETICS color scheme
– DocumentationDocumentation
• Portlets:Portlets:– User self registration – availableUser self registration – available– Administration – in progressAdministration – in progress– My ETICS – in design stageMy ETICS – in design stage
INFSOM-RI-026753
People involved
• Marc-Elian BMarc-Elian Bégin – managerégin – manager• Lorenzo Dini – consultance, designLorenzo Dini – consultance, design• Alberto Conte – CSS Alberto Conte – CSS refactorrefactor• Tomasz Kokoszka – main Tomasz Kokoszka – main developerdeveloper
INFSOM-RI-026753
Questions
QUESTIONS