Billie Tweets - a Twitter tribute to Michael Jackson's "Billie Jean"
billietweets.com
billietweets.com
turns out I didn't even know the lyrics to the song that well :-) 20+ years!
I actually had to triple check with the various lyrics sites when I was coding it. I kept thinking there was no way these were the correct lyrics.
Deleted comment
The page contains a list of tuples which contain word, time, and indentation level. The tweets are loaded in the background from the billietweets server. I don't know if the list is static or gets updated from time to time. The YouTube player is used to get the current play time and the right word is looked up from the word list. The highlighting of the word in the tweet is done with a regular expression. And yes, it uses jquery.
Edit: great, I craft an answer, just to see the question vanish.
Sorry, I also saw the source, and figured out but was afraid of being down voted(it's almost like someone is swearing at you!). but your answer is much more than what i understood. I thought the author of this app could provide more details.
danielh was pretty much spot-on... The lyrics are stored with a time offset and indentation level (sort of like a player-piano roll) and the list of tweets is updated periodically by the server.
On the browser side, I'm using jQuery and the YouTube chromeless player (http://code.google.com/apis/youtube/js_api_reference.html)
When the page is loaded, I take the lyrics information and generate a sparse array where each index represents a tenth of a second. Then I start an interval timer that runs an update function once every 100 milliseconds. That updater gets the current video time from the YouTube player, converts that time value from milliseconds to deciseconds, grabs all entries from the sparse array between its last run and the current time, and inserts them onto the page (with a 200 ms fadeIn animation).
To be perfectly honest, there really isn't much code involved at all. Most of the development time was spent figuring out the time offset of each word. There was no fancy technology used there... it was just a brute force effort (though perhaps the Mechanical Turk could have been of use?)
I haven't had any coffee yet this morning so please let me know if my explanation was incoherent or if you'd like more info.
Never fear asking questions.