Xbox Live Friends Sidebar Gadget 1.2

I’ve had this sitting on my hard drive for quite some time. I think there was something else I wanted to do with it, but I’m not really sure.  It’s been running pretty well for me for months though, so I think it’s about time I released it!

Version 1.2 has a bunch of small fixes in it and some cleaned up graphics. There’s some issues with the API I’m hitting causing ghost friends to show up, not much I can do about that. I’m also noticing some weirdness with the scroll bar in the config panel. It’s not worth fixing right now.

You know what time it is!

Download the gadget

Xbox Live Friends Sidebar Gadget 1.1

Download the gadget

I said I was working on it this morning, and I wasn’t even lying!  I’ve just updated the Xbox Live Friends Gadget to version 1.1 which brings with it almost everything I promised in the previous post!

New Stuff!

I’ve created an actual landing page for the gadget, http://patcavit.com/xbox-live-gadget/. There’s also a page helping people copy gadgets from their old install to a new one, http://patcavit.com/xbox-live-gadget/how-to-update/. Both of these pages need a lot of work but it’s a start. Had to learn a lot of wordpress knowledge I had long forgotten to be able to do that stuff!

So here’s what did end up making the cut for 1.1

  • The backend web service caches results now, makes updating faster (but the data is no less fresh!)
  • Expanding in height was retarded, the guidelines were correct. To solve the problem of more than 5 online contacts without expanding there’s now pagination!
  • Undocked state exists now, might even be marginally useful.
  • Flyout has a link to open up xbox.com to send user a message over XBL
  • Error Handling for bad data from the WS
  • New background images, no longer quite so boring!
  • List updates are animated with a subtle fade effect. Probably needs more tweaking, but I think it makes a big difference.
  • Checks to make sure you have the latest version of the gadget and will nag you if not
  • (Online) Instructions for updating the gadget to save you from having to retype your friends list
  • (Online) Actual web page for the gadget to provide some useful info

Unfortunately showing offline contacts didn’t make it. That task is quite a bit bigger than I originally though, but may still be coming down the pipe in a future update. There’s already a list of things I’m going to be working on next, so here’s a peek

  • Show total count of online friends somewhere
  • Flyout wonkiness
  • Make flyout more useful (it’s getting there slowly!)
  • List update fades interfere with the hover effect. This will be amusing to fix, I just know it.

So there’s still plenty for me to do and that was just after having one other person look at this. I’d love to get some feedback so I could keep working on this. After really getting into it I’m having a blast working with gadgets.

And now, pictures!

Closing in on Xbox Gadget 1.1

I’ve been working on this off and on ever since releasing 1.0, I definitely feel like this is deserving of a whole tenth of a full version bump.  Quick list of things that have changed so far off the top of my head.

  1. The backend web service caches results now, makes updating faster (but the data is no less fresh!)
  2. Expanding in height was retarded, the guidelines were correct. To solve the problem of more than 5 online contacts without expanding there’s now pagination!
  3. Undocked state exists now, might even be marginally useful.
  4. Flyout has a link to open up xbox.com to send user a message over XBL
  5. Error Handling for bad data from the WS
  6. New background images, no longer quite so boring!
  7. List updates are animated with a subtle fade effect. Probably needs more tweaking, but I think it makes a big difference.

There’s still a few things left I want to do before making 1.1 official like update nagging and possibly adding a toggle to the settings page to show all your contacts and just filter it so that the only ones are a different color and show up first. Not sure about that one yet, but it’s a possibility.

Look, it’s a SCREENSHOT of the new stuff! Ok so mostly I wanted to play with a Windows Live Writer “Polariod Image” plugin, but it’s still a perfectly reasonable picture. I don’t feel bad for a second about posting it, so there!

One last thing, I’ve given the gadget a “proper” home page at http://patcavit.com/xbox-live-gadget/ thanks to Wordpress’s support for pages and custom templates.  It took some hunting to figure out how to make a static page include a list of posts from a certain category, but http://www.transycan.net/blogtest/2007/09/10/static-frontpage-combined-with-dynamic-content/ was incredibly helpful in answering the questions I had.

Oh that reminds me I have to update the homepage in the gadget metadata…

Xbox Live Friends Sidebar Gadget

What’s the problem?

