Recently, Web 2.0 has brought a storm on web application development. In particular, mashups have greatly enhanced user creativity across the web, allowing end-users to rapidly combine information from diverse sources, and integrate them into \new" goal-oriented applications. In the meantime, widgets (also built withWeb 2.0 technology) have also gained a lot of momentum. Indeed, they have become ever more present in our every day lives, even appearing as first class players in our operating systems (e.g., Mac OS X
and Windows 7).
In this paper we present Mashlight: a lightweight framework for creating and executing mashups that combines these two worlds. Indeed, it provides users with a simple means to create "process-like" mashups using "widget-like" Web 2.0 applications. Even users that have no technical know-how can string together building blocks (taken from an extensible library) to define the application they need. The framework is implemented using common Web technology, meaning our mashups can be run from dierent kinds of devices, in a lightweight fashion without the overhead of a complex application server. The paper presents the main concepts behind Mashlight blocks and Mashlight processes, and demonstrate our prototype on a concrete example.
Mashlight: A Lightweight Mashup Framework for Everyone
1. POLITECNICO DI MILANO
Dipartimento di Elettronica e Informazione
DEEPSE Group
MASHLIGHT:
A
LIGHTWEIGHTMASHUPFRAME
WORKFOREVERYONE
M. Albinola, M. Carcano,
L. Baresi, S.Guinea
2nd Workshop on Mashups, EnterpriseMashups
and LightweightComposition on the Web
2. 2
Mashups in a nutshell
• Reuse and integrationofcomponents
▫ Lower design and developmentcosts
▫ Lowertime-to-market
• Software as a Service (SaaS)
▫ Simple and lightweightmodel
▫ Universallyaccessible (through a browser)
▫ No needtoinstall
• Do-it-yourself (DIY)
▫ Anyone can beanauthor
▫ On–the-flydevelopment
3. 3
Mashlightgoals
Qualitydimensions:
▫ Flexibility
Suppportforallthree “natures”
(Data, Logic and Presentation)
▫ Usability
Abstractionlevelthatanykindofuser can understand
(End Users and Developers)
▫ Lightweight
Can bedeployedtodifferentkindsofdevices
(Android/iPhone)
4. 4
Mashlight: the Idea
Starting Point:
Mashups are createdthrough the process-
likedispositionoflogicactivities
Maincharacteristics:
• Single activities are Web 2.0 applications
▫ Mac OS XDashboard, Vista sidebar, etc.
• Processlanguageisextremelysimple
▫ Blocksdefineabstractionlevel
• Show oneactivity at a time
▫ Provideintrinsicrollback
6. 6
Real-worldblocks…
• Widgetlike Web 2.0 applications
• Modifiedversionsof Google Widgets
▫ Supportfor I/O parameters
▫ SupportforinteractionwithMashlightEngine
7. 7
The Model: MashlightProcesses
• Graphrepresentationof the process
▫ Activationorder (Process Flow)
▫ Data dependencies (Data Flow)
Process Flow Execution Flows Data Flow
A
A A
A
B
B D
D
B D
C E
C E
C E
E
• High levelofabstraction
▫ No explicitconditional branching or looping
8. 8
The Model: AdvancedAspects
Execution flow
• Complex Data A B C
Assignment A
B
street
city
address.city
address.street
C
• Data with Multiple
Cardinality A A A
address[1].stree address[1].city
city address[2].cit
t street address[*].city
y
B B B
• Prioritized data A B
A
assignments address[2].street address[1].city
address[1].city
city[*]
address.street address.city
B
C
9. 9
The Model: AdvancedAspects
• Undooperation
▫ Goes back to the beginningof the
previouslycompleted block
Process Flow
Evolutionof the execution flow
A A A
A
D B D
B D
E C
C E
1 2 3
12. 12
Example-NightPlan
Userwantstoorganize a night out:
restaurant + cinema
Mashlightblocks:
▫ PagineGialle
Italian Yellow Pages
▫ Google Maps
Visualizationof interest point
▫ MovieTickets
Buy tickets online
▫ Google Maps Navigator
Mapdrivinginstructions
DEMO
13. 13
Process Flow Data Flow
what: ristorante
where: Milano
streetName: piazza leonardo false
searchQuery autoQuery
A - PagineGialle
A - Pagine gialle
out
resultItem.coordinates
resultItem.coordinates
address coordinates
resultItem.city
B - Google Maps cinema
B - Google Maps
resultItem.address
out
false
searchQuery autoQuery
C - PagineGialle
C - Pagine gialle
out
resultItem.name resultItem.coordinates
address coordinates
D - Google Maps
B - Google Maps
out Matteo
CinemaName accountUsername
E - MovieTickets
E - MovieTickets
out
resultItem.coordinates
steps[0] travelMode
from to
F - Google Maps
F - Google Maps
Navigator
Navigator
city: Milano
out
address: via Golgi, 40
14. 14
Future Work
• EnrichlibraryofMashlightblocks
▫ Specificblocksforspecificdomains
• Block Builder
▫ Eclipsepluginforsemi-automatic block creation
▫ WADL-generatedMashlightblocks
• Mashup Builder
▫ Generalpurposeprocess design environment
▫ Domain-
specificabstractionsthatuseMashlightasbackend
• Supportfor mobile devices
▫ Processstarts on PC and continues on Android/iPhone
15. 15
Example - Prototype
Developerwantstoprototype service
interactions
Mashlightblocks:
▫ SOAP Client
Service invocationthrough SOAP
▫ Selector
Selectorcomponentsimilartoforeach
in programminglanguages
▫ Choose
Chooseanoutlinkbased on
conditionparameter
16. 16
Process flow Data flow
http://www. getList
methodName parameter
wsdlUrl
s
A - SoapClient
A - SoapClient
ok
soapResponseObjects
soapResponseXml
itemIndex itemList
0
B - Selector
B – Selector
end
loop selectedItemIndex
nextItemIndex
item
parameters[0
getList methodName
]
wsdlUrl
http://www.
C - SoapClient
C - SoapClient
ok
soapResponseXml soapResponseObjects[0]
condition
D - Choose
D – Choose
false
true
getList parameter
wsdlUrl methodName
s
http://www.
E - SoapClient
E - SoapClient
ok
soapResponseXml soapResponseObjects
methodName parameters[1]
wsdlUrl
getList
parameters[0]
F - SoapClient
F - SoapClient
http://www.
ok
soapResponseObjects
soapResponseXml