Welcome to the second installment in this series of back-flipping articles regarding some pretty stupid uses of AJAX, and that ever-adorable XmlHttpRequest object. In part one - The Fonz uses XmlHttpRequest and AJAX to spy on you, we took a rather negative view of the "developer and AJAX sitting in a tree" love of remote scripting, and applied our paranoia to a simple text adventure application featuring Arthur 'Fonzie' Fonzarelli.
This time round, taking the results from The Fonz test, we will temporarily leave the dark side, and use the forces of remote scripting toward the purpose of enhancing the "user experience" by building a live help system.
Long live the XmlHttpRequest!
I can't believe some people don't know how to play text adventures... "look", "get", "use", "go"... that's all you need! Sheeesh, Isn't that the first thing you learn after connecting to your local BBS at ï¼’ï¼”00 baud? At any rate, I was able to greatly decrease the frustration level of "The Search For Fonzie's Treasure" by analysing user input.
The implemenation of "look jukebox" was obviously inadequate, as the first 3 people who played the game typed "examine jukebox". Five out of the first dozen people tried to use shortcuts for moving - "south", or "s", instead of "go south". All would have been greeted with the text-adventurer's worst nightmare... "I DO NOT UNDERSTAND..."
By responding to the tracked data I could increase the length of time people would stay and play. As I watched the live moves pour in I got a bit obsessed about supporting more commands. "ride motorbike? start motorbike? Better add them..." As my obsession turned, um, obsessive, I reasoned that simply adding in new moves wasn't good enough. I needed a way to let the "less bright" users know what to do as they played, 'cause I only had one crack at each player - and they weren't going to refresh...
In the interests of experimentation, and desperation to get people to stay on the blog, I implemented a kind of "live help system" with the game players who perhaps needed a little prod in the right direction. For example, this represents a common play pattern:
go north - you are in the kitchen
go north - you can see the Fonz's jacket
look jacket - its a jacket...
get jacket - you can't reach it.
take jacket - you can't reach it.
wear jacket - I don't understand "wear"
jump up and try and get the fonz's jacket - umm?
A couple more commands that indicated the user thought the computer was a fluent conversationalist and they were gone. Never to return to mrspeaker.webeisteddfod.com again.
So, to help them out - or freak them out if they were being stupid - The Fonz was given the ability to interject. "The Fonz says: You're not getting the jacket just now. Go look somewhere else.", "The Fonz says: Please stop trying to hurt my dog.", "The Fonz says: Please stop trying sql injection attacks on Mr.Speaker's server. 'Eeeey!", and so on.
Messages were displayed to the user via the onReadyStateChange function of the XmlHttpRequest. Each time a new game is started, a "game id" - a random number - is generated. This id is sent to the server along with the user's inputted commands. If I wanted to send a message to a player I would just pre-pend a special "token" to the usual return data from the server. Here's an example of the data returned to the client:
sent:@8832#The jukebox does nothing|look jukebox|eat jukebox|take jukebox|smash jukebox
The "@" marks the start of the game id, the "#" marks the end. The message to display is the text that follows, up to the first pipe symbol. The rest of the string is the usual return data of the user's moves.
The following code in the onReadyStateChange function looks for a the message token in the data and parses it for a game id. If it is the client's game id the message is displayed:
if ( returnedData[ 5 ] == '@' && returnedData.indexOf('#') != -1 )
{
liveGameId = returnedData.substring( 6, returnedData.indexOf('#') );
liveMessage = returnedData.substring( returnedData.indexOf('#') + 1, returnedData.indexOf('|') );
if( liveGameId == track_gameId )
{
println( 'The Fonz says:' + liveMessage ); //println writes to the DIV
}
}
The web would be great, if it weren't for the users
Voila! I don't know if anyone was helped, but I certainly know there is one guy out there who will never type "beat off" as a command in a text adventure again. Hoo no.
Any commercial uses? Well, it certainly could be used to add that "human touch", or better still, that "really really smart sounding computer touch" to a user experience. And it's one-way only communication, which means you can tell your customers stuff without having to listen to their boring nonsense.
Of course, The Fonzie's Treasure game map is very small, and it was very easy to look at common patterns and problems. But if you've got human resources to burn then you can just employ a bunch of people as "creative enhancement injectors" or something like that. Or, you could probably just outsource it.
Next week we return to hating the XmlHttpRequest object again, and show why you should give up using them right now. I mean, right next week.