Ajax and its use in your game?

[Tribal]

So... Ajax,

Very popular with those brain boxes at Google.

Do you use it?
Where about do you use it in your game?
Your reasoning behind its use/not use?

Explain people...


EDIT: Just realised this is probably in the wrong forum. Sorry Zeggy

[Zeggy]

No problem, I'll move the topic

I use it for map exploration - simply because it's easier for the user not having to refresh the entire page every time.

I use it for almost real-time chat Becuase I don't want to use java, and I don't want to have it like a shoutbox.

[Tribal]

yay @ chatting

wewt wewt

[jannesiera]

I'm going to use it for the chat, maybe in some menus. And perhaps for fast help (like when you go with your mouse over an item, it gives information.) though, I don't know how to do this yet .

[grim1208]

i enjoy the drag and drop functionality, good for moving characters around site maps.  Also for a prioritizing list functionality www.newgameprojects.net/drag_drop

Love ajax

[raestlyn]

Well, the game I participated the contest with is basicly one page thats updated with ajax all the time. I tried to optimise the queries so it would use less bandwith and cpu as little as possible making the whole game playing faster. Unfortunately my web host is slow, so the game is much slower than I hoped for.

[anbeck]

Until now I mostly use it for small stuff, like tool tips or tabs or pop-up info boxes. But I'm currently integrating a drag&drop system, which is quite a nice effect.

I think the future is certainly AJAX in browsergames, because you can create an user interface that people know from high-quality desktop games. People are just tired of text-based layouts online. With AJAX you can have nice effects with so little effort.

[Scion]

the other big thing with ajax is the a bit.....its asynchronus....so all those page reloads, are gone....no more website flicker....or if your like me on snail net, coffee breaks between page loads for a basic update.

Clever use of ajax allows us to give the impression that our websites are a lot faster and more responsive than they really are....

for instance take the classic one combo box dependant on the other....when using the form there is a natural delay between the user selcting the value in the first and moving to the second ...the classic approach is to reload the page...but thats not really all that nice...with ajax you can use that delay beween selection and navigation to start retrieving the data, and if your lucky it will be there befor the user wants to select from the dependant combo.

[genmac]

I'm planning to use it for all game menus as well as map movement and item management.

[Hypemaster]

I use it for my menu's and everything related to the map (unit movement, building,...). I use alot of ajax in my game.

[Zeggy]

What I'd really like to do is use AJAX for form checking... so the user has instant feedback if something is wrong. No need to submit a form and find out you've been entering the wrong things!

But... I don't know how to implement that and I don't think I'd have the time to spare for learning it

[knuts]

I use AJAX all over the place too, to show maps, incoming missiles, animation, menus, etc.

Form validation is not too bad, especially if you are already used to using XMLHttpRequest...
My javascript looks something like this:

Code: [Select]

function checkuname(uname,pw){
   xmlhttp = getxmlhttp();
   xmlhttp.open("POST","checkreg.pl?uname="+uname+"&passwd="+pw);
   xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState == 4 ) {
         try {
            if ((xmlhttp.status == 200)){
               //alert("XML=" + xmlhttp.responseText );
               str = eval("(" + xmlhttp.responseText + ")");
               if (str.result == "1"){
                  document.location = 'http://new.page.com';
               } else {
                  document.getElementById('popdiv').innerHTML = str.message;
               }
               return;
            } else {
               alert("ERROR BAD STATUS=" + xmlhttp.status);
               document.getElementById('popdiv').innerHTML = "Bad status code:" + xmlhttp.status;
               return;
            }
         } catch(err) {
            alert("JS Error" + err);
            document.getElementById('popdiv').innerHTML = "JS error:" + err;
            return;
         }
      }
   }
   document.getElementById('popdiv').style.visibility = "visible";
   xmlhttp.setRequestHeader( "If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT" );
   xmlhttp.setRequestHeader( "Content-Type", "application/x-www-form-urlencoded" );
   xmlhttp.send(null);
   return;
}

In perl, the function that checks if a username is ok looks something like :

Code: [Select]

