O'Reilly logo

Greasemonkey Hacks by Mark Pilgrim

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Hack #98. Animate Wikipedia History

Watch a full-screen timeline of how a Wikipedia page evolved.

The fundamentally fascinating thing about Wikipedia is that is can be edited by anyone. If you see a mistake, you can correct it. If you know something more about a topic, you can add it. If you think an image would be helpful as a reference, you can upload it. And, of course, if you're just a jackass who likes to destroy other people's work, you can deface it.

All of these actions are recorded, and you can roll back the clock to see what a page looked like at a specific revision. This hack takes this revision history one step further by constructing an animated timeline of the life of a Wikipedia entry, from its inception to its current state.

The Code

This user script runs on all Wikipedia history pages. It adds an "Animate changes" button to the history page that acts as the main entry point for the rest of the script. The animation itself is a series of calls to Wikipedia's revision history interface.

We create an XMLHttpRequest object to retrieve the actual revision text and associated metadata (such as the author and revision date). The script also constructs a slider (really, a styled <div> with appropriate styling and event handlers) that tracks the current status of the animation, from the first version of the page to the current revision.

Save the following user script as wikipedia-animate.user.js:

 // ==UserScript== // @name Wikipedia Animate // @namespace http://phiffer.org/greasemonkey/ ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required