exercise-screens is a utility that renders PNG screenshots of every
Perseus exercise on
Khan Academy. It is a very simple script that
fetches a list of exercises from
/api/v1/exercises and runs
webkit2png on each one. The resulting
images are stored in an Amazon S3 bucket for use
in various places on the site.
For historical reasons,
exercise-screens generates two versions of each
screenshot. The first is a "full-size" screenshot that can be any dimensions
but contains the entire
<div id="problemarea">. The second is a cropped square
screenshot whose dimensions are guaranteed to be 256 by 256 pixels. However,
this behavior is easily customizable if you'd like differently sized output.
The first version of
exercise-screens used PhantomJS
to capture screenshots, but now it uses
spicyj's fork of
and therefore only runs on Mac OS X now. The only other prerequisite is
Homebrew users can get it by running the
brew install imagemagick.
git clone https://github.com/Khan/exercise-screens.git cd exercise-screens git submodule update --init [sudo] pip install -r requirements.txt
Then customize the S3 bucket name in
exercise-screens.py and create a file
secrets.py containing your Amazon Web Services credentials. See
secrets.py.example for an example of how your
secrets.py should look.
Once your S3 credentials and bucket name are configured, simply run
./exercise-screens.py. The script will tell you what it is currently
processing and how many errors it encounters. An error is not the end of the
world; there currently exist some small inconsistencies in the Khan Academy
content entities that cause some exercises to have URLs that don't exist.
exercise-screens at regular intervals, you can set it up as a
is like a cron job on OS X steroids. After customizing the example plist, do
cp org.khanacademy.exercise-screens.plist.example ~/Library/LaunchAgents/org.khanacademy.exercise-screens.plist launchctl load ~/Library/LaunchAgents/org.khanacademy.exercise-screens.plist
exercise-screens will be executed periodically by the system.
You might also be interested in setting up a custom error document for your S3 bucket, which will let you serve a nice placeholder image instead of an ugly 404 in the event that someone tries to access a screenshot that doesn't exist.