Breaking Code

September 19, 2012

Quickpost: Cheating on XKCD

Filed under: Just for fun — Tags: , , — Mario Vilas @ 3:23 pm

In case you missed it, today’s XKCD comic titled Click and Drag is simply amazing! Go check it out first, spend a few hours lost in it, and come back only when you’re done having fun. I’ll wait here. :)

Ok, you’re back. Naturally you’ll want to cheat on it at some point, to make sure you didn’t miss out on any hidden easter eggs! So let’s take a look at the web page.

The easiest route is loading the comic on Google Chrome, or Chromium. Just right click on the image and select “inspect element”. This quickly reveals how the neat trick works.

Taking a peek under the hood...

Taking a peek under the hood…

The “world” is divided into tiles of fixed size, and at all times the page loads the tile you’re currently viewing and the surrounding ones, in order to seamlessly stitch them together when scrolling. The clickable area is a map and the coordinates are used to build the URL to the images, which always follows the same pattern (north, south, and east and west coordinates). Trying out a few numbers reveals the “north” coordinate goes from 1 to 5, the “east” coordinate goes from 1 to 48 and the “west” coordinate goes from 1 to 33. Not all coordinates seem to work around the edges of the world (north 2 west 5 doesn’t work for example) and I couldn’t get south to work with manual tries. I suppose a couple empty images are used for those (one for black and one for white) but I didn’t confirm it.

The first thing I tried was just accesing the parent directory to see if directory indexing was enabled, but no such luck. Instead, I wrote this quick and dirty script in Python to download all images, using urllib to download them and shutil to write them to disk. Missing tiles are simply skipped.

This should be enough to check for easter eggs, but it’d be interesting of someone assembles a big image containing all the tiles. Let me know if you do! :)

Update 1: I originally missed the east coordinate, so the script was updated to try and bruteforce in all directions 1 to 10 north and south, and 1 to 50 east and west. This means a lot more HTTP requests, so I also added a pause between them as good netizens should.

Update 2: This seems to be the complete list of valid image URLs.

Update 3: A commenter pointed out somebody did assemble the entire world image! Check it out here.

Update 4: @prigazzi on Twitter pointed out this fully navegable map as well, based on Google Maps. Check it out! It’s IMHO the best one yet. :)

Update 5: The previous link no longer works, but this works pretty much the same way: xkcd-map.rent-a-geek.de

Source code:

#!/usr/bin/env python

from __future__ import with_statement

import time
import os.path
import shutil
import urllib2

def download(filename):
    if not os.path.exists(filename):
        url = "http://imgs.xkcd.com/clickdrag/" + filename
        print url
        try:
            fsrc = urllib2.urlopen(url)
            with open(filename, "wb") as fdst:
                shutil.copyfileobj(fsrc, fdst)
            print "=>", filename
        except urllib2.HTTPError, e:
            print "=>", "%s: %s" % (e.code, e.msg)
        print
        time.sleep(1)

for north in xrange(1, 50):
    for west in xrange(1, 50):
        filename = "%dn%dw.png" % (north, west)
        download(filename)
    for east in xrange(1, 50):
        filename = "%dn%de.png" % (north, east)
        download(filename)
for south in xrange(1, 50):
    for west in xrange(1, 50):
        filename = "%ds%dw.png" % (south, west)
        download(filename)
    for east in xrange(1, 50):
        filename = "%ds%de.png" % (south, east)
        download(filename)
About these ads

8 Comments »

  1. you missed south

    Comment by xuf — September 19, 2012 @ 4:27 pm

  2. I couldn’t find any working image south. I did miss east however! So I’m updating the script to bruteforce in those directions as well.

    Comment by Mario Vilas — September 19, 2012 @ 4:40 pm

  3. here’s a south:

    Comment by djObfuscate — September 20, 2012 @ 12:09 am

  4. Reblogged this on My.grind.on.IT und kommentierte:
    most awesome xkcd ever?

    Comment by Dirk.L — September 20, 2012 @ 4:32 pm

  5. the valid url for the list of images is .txt not .xml http://winappdbg.sourceforge.net/blog/xkcd-click-drag.txt

    Comment by stuart — September 24, 2012 @ 2:52 pm

  6. Oops! Thank you, fixed! :)

    Comment by Mario Vilas — September 24, 2012 @ 8:02 pm

  7. I feeel this is one of the so much important information for me.
    And i’m happy reading your article. However should commentary on some
    basic issues, The website style is ideal, the articles is truly nice :
    D. Excellent task, cheers

    Comment by Clash of Clans Cheats Codes — August 7, 2014 @ 1:27 am


RSS feed for comments on this post. TrackBack URI

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

The Silver is the New Black Theme. Create a free website or blog at WordPress.com.

Follow

Get every new post delivered to your Inbox.

Join 2,479 other followers

%d bloggers like this: