Jump to content

Display a Series of Images via XMLHttpRequest


Guest freddofrog
 Share

Recommended Posts

Guest freddofrog

HiI am trying to design a desktop gadget that will display a radar loopfrom my local weather website. I currently have the gadget downloadingand displaying the latest image without a problem. However when Imake the second XMLHttpRequest, the gadget only displays the secondrequest, not the first. So far I have tried:-Have all the requests called synchronously from the main.js script.Doesn't work.-Have each request in a separate script and call them in turn from themain.xml file. Doesn't work.-Assign the requests to different responsestreams and call them insequence from the main.xml file. Doesn't work. I've tried allcombinations with the above but with no success.Here is a copy of my code. Its adapted from the XMLHttpRequest sample.Any help would be greatly appreciated.Main.js

//Get datevar yrs=null;function years() {var a=new Date();var yrs=a.getUTCFullYear();return yrs;}function months() {var b=new Date();var mths=b.getUTCMonth() + 1;if (mths < 10) {mths = "0" + mths};return mths;}function days() {var c=new Date();var dys=c.getUTCDate();if (dys < 10) {dys = "0" + dys};return dys;}function hours() {var d=new Date();var hrs=d.getUTCHours();if (hrs < 10) {hrs = "0" + hrs};return hrs;}function minutes() {var e=new Date();var mns=e.getUTCMinutes() - 10;{ if (mns<=10) { mns= "0" + 0;} else if (mns>10 && mns<=20)		{		mns=10;		}		else if (mns>20 && mns<=30)			   {			   mns=20;			   }				else if (mns>30 && mns<=40)					   {					   mns=30;					   }					   else if (mns>40 && mns<=50)							   {							   mns=40;							   }							   else if (mns>50 && mns<=59)									  {									  mns=50;									  }return mns;}}function minutes1() {var f=new Date();var mns1=f.getUTCMinutes() - 20;{ if (mns1<=10) { mns1= "0" + 0;} else if (mns1>10 && mns1<=20)		{		mns1=10;		}		else if (mns1>20 && mns1<=30)			   {			   mns1=20;			   }				else if (mns1>30 && mns1<=40)					   {					   mns1=30;					   }					   else if (mns1>40 && mns1<=50)							   {							   mns1=40;							   }							   else if (mns1>50 && mns1<=59)									  {									  mns1=50;									  }return mns1;}}//Assemble strings for http requesthttp = ("http://www.bom.gov.au/radar/IDR283.T."+years()+months()+days()+hours()+minutes()+".png");http1 = ("http://www.bom.gov.au/radar/IDR283.T."+years()+months()+days()+hours()+minutes1()+".png");//This is the XMLHttpRequestvar logoRequest_ = null;function onOpen() {loadRadar();timeout();loadRadar1();} // Start to download the Google logofunction loadRadar(){ logoRequest_ = new XMLHttpRequest(); try {   logoRequest_.open("GET", http, true); } catch (e) {   // Catch invalid URLs   statusLabel.innerText = FAILED;   logoRequest_ = null;   return; } // Set the callback for when the downloading is completed (orfailed) logoRequest_.onreadystatechange = onLogoData; // Start the download try {   logoRequest_.send(); } catch (e) {   // Catch errors sending the request   statusLabel.innerText = FAILED;   statusLabel.visible =  true;   logoRequest_ = null;   return; }}function onLogoData() { // Verify that the download completed if (logoRequest_.readyState != 4)   return; // Verify that the download was successful if (logoRequest_.status != 200) {   statusLabel.innerText = FAILED;   statusLabel.visible =  true;   logoRequest_ = null;   return; } // Obtain the stream of image data and set it as the image. If youwere // just downloading text, you could use .responseText to get thetext content // of the URL you specified. BOM.src = logoRequest_.responseStream; BOM.visible = true;   statusLabel.visible =  false;} // Destroy the XMLHttpRequest object since it isn't being usedanymore logoRequest_ = null;//Timeoutfunction timeout() {setTimeout("loadRadar1()", 1000);} // Start to download the Google logofunction loadRadar1(){ logoRequest_ = new XMLHttpRequest(); try {   logoRequest_.open("GET", http1, true); } catch (e) {   // Catch invalid URLs   statusLabel.innerText = FAILED;   logoRequest_ = null;   return; } // Set the callback for when the downloading is completed (orfailed) logoRequest_.onreadystatechange = onLogoData; // Start the download try {   logoRequest_.send(); } catch (e) {   // Catch errors sending the request   statusLabel.innerText = FAILED;   statusLabel.visible =  true;   logoRequest_ = null;   return; }}function onLogoData() { // Verify that the download completed if (logoRequest_.readyState != 4)   return; // Verify that the download was successful if (logoRequest_.status != 200) {   statusLabel.innerText = FAILED;   statusLabel.visible =  true;   logoRequest_ = null;   return; } // Obtain the stream of image data and set it as the image. If youwere // just downloading text, you could use .responseText to get thetext content // of the URL you specified. BOM1.src = logoRequest_.responseStream; BOM1.visible = true; BOM.visible = false;   statusLabel.visible =  false;} // Destroy the XMLHttpRequest object since it isn't being usedanymore //	logoRequest_ = null; logoRequest_ = null;

And my main.xml:

<view height="600" width="600" onopen="onOpen()"> <img src="stock_images\IDR283.background.png"/> <img src="stock_images\IDR283.topography.png"/> <img height="500" name="BOM" width="500" visible="false"/> <img height="500" name="BOM1" width="500" visible="false"/> <img src="stock_images\IDR283.range.png"/> <img src="stock_images\IDR283.locations.png"/> <label name="statusLabel" width="250" x="0" y="65" align="center"size="30"  >DOWNLOADING; </label> <script src="main.js" /></view>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...