Add the 30-second client replay tutorial to the docs.

It's verbatim from the blog post at the moment - I might edit it a bit before
pushing it to mitmproxy.org.

doc-src/02-docstyle.css

@@ -67,6 +67,13 @@ pre {
     background-color: #dddddd;
 }
 
+.terminal {
+    color: #ffffff;
+    background: #000000;
+
+
+}
+
 .docindex, .docindex ul {
     margin-top: 0.1em;
     margin-bottom: 0;

doc-src/index.html

@@ -18,7 +18,7 @@
      <li><a href="@!urlTo("library.html")!@">libmproxy</a></li>
      <li>Tutorials</li>
         <ul>
-            <li> Client replay: a 30 second example [coming soon] </li>
+            <li> <a href="@!urlTo("tutorials/30second.html")!@">Client replay: a 30 second example</a> </li>
             <li> Scripting: On-the-fly modifications to HTTP conversations [coming soon] </li>
             <li> Sticky cookies  [coming soon] </li>
             <li> Breaking iPhone apps for fun and profit [coming soon] </li>

doc-src/index.py

@@ -74,9 +74,10 @@ pages = [
     Page("anticache.html", "Anticache"),
     Page("filters.html", "Filter expressions"),
     Page("scripts.html", "External scripts"),
-    Page("library.html", "libmproxy: mitmproxy as a library"),
     Page("ssl.html", "SSL"),
     Directory("certinstall"),
+    Page("library.html", "libmproxy: mitmproxy as a library"),
+    Directory("tutorials"),
     Page("faq.html", "FAQ"),
     Page("admin.html", "Administrivia")
 ]

doc-src/tutorials/30second.html

@@ -0,0 +1,61 @@
+
+My local cafe is serviced by a rickety and unreliable wireless network,
+generously sponsored with ratepayers' money by our city council. After
+connecting, you  are redirected to an SSL-protected page that prompts you for a
+username and password. Once you've entered your details, you are free to enjoy
+the intermittent dropouts, treacle-like speeds and incorrectly configured
+transparent proxy. 
+
+I tend to automate this kind of thing at the first opportunity, on the theory
+that time spent now will be more than made up in the long run. In this case, I
+might use [Firebug](http://getfirebug.com/) to ferret out the form post
+parameters and target URL, then fire up an editor to write a little script
+using Python's [urllib](http://docs.python.org/library/urllib.html) to simulate
+a submission. That's a lot of futzing about. With mitmproxy we can do the job
+in literally 30 seconds, without having to worry about any of the details.
+Here's how.
+
+## 1. Run mitmdump to record our HTTP conversation to a file.
+
+<pre class="terminal">
+> mitmdump -w wireless-login
+</pre>
+
+## 2. Point your browser at the mitmdump instance. 
+
+I use a tiny Firefox addon called [Toggle
+Proxy](https://addons.mozilla.org/en-us/firefox/addon/toggle-proxy-51740/) to
+switch quickly to and from mitmproxy. I'm assuming you've already [configured
+your browser with mitmproxy's SSL certificate
+authority](http://mitmproxy.org/doc/ssl.html).
+
+## 3. Log in as usual. 
+
+
+And that's it! You now have a serialized version of the login process in the
+file wireless-login, and you can replay it at any time like this:
+
+<pre class="terminal">
+> mitmdump -c wireless-login
+</pre>
+
+## Embellishments
+
+We're really done at this point, but there are a couple of embellishments we
+could make if we wanted. I use [wicd](http://wicd.sourceforge.net/) to
+automatically join wireless networks I frequent, and it lets me specify a
+command to run after connecting. I used the client replay command above and
+voila! - totally hands-free wireless network startup.
+
+We might also want to prune requests that download CSS, JS, images and so
+forth. These add only a few moments to the time it takes to replay, but they're
+not really needed and I somehow feel compelled trim them anyway. So, we fire up
+the mitmproxy console tool on our serialized conversation, like so:
+
+<pre class="terminal">
+> mitmproxy wireless-login
+</pre>
+
+We can now go through and manually delete (using the __d__ keyboard shortcut)
+everything we want to trim. When we're done, we use __S__ to save the
+conversation back to the file.

doc-src/tutorials/index.py

@@ -0,0 +1,5 @@
+from countershape import Page
+
+pages = [
+    Page("30second.html", "Client playback: a 30 second example"),
+]