Knowing when my friends are online on Xbox Live has been a problem I’ve struggled with for years. When Microsoft announced the Xbox Community Developers program I thought I had found the answer. Then the recipients of the 50 API keys they gave out promptly made a bunch of websites I couldn’t care less about…

Except for 360voice.com (<3 their RSS feeds, I’m right here). I really like the daily summaries that pop up into Bloglines, it’s cool knowing what games I should get so we can play more.

But even 360voice doesn’t handle the status info I was interested in. There’s no good way to have a list of my friends updating in the background so I can tell with a glance who is online and whether or not I should join them. Plus there’s the hassle of actually getting someone else to sign up for it, so far I think all of 3 or so friends of mine are on there.

The other issue is one that isn’t anyone’s fault, per se. I don’t want to have to open a webpage to know who is online. The Xbox.com friends page is certainly easy to read, and it sticks all your friends at the top so you can scan it quickly. It still suffers from the fact that I have to actively go to it if I want to see who is online. I could hook up one of the Firefox extensions that checks a page for updates, but that still isn’t what I’m looking for.

That sounds like it should work…

So how do I get an unobtrusive, automatically updating list of my friends to sit on my desktop so I know at a glance who is online? Well I’m rocking Vista and dual-monitors, so I fired up the Sidebar and added the Xbox Friends WatchXbox Friends Watch gadget. It’s doubly neat because it not only does what I want but it uses Silverlight so there’s lots of fancy animations and the like.

I was pretty happy with this solution for a while, but it’s still not quite right. Despite me having more than 5 friends on Xbox Live, I can’t get updates for them. The gadget will happily add them and even appears to render them on its list, but it doesn’t support scrolling of any sort. You can kinda mouseover the very bottom and see the highlight travel to the other people on your list, but you’ll never know if they are online or not. Adding gamertags to it wasn’t the easiest thing in the world either, as the settings dialog expects tags to be commas-separated , which I always found to be pretty clunky.

Like I mentioned, the hard limit of 5 gamertags wasn’t a huge issue for me and I was happily using the Xbox Friends Watch gadget for several months. Eventually though I was having to swap people in and out of the list on a pretty regular basis, depending on which group of friendXbox Friends Watch Configs I was going to try and play with next. It didn’t make sense to me that I would have to do that, so I went looking to see if there were any other options out there.

Not quite, next!

The closest I found was Duncan MacKenzie’s Xbox to Twitter application. It’s very cool, and something I contemplated running for a while before deciding that I spammed Twitter (and Facebook, thanks to the Twitter App) and people probably wouldn’t care that much. Besides, I’m not looking for ways to broadcast to other people that I’m online, I want a way to keep tabs on my friends and know when they’re online.

So Xbox to Twitter wasn’t what I needed, but it did get me the hook I needed to be able to solve my problem. As part of his twitter app Duncan also put up a Webservice API you can hit to get Xbox status info for a gamertag. Even better, he put up a REST version of it that you can hit using plain old HTTP. It’s super simple, check this out:

http://duncanmackenzie.net/services/GetXboxInfo.aspx?GamerTag=Tivac

<?xml version="1.0"?>
<XboxInfo xmlns:xsi=http://www.w3.org/2001/XMLSchema-instance
xmlns:xsd="http://www.w3.org/2001/XMLSchema">
  <AccountStatus>Gold</AccountStatus>
  <PresenceInfo>
    <Valid>true</Valid>
    <Info>Last seen 58 minutes ago</Info>
    <Info2 />
    <LastSeen>2008-04-14T15:42:05-05:00</LastSeen>
    <Online>false</Online>
    <StatusText>Offline</StatusText>
    <Title>www.xbox.com</Title>
  </PresenceInfo>
  <State>Valid</State>
  <Gamertag>tivac</Gamertag>
  <ProfileUrl>http://live.xbox.com/member/tivac</ProfileUrl>
  <TileUrl>http://tiles.xbox.com/ti...8M6cr.jpg</TileUrl>
  <Country>United States</Country>
  <Reputation>99.98135</Reputation>
  <ReputationImageUrl>http://live.xbox.com/xweb/...gif</ReputationImageUrl>
  <GamerScore>12860</GamerScore>
  <Zone>Recreation</Zone>
  <RecentGames>
    <XboxUserGameInfo>
      <Game>
        <Name>Halo 3</Name>
        <TotalAchievements>49</TotalAchievements>
        <TotalGamerScore>1000</TotalGamerScore>
        <Image32Url>http://tiles.xbox.com/tiles/oo/P5/0...</Image32Url>
        <Image64Url>http://tiles.xbox.com/tiles/zS/3N/1W....jpg</Image64Url>
      </Game>
      <LastPlayed>2008-04-10T00:25:48-05:00</LastPlayed>
      <Achievements>25</Achievements>
      <GamerScore>770</GamerScore>
      <DetailsURL>http://live.xbox.com/en-...o=tivac</DetailsURL>
    </XboxUserGameInfo>
    ...
  </RecentGames>
