Wave Raid powered by Timed Comments

April 5th, 2012 by Lee Martin

Wave Raid

One of the SoundCloud API’s most powerful features is the timed comment. At its core it seems simple enough: a piece of text associated with a point in time for a particular track. But where you see timed opinions, I see a light-weight game scripting engine.

So when Johannes Wagener told me he was adding an ontimedcomments event to our JS SDK, I immediately began work on Wave Raid: Quest for the Timed Comment.

 

Pre Game

I’m fairly new to gaming, html5, canvas… pretty much everything used in building this hack. So Daniel X Moore’s No Tears Guide to HTML5 Games was an absolute godsend. It gives you an extremely solid base to develop HTML5 games while simultaneously explaining the basics of canvas. I wish more tutorials were written like this.

 

OnTimedComments

So, how does this ontimedcomments event work? Just add it as a function to your SC.stream event and tell your app what to do with the comment chunks as they come in. In my case, I’m creating coins (comments) to collect in game.

Disclaimer: CoffeeScript:

SC.stream TRACK_ID,
    ontimedcomments: (comments) ->
        for comment in comments
            coin = Coin(comment: comment)
            coins.push(coin)

Simple? Yes, indeed. Just loop through the comments and do whatever you want with them. [nerdrant]I may even want to look at the comment user’s details and vary the coin’s properties. Maybe if the comment came from the track owner, it would be a power up or obstacle.[/nerdrant]

 

Post Game

“That’s great Lee. but I’m not building a game.”

OKAY :( … You can use ontimedcomments in all sorts of ways:

  • Display comments in time with a playing track visualized in interesting ways. 3D, perhaps?
  • Maybe your track has an accompanied transcript of timed comments. Wouldn’t it be nice to display those while the track is playing? Yes, it would!
  • How about rich media content? Add some photos as timed comments to your track and then build an app that displays those in realtime. We used a similar technique on Storywheel.

But don’t take my word for it. Get in there, build something awesome, and let us know about it. We’ll be waiting.