Example: a simple Ajax call with throbber

Run Demo
// Throbber manager
function Throbber() { }
Throbber.prototype = {
	image : null,
	requests : 0,
	
	requestOpened : function(event) {
		if (this.requests == 0) {
			this.image.src = 'throbber.gif';
		}
		this.requests++;
	},
	
	requestLoaded : function(event) {
		this.requests--;
		if (this.requests == 0) {
			this.image.src = 'throbber_stopped.gif';
		}
	},

	clicked : function() {
		request_manager.abortAll();
	},
	
	// Called on window load
	attach : function() {
		this.image = document.getElementById('throbber');
		if (this.image && request_manager) {
			request_manager.addEventListener('open', [this, this.requestOpened]);
			request_manager.addEventListener('load', [this, this.requestLoaded]);
			request_manager.addEventListener('abort', [this, this.requestLoaded]);
			this.image.onclick = function() { Throbber.prototype.clicked.apply(throbber, arguments); };
		}
	}
}
var throbber = new Throbber();
window.addEventListener('load', function() { Throbber.prototype.attach.apply(throbber, arguments); }, false);

function SimpleDemo() { }
SimpleDemo.prototype = {
	// The AjaxRequest object
	request : null,

	// Setup and send the request
	run : function() {
		this.request = request_manager.createAjaxRequest();
		this.request.get = {
			one : 1,
			two : 2
		};
		this.request.addEventListener('load', [this, this.ran]);
		this.request.open('GET', 'xml.php');
		var req = requests[this.request.id];
		return setTimeout(function() { req.send(); }, 5000);
	},

	// Triggered when the response returns
	ran : function(event) {
		alert(event.request.xhr.responseText);
	}
}