My First Mashup

So WSO2's Mashup Server has finally been released. As I've blogged before, this is a very exciting product for a number of reasons.

My first mashup is now public at mooshup.com, the hosted online version of WSO2 Mashup Server, where anyone can get an account and start kicking the tyres of this revolutionary technology.

The mashup is really simple, but it illustrates some of the power of the platform. I have two independent "services", a Grocery List service and a Grocery Prices service (Click the "Try it" link on each). The idea is that I create my grocery list independently knowing only what products I need and the quantities of each that I need. What I don't know are the (unit) prices of these products. Another service provides the prices for a number of grocery products, which is a superset of the products in my list.

My grocery list:

<order>
<line-item prod="tomato" qty="4" />
<line-item prod="potato" qty="3" />
<line-item prod="onion" qty="6" />
<line-item prod="chilli" qty="40" />
</order>

Grocery prices (independently available):

<prices>
<prod id="potato" unit-price="1.00" />
<prod id="tomato" unit-price="2.00" />
<prod id="onion" unit-price="3.00" />
<prod id="beans" unit-price="4.00" />
<prod id="chilli" unit-price="0.10" />
</prices>

What I need to do is "mash up" my grocery list with the price list that is independently published, so that I can see my itemised grocery bill, with individual costs and total cost.

To anyone who shudders at the thought of the XML manipulation this entails, the brevity of the following code should be vastly reassuring:

var total = 0.0;
for each ( i in gList.descendants("line-item") )
{
i.@amount = i.@qty * gPrices..prod.(@id==i.@prod)["@unit-price"];
total += Number( i.@amount );
}
gList..order["total-amt"] = total;

That's really all it takes. The "for" loop iterates through all elements in the grocery list with the tag "line-item". The first line inside the loop is the most interesting one. It's basically multiplying the quantity by the unit price to arrive at the amount, but this is where the "mashup" happens. It's using the unit price of the product in the grocery price list whose id matches the id of the product in the grocery list. It's like this SQL statement:

UPDATE T_GROCERY_LIST GL
SET GL.AMOUNT =
(SELECT GL.QTY * GP.UNIT_PRICE
FROM T_GROCERY_PRICES GP
WHERE GL.PROD_ID = GP.ID)

Then of course, there's the running total which gets inserted as a new subelement ("total-amt") under the "order" element of the grocery list. Note that if an element or attribute doesn't exist, it gets quietly added (e.g., the new attribute "amount" and the new element "tot-amt"). What distinguishes attributes from elements is the "@" symbol. If you avoid hyphens altogether in element and attribute names, the syntax is much simpler, but I prefer to use hyphens for complex tags, so I wear the extra syntactic overhead, but it's not much really.

What I finally get is the "mashed-up" XML:

<order>
<line-item prod="tomato" qty="4" amount="8" />
<line-item prod="potato" qty="3" amount="3" />
<line-item prod="onion" qty="6" amount="18" />
<line-item prod="chilli" qty="40" amount="4" />
<tot-amt>33</tot-amt>
</order>

which I can redisplay as a table.

My JavaScript is a bit rusty these days, but E4X has excited me enough to start coding again. Those of you who have to work with XML on a daily basis and curse the experience should look at E4X. It might just cause you to desert Java or C# for JavaScript.

If you do a View Source on the HTML page, you'll see that I've even used E4X to manipulate HTML from within JavaScript! Who wants to deal with the DOM? Treat whatever HTML structures you're working with as XML (well, it's all supposed to be XHTML anyway, so that's not an invalid assumption, right?). Once you've created the HTML structure you want, just convert it to a string using "toXMLString()" and use (the admittedly nonstandard but universally supported) "innerHTML" to insert that string into the existing HTML document.

Think of the possibilities. This goes far beyond content aggregation, which is what mashups are about. Mashup Server can talk both SOAP and REST (as consumer and producer). You can use JavaScript to code arbitrary logic, even simple processes. I'm sure someone will write a JavaScript library very soon to match the capabilities of WS-BPEL, and a translator to convert BPEL scripts into JavaScript, which will let them run more complex processes on Mashup Server. A process server! Next, combine all this with AJAX. You now have a one-stop shop for all your enterprise and collaborative computing needs. I wonder if there are nice programmatic interfaces to databases, directories, message queues, e-mail, etc. Something like the Spring templates in JavaScript would be nice.

I never had much regard for JavaScript when I was a Java programmer, but I'm sure developing a lot of respect for it now. A friend recently pointed me to Sun's research project, the Lively Kernel, which is essentially recreating Java applets using the more lightweight and ubiquitous JavaScript. Sun's Phobos library makes server-side JavaScript more feasible. Could it be that JavaScript is enjoying a resurgence?

E4X is the clincher for me. I know I'm not going to manipulate XML any other way right now. And WSO2 Mashup Server is my new hammer which makes every integration problem look like a mashup-able nail.