You can use the Web Service Client widget to import XML data from an external source, transform it into format acceptable by the XDIME application, and load the results on a device with AJAX.
You can use the Web Service Client widget to import XML data from an external source, transform it into format acceptable by the XDIME application, and load the results on a device with AJAX.
The visual appearance and user interactions depend on the implementation. The building blocks, such as input fields and buttons, allow you to achieve the desired functionality. In addition, the Web Service Client widget can be placed within other data containing widgets, for example popups or tabs.
The Web Service Client widget uses several existing XDIME elements, and introduces one new element: widget:fetch. This action defining element cooperates with the fetch service built into MCS. The service receives a request from the widget, made using AJAX. The request contains the URL of an external XML data source, and the address of an XSL stylesheet. The service applies the XSL transformation to the XML data received from the external source, and sends the results back to the device in a form of the XDIME response.
The following example shows how you can create a simple XDIME web application that provides weather information.
The widget:select element allows a user to choose a location from a list specified with a widget:option element. The value attribute holds the information that will be used to create the final query for the web service.
The widget:fetch element specifies the location of an external XML data source in the src attribute, and the location of the XSL stylesheet in the transformation attribute. The service attribute defines the path to a fetch service. It must be specified if the fetch service location is different to the default that is defined in the web.xml file. The value of the attribute is processed in the following manner:
If the path is absolute, for example http://host/mcs/services/fetch, then it remains absolute and is subject to standard rewriting.
If the path is relative and starts with '/', it is resolved against the web application context. Please note that '/mcs' is the default context. For example, if the service attribute is set to '/services/fetch', then the path will be rewritten to /mcs/services/fetch.
If the path is relative but does not start with '/', it is resolved against the current request URL. For example, if the client requested the page at http://host/mcs/projects/myapp/mypage.xdime and the service attribute is set to 'fetch', the URL will be rewritten to http://host/mcs/projects/myapp/fetch.
Information received from the fetch service will be displayed by the containing widget:block element.
The widget:fetch and widget:select elements are coupled together by a JavaScript function that converts the query to a full request. The widget:button element will execute the script.
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/2002/06/xhtml2"
xmlns:widget="http://www.volantis.com/xmlns/2006/05/widget">
<head>
<title>widget:fetch</title>
</head>
<body>
<widget:block>
<widget:fetch src="http://xml.weather.yahoo.com/forecastrss?p=AUXX0025&u=c"
when="onload" transformation="test.xsl"
service="/projects/client-app/servicefetch/servicefetch"/>
</widget:block>
</body>
</html>The XSL stylesheet must produce a complete XDIME response, with response:response as the root element. The body of response must be enclosed by the widget:block-content element. Refer to the XSL documentation for more information.
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:template match="/">
<response:response xmlns="http://www.w3.org/2002/06/xhtml2"
xmlns:response="http://www.volantis.com/xmlns/2006/05/widget/response"
xmlns:widget="http://www.volantis.com/xmlns/2006/05/widget">
<response:head/>
<response:body>
<widget:block-content>
<table>
<tr>
<td>City: </td>
<td>
<xsl:value-of select="//yweather:location@city"/>
</td>
</tr>
<tr>
<td>Weather: </td>
<td>
<xsl:value-of select="//yweather:condition@text"/>, Temp:
<xsl:value-of select="//yweather:condition@temp"/>
<xsl:value-of select="//yweather:units@temperature"/>
</td>
</tr>
</table>
</widget:block-content>
</response:body>
</response:response>
</xsl:template>
</xsl:stylesheet>If a device does not support widgets then the fetch action is ignored and does not produce any markup.
In MCS you use the link element to bind a theme policy to an XDIME 2 page. Let's assume a web application is in the projects/myapp directory and a theme named main.mthm is located in the projects/myapp/themes directory. The following code binds the page and the theme.
<link rel="mcs:theme" href="/themes/main.mthm"/>You use the response:link element to bind a theme to an AJAX response.
<response:link rel="mcs:theme" href="/themes/main.mthm"/>You must ensure that the service returning the response is part of your project, otherwise the theme will not be found. In our example, it means that you cannot use the default value of the service attribute, i.e. 'services/fetch', because it is outside the project. Therefore you need to change the URL pattern of the FetchService servlet entry in the web.xml file to a location inside your project, for example:
<servlet-mapping>
<servlet-name>FetchService</servlet-name>
<url-pattern>/projects/myapp/fetch/*</url-pattern>
</servlet-mapping>Then, you can use this path in the service attribute of widget:fetch, for example:
<widget:fetch service="/projects/myapp/fetch" src="http://host/mcs/info?p=A0025"/>