Topic awaiting preservation: Novel (?) use of XMLHttpRequest (Page 1 of 1)

Hey all... I've still been working at my website (heh), and I've added in what I think is a nice feature: using XMLHttpRequest to highlight items that were recently modified. Best part is, since I'm only querying my own server, there aren't any associated security issues.

http://www.rpi.edu/~laporj2/index.html is the normal page that you're all used to. (the cookies still have a bug in Opera, trying to figure that one out)
http://www.rpi.edu/~laporj2/index.html?recent is the new page, that automatically highlights all recent (past two weeks) items.

I think it's pretty cool, and a great way to navigate the vast amount of stuff I have on my website (that will only continue to grow, I promise ).

Some fixes that I plan on doing:

• Figure out why it breaks in Opera. Looks like it half-works.
• Cache all the XMLHttpRequests in a session cookie. It's like, 50+ server HEAD queries made on every load of the page. Ick! Once is acceptable, and then they'll all be cached for quick subsequent access.
• Make the recency variable. For example, place a ?5 to see the last five days, or a ?31 to see the last month, or ?365 to see everything added in the previous year. Currently, it's hardwired to be at 14 days.
• Display an unintrusive error message for browsers that don't support XMLHttpRequest.

Maybe that can inspire you all a little. The biggest code change is below:

function lastModifiedDate (anchor) {

	var request;



	if(window.XMLHttpRequest) request = new XMLHttpRequest();

	else if(window.ActiveXObject) request = new ActiveXObject("Microsoft.XMLHTTP");



	if(request) {

		request.onreadystatechange = function () {

			if(request.readyState == 4) {

				var	date = new Date() - new Date(request.getResponseHeader("last-modified")),

					recent = date < threshold;



				if(recent)

					anchor.className = "recent";

			}

		}



		request.open("HEAD", anchor.href, true);

		request.send(null);

	}

}

---
Website

(Edited by Iron Wallaby on 05-06-2005 20:29)

That is neat.

I think those "37signals" guys had demoed an effect in one of their products - recently-changed (or new) content was initially highlighted with a different background colour, which would gradually fade out. A neat attention-getting effect, and without being annoying (ie. <blink>

I like that you're modifying the content dynamically also, but one might argue that you could also "automagically" serve this content from the server side easily enough?

At the same time though, the XHR (as I've heard it referred to recently) thing is a neat way of accomplishing the task client-side without (presumably) causing much server-side load. It'd be good to work on lowering the number of requests though, for sure.

I completely agree that server-side would alleviate a lot of ills... problem is that my web host does not allow server-side scripting.

I did try to put a good amount of effort into preventing too much server load -- first, it's not the immediate option; you only will request from the server a lot if you ask for it. Secondly, I cache the results, so it only rechecks if you quit your browser and load it up again some other time.

If I ever get my own server (which I hope to sometime), then you can bet I'm pushing all of this into an XML file and have a script create the HTML, frills and all, for me.

---
Website