Build Your Own AJAX Web Applications Part 3/3
By SitePoint Books | Published  12/7/2006 | Tutorials | Unrated
Page 6

Checking your Work In Progress

Now that you've come this far, it would be nice to be able to see your work in action, right? Well, unfortunately, we've still got a lot of loose ends in our application -- we've briefly mentioned a singleton class called Status but we haven't created it yet, and we still have event handlers left to write. But never fear! We can quickly get the application up and running with a few class and function stubs.

We'll start by creating that Status singleton class with one empty method.

Example 3.11. appmonitor2.js (excerpt)
 
var Status = new function() {
  this.init = function() {
    // don't mind me, I'm just a stub ...
  };
}

Since the Status class is used by the Monitor class, we must declare Status before Monitor.

Then, we'll add our button's onclick event handlers to the Monitor class. We'll have them display alert dialogs so that we know what would be going on if there was anything happening behind the scenes.

Example 3.12. appmonitor2.js (excerpt)
 
this.pollServerStart = function() {
  alert('This will start the application polling the server.');
};
this.pollServerStop = function() {
  alert('This will stop the application polling the server.');
};

With these two simple stubs in place, your application should now be ready for a test-drive.

1542_fig3.2
Figure 3.2. Humble beginnings

When you click the Start button in the display shown in Figure 3.2 you're presented with an alert box that promises greater things to come. Let's get started making good on those promises.

Polling the Server

The first step is to flesh out the Start button's onclick event handler, pollServerStart:

Example 3.13. appmonitor2.js (excerpt)
 
this.pollServerStart = function() {
  var self = Monitor;
  self.doPoll();
  self.toggleAppStatus(false);
};

This code immediately calls the doPoll method, which, like the app monitor we built in Chapter 2, Basic XMLHttpRequest, will be responsible for making an HTTP request to poll the server. Once the request has been sent, the code calls toggleAppStatus, passing it false to indicate that polling is underway.


Share and Enjoy:

StumbleUpon Toolbar


Article Series
This article is part 3 of a 3 part series. Other articles in this series are shown below:
  1. Build Your Own AJAX Web Applications Part 1/3
  2. Build Your Own AJAX Web Applications Part 2/3
  3. Build Your Own AJAX Web Applications Part 3/3
Comments