</XboxInfo>

A little hard to parse in this format, I know. Hitting that URL in your browser will make it easier to understand though. I also shortened all the URLs and removed a the previous 9 games I had played because honestly, it’s not that interesting and it makes the XML way longer.

This is it though, the data that I needed to solve the problem of “I want to know what friends are on Xbox Live” (at least for me!). All I needed to do was to figure out how to use that info. Reaching back into the depths of my memory I recalled my previous attempt at building sidebar gadgets (http://patcavit.com/2007/05/04/vista-gadget-headaches/) and how I in fact had tried to build this very gadget once before. Except it failed horribly because I couldn’t automate a Windows Live login. Well wonder of wonders, with this API I don’t have to!

Finally, some progress!

So after a few days of hacking in JavaScript and PHP I’ve got a sidebar gadget that takes a list of Xbox gamertags and will update to let you know when any of them are online. It even uses the cool Gadget Persistent Storage library to store your list of gamertags when you remove and re-add the gadget. A lot of this is powered by a small subset of YUI because programming JS without it is too painful. Specifically I’m using Reset, DOM, Event, JSON & Connection.

Xbox Friends ListXbox Friends List Flyout

There are of course some caveats to this, but there always are.

Getting a list of gamertags isn’t automated. I’m not even sure the people who have direct access to the Xbox Community Developers Program ever got this capability. I doubt it. It means that for now you’ll still need to input a bunch of gamertags by hand. Fortunately this list is newline separated, so it’s very quick to add a bunch of them. I’ve got some stub code in there to parse it from a copy/paste of your Xbox.com friends management page, but it isn’t ready for anyone to actually use yet.

  1. It violates Microsoft’s Gadget UI Guidelines, in that gadgets shouldn’t change size on anything other than a click. Mine does automatically depending on the number of people online. It could even conceivably become taller than your monitor. Microsoft is definitely right about this and I think it sucks, but I didn’t figure out a clean way of paginating the data that could stand. This is something I’m going to work on in the future, but for now it’s crappy.
  2. There’s no undocked state. More accurately, it’s the exact same docked to the sidebar and undocked. Ideally it would expand a bit to shower bigger icons, larger text, and gamerscore (at a minimum) when you undocked the gadget. That’s on the list of things I’d like to do someday, but since I never use the gadget undocked is pretty low priority.
  3. There’s still some weird behaviors. Here’s the ones I know about.
    1. Sometimes the requests to the server for user info just take forever and return empty.
    2. Opening a new flyout when there’s already one open causes the flyout to lose focus until you click on it. This appears to be a Sidebar/Gadgets limitation so it’s unlikely to be fixed.

Xbox Friends List SettingsStill, it works like I need it to which is really the only important thing! I’d love to have some other people use it and give me feedback though. I’m always down for hearing about bugs as well, though no promises that they will be something easily fixable.

It’s not the prettiest thing in the world, I’ve modelled it after xbox.com and the flyout details are powered by the Embeddable Gamercards offered on xbox.com. Here’s an example of the what those look like

Put your gamertag here too.

It’s lazy but it gets the data I want in there without a lot of hassle on my part. In the future I would like to have a nicer flyout more akin to what Xbox Friends Watch has. Unfortunately, that’ll be a a good chunk of work to get the interactions right so that’s a challenge I’m putting off for another day. I don’t even really use the flyouts in my day to day gadget usage, but it’s nice to be able to interact and get a bit more information.

As usual I’ve written way too much and not posted enough links to just get the damn thing, so here you go!

Xbox Live Friends Gadget 1.0