Building Portlets Building Portlets with Ajax Behavior with ...
Modelado de la agregración de portlets por medio de statecharts
description
Transcript of Modelado de la agregración de portlets por medio de statecharts
![Page 1: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/1.jpg)
Modelado de la agregración de portlets por medio de
statecharts
O. Díaz, A. Irastorza, M. Azanza, F.M. VilloriaONEKIN Research group
University of the Basque Country San Sebastián (Spain)
5 octubre 2006
Jornadas de Ingeniería del Software y Bases de Datos
![Page 2: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/2.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 2
El portal como agregador de portlets
![Page 3: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/3.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 3
Portlets. Definición
2Hand Car Database
Search for Cars
“Los portlets son Servicios Web interactivos, con interfaz de usuario y que pueden ser incrustados en
aplicaciones de organizaciones externas”
Flow +Presentation
BusinessLogic
Data
Complete Web Application
![Page 4: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/4.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 4
PORTAL
TAREAS ORQUESTACIÓN VISUALIZACIÓN
<<merge>>
EXO
PIM
PSM
![Page 5: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/5.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 5
PORTAL
TAREAS ORQUESTACIÓN VISUALIZACIÓN
<<merge>>
EXO
PIM
PSM
![Page 6: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/6.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 6
Tarea: ACM portlet
ACM
![Page 7: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/7.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 7
ISIWOKDelicious
Store
DBLP
![Page 8: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/8.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 8
Metamodelo de tareas
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
![Page 9: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/9.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 9
PORTAL
TAREAS
ORQUESTACIÓN VISUALIZACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
![Page 10: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/10.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 10
PORTAL
TAREAS
ORQUESTACIÓN VISUALIZACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
![Page 11: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/11.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 11
El portal como agregador de portlets
![Page 12: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/12.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 12
El portal como agregador de portlets
![Page 13: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/13.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 13
El portal como agregador de portlets
DIAGRAMAS
DE
TRANSICIÓN
DE ESTADOS
![Page 14: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/14.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 14
DTE para modelar la orquestación
Transición: abstracción de la interacción de un usuario
Estado atómico: una unidad de visualización (p.e. un portlet)
Estado AND: agrupa “n” estados activos simultáneamente
Estado OR: agrupa “n” estados disjuntos
DTE = estados + transiciones
![Page 15: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/15.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 15
Diseño de la orquestación del portal
PaperSearch
IEEESearch
ACMSearch
AuthorSearch
CiteSeerSearch
DBLPSearch
2AuthorSearch
![Page 16: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/16.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 16
Diseño de la orquestación del portal
2AuthorSearch
2PaperSearch
SearchPaperSearch
IEEESearch
AuthorSearch
CiteSeerSearch
DBLPSearch
deliciousStore
2Delicious
2Search
ISIWoK
2ISIACMSearch
Browser
![Page 17: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/17.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 17
Metamodelo de orquestaciónStateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
< Metamodelo UML >
![Page 18: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/18.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 18
PORTAL
TAREASORQUESTACIÓN
VISUALIZACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
StateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
![Page 19: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/19.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 19
VISUALIZACIÓN
PORTAL
TAREASORQUESTACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
StateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
![Page 20: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/20.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 20
Visualización del portal
Estructura del portal
Presentación del portal
Páginas
Estética
![Page 21: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/21.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 21
Visualización del portal. Páginas
En nuestro contexto, una página es un conjunto de portlets que son visulizados simultáneamente
Es decir, una CONFIGURACIÓN DE ESTADOS
![Page 22: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/22.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 22
Configuraciones de estados. Ejemplo
Página1={Browser, Search, PaperSearch, IEEESearch,ACMSearch}
Página2 = { Browser, Search, AuthorSearch, DBLPSearch, citeSeerSearch }
Página3 = { Browser, deliciousStore }
Página4 = { Browser, ISIWoK }
![Page 23: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/23.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 23
Visualización del portal
Las páginas (estructura) del portal se generan automáticamente a partir del DTE
La navegación entre páginas también se deriva del DTE
![Page 24: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/24.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 24
Configuraciones de estados. Ejemplo
Página1={Browser, Search, PaperSearch, IEEESearch,ACMSearch}
Página2 = { Browser, Search, AuthorSearch, DBLPSearch, citeSeerSearch }
Página3 = { Browser, deliciousStore }
Página4 = { Browser, ISIWoK }
2AuthorSearch
2Search
Incrustar un ancla en la página
![Page 25: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/25.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 25
anchor2event state2page
map
ping
Configuración
Páginaancla
Páginas del portal
cjtos. de fragmentos que provienen de los
portlets + anclas
+ Parámetros presentación
cont
rolle
r
evento
![Page 26: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/26.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 26
Visualización del portal. Estética
PortalAppDescriptor • Describe el formato externo, la estructura,
con el que se presentará el conjunto de los portlets y las anclas
WindowAppDescriptor y AnchorAppDescriptor
• Describen el formato externo con el que se presentarán los portlets y las anclas incluidos en el portal
• Describen la estética de presentación del contenido de los portlets y de las anclas
![Page 27: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/27.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 27
Página2 = {Browser, Search, AuthorSearch,
DBLPSearch, citeSeerSearch }
PortalAppDescriptor {transition=anchor; distribution=detached; position=top; backgrd=white;…}WindowAppDescriptor {alignment=row; background=yellow; borderColor=orange;
fontFamily=times; color=black; fontSize=12pt; fontStyle=normal; …}AnchorAppDescriptor { background=orange; fontFamily=arial; color=black; fontSize=10pt;…}
![Page 28: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/28.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 28
PortalAppDescriptor {transition=anchor; distribution=detached; position=top; backgrd=white;…}WindowAppDescriptor {background=yellow; borderColor=orange; fontFamily=times;
color=black; fontSize=12pt; fontStyle=normal; …}AnchorAppDescriptor { background=orange; fontFamily=arial; color=black; fontSize=10pt;…}
Página3 = { Browser, deliciousStore }
![Page 29: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/29.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 29
PortalAppDescriptor {transition=anchor; distribution=detached; position=top; backgrd=white;…}WindowAppDescriptor {background=white; borderColor=white; fontFamily=times;
fontStyle=normal; color=yellow; fontSize=12pt; …}AnchorAppDescriptor { background=orange; fontFamily=arial; color=black; fontSize=10pt;…}
Página4 = { Browser, ISIWoK }
No hay reutilización
No hay abstracción
![Page 30: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/30.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 30
Usar la jerarquía en DTE para estructurar los parámetros de presentación
Añadir parámetros de presentación al DTE
Herencia de parámetros
![Page 31: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/31.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 31
AcademicBrowser
Visualización del portal. Estética
2AuthorSearch
2PaperSearch
SearchPaperSearch
IEEESearch
AuthorSearch
CiteSeerSearch
DBLPSearch
deliciousStore
2Delicious
2Search
ISIWoK
2ISIACMSearch
Browser
PortalAppDescriptor {transition=anchor; distribution=detached; position=top; background=white; borderStyle=none; borderColor=transparent; borderWidth=0px}
WindowAppDescriptor {alignment=column; background=yellow; borderStyle=solid; borderColor=blue; borderWidth=4px; fontFamily=times; color=black; fontSize=12pt; fontStyle=normal; textAlign=justify}
AnchorAppDescriptor { background=orange; borderStyle=none; borderColor=transparent; borderWidth=0px; fontFamily=arial; color=black; fontSize=10pt; fontStyle=italic; textAlign=justify}
![Page 32: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/32.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 32
AcademicBrowser
Visualización del portal. Estética
2AuthorSearch
2PaperSearch
SearchPaperSearch
IEEESearch
AuthorSearch
CiteSeerSearch
DBLPSearch
deliciousStore
2Delicious
2Search
ISIWoK
2ISIACMSearch
Browser
WindowAppDescriptor {background=white; fontFamily=courier}
AnchorAppDescriptor { }
PortalAppDescriptor {transition=anchor; distribution=detached; position=top; background=white; borderStyle=none; borderColor=transparent; borderWidth=0px}
WindowAppDescriptor {alignment=column; background=yellow; borderStyle=solid; borderColor=blue; borderWidth=4px; fontFamily=times; color=black; fontSize=12pt; fontStyle=normal; textAlign=justify}
AnchorAppDescriptor { background=orange; borderStyle=none; borderColor=transparent; borderWidth=0px; fontFamily=arial; color=black; fontSize=10pt; fontStyle=italic; textAlign=justify}
AnchorAppDescriptor {background=green}
![Page 33: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/33.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 33
Metamodelo de visualización
13..*
-file
Banner
-file
Footer
10..1
1
0..1
-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType-fontFamily : FontFType-fontSize : FontSType-fontStyle : FontStyleType-color : ColorType-textAlign : TextAType
AppearanceDescriptor
-transition : TransitionType-distribution : DistributionType-position : PositionType-textPosition : PositionType-presentationDef : PresentationType-alignment : AlignmentType-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType
PortalAppDescriptor
-position : PositionType-alignment : AlignmentType
WindowAppDescriptor
-override : Boolean
AnchorAppDescriptor
-displayName : String-portletName : String
Anchor1..*1
-displayName : String-portletName : String
TextAppDescriptor
![Page 34: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/34.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 34
PORTAL
TAREASORQUESTACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
StateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
VISUALIZACIÓN
13..*
-file
Banner
-file
Footer
10..1
1
0..1
-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType-fontFamily : FontFType-fontSize : FontSType-fontStyle : FontStyleType-color : ColorType-textAlign : TextAType
AppearanceDescriptor
-transition : TransitionType-distribution : DistributionType-position : PositionType-textPosition : PositionType-presentationDef : PresentationType-alignment : AlignmentType-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType
PortalAppDescriptor
-position : PositionType-alignment : AlignmentType
WindowAppDescriptor
-override : Boolean
AnchorAppDescriptor
-displayName : String-portletName : String
Anchor1..*1
-displayName : String-portletName : String
TextAppDescriptor
![Page 35: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/35.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 35
PORTAL
TAREASORQUESTACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
StateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
VISUALIZACIÓN
13..*
-file
Banner
-file
Footer
10..1
1
0..1
-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType-fontFamily : FontFType-fontSize : FontSType-fontStyle : FontStyleType-color : ColorType-textAlign : TextAType
AppearanceDescriptor
-transition : TransitionType-distribution : DistributionType-position : PositionType-textPosition : PositionType-presentationDef : PresentationType-alignment : AlignmentType-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType
PortalAppDescriptor
-position : PositionType-alignment : AlignmentType
WindowAppDescriptor
-override : Boolean
AnchorAppDescriptor
-displayName : String-portletName : String
Anchor1..*1
-displayName : String-portletName : String
TextAppDescriptor
![Page 36: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/36.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 36
Plataforma eXo
Ofrece un núcleo común extensible y configurable para la construcción de portales
La funcionalidad, estructura, orquestación y visualización del portal se describen a través de ficheros de configuración:
• browser-config.xml• browser-pages.xml• browser-navigation.xml• skin-config.xml• browser.css
![Page 37: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/37.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 37
<page-set xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<page renderer="PageRowRenderer" decorator="academicBrowserPageDecorator">
<owner>@owner@</owner>
<name>/home</name><title>SearchingInPapers</title><viewPermission>any</viewPermission><editPermission>owner</editPermission><container renderer="ContainerRowRenderer" decorator="academicBrowserTransparentDecorator">
<portlet renderer="PortletRenderer" decorator="ToIsiSDecorator"><portlet-style>ToIsiSStyle</portlet-style><showInfoBar>false</showInfoBar><title>Step Navigation</title><windowId>@owner@:/navigationstep/step/E5</windowId><portlet-preferences>
<preference><name>transitionTitle</name><value>2Isi</value><read-only>false</read-only>
</preference><preference>
<name>defaultPageName</name><value>SC4</value><read-only>false</read-only>
</preference></portlet-preferences>
</portlet></container><portlet renderer="PortletRenderer" decorator="acmSearchPDecorator">
<portlet-style>acmSearchPStyle</portlet-style><title>acmSearch</title><windowId>@owner@:/acmLibrary/acmLibrary/S6</windowId>
</portlet>…
</page-set>
browser-pages.xml
![Page 38: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/38.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 38
Metamodelos eXo (I)
-owner[1]-locale[1]-viewPermission[0..1]-editPermission[0..1]
Portal Config
-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portal Layout
1
1
-windowId[1]-title[0..1]-portlet-style[0..1]-showInfoBar[0..1]-showWindowState[0..1]-showPortletMode[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portlet
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
0..1*1
0..1
-*id[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Container
0..1
*
0..1
*
**-config.xml
-componentType[1]-componentId[1]
Body
10..1
0..1
*
![Page 39: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/39.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 39
Metamodelos eXo (II)
Page-Set
-owner[1]-name[1]-title[1]-viewPermission[1]-editPermission[1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Page
1
1..*
-windowId[1]-title[0..1]-portlet-style[0..1]-showInfoBar[0..1]-showWindowState[0..1]-showPortletMode[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portlet
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
1
0..1
-*id[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Container
0..1*
0..1*
0..1
*
0..1
*
**-pages.xml
-owner[1]
Node Navigation
-uri[1]-name[0..1]-label[1]-viewPermission[0..1]-editPermission[0..1]-description[0..1]-pageReference[1..*]
Node
0..1
1
0..1
*
**-navigation.xml
![Page 40: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/40.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 40
PORTAL
TAREASORQUESTACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
StateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
VISUALIZACIÓN
13..*
-file
Banner
-file
Footer
10..1
1
0..1
-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType-fontFamily : FontFType-fontSize : FontSType-fontStyle : FontStyleType-color : ColorType-textAlign : TextAType
AppearanceDescriptor
-transition : TransitionType-distribution : DistributionType-position : PositionType-textPosition : PositionType-presentationDef : PresentationType-alignment : AlignmentType-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType
PortalAppDescriptor
-position : PositionType-alignment : AlignmentType
WindowAppDescriptor
-override : Boolean
AnchorAppDescriptor
-displayName : String-portletName : String
Anchor1..*1
-displayName : String-portletName : String
TextAppDescriptor
-owner[1]-locale[1]-viewPermission[0..1]-editPermission[0..1]
Portal Config
-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portal Layout
1
1
-windowId[1]-title[0..1]-portlet-style[0..1]-showInfoBar[0..1]-showWindowState[0..1]-showPortletMode[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portlet
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
0..1*1
0..1
-*id[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Container
0..1
*
0..1
*
**-config.xml
-componentType[1]-componentId[1]
Body
10..1
0..1
*
Page-Set
-owner[1]-name[1]-title[1]-viewPermission[1]-editPermission[1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Page
1
1..*
-windowId[1]-title[0..1]-portlet-style[0..1]-showInfoBar[0..1]-showWindowState[0..1]-showPortletMode[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portlet
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
1
0..1
-*id[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Container
0..1*
0..1*
0..1
*
0..1
*
**-pages.xml
-owner[1]
Node Navigation
-uri[1]-name[0..1]-label[1]-viewPermission[0..1]-editPermission[0..1]-description[0..1]-pageReference[1..*]
Node
0..1
1
0..1
*
**-navigation.xml
skin-config.xmlSkin Config
Portal Decorators
-renderer-type
Decorator
-name-url
Style
Page Decorators Container Decorators Portlet Decorators
-portlet-name
Portlet-Style-Config
1 *10..1
1..* * *
1..*
10..1
1
0..11
0..1
1*
1
*
1
*
-
cssClassSet
-name[1]-background[0..1]-border-style[0..1]-border-width[0..1]-border-color[0..1]
Container-Class
-name[1]-background[0..1]-border-style[0..1]-border-width[0..1]-border-color[0..1]
Decorator-Class
-name[1]-font-family[0..1]-font-size[0..1]-font-style[0..1]-text-align[0..1]-color[0..1]
Portlet-Class
{portalTitle}.css
1 *1*1*
![Page 41: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/41.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 41
PORTAL
TAREASORQUESTACIÓN
<<merge>>
EXO
PIM
PSM
-id : String-portalTitle : String-userProfile : String
Portal
-windowTitle : String-displayName : String-portletName : String-windowState : String-portletMode : String-showInfoBar : Boolean
Portlet
11..*
-text : String
HelpingText
1*
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
10..1
StateMachine
0..1
1..*
-isComposite-isOrthogonal-isSimple
State
-name
Transition
FinalState
-name
Vertex
Region0..1
* 1 *
0..1
*
-source
1 *
-target
1 *
Behavior
-kind : PseudoStateKind
Pseudostate
StateConfiguration
11..*
0..1
-exit-doActivity
Trigger
Constraint
0..1
0..1
-entry
0..1
0..1
0..1
0..1*
VISUALIZACIÓN
13..*
-file
Banner
-file
Footer
10..1
1
0..1
-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType-fontFamily : FontFType-fontSize : FontSType-fontStyle : FontStyleType-color : ColorType-textAlign : TextAType
AppearanceDescriptor
-transition : TransitionType-distribution : DistributionType-position : PositionType-textPosition : PositionType-presentationDef : PresentationType-alignment : AlignmentType-borderStyle : BorderSType-borderWidth : String-background : BackgroundCType-borderColor : ColorType
PortalAppDescriptor
-position : PositionType-alignment : AlignmentType
WindowAppDescriptor
-override : Boolean
AnchorAppDescriptor
-displayName : String-portletName : String
Anchor1..*1
-displayName : String-portletName : String
TextAppDescriptor
-owner[1]-locale[1]-viewPermission[0..1]-editPermission[0..1]
Portal Config
-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portal Layout
1
1
-windowId[1]-title[0..1]-portlet-style[0..1]-showInfoBar[0..1]-showWindowState[0..1]-showPortletMode[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portlet
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
0..1*1
0..1
-*id[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Container
0..1
*
0..1
*
**-config.xml
-componentType[1]-componentId[1]
Body
10..1
0..1
*
Page-Set
-owner[1]-name[1]-title[1]-viewPermission[1]-editPermission[1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Page
1
1..*
-windowId[1]-title[0..1]-portlet-style[0..1]-showInfoBar[0..1]-showWindowState[0..1]-showPortletMode[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Portlet
Portlet Preferences
-name[1]-read-only[0..1]-value[1..*]
Preference
1
1..*
1
0..1
-*id[0..1]-*renderer[0..1]-*decorator[0..1]-*width[0..1]-*height[0..1]
Container
0..1*
0..1*
0..1
*
0..1
*
**-pages.xml
-owner[1]
Node Navigation
-uri[1]-name[0..1]-label[1]-viewPermission[0..1]-editPermission[0..1]-description[0..1]-pageReference[1..*]
Node
0..1
1
0..1
*
**-navigation.xml
skin-config.xmlSkin Config
Portal Decorators
-renderer-type
Decorator
-name-url
Style
Page Decorators Container Decorators Portlet Decorators
-portlet-name
Portlet-Style-Config
1 *10..1
1..* * *
1..*
10..1
1
0..11
0..1
1*
1
*
1
*
-
cssClassSet
-name[1]-background[0..1]-border-style[0..1]-border-width[0..1]-border-color[0..1]
Container-Class
-name[1]-background[0..1]-border-style[0..1]-border-width[0..1]-border-color[0..1]
Decorator-Class
-name[1]-font-family[0..1]-font-size[0..1]-font-style[0..1]-text-align[0..1]-color[0..1]
Portlet-Class
{portalTitle}.css
1 *1*1*
ReglasRubyTL
Colaboración Univ. Murcia
![Page 42: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/42.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 42
Taskmetamodel
Orchestrat. metamodel
Rendering metamodel
EXO metamodelbrowser.css
Portal
portalTitle= {portalTitle}
RootState
PortalAppDescriptor
presentationDef= “portal”
{borderStyle}{borderWidth}
{backgroundColor}{borderColor}
.{portalTitle}PageDecorator { {AttributesPD} }
.{portalTitle}CDecorator { {AttributesCD} }
.{portalTitle}TransparentDecorator { background: transparent; border-style: none }
WindowAppDescriptor
{borderStyle}{borderWidth}
{backgroundColor}{borderColor}
.{portalTitle}PDecorator { {AttributesWD} }
…
Transformaciones
![Page 43: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/43.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 43
TransformacionesTask
metamodelOrchestr.
metamodelRendering metamodel
EXO metamodelskin-config.xml
Portal
portalTitle= {portalTitle}
RootState PortalAppDescriptor
presentationDef=“portal”
<page-decorators><decorator>
<renderer-type>PageRowRenderer</renderer-type>
<style name="{portalTitle}PageDecorator" url="/…/../{portalTitle}.css"/></decorator> …
</page-decorators><portlet-decorators>
<decorator><renderer-type>PortletRenderer</renderer-
type><style name="{portalTitle}PDecorator"
url="/…/../{portalTitle}.css"/></decorator>
</portlet-decorators> <portlet-decorators><decorator>
<renderer-type>PortletRenderer</renderer-type>
<style name="{portalTitle}AnchorDecorator“ url="/…/.../{portalTitle}.css"/>
</decorator></portlet-decorators>…
![Page 44: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/44.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 44
Taskmetamodel
Orchestrat.metamodel
Renderingmetamodel
EXO metamodelbrowser-pages.xml
Portal
portalTitle= {portalTitle}
stateConfig.RootState
name={Name}
PortalAppDescriptor
transition=”anchor”distribution=”together”
position=”top”
<page renderer="PageRowRenderer” decorator="{portalTitle}PageDecorator">
<owner>@owner@</owner><name>”/config”+{Name}+
apply_templates_select(children(RootState))</name><viewPermission>any</viewPermission><editPermission>owner</editPermission>
<container renderer="ContainerColumnRenderer”
decorator="{portalTitle}TransparentDecorator">
apply_templates_select(transition(config))
</container>
apply_templates_select(children(RootState))
</page>
Transformaciones
![Page 45: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/45.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 45
Conclusiones
Un método para el diseño de portales agregadores de portlets• Basado en DTEs para el comportamiento• Utiliza la jerarquía de los estados de un DTE
para definir la visualización
Enfoque MDA• Modelo complejo• Transformaciones recursivas• Se genera todo el código
¡¡¡¡ FUNCIONA !!!!
![Page 46: Modelado de la agregración de portlets por medio de statecharts](https://reader035.fdocuments.in/reader035/viewer/2022062800/56814210550346895dae1676/html5/thumbnails/46.jpg)
O. Díaz, A. Irastorza, M. Azanza, F.M. Villoria 46
Contacto
Arantza [email protected]
http://www.onekin.org