For a new site, I wanted to have a DIV’s background image be dependent on the online status of an AIM user. jQuery and the AIM Presence API make it easy.
First, the code:
-
$.getJSON("http://api.oscar.aol.com/presence/get?k=key&f=json&t=aimuser&c=?",
-
function(result){
-
if (result.response.data.users[0].state == ‘online’) {
-
$("#status").css("background-image", "url(’online.jpg’)");
-
}
-
}
-
);
Using the getJSON() method of jQuery, we pass in the URL of the AIM Presence service with the parameters needed.
The f parameter tells the service what format to return the results in–JSON in our case. The c parameter specifies the JSON callback to use–this is important! The k and t parameters specify the AIM key to authorize the request and the user to query the prescense for. Note that key and aimuser need to be replaced with your AIM key and the user you want to query if you’re playing along at home.
The second parameter we pass in to getJSON() is the function we want to use to process the JSON data that gets returned. In this case, my CSS rule for the #status DIV specifies the background image used by default which is the offline status. This way, if there is a problem with the service or API, we default to it being offline. So, the function here just checks the first member of the returned users array in the response and compares their state to the string 'online'. We only need to worry about the first user returned since we’re querying the status for only one user.
The important part of this is setting c=? in the parameters passed to the AIM Presence service. This tells jQuery to replace the ? with the correct method name to call and passes it in to the service. Without this, you’ll get 'invalid label' errors in Firefox and it just won’t work in other browsers. The jQuery getJSON() docs note this but it wasn’t clear to me from the example at first how to use it.
That’s all there is to it. One more reason to love jQuery!
5 comments ↓
I resolved one ‘invalid label’ error on getJSON - jQuery by your entry. Thanks a lot!.
@Hidekazu: glad to hear it. That’s why I ended up writing this up since I spent way too much time on it
Can you please explain a little more the significance of c=?. Where does “c” come form, as opposed to “callback” or “jsoncallback”? I’m running into an “invalid label” and adding these arguments to the url have no effect on the error.
Thanks
@Jeff: they don’t show it in the FAQs any more but the “c” is what they specified to use for the callback parameter. So, when you use c=?, jQuery knows to sub the ? for the callback parameter it will use to eval the json response.
In the example in the jQuery docs using Flickr, it looks like Flickr is expecting the callback parameter to be named “jsoncallback”. You’d need to adjust the parameter name for the service you are using.
I’ve managed to get it working now.
Thanks very much for the article and explanation.