XM Radio Online v2.0 launches, now with AJAX!

XM Radio Online v2.0 is up. This was a complete rebuild of the UI and a nice overhaul to the back-end as well. Unlike the previous version, the UI is now mostly Javascript using xmlHttpRequest (that’s AJAX if you follow the trendy names for these things) for the channel/song data updates. There’s still a few small Flash movies for displaying the presets and the current song data.

Here’s a screenshot of the new player:

XM Radio Online Player v2.0

This new version should be much more accessible and easier to use, and also takes up fewer system resources, so people who want to tune in a channel and leave it playing in the background while they work should be happier.

This was an excellent project to work on – while I’ve done quite a bit of DHTML/Javascript work in the past, I’ve never used it as a base for an entire application. This was also the first time I used xmlHttpRequest, but I found that applying my Flash knowledge to the AJAX model worked out great – the only tricky part was figuring out a few browser inconsistencies and working around those.

If you want to check it out, you can sign up for a free 3 day trial.

7 thoughts on “XM Radio Online v2.0 launches, now with AJAX!

  1. “This new version should be much more accessible…”

    What’s the difference which leads you to suspect this? (What I’ve been hearing from the accessibility folks is that JavaScript can be harder to use with speechreaders and other assistive devices, so I’m trying to learn more.)

    I didn’t see any word about browser requirements on the front page… is there a browser-sniffer in one of those .JS includes? How is capability-detection handled?

    tx, jd/mm

  2. There’s a few changes that help with the overall usability and accessibility.

    The biggest improvement is probably the addition of presets. This is a big improvement in that you can have your favorite channels all lined up in front of you, instead of hunting through the huge list of channels every time you want to scan for something new. The old version just had the one large list on the screen at all times, so finding a specific channel in the list was much harder to do.

    Also the change to HTML allows the use of the browser’s default scrollbars, so if any users have their scrollbars set to larger sizes for easier grabbing, that will be honored as well. If you saw the crazy scrolling in the previous version, you’ll realize quickly that it’s a big improvement for people with disabilities (not just blind people).

    As for screen readers specifically: Since the Javascript just writes HTML to the page, it’s very simple (in this application, at least) for the screen readers to pick that up and read through the contents. This compared to the Flash version probably isn’t much of an improvement other than the possibility of vision impaired users being more experienced in using a screen reader when reading HTML content over Flash content.

    Browser detection was left mostly up to XM, and they decided to leave it open to everyone, (a decision I agree with) so they aren’t locking out any unknown browsers (as Linux users often are). Theoretically this will run on any browser that will play windows media streams and supports xmlHttpRequest for the song data, so I only check for the xmlHttpRequest capability and redirect to the upgrade page if they don’t support that. There’s no media player detection (didn’t want to lock out people using alternative players like mplayer on linux) so that is up to the user to upgrade/install. The application *should* run even without the Flash plugin installed, but you lose a bit of the presets functionality and the current song data won’t update unless you manually reload the data by changing to a different view. There is Flash detection (it uses my FlashObject script) but since Flash isn’t absolutely required you only get a text warning that you should download the Flash player.

  3. Thanks, Geoff, appreciated.

    For screen readers, people have the same UI when using it, regardless of the content. I don’t know how many Flash authors are using the audio-layout abilities yet, to really tweak what people hear. I used the Fangs extension to Firefox on the site, and here is what it says people will hear:

    Page has nineteen linksXM Radio dash XM RADIO ONLINE dash Mozilla FirefoxTable with three columns and two rowslinkGraphicXM Satellite RadioGraphicBeyond AM. Beyond FM.linkGraphicListen NowlinkGraphicLearn About XMlinkGraphicGet XM RadiolinkGraphicProgrammingTable endTable with one column and one rowTable endTable with one column and twenty-two rowsTable with one column and twenty-one rowsTable with three columns and twenty rowsTable with one column and two rows With XM Radio Online you’ll get unlimited access to over 75 channels of amazing programming including colon List of five itemsbullet All of XM’s 100 percent commercial dash free music channelsbullet XM’s exclusive music series link Artist Confidentialâ„¢ and link Then…Again…Live!â„¢bullet Online dash exclusive channels, including XM Liquid Metal , Special X registered and On the Rocks registered bullet The Bob Edwards Show , from XM’s Public Radio channelbullet Uncensored comedy including the outrageous, uninhibited talk duo, Opie and AnthonyList end See which XM Satellite Radio channels are available on thelink XM Radio Online Channel Lineup . Table with two columns and one rowlink Listener Support dash Find answers to frequently asked questions, details about system requirements, user agreements and other tips for using XM Radio Online.Table endTable endTable with one column and fifteen rowsTable with one column and five rowsTable with zero column and zero rowTable end Email colon Password colon link Forgot your password?Table endlinkTable with three columns and one rowlinklink You may be eligible for XM Radio Online, at no additional charge.linkTable endTable with one column and four rows XM Radio Online is a great way to experience the innovative programming you can hear on the XM service. Table with one column and three rowslinklinklinkTable endTable endTable endTable endTable endTable endTable with one column and four rowsTable with two columns and one row copyright Copyright 2001 dash 05 XM Satellite Radio. All Rights Reserved.link Privacy Policy vertical bar link Terms and ConditionsTable endTable endPage end

    (I’m trying to study that accessibility angle with the new JavaScript, which is why I grabbed onto your “more accessible” comment.)

    tx, jd/mm

  4. It looks like you grabbed the content of the XM Radio Online login page, not the actual player (and I should point out that I didn’t build anything but the actual player).

    If you run fangs on the player window, you’ll get a the full list of all the currently playing channels, along with song data depending on your view in the app.

    It’s really too bad Fangs doesn’t work on Flash content… that would be extremely useful.

    As for the ‘more experience navigating HTML content vs. Flash’ I was speaking of things like being able to skip bulleted lists, or being able to skip to the next item in a list using keyboard shortcuts (and other similar actions).

  5. “It’s really too bad Fangs doesn’t work on Flash content… that would be extremely useful.”

    I hear you — sometimes there have been threads in the Flash forums where people wanted to test the audio representations of their files, but couldn’t afford a screenreader. I don’t know of a free way to get a text presentation yet either.


  6. Dude, I’m impressed with the online player. Do you still work with/for XM? Because I have a suggestion. Is there any reason to limit the number of presets? Is this stuff being stored in a database or via cookies? I can understand limits on disk usage if you’re storing it all centrally. But if you’re using cookies to figure out presets and other things, why not let people create as many presets as they want? Limit the presets on the top to the number that still fits within the page layout, or even have a “more presets” button that lets you “scroll” through the presets on the limited-space top, but when you go to the preset tab, it should or could be unlimited, I have an alpine head unit (one of the earliest, pre-launch models, I think I’m like customer # 80,000 or something) and it limits me to 6 presets per “band”, and that’s annoying. Using your online player, I’ve realized there are a lot of channels that I could listen to that I never get to because, in my car, I navigate by the presets and up and down scans, so I might only go up or down 4 or 5 channels from any of the 6 presets.

    also, this may be on the backend, but I notice a consistent pause within the first 3 or 4 seconds of a song, it just pauses, then plays flawlessly for hours after that. Overall, not a big complaint, but if your programming has anything to do with it, I’m sure you’d like to investigate (BILL XM @ $xx an hour) the problem.

    I bought and then returned a PC XM radio device because getting the antenna positioned properly was a hassle. But I love having XM Radio on my laptop, at my desk, at work. I can listen to XM on the commute in, and then continue listening all day at work, and then again for the return trip home.

    The only drawback for XM is that I don’t need to buy a home player anymore, I was always considering it, but now I don’t need to. Tell them that, though, and you know they’ll consider getting rid of the online player. So don’t do that!

  7. oh yeah, I keep things simple, so I don’t even know if this is possible, but having the currently active song’s data scroll on the taskbar icon would be really nice. That way I can keep coding and just glance down to the task bar to see what song is playing without having to leave my work area and click to bring up the window.

Comments are closed.