sub checkreg {
 my $uname = shift;
 my $pass = shift;
 my $result = -1;
 my $msg = "None";
 if ($uname eq $pass){
    $result = 3;
    $msg = "Don't use your uname as you password !";
 }
#$exists = RESULT OF EXISTS QUERY;
if ($exists) {
   $result = 2;
   $msg = "Sorry that username is taken";
 } else {   
   $result = 1;
   $msg = "This will not be seen...";
   #insert the new user;
 }
 return "{\"result\": \"$result\"\n, \"message\": \"$message\"}";
}

The page has a form that calls "checkuname()" on submit, and an element "popdiv" that pops up the error message and a "try again" link that closes the popup div and resets the form variables that were wrong.

In php I guess it would be similar - whatever.php gets called with the XMLHttp POST, and returns a JSON string

Code: [Select]

{"result":"abc","message":"def"}  which is eval'ed and looked at to determine what the script should do - forward them to the next page, show them which form input was invalid, etc.

I'm sure there are other ways too . . .

[codestryke]

The new game I'm working on, CyberStryke, is very heavy ajax. I also use JSON, I started with XML but I ended up writing more XML parsing routines then I was writing the real meat of the interface logic. XML, IMHO, is just to wordy and thus to much bandwidth.. Yes I know you can gzip the output etc etc but in the end it just became to cumbersome to work with.

What I would like to recommend is using some sort of javascript library. I chose Prototype because it fit my needs, there are a ton more out there to chose from (also use Yahoo's YUI). Switching to using a javascript library has been a god send when coding intensive javascript UI's.

Yes it does make the pages bigger because the libraries are pretty good size but I think the benfit far outweighs the size. When I started CyberStryke only worked with FF and "ok" on IE.. Now it works with FF, IE, Safari and Opera

[jannesiera]

What I'd really like to do is use AJAX for form checking... so the user has instant feedback if something is wrong. No need to submit a form and find out you've been entering the wrong things!

But... I don't know how to implement that and I don't think I'd have the time to spare for learning it

Modulargaming has an ajax form checking... spryWidet or something... I don't have time to check it right now. But I guess it's soem sort of library and isn't to hard to implement, maybe you want to go to take a look at it. I use it, but I just copy existing code so I dont even know how exactly is working  .

[codestryke]

knuts,

Nice little demo there and thats how I started using JSON till I discovered the power of callbacks:) Not sure if you know this or not but I'll put it out there for those that might not. JSON can also be eval'd instead of just passing back variable information.

in knuts example the perl processing part I would return the check function with the data, something like so...

return "checkForm( {\"result\": \"$result\"\, \"message\": \"$message\"}) ";

on your receive notice you would eval(responseText)

Then on my HTML form I would have a function called checkForm(data) to process the returned information. The nice thing about doing it this way is you can set up only one AJAX receive handler and have your back-end dictate what function to hand off the data off to for processing

A good quick get to know it article that I used http://www.hunlock.com/blogs/Mastering_JSON_(_JavaScript_Object_Notation_)

[genmac]

I'm using xajax myself, it has a nice method of registering PHP functions which can then be called via a javascript link asynchronously.  Makes writing more game-like functions, eg querying or updating the database or processing game events, much easier.

[Piny2u]

Ajax is a great choice! Can do a lot of things.... I ussualy using for menus, popups, map exploring and form validation and  feedback.

I saw some drap&drop sistems verry cool. Is recommanded to use it to avoid refreshing the entire page in browser. Is more fastly and effective.

[lolninja]

I'm planning on using AJAX to poll my server for updates on character positions, the returned information will then be used to animate the players in the browser and with any luck it will be awesome Though its taken me about a year to come up with a method that might just work, so far my failed attempts list include stuff like loading a multiple Mb array in Javascript, then processing it down using a Quad tree, this gave me a much smaller map in memory, but it used up to much to then animate everything
Hopefully soon I will be able to post some videos of my work so far , though because I tend to work solid, then give up when it doesn't work maybe soon is a bit optimistic.

[raestlyn]

I did find a fine example what you can do with AJAX: Civilization Clone

[jannesiera]

I did find a fine example what you can do with AJAX: Civilization Clone

Ah, I'm curious, I'll take a look at it if I have time.