World of Warcraft: Ajax item tooltips
Update 16 April 2010: I have created a drop-in extension, wowhead-mediawiki, to easily create Wowhead tooltips and links within Mediawiki.
World of Warcraft uses a floating tooltip to display detailed information about items and armor. The convention and style is duplicated on many websites, including the Warcraft website itself. I've wanted tooltips on the Apocalypse site, but there were several criteria that needed to be met:
- Some form of data mining had to be implemented.
- The data had to be available to hand-written pages, dynamic pages, MediaWiki, and phpBB.
- It had to be nifty.
Mining for Tooltips
Most WoW veterans are familiar with Thottbot. The Thottbot addon uploads in-game data to a third-party server, giving players a searchable database of items, recipes, bosses, quests, and just about everything else in the game. The item pages are modeled around the Warcraft tooltip style. This information is about as comprehensive as it gets, so that means the hard part is done: data has already made it out of Warcraft, and is just waiting for a script to pick it up.
Using a combination of the Curl library (for fetching web pages) and the Document Object Model methods (for parsing XML and HTML files), a Thottbot page can be dissected and the "tooltip" extracted. This data can then be stored in a local database to lessen the load on external servers.
Show what you Know
It turns out the World of Warcraft website uses tooltip functions from the folks over at Dynamic Drive. All that's left is to populate the tooltip with cached data from Thottbot. We have the tooltips in our database, but MediaWiki and phpBB don't have access. So, Ajax enters from stage right.
Through Ajax, large item tables become relatively painless. A custom
MediaWiki plugin can create new wiki tags, such as the
used in the previous example:
*<thottbot rarity="legendary">Bindings of the Windseeker</thottbot> Keridwen *<thottbot rarity="epic">Arcanist Bindings</thottbot> Jackstroud *<thottbot rarity="epic">Felheart Belt</thottbot> Osynling *<thottbot rarity="epic">Felheart Shoulder Pads</thottbot> Dakkota