View source

{{ReviewerApproved}}{{FeaturedArticle}}
[[Category:Flash Lite]]
[[Category:How To]]
[[Category:Code Examples]]

== Introduction ==

Like any other application development technology, such as Symbian C++ or Java ME, Flash Lite can connect to a Web service and thus send/receive data. This article illustrates again the power of Flash Lite. 


== Concept ==

Here is a reference to the [http://en.wikipedia.org/wiki/Web_Services_Description_Language WSDL page] on Wikipedia. To learn on the WSDL concept in detail, you may refer to this page. To learn more about its implementation in flash Lite, read below.

[[Image:Diagram1.png]]

== Connecting to the Web service ==

[[Image:Weatherloading.jpg]]

The client's device establishes communication with the Web services by creating a new Web service object in the ActionScript and invokes its <tt>GetWeather()</tt> method once the "GO" button is pressed. 

<code actionscript>
import mx.services.*;
// Create a new instance of Web service called - wthrService.
var wthrService = new  WebService("http://www.webservicex.net/globalweather.asmx?WSDL");

// set it up so that the service is called when the button is pressed.
result_btn.onPress = function() {
        loading_mc._visible = true;
	//Call the getWeather method and assign it to the pending call object to handle results.
	resultObj = wthrService.GetWeather(citybox.text, "");
	wthrService.onLoad = trace("loading");	
        // the onResult function is called if the service is successful
	resultObj.onResult = function(result) {	
	if(result ne "Data Not Found")
	{
		loading_mc._visible = false;
		resStr = result.slice(result.indexOf("<CurrentWeather>")+16,result.indexOf("</CurrentWeather>")-17);	
		xml = null;
		delete xml;	
		xml = new XML()
		xml.ignoreWhite = true;
		xml.parseXML(resStr)
		cityTxt = citybox.text;
		gotoAndStop(2);
	}
	else
	{
	  gotoAndStop(3);
	}
	}
	resultObj .onFault = function(fault) {
	 // If there is any error, e.g. the service is not working, the onFault handler will be invoked.
	 loading_mc._visible = false;
	 fault_txt = "ERROR: "+fault.faultCode + "," + fault.faultstring
	}
}
</code>

== XML parsing ==

The server sends the XML object containing weather information that must be parsed before it can be used. 

'''- XML FORMAT'''
<code xml>
<?xml version="1.0" encoding="utf-16"?>
<CurrentWeather>
  <Location>Islamabad Airport, Pakistan (OPRN) 33-37N 073-06E 508M</Location>
  <Time>May 29, 2008 - 07:00 PM EDT / 2008.05.29 2300 UTC</Time>
  <Visibility> 3 mile(s):0</Visibility>
  <SkyConditions> clear</SkyConditions>
  <Temperature> 77 F (25 C)</Temperature>
  <DewPoint> 59 F (15 C)</DewPoint>
  <RelativeHumidity> 53%</RelativeHumidity>
  <Pressure> 29.65 in. Hg (1004 hPa)</Pressure>
  <Status>Success</Status>
</CurrentWeather>
</code>

The XML object may have more or less nodes as it depends on the level of information available on the server at any given time. Hence using the following code, the XML node's name/value pairs are stored in an array of a dataclass object.

'''- DataClass'''
<code actionscript>
class dataClass
{
   //Establishes the variables in dataClass
   public var nodeName: String;
   public var nodeValue:String;
}
</code>
<code actionscript>
import dataClass; 

for (var aNode:XMLNode = xml.firstChild; aNode != null; aNode=aNode.nextSibling) {
        if (aNode.nodeType == 1) {
			var t:dataClass = new dataClass();
			t.nodeName = aNode.nodeName;              
			t.nodeValue = aNode.firstChild.nodeValue;
			array.push(t);			
        }
    }
</code>

== Trimming string data ==

Once data is saved in the array, it can be retrieved from the array and trimmed to be displayed on the screen.

<code actionscript>
for(j=0;j<array.length;j++)
{ 
	if(array[j].nodeName eq "Time")
	{
		getLocalTime = array[j].nodeValue;
		getLocalTime = getLocalTime.slice(0,getLocalTime.indexOf("EDT"));
	}
	if(array[j].nodeName eq "Wind")
	{
		getWind = array[j].nodeValue;
		getWind = Number(getWind.slice(getWind.indexOf("at ")+3,getWind.indexOf("MPH")-1));
	}
	if(array[j].nodeName eq "Visibility")
	{
		getVisibility = array[j].nodeValue;
		getVisibility = getVisibility.slice(0,getVisibility.length-2);
	}
	if(array[j].nodeName eq "Temperature")
	{
		getTemperature = array[j].nodeValue;
		getTemperature_F = getTemperature.slice(0,getTemperature.indexOf("F")-1);
		getTemperature_C = getTemperature.slice(getTemperature.indexOf("(")+1,getTemperature.indexOf("C")-1);
	}
	if(array[j].nodeName eq "DewPoint")
		getDewPoint = array[j].nodeValue;
	if(array[j].nodeName eq "RelativeHumidity")
		getRelativeHumidity = array[j].nodeValue;
	if(array[j].nodeName eq "Pressure")
	{
		getPressure = array[j].nodeValue;
		getPressure = getPressure.slice(getPressure.indexOf("(")+1,getPressure.length-1);
	}
}
</code>


== Temperature gauge animation ==

<code actionscript>
new mx.transitions.Tween(temp_mc.temp_lvl_mc, "_height", mx.transitions.easing.Strong.easeOut, 0, getTemperature_C / 100 * 100, 5, true);
</code>


== Final output ==

[[Image:Weather.jpg]]

== Source code ==

The source code files are available for download: [[media:FLWeather.zip]]


== Author ==

--[[User:Raheal akh|NINJA]] 03:16, 30 May 2008 (EEST) RAHEAL AKHTAR