Web ml
-
Upload
tazeen-fakih -
Category
Software
-
view
112 -
download
4
description
Transcript of Web ml
![Page 1: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/1.jpg)
Model-driven design of Web applications
Piero Fraternali, Marco Brambilla9 novembre 2002
[email protected]@polimi.it
![Page 2: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/2.jpg)
http://www.webratio.com
WIS selection!
This presentation contains a selection of the original presentation, specifically
made for use in the WIS course!
For more information go to the website.
![Page 3: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/3.jpg)
Web Modeling Language (WebML)
WebML: a conceptual language for high-level design of data-intensive Web applicationsDefined in 1998, in use for more than six yearsWidely published: Ceri, Fraternali at al. Designing data-intensive Web applications, Morgan Kauffman, Dec. 2002Adopted in many universities worldwideCommercially implemented (www.webratio.com)Used for developing several applications:
www.acer-euro.com, www.aceradvantage.com, www.elet.polimi.it, www.image.co.uk,...
![Page 4: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/4.jpg)
WebML basic concepts
Web application = Structure + Hypertext + Presentation
structure
entities,relationships
navigation + composition + user model
units, pages, links, site views
presentation
styles
![Page 5: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/5.jpg)
http://www.webratio.com
1. Data Modelling
Model-driven design of Web applications
Piero Fraternali, Marco Brambilla9 novembre 2002
[email protected]@elet.polimi.it
![Page 6: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/6.jpg)
Data Modeling: Purpose
Q: what are the objects published in the site, what are their properties, how are they related?
A: Structure model primitivesEntity: a class of objects in the application domainAttribute: a property of an entityRelationship: a connection between entitiesIS-A hierarchy: for classification and grouping
MODEL
![Page 7: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/7.jpg)
Entity and RelationshipEntities are boxes, labelled with the entity name in the upper half of the boxAttributes are listed in the lower half of the entity box (optional)
Relationships are represented by a solid line between two entity boxesISA hierarchies are denoted by an arrow pointing from the sub-entity (more specific concept) the the super-entity (general concept)
Entity1Entity2
SubEntity
attribute1
MODEL
![Page 8: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/8.jpg)
Relationship role
A relationship role is one of the two “directions” under which a relationship can be regardedRelationship roles have user defined names
E.g.: Relationship Author_Book may have the rolesRole 1: author2bookRole 2: book2author
BookAuthor author2book
book2authorAuthor_Book
MODEL
![Page 9: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/9.jpg)
Relationship cardinality
For each direction of the relationship, maximum and minimum cardinality contraints can be specified
E.g. relationship Author_Bookauthor2book minCard: 0 maxCard: Nbook2author minCard: 1 maxCard: N
It reads: an author may produce zero or more books, a book may have one or more authors
BookAuthor 0..N
1..N
MODEL
![Page 10: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/10.jpg)
ISA hierarchy
A IS-A hierarchy is a special connection between two entities that implies that one entity (the sub-entity) is a special case of the other one (the super-entity)The sub-entity inherits the properties of the super-entityIS-A hierarchies may have several levels (e.g, book, novel, thriller..)
Book
Novel Biography
Thriller
MODEL
![Page 11: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/11.jpg)
Example: Acme e-Catalog
Acme is a small furniture company, which sells products thru stores located all over the world. Now, ACME wants to build a Web site for publishing a product catalog and attracting new customers. The site should include information about products, special offers, i.e. combinations of products sold at a discounted price, and stores. Products are associated to a technicalrecord. Products may have several enlarged images.
RUNNING CASE
![Page 12: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/12.jpg)
ACME Complete structure model (initial version)
Store
Location: stringMap: imageURL: URLEmail: URL
Product
Name: stringCode: integerPrice: floatDescription:textThumbnail:image
Combination
Name: stringPrice: floatDescription:textPhoto:image
Tech record
Colors:imageSize: text
Big image
Description: textPhoto:image
RUNNING CASE
0:N
0:N
1:1
0:10:N
1:1
![Page 13: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/13.jpg)
http://www.webratio.com
2. Hypertext Modelling
Model-driven design of Web applications
Piero Fraternali, Marco Brambilla9 novembre 2002
[email protected]@elet.polimi.it
![Page 14: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/14.jpg)
Hypertext Model:purpose
Goals: Modelling at a high level the front-end of a dynamic
Web application and the interactions with the back end business logic and dataUsing a simple, yet formal, visual notationEnabling automatic generation of dynamic page
templates and data access and manipulation queries
MODEL
![Page 15: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/15.jpg)
•Q1: what is the experience of the site that the user can achieve?
•Q2: how is the hypertext divided into pages served to users?•Q3: what information is published in the hypertext nodes? •Q4: how are the hypertext nodes connected?
•A1: siteviews•A2: pages•A3: content units•A4: links
Hypertext Model:questions
MODEL
![Page 16: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/16.jpg)
DATAUNIT INDEXUNIT MULTIDATAUNIT
ENTRYUNIT SCROLLERUNIT
entity[Selector]
Content:• instances of an entity
Basic Content Units
MODEL
entity[Selector]
entity[Selector]
entity[Selector]
MULTICHOICE
entity[Selector]
Selector:• set of conditions
HIERARCHICAL
entity[Selector]
![Page 17: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/17.jpg)
DATAUNIT INDEXUNIT MULTIDATAUNIT
ENTRYUNIT SCROLLERUNIT
Meaning of Content Units
Authorfirst name:XXXlast name:YYYphoto:
Index of Authors
•S. Ceri•P. Fraternali•O.Versand
All Authors
Browse Authors
5/12: go to 1/12
MODEL
Insert Your Data
•Fname•Lname
MULTICHOICE
Choose Authors
CeriFraternaliVersand
HIERARCHICAL
Books&Authors1. Web Applicat.
CeriFraternali
2. SystemsTannenbaum
![Page 18: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/18.jpg)
Content Units
A WebML unit is the atomic information publishing element
It is a “view” defined upon a container of objects:All the instances of an entityInstances of an Entity that meet a selection condition called selector
unitX
container
MODEL
![Page 19: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/19.jpg)
Unit input and output
A unit may need some “context” to be computedEach unit exposes input and output parametersInput is required to compute the unit itself
Parameters pre-defined for the unit +Other parameters required by the selector of the unit
Output can be used to compute other unit(s) depending on the current unit
unitX
entity[selector (par 1, .., parN)]
IN OUT
MODEL
![Page 20: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/20.jpg)
Navigation:contextual links
•A contextual link is an oriented connection between two units (source unit and target unit), normally rendered by means of anchors or submit buttons• Purpose of a contextual link: •Allowing the user to move from one place to another•Transporting information from one place to another•Activating a computation (side effect)
AuthorAuthor
MODEL
source unit target unit
![Page 21: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/21.jpg)
Authorfirst name:Jameslast name:Joycephoto:
Author[OID=p1]
Book[author2book(p2)]
Book[OID=p3]
BookTitle:UlyssesPrice:23$Cover:
Which author’s books? Which book?
Books of YYY
•Ulysses•The Dubliners•Portrait...
Example of links
MODEL
p1 p2 p3
![Page 22: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/22.jpg)
Link Parameters
Book[Author2Book(param)]
•Context is transported through links using link parameters•A link parameter is defined by:•Name•Source: one of the output parameters of the source
unit•Target: one of the input parameters of the target unit
Author
MODEL
param
![Page 23: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/23.jpg)
Default Link Parameters
AuthorBook
[Author2Book]
•Whenever possible, link parameters are inferred from the diagram and need not be explicitly specified •Diagrams become simpler and more readable•Example:
MODEL
![Page 24: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/24.jpg)
Defaults for selectors
•Whenever possible, selectors and their parameters are inferred from the diagram and need not be explicitly specified • Example:
MODEL
Author Book[author2book]
Book
![Page 25: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/25.jpg)
Automatic Links
•An automatic link passes some default context to the destination unit immediately after the display of the source unit, without the user intervention
• Subsequently, the user can change the passed context by choosing a different object, using the anchor(s) representing the link
AuthorAuthor
MODEL
source unit target unitA
![Page 26: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/26.jpg)
Transport Links
AuthorBook
[Author2Book]
•A transport link has a default context that is passed to the target unit immediately after the display of the source unit, without the user intervention• The user cannot change the default context and
therefore the link is not rendered with an anchor
MODEL
source unit target unit
![Page 27: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/27.jpg)
DataUnit
Data unitsPublish information about ONE SINGLE INSTANCEONE SINGLE INSTANCE
The container is an entity with (optional) selectorInput:
OID of the object to be published, ORParameters requested for the computation of the selector, like:
Attribute values
OID of object participant to a relationship role
Output: OID of the published object (and its attributes)
Entity[selector(params)]
params OID
MODEL
![Page 28: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/28.jpg)
ACME: data unit inProduct page
Information about a onespecific product
RUNNING CASE
Product
![Page 29: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/29.jpg)
ExamplesNo input links and no selector: wrong unit!
Input parameter: OID of a connected object: the related object is shown
EntityB[Relationship(A2B)]
A.oid B.oid
EntityB
MODEL
EntityB[B.attr = param1]
param1(B.oid)
Input parameter: value to be used in the selector: the matching object is shown
p1
![Page 30: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/30.jpg)
IndexUnit
Index units:Publish an index of elements (SET OF OBJECTS)(SET OF OBJECTS)
The container is an entity with (optional) selectorInput parameters for the computation of the selector:
Values for attribute comparisons
OID of related object
Output parameter:OID of the object selected by the user
Entity[Selector(params)]
params
MODEL
selectedOID
![Page 31: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/31.jpg)
ExamplesNo input links: all objects shown
Input parameter: OID of the source object of the relationship role, all related object are shownEntityB
[Relationship(A2B)]
sourceOID (A)
selOID(B)
EntityB
selOID(B)
MODEL
EntityB[B.attr = Param1]
Param1 selOID(B)
Input parameter: value to be compared with the attribute, matching objects shown
![Page 32: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/32.jpg)
ACME case: index unit inProducts page
A simple index is provided to the user Users can access products by clicking on index elements
RUNNING CASE
Product
selOID
![Page 33: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/33.jpg)
MultiDataUnit
MODEL
• Multidata units• Present multiple instances of an entity (SET OF OBJECTS)(SET OF OBJECTS)
• The container is an entity with (optional) selector• Input parameters requested for the computation of the
selector:•Values for attribute comparisons•OID of participants to relationships
•Output parameter:•The set of OIDs of the published objects
Entity[Selector(params)]
params {OIDs}
![Page 34: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/34.jpg)
MultiData vs. Index
MultiData or Indexes?Indexes can be used as access mechanism to shown detailed information about one objectMultidata Units publish information about many objects at time
The difference is in the output parameter:Indexes output the OID of one selected objectMultidata units output the OIDs of all the displayed objects
MODEL
![Page 35: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/35.jpg)
Entry Unit
Unit for describing input forms that allow information submission by the userContent is shipped to other units via outgoinglinks (normally one), using link parametersTypically translated into HTML using the <form> tag and the associated submit button
MODEL
params
![Page 36: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/36.jpg)
Entry Fields and Selection Fields
Entry units contains two types of widgets for data entry:
Fields to insert new valueSelection fields to select a value from a list
Fields have properties: Preloading (of an existing value in the field)Modifiability (Y/N)Visibility (hidden/shown)Data type (string, integer, text, etc..)Input validation rules
MODEL
![Page 37: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/37.jpg)
Preloaded FieldsA field can be preloaded with value(s)
Field slots allow the concatenation of multiple values in the same fieldSlots can contain dynamic values taken from the database or static values defined in the model
Selection fields need to be preloaded with a set of instances (possibly with multiple slots per instance)The user chooses an instance among them
MODEL
EntryUnitS1 S2 S3PersonField
AddrFieldArtist
FirstName → PF.S1LastName → PF.S2NickName → PF.S3
Resulting field Bruce Springsteen “the boss”PersonField
![Page 38: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/38.jpg)
Multichoice Unit
Multichoice units:
Publish indexes of elements (SET OF OBJECTS)(SET OF OBJECTS) among which the user to select one or more elements (with checkboxes)
The container is an Entity (with optional selector & pre-selector)Input parameters:
Those requested for the computation of the selectors (values for attribute comparisons and OID of participants to relationships)
Output parameters:OIDs of the objects checked by the user
Preselector: allows one to define a sub-set of elements as pre-checked (before any user interaction)
Entity[Selector(params)]
[Preselector(params)]
params
MODEL
{selOIDs}
![Page 39: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/39.jpg)
ExamplesNo input links: all objectsshown, no pre-checked elements
Pre-selector: all objectsshown, pre-checked elements related to A
EntityB[PRE:Relationship(A2B)]
sourceOID (A)
{selOIDs}(B)
EntityB
{selOIDs}(B)
MODEL
EntityB[Relationship(A2B)]
sourceOID (A)
{selOIDs} (B)
Selector: only elements related to A shown, no pre-checked elements
AtzeniCeriFraternaliVersand
CeriFraternali
AtzeniCeriFraternaliVersand
![Page 40: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/40.jpg)
Hierarchical Unit
Hierarchical units:
Publish an index of elements, with entries organized hierarchically using entities connected by relationships Allow the user to select one element from any level of the hierarchy
The container is a set of entities and connecting relationships (with optianl selectors at all levels)
Input param: requested for the computation of the selectors :
Values for attribute comparisons
OID of partecipants to relationships
Output parameter: OID of the object selected by the user
{ Entity (Relationship) [Selector]}
params
MODEL
{selOIDs}
![Page 41: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/41.jpg)
Hierarchical Unit outgoing links
Each link is rendered as an anchor at the proper level of the hierarchy The level where the link is placed depends on the type of the link parameter(s)
EntityA[selector1]EntityB (A2B)[selector2]EntityC (B2C)[selector3]
MODEL
ParamA
ParamBParB,ParC
•Tables link a•Kitchen link b
•Korla KJD54 link c•Chairs link a
•Stools link b•Roy LKR34 link c•OddVar JSQ87 link c
•Office link b•Jess RLT45 link c
link a
link b
link c
CategorySubCategory(Cat2SubCat)
Product(SubCat2Prod)
EntityA
EntityB
EntityC
![Page 42: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/42.jpg)
ScrollerUnit
Scroller units:Add browsing capabilities to a set of objects
Publish links to the first, previous, next, last object of the setUsed in conjunction with data, index and multidata unitsNumber of scrolled objects = block factorInput: values for attribute comparisons, OID of participants to a relationshipOutput: the set of OIDs (possibly 1) of the current block of objects
Always placed in the same page as another content unit that publish the current (block of) object(s)
MODEL
Entity[Selector(params)]
params {selOIDs}
![Page 43: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/43.jpg)
Scroller + data unit
The entity is the same for the scroller and the data unitIt is possible to access the data unit also from another page and the scroller is automatically syncronized
ArtistArtist
MODEL
![Page 44: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/44.jpg)
Scroller + index
Paging the result of a search
MODEL
AlbumAlbum[Title contains t]
[Year > y]
t,y
![Page 45: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/45.jpg)
Pages
A page is a container of one or more pieces of information shown to the user at the same timeNesting of pages is allowed: a page can have sub-pagesThe user navigates a site made of pages
LoginBook Index Catalog
MODEL
![Page 46: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/46.jpg)
A non contextual link is a link between pagesNo context (information) is transported
The user can browse from a page to another one via an anchor (e.g., >>Books)
Non contextual links
HomePage Book Index
MODEL
![Page 47: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/47.jpg)
Home Page
The Home Page is the main page of a siteIt is the first page of the site that the user should seeEach siteview must contain a page marked as “Home”
HomePage H Book Index
MODEL
![Page 48: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/48.jpg)
Landmark pages
Landmark pages: globally visible pages. The user can jump to them from everywhere in the site viewIt is equivalent to a non contextual link implicitly defined from every other page in the site view to the landmark page
Authors
Books
L
Book Details
Store Page
Authors
Books
Book Details
Store Page
MODEL
![Page 49: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/49.jpg)
Areas
An area is a set of logically homogeneous pagesExamples of areas:
Sections of a portal: Sport, Music, Technology, …
Elements of a data-management system: Products management, News management, …
Areas can be nested, so that sub-areas can be defined inside areasEach area should have a DEFAULT PAGE or aDEFAULT SUB-AREA, to give a meaning to landmark areas and non-contextual links pointing to areas
MODEL
Area
![Page 50: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/50.jpg)
Site Views
A siteview is a set of pages and/or areas forming a coherent view of the site Multiple site views can be defined on the same data modelDifferent site views can be published for different types of users and for different types of output devicesSite views can be
Public: everyone can enterPrivate: access control with password protection is enforced
MODEL
![Page 51: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/51.jpg)
Acme site view modeling
Two site views on the same data modelCustomer: public, for customersAdmin: private, for the administrators and content managers
![Page 52: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/52.jpg)
Acme customer siteview
Purpose: define the customer experience of the siteStructure:
Two main areas: products and combinationsOther landmark pages: home, stores
Customer
Product area
Store Page
Combination area
RUNNING CASE
Home Page
L L
H,L L
![Page 53: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/53.jpg)
Combination areaProduct area
ACME page modeling
Q: what “main” pages do I need in the site?Home, Products, Combinations, Stores
AcmeHome
L
HProducts
LCombinations
L
Stores
L
Q: what other pages do I need?Product detail, Combination detail, ByPrice, BigImages,..
BigImages
Product Page
CombinationDetailBy price
RUNNING CASE
![Page 54: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/54.jpg)
ACME: HomePage
RUNNING CASE
![Page 55: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/55.jpg)
RUNNING CASE
ACME product page
![Page 56: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/56.jpg)
RUNNING CASE
ACME combinationpage
![Page 57: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/57.jpg)
The Acme public siteview
![Page 58: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/58.jpg)
http://www.webratio.com
3. Content management and access control
Model-driven design of Web applications
Piero Fraternali, Marco Brambilla9 novembre 2002
[email protected]@elet.polimi.it
![Page 59: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/59.jpg)
Integrating hypertexts and backend business logic
Example of web sites using back-end/remote services:
Reservation Web site: create a reservation, undo a reservation, overwrite a reservation..Other examples: content management, e-commerce trolley management, update of personal profile ..
How can we model the invocation of back end operations, e.g., the update of content by the user?Response:
Embedding operation calls into the hypertext
MODEL
![Page 60: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/60.jpg)
Operation Unit
MODEL
Models a generic external operation, or a built-in content manipulation operationInput from one or more incoming links (at least one is declared as normal link, the others astransport links)Two kinds of output links
OK link if the operation completes correctlyKO link if the operation fails
The predefined WebML units can be enriched by adding custom external operations (e.g. SendMail, …)
![Page 61: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/61.jpg)
Built-in Operations
MODEL
WebML predefines a set of frequently used built-in operations to manage a site’s contentThey are the traditional database operations: create, delete, modify, create relationship, delete relationshipUsers do not need to define the behaviour and the implementation; they are provided off-the-shelf in the model
![Page 62: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/62.jpg)
Built-in Operations
Delete Unit
Entity
Create Unit
Entity
Modify Unit
Entity
CREATE DELETE MODIFY
Disconnect Unit
relationship
Connect Unit
relationship
CONNECT DISCONNECT
MODEL
![Page 63: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/63.jpg)
In/out flow: create
Create Unit
Entity
value1→ attribute1
value2 → attribute2
OID of the new object
MODEL
KO
OK
Nothing
![Page 64: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/64.jpg)
Example
CreationResults
CREATION RESULTS
FirstName: Celine
LastName: Dion
ArtistCreation
CREATE ARTIST
FirstName:
LastName:
Press OKto create
Celine
Dion
OK
OK
KO
ArtistCreationPage
ArtistEntry CreateArtist
Artist<FirstName := FName><LastName := LName>
FName:FirstNameLName: LastName
CreationResultsPage
Artist
ArtistDetails
OK
KO
![Page 65: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/65.jpg)
In/out flow: modify
Value2 → attribute1 value1 → attribute2
Identifier(s) of the modified object(s)
Modify Unit
Entity
MODEL
KO
OK
Identifier(s) of the object(s) to modify
OIDs of objects to modify
![Page 66: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/66.jpg)
Example:
Result
ModifyArtist
BioEntry
ModifyBio
Artist<BiographicInfo := Bio>
OK
KO
ModifyArtist
EDIT BIOGRAPHYCeline Dion
Celine Dion was born in1968, the youngest offourteen children.
OK
Result
BIOGRAPHY
OK
KO
Celine DionBio: Celine Dion was bornin 1968, the youngest offourteen children.
Artist
BioData
Bio: BiographyField
ModifyArtist
EDIT BIOGRAPHYCeline Dion
OK
Artist
BioData
![Page 67: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/67.jpg)
In/out flow: delete
NothingOIDs of the object(s) to delete
Delete Unit
Entity
MODEL
KO
OK
OIDs of the object(s) to delete
Albums
DeleteAlbum
Album
DeletionError
OK
KO
NotDeleted
Album
DeletionError
NOT DELETED
All the way1999
Let's talk...1997
Sing-a-long1998
Albums
DELETE ALBUMS
OK
KO
All the way
Born in the USA
ImagineLet's talk ...Sing-a-long
Anthology
Bridges to Babylon
Del
AlbumIndex
Album
Albums
DELETE ALBUMS
Imagine
AnthologyBridges to Babylon
Del
Example:
![Page 68: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/68.jpg)
In/out flow: connect
Identifiers of theconnected objects
OIDs of source object(s)to connect
OIDs of destination object(s)to connect
MODEL
KO
OK
Identifiers of theobjects to connect
Note: if the any of the input parameters is a set of OIDs, the operation is applied to each element of the setThe disconnect operation is similar
Connect Unit
relationship role
![Page 69: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/69.jpg)
Example
MODEL
Rev iewPage
° Beatles
* Dion
° Prince
One of the mostromantic andexpressive artistsof the nineties.
Result
First name:CelineLast name:Dion
OK
KO
ARTISTSNEW REVIEW ARTIST
ReviewPage
Rev iew
NewReview
AllArtists
Artist
AssignReview
ArtistToRev iew[Artist.OID = Art ]
[Rev iew.OID = Rev ]
Rev : OID
Art:OID
Result
Artist[OID = Art]
ArtistDetails
Art: Artist.OID
OK
Rev : Rev iew.OIDKO
Rev iew[OID=Rev ]
ReviewDetails
Rev : Rev iew.OID
Select an artist toassign the review: Review :
One of the mostromantic andexpressive artistsof the nineties.
REVIEW
![Page 70: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/70.jpg)
Example/2
MODEL
Artist&AlbumsPage
Artist
ArtistDetails
PublishedAlbums
Album[ArtistToAlbum]
Album
AlbumDetails
AlbumDisconnect
AlbumToArtist
OK
KO
Artist&Albums
Celine Dion
° All the way° Let's talk...° Sing-a-long° These are...
ALBUMS
Artist&Albums
Celine Dion
° All the way° Let's talk...* Sing-a-long° These are...
ALBUMS DETAILSSing-a-long1999
Press OKto remove
OK
Artist&Albums
Celine Dion
° All the way° Let's talk...° These are...
ALBUMS
OK
KO
![Page 71: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/71.jpg)
Acme administrator
![Page 72: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/72.jpg)
Using global information
It is often necessary to:Set a parameter value (e.g. the country or language preferred by a user)Use this value globally in all the pages the site view, without carrying it explicitly along links
SolutionUse global parameters stored in the sessionProvide means for setting/getting their value
![Page 73: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/73.jpg)
Global Parameters
Global parameters model site-wide information stored globally or in the user sessionA context parameter is defined by:
NameID Duration (User session or Application)Value type: can be either:
A Printable value (integer, string, …)
An Entity (thus, the parameter can assume an OID value of that entity)
Default value [optional]
![Page 74: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/74.jpg)
Set unit
Unit that allows to SET the value of a parameter
It is always placed outside a PageIt has only an incoming link (carrying the value to be assigned to the parameter)It has not outgoing links
Value/OID
ParamName
![Page 75: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/75.jpg)
Get unit
Unit that allows to RETRIEVE the value of a parameter
It is always placed inside a PageIt has only an outgoing link (carrying the value retrieved from the parameter)It has not incoming linksThe retrieved value can be used in other units
Value/OID
ParamName
![Page 76: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/76.jpg)
Example
NewsPage[L]
CountrySelectionPage [L]
CountryIndex
Country Country
CountryData
LocalNews
News[Country2News]
SetCountry
CurrCountry
Country
CountryData
GetCountry
CurrCountry
ProductPage [L]
Country
CountryData
LocalProducts
Product[Country2Product]
![Page 77: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/77.jpg)
Personalization
Personalization has three facets:Access control: login/logout operations for user recognitionSite view assignement: based on the group the user belong to, some site views are accessible (1 or more site view per Group)Content customization: user- or group-dependent content
![Page 78: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/78.jpg)
User / Group model
Each User can belong to one or more Groups (predefined entities in the structural model)Each user has one default Group Each group has one associated Siteview
MODEL
User Group1:N 1:N
1:1 1:N
SiteView1:N1:1
user2group
user2defaultGroup
![Page 79: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/79.jpg)
Login/ Logout
A site-view may contain a page allowing users to login
Each secured site-view should allow users to logout
Changing Role (i.e. group) dynamically is allowed
Entry Unit
MODEL
Login
Logout
ChangeGroup
![Page 80: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/80.jpg)
CurrentUser andCurrentGroup
Each WebML project has two predefined global parameters:
CurrentUser: the OID of the currently logged UserCurrentGroup: the OID of the Group of the currently logged user
Login and Logout operations automatically set / unset these two parameters
MODEL
![Page 81: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/81.jpg)
preference
Page personalization (user-level)
•Personalization can be achieved with appropriate data design
userarticles
After login CurrentUser is identified, thus the index shows user’s preferred articles
MODEL
•Hypertext can reflect structure, and thus provide personalization
user article[preference]
Recommendations
CurrentUser
![Page 82: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/82.jpg)
Trolley managementTrolleyPage
User
CurrentUser
Trolley[UserToTrolley]
TrolleyData
DeleteOrderLine
OrderLine
L
OrderLines
GetUser
CurrentUserOK
Album:Album.OID
Artist:Artist.OIDto Artist Page
to Album Page
OrderLine[TrolleyToOrderLine]
NEST Support[OrderLineToSupport]
NEST Album[SupportToAlbum]
NESTArtist[AlbumToArtist]
KO
![Page 83: Web ml](https://reader034.fdocuments.net/reader034/viewer/2022042713/5484cf34b4af9faf0d8b4c8f/html5/thumbnails/83.jpg)
References
“Building data-intensive Web applications.”By Stefano Ceri, Piero Fraternali, Aldo Bongio, Marco Brambilla, Sara Comai, Maristella Matera, will be published by Morgan-Kaufmann (Jim Gray’s series), December 2002.
www.webml.orgWebML resources (papers, manuals, …)Web modeling compendium & bibliography
www.webratio.comTool can be downloaded for academic use