Fun & Games -- Charlie Harvey

<!DOCTYPE html> <html lang="en-GB"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1" />  <meta name="description" content="A collection of games, amusements and diversions. They might be fun. I suppose. A mix of things that I made myself, stuff that I think is funny and other random amusements." /> <meta name="keywords" content="charlie harvey, charlie, harvey, perl, html, punk, punk rock, cider, ciderpunx, direct action, boozeulator, daily mail generator, code, floss, gnu/linux, hacker, geekery" /> <meta name="news_keywords" content="charlie harvey, ciderpunx" /> <meta name="author" content="Charlie Harvey" /> <meta name="generator" content="Dancer 1.3500: Minimalist perl web framework. Vim: text editor." /> <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700%7CCabin:400,700%7CInconsolata:400" type="text/css" /> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" media="screen"/> <link rel="stylesheet" href="//static.charlieharvey.org.uk/css/style.css" media="screen" /> <link rel="alternate" type="application/rss+xml" title="RSS: Blog Posts" href="/page/feed/rss" /> <link rel="alternate" type="application/rss+xml" title="RSS: Comments" href="/comment/feed/rss" /> <link rel="alternate" type="application/rss+xml" title="RSS: Files" href="/file/feed/rss" /> <link rel="alternate" type="application/rss+xml" title="RSS: Flickr images" href="http://flickr.com/services/feeds/photos_public.gne?id=8361414@N05&lang=en-us&format=rss_200"> <link rel="license copyright" href="http://creativecommons.org/licenses/by-nc-sa/3.0/" /> <link rel="shortcut icon" href="//static.charlieharvey.org.uk/favicon.ico" /> <link rel="canonical" href="/page/fun_and_games " />  <meta property="og:title" content="Fun & Games" /> <meta property="og:locale" content="en_GB" /> <meta property="og:type" content="article" /> <meta property="og:url" content="/page/fun_and_games" /> <meta property="og:site_name" content="charlieharvey.org.uk" /> <meta property="og:description" content="A collection of games, amusements and diversions. They might be fun. I suppose. A mix of things that I made myself, stuff that I think is funny and other random amusements." /> <meta property="twitter:card" content="summary_large_image" /> <meta property="twitter:title" content="Fun & Games" /> <meta property="twitter:domain" content="charlieharvey.org.uk" /> <meta property="twitter:description" content="A collection of games, amusements and diversions. They might be fun. I suppose. A mix of things that I made myself, stuff that I think is funny and other random amusements." /> <meta property="twitter:creator" content="@ciderpunx" /> <meta property="twitter:site" content="@ciderpunx" /> <meta property="dc.title" content="Fun & Games" /> <meta property="dc.creator" content="Charlie Harvey" /> <meta property="dc.subject" content="Fun & Games" /> <meta property="dc.description" content="A collection of games, amusements and diversions. They might be fun. I suppose. A mix of things that I made myself, stuff that I think is funny and other random amusements." /> <meta property="dc.publisher" content="charlieharvey.org.uk" /> <meta property="dc.contributor" content="Charlie Harvey" /> <meta property="dc.language" content="en-GB" />  <script src="//static.charlieharvey.org.uk/js/zepto.min.js"></script> <title>Fun & Games -- Charlie Harvey</title> </head> <body>  <p class="hidden"><a id="top" href="#content">Skip navigation</a></p> <header class="titlebar"> <h1><a rel="me home" class="fn url no_under" href="/">Charlie Harvey</a></h1> </header> <nav class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">Menu</button> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li ><a class="tag me" href="/" >Home</a></li> <li class="dropdown active"> <a class="dropdown-toggle" href="#" data-toggle="dropdown">Blog<strong class="caret"></strong></a> <ul class="dropdown-menu" role="menu"> <li><a class="nav tag me" href="/page/index" accesskey="B">Blog home</a></li> <li class="divider"></li> <li><a class="nav tag me" href="/page/geekery">Geekery</a></li> <li><a class="nav tag me" href="/page/cider">Cider reviews</a></li> <li><a class="nav tag me" href="/page/projects">Projects</a></li> <li><a class="nav tag me" href="/page/activism">Activism</a></li> <li><a class="nav tag me" href="/page/reading_lists">Reading</a></li> <li><a class="nav tag me" href="/page/design">Design & photography</a></li> <li><a class="nav tag me" href="/page/musings_rants_oped">Musings</a></li> <li><a class="nav tag me" href="/page/vegan_recipes">Vegan recipes</a></li> <li><a class="nav tag me" href="/page/fun_and_games">Fun and games</a></li> </ul> </li> <li ><a class="nav tag me" href="/file/archive/1" accesskey="W">Files</a></li> <li ><a class="nav tag me" href="/flick/list/1" accesskey="I">Images</a></li> <li class="dropdown "> <a href="#" class="dropdown-toggle" data-toggle="dropdown">About<strong class="caret"></strong></a> <ul class="dropdown-menu" role="menu"> <li><a class="nav tag" href="/about" accesskey="?">About</a></li> <li><a class="nav tag me" href="/cv.pl" accesskey="R">CV</a></li> <li><a class="nav tag" href="/popular/week">Popular this week</a></li> <li><a class="nav tag" href="/about/feeds">RSS and Atom feeds</a></li> <li><a class="nav tag" href="/about/api">Content API</a></li> <li><a class="nav tag" href="/page/privacy">Privacy statement</a></li> <li><a class="nav tag me" href="/contact_charlie" accesskey="@">Contact</a></li> </ul> </li> </ul> <div class="searchbox right nav navbar-right pull-right"> <form method="get" id="search" class="navbar-form" role="search" action="/ddg"> <div class="input-group" id="search-input-group"> <label class="search-label hidden" for="st-search-input">Search:</label> <input type="text" name="q" maxlength="255" tabindex="1" placeholder="Search" id="st-search-input" /> <div class="input-group-btn"> <button type="submit" tabindex="2" name="go" value="" id="go" class="btn btn-default"> <span class="glyphicon glyphicon-search"></span> </button> </div> <label for="go" class="hidden">Go</label> </div> </form> </div> </div> </div> </nav>  <div id="page" class="container">   <ul class="breadcrumbs horizontal-list tinytext xoxo"> <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/page/index" itemprop="url"><span itemprop="title">Blog</span></a> /</li> <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/page/index" itemprop="url"></a><span itemprop="title">Fun & Games</span></li> </ul>   <article id="fun_and_games" class=" drop-cap"> <header> <h1 class="entry-title">Fun & Games</h1> <a rel="bookmark" href="http://charlieharvey.org.uk/page/fun_and_games" class="hidden">Permalink</a> </header> <div class="social-block-div"> <ul class="no-decoration" id="social-block">  <li><a href="https://twitter.com/intent/tweet?text=I’m%20reading%20Fun%20&%20Games%20—%20&url=http://charlieharvey.org.uk/page/fun_and_games&via=ciderpunx&related=ciderpunx" class="sprite twitter">Share on Twitter</a></li> <li><a href="http://www.facebook.com/share.php?u=http://charlieharvey.org.uk/page/fun_and_games&t=I’m%20reading%20Fun%20&%20Games" class="sprite facebook">Share on Facebook</a></li> <li><a href="https://plus.google.com/share?url=http://charlieharvey.org.uk/page/fun_and_games" class="sprite gplus">Share on Google+</a></li> <li><a href="http://news.ycombinator.com/submitlink?u=http://charlieharvey.org.uk/page/fun_and_games&t=Fun%20&%20Games" class="sprite hackernews">Share on Hacker News</a></li>  </ul> <a href="javascript:void(0)" id="social-block-toggle" class="visible-lg">↗</a> </div> <p class="tinytext no-drop-cap">This is the <em>Fun & Games</em> section. <a href="#blog-info-popup" data-toggle="modal" data-target="#blog-info-popup">Learn more »</a></p> <div id="blog-info-popup" class="tinytext modal fade in"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <a class="close" data-dismiss="modal">脳</a> <h2 class="modal-title">More about Fun & Games</h2> </div> <div class="modal-body"> <div class="entry-content"> <p>A collection of games, amusements and diversions. They might be fun. I suppose. A mix of things that I made myself, stuff that I think is funny and other random amusements.</p> </div>  <ul class="no-decoration" id="after-article-shares">  <li><a href="https://twitter.com/intent/tweet?text=I’m%20reading%20Fun%20&%20Games%20—%20&url=http://charlieharvey.org.uk/page/fun_and_games&via=ciderpunx&related=ciderpunx" class="sprite twitter">Share on Twitter</a></li> <li><a href="http://www.facebook.com/share.php?u=http://charlieharvey.org.uk/page/fun_and_games&t=I’m%20reading%20Fun%20&%20Games" class="sprite facebook">Share on Facebook</a></li> <li><a href="https://plus.google.com/share?url=http://charlieharvey.org.uk/page/fun_and_games" class="sprite gplus">Share on Google+</a></li> <li><a href="http://news.ycombinator.com/submitlink?u=http://charlieharvey.org.uk/page/fun_and_games&t=Fun%20&%20Games" class="sprite hackernews">Share on Hacker News</a></li>  </ul>  </div> </div> </div> </div> </article> <ul class="hfeed unstyled-list" >  <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/hipster_menu_crafter">The authentic, hand-curated Hipster menu crafter</a></h3> </header> <a href="/page/hipster_menu_crafter"><img style="width:40%;max-width:225px" src="https://static.pexels.com/photos/6969/sunset-summer-hipster-pipe.jpg" alt="The authentic, hand-curated Hipster menu crafter cover image" class="bordered rightfloat"></a> <p class="entry-summary"> Since the world, or at least the UK, seems to have decided to Gastrate all its pubs and the hipsters have taken over even once proudly grim local boozers, it seemed important to invent a tool to generate hipster menu items. And it should be written in vintage javascript, of course.So let me pres <a href="/page/hipster_menu_crafter">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2017-04-17T10:40:55Z" datetime="2017-04-17T10:40:55Z">2017-04-17</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/hipster_menu_crafter">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/what_if_languages">The foundational questions that inspire computer languages</a></h3> </header> <a href="/page/what_if_languages"><img style="width:40%;max-width:225px" src="//static.charlieharvey.org.uk/graphics/what-if-languages.jpg" alt="The foundational questions that inspire computer languages cover image" class="bordered rightfloat"></a> <p class="entry-summary"> I came across a very amusing image the other day, dealing with the questions that various popular programming languages seek to answer. There is a nice thread on reddit with some extra suggestions to include in the list too.Here is a transcription.Python: What if everything was a dict?Java: <a href="/page/what_if_languages">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2016-06-09T09:11:35Z" datetime="2016-06-09T09:11:35Z">2016-06-09</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/what_if_languages">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/corbynocalypse">The automatic #corbynocalypse certain doom prediction machine</a></h3> </header> <a href="/page/corbynocalypse"><img style="width:40%;max-width:225px" src="//static.charlieharvey.org.uk/graphics/fun-and-games/devil-corbyn-banner.png" alt="The automatic #corbynocalypse certain doom prediction machine cover image" class="bordered rightfloat"></a> <p class="entry-summary"> Everywhere I look it seems that another apocalyptic prediction about what will happen if Jeremy Corbyn is elected leader of the Labour Party. It seems that the Corbynocalypse is upon us. Fortunately the certain doom prediction machine® knows exactly what it will be like. Press the button, <a href="/page/corbynocalypse">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2015-08-14T19:32:19Z" datetime="2015-08-14T19:32:19Z">2015-08-14</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/corbynocalypse">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/11_years_old">Happy 11th birthday charlieharvey.org.uk</a></h3> </header> <a href="/page/11_years_old"><img style="width:40%;max-width:225px" src="//static.charlieharvey.org.uk/graphics/history/dotorg.png" alt="Happy 11th birthday charlieharvey.org.uk cover image" class="bordered rightfloat"></a> <p class="entry-summary"> A mere few days ago — 27 June 2015 to be precise — charlieharvey.org.uk celebrated its 11th birthday. They grow up quick, don’t they? It is now officially old enough to go to big school, at least if the Tories haven’t closed all the schools yet. In internet terms, 11 is anc <a href="/page/11_years_old">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2015-08-02T17:15:05Z" datetime="2015-08-02T17:15:05Z">2015-08-02</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/11_years_old">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/nineties_website_meercats_that_look_like_schneier">2 new sites: nineties.website, Meerkats that look like Bruce Schneier</a></h3> </header> <a href="/page/nineties_website_meercats_that_look_like_schneier"><img style="width:40%;max-width:225px" src="//static.charlieharvey.org.uk/graphics/fun-and-games/nineties-website.png" alt="2 new sites: nineties.website, Meerkats that look like Bruce Schneier cover image" class="bordered rightfloat"></a> <p class="entry-summary"> Today it rained most of the day. That, I suppose, is part of the joy of a British summer. The rainy weather conditions coupled with a rare non-work day allowed me to work on a couple of slightly silly websites that were rather fun to make and helped bring good cheer to my day._H_nineties.website_/ <a href="/page/nineties_website_meercats_that_look_like_schneier">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2015-07-24T19:43:48Z" datetime="2015-07-24T19:43:48Z">2015-07-24</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/nineties_website_meercats_that_look_like_schneier">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/video_esoteric_pprogramming_languages">Video: esoteric programming languages by TheBreakingBit</a></h3> </header> <a href="/page/video_esoteric_pprogramming_languages"><img style="width:40%;max-width:225px" src="http://img.youtube.com/vi/Ny4QdaqyEX8/maxresdefault.jpg" alt="Video: esoteric programming languages by TheBreakingBit cover image" class="bordered rightfloat"></a> <p class="entry-summary"> This recent video by TheBreakingBit amused me. The incredible creativity that has gone into creating languages that ar, let’s face it, a little bit silly is staggering. A favourite effort of mine that is missing from this video is Damian Conway’s fabulous CPAN module Lingua::Romana::Pe <a href="/page/video_esoteric_pprogramming_languages">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2015-02-26T19:15:13Z" datetime="2015-02-26T19:15:13Z">2015-02-26</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/video_esoteric_pprogramming_languages">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/video_tomorrows_world_future_office">Tomorrows World 1969: the bleak, lonely, sexist office of the future</a></h3> </header> <a href="/page/video_tomorrows_world_future_office"><img style="width:40%;max-width:225px" src="/graphics/fun-and-games/tomorrows-world-future-office.jpg" alt="Tomorrows World 1969: the bleak, lonely, sexist office of the future cover image" class="bordered rightfloat"></a> <p class="entry-summary"> I have a strange fascination for digging out old pieces of footage about the future. I don’t know why. Here is a particularly bleak version of how the future was to be, as foreseen in 1969 by BBC Tomorrow’s World presenter James Burke.A man in a business suit arrives at work. Wande <a href="/page/video_tomorrows_world_future_office">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2015-02-22T17:13:04Z" datetime="2015-02-22T17:13:04Z">2015-02-22</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/video_tomorrows_world_future_office">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/get_youtube_thumbnail">Tool: Get thumbnail images for youtube videos</a></h3> </header> <a href="/page/get_youtube_thumbnail"><img style="width:40%;max-width:225px" src="//img.youtube.com/vi/f3KE0EuzD4U/0.jpg" alt="Tool: Get thumbnail images for youtube videos cover image" class="bordered rightfloat"></a> <p class="entry-summary"> Here is a small tool for grabbing the thumbnail image for a youtube video — something I sometimes need to do and always have to DDG or Google. There is a very helpful StackOverflow answer, which it is straightforward to implement in Javascript (have a look at the source code of the page).Upd <a href="/page/get_youtube_thumbnail">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2015-02-10T23:39:09Z" datetime="2015-02-10T23:39:09Z">2015-02-10</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/get_youtube_thumbnail">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/what_is_internet_video">Video: What is internet? (1994)</a></h3> </header> <p class="entry-summary"> I have a thing about old clips non-technical folks talking about the intertubes. Witness, for example The Kids Guide to the Internet from 1997. Here is a great piece from the archives circa 1994. I love the idea that @ is the about symbol. And that you don’7 need a phone line to <a href="/page/what_is_internet_video">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2014-10-06T19:00:38Z" datetime="2014-10-06T19:00:38Z">2014-10-06</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/what_is_internet_video">Read on »</a> </div> <div class="clear"> </div> </article> </li>   <li> <article class="hentry drop-cap"> <header> <h3 class="entry-title"><a href="/page/haskell_house_cleaning_rota">The simplest cleaning rota that could possibly work. Haskell edition</a></h3> </header> <a href="/page/haskell_house_cleaning_rota"><img style="width:40%;max-width:225px" src="/graphics/brooms.png" alt="The simplest cleaning rota that could possibly work. Haskell edition cover image" class="bordered rightfloat"></a> <p class="entry-summary"> Living in a shared house can sometimes be troublesome; people have different living habits that can conflict with our own. In my house we recently agreed to start a cleaning rota to make sure that we were all doing our bit. The administrative overhead of a rota can be a pain, so I implemented a v <a href="/page/haskell_house_cleaning_rota">…</a> </p> <div class="clear" style="padding-top:1em;"></div> <div class="leftfloat"> <ul class="horizontal-list unstyled-list tinytext"> <li class="author vcard"><em>Posted By: <a href="/" class="fn url" rel="home">Charlie Harvey</a></em></li> <li class="updated published"><em>Published: <time class="value-title" title="2014-09-07T17:12:08Z" datetime="2014-09-07T17:12:08Z">2014-09-07</time></em></li> </ul> </div> <div class="righttfloat rightalign"> <a class="" href="/page/haskell_house_cleaning_rota">Read on »</a> </div> <div class="clear"> </div> </article> </li>  </ul> <p class="centre"> <a href="http://charlieharvey.org.uk/page/fun_and_games/archive/2" class="btn btn-dark btn-lg">More <em>Fun & Games</em> articles »</a> </p>  <section> <p><a id="comments" href="#"></a><br /></p> <h3>Comments</h3> <div id="comment-form" class="comment"> <form method="post" action="/comment/create" enctype="multipart/form-data"> <div class="comment-detail tinytext"> <ul> <li>Be respectful. You may want to read the <a href="/page/comment_guidelines">comment guidelines</a> before posting.</li> <li>You can use <a href="http://daringfireball.net/projects/markdown/syntax">Markdown syntax</a> to format your comments. You can only use level 5 and 6 headings.</li> <li>You can add class="your language" to code blocks to help <a href="https://highlightjs.org/">highlight.js</a> highlight them correctly.</li> </ul> <p> <strong>Privacy note</strong>: This form will forward your IP address, user agent and referrer to the <a href="http://akismet.com/">Akismet</a>, <a href="http://stopforumspam.com">StopForumSpam</a> and <a href="http://www.botscout.com/">Botscout</a> spam filtering services. I don’t log these details. Those services will. I <em>do</em> log everything you type into the form. Full <a href="/page/privacy">privacy statement</a>. </p> </div> <p> <label for="bdy" class="required">Leave a reply:</label><br /> <textarea required name="bdy" rows="5" cols="52" id="bdy" placeholder="Type your comment here"></textarea> </p> <p class="comment-detail"> <input type="hidden" name="page_id" value="17" /> <label for="nick">Name:</label> <input type="text" name="nick" value="" size="45" maxlength="140" id="nick" placeholder="Optional nickname" /> <br /> <label class="required" for="email">Email:</label> <input type="email" placeholder="email@example.com" required name="email" value="" size="45" maxlength="140" id="email" /> <br /> <label for="url">URL:</label> <input type="url" name="url" value="" placeholder="http://example.com" size="45" maxlength="140" id="url" /> <br /> <label for="ctitle">Title:</label> <input type="text" name="ctitle" value="" size="45" maxlength="100" id="ctitle" placeholder="Optional title" /> <br /> </p> <p> <label class="hidden" for="submit">Submit comment: </label> <input type="submit" name="submit" value=" Comment »" class="btn btn-dark btn-lg" id="submit" /> </p> </form> <script> $('.comment-detail').hide(); $('#bdy').focus( function(){ $('.comment-detail').show(); $('#bdy').attr('rows',10); $('#name').focus(); }); </script> </div> </section>     </div>  <footer id="footer" class="footer"> <div id="footwrap" class="container"> <ul class="row"> <li class="col-sm-3"> <section> <h3>Onsite links</h3>  <ul class="xoxo"> <li><a href="/daily_mail.pl">Daily Mail story generator</a></li> <li><a href="/newsfeed">Newsfeeds</a></li> <li><a href="/page/space_invaders">Space Invaders</a></li> <li><a href="/mills_boon.pl">Statistically probable Mills and Boon stories</a></li> <li><a href="/html_static/real_ultimate_perlgeeks.html">Real Ultimate Perl Geeks</a></li> <li><a href="/rot13">ROT13 Tool</a></li> <li><a href="/about/api">Content API</a></li> <li><a href="/contact_charlie">Contact</a></li> </ul>  </section> </li> <li class="col-sm-3"> <section> <h3>External links</h3>  <ul class="xoxo"> <li><a href="http://charlie.ox4.org" rel="me">Charlie's Drupal Life Aggregator</a></li> <li><a href="http://perlmonks.org/?node_id=373188" rel="me">Perlmonks page</a></li> <li><a href="http://slashdot.org/~ciderpunk" rel="me">Slashdot page</a></li> <li><a href="https://github.com/ciderpunx">Charlie’s repositories on github</a></li> </ul>  </section> </li> <li class="col-sm-3"> <section> <h3>Friends</h3>  <ul class="xoxo"> <li><a href="http://ox4.org/" rel="friend co-worker met">OX4: Webhosting for Oxford Activism</a></li> <li><a href="http://newint.org" rel="friend co-worker met">New Internationalist</a></li> <li><a href="http://hacktivista.net/" rel="friend co-worker met">Hacktionlab</a></li> <li><a href="http://eleanorg.org" rel="friend sweetheart date met muse">Nor’s Page</a></li> <li><a href="http://artfulrobot.com/" rel="friend met">Rich’s page</a></li> <li><a href="http://oxguin.net" rel="friend met">Graham’s page</a></li> <li><a href="http://theoarc.org.uk/" rel="friend co-worker met">Oxford Action Resource Centre</a></li> </ul>  </section> </li> <li class="col-sm-3"> <section> <h3>Follow me</h3>  <ul class="xoxo"> <li><a href="http://twitter.com/ciderpunx" rel="me"><div class="sprite32 twitter pull-left"> </div><div class="pull-left">   @ciderpunx</div></a><div class="clear"></div></li> <li><a href="http://flickr.com/photos/charlie_harvey" rel="me"><div class="sprite32 flickr pull-left"></div><div class="pull-left">   flickr</div></a><div class="clear"></div></li> <li><a href="http://uk.linkedin.com/in/charlieharvey"><div class="sprite32 linkedin pull-left"></div><div class="pull-left">   LinkedIn</div></a><div class="clear"></div></li> <li><a href="http://last.fm/user/ciderpunx" rel="me"><div class="sprite32 lastfm pull-left"></div><div class="pull-left">   last.fm</div></a><div class="clear"></div></li> <li><a href="/page/feed/rss" rel="me"><div class="sprite32 rss pull-left"></div><div class="pull-left">   RSS</div></a><div class="clear"></div></li> </ul>  </section> </li> </ul> <p id="copyright" class="centre">© Charlie Harvey 2003-2024. You can use the content under the <a href="http://creativecommons.org/licenses/by-nc-sa/3.0/">BY-NC-SA</a>. The code is under the <a href="https://www.gnu.org/licenses/agpl-3.0.html">GNU Affero licence</a> and is on <a href="https://github.com/ciderpunx/charlieharvey.org.uk">Github</a>.</p> </div> </footer> <script src="//static.charlieharvey.org.uk/js/min-new.js"></script> <script>// <![CDATA[ $(document).ready(function() { $('code').each(function(i, e) {hljs.highlightBlock(e)}); }); $( "#social-block-toggle" ).click(function() { $( "#social-block" ).slideToggle( "slow", function() { if ($('#social-block-toggle').html()==$('<div/>').html('&#8599').html()) { $('#social-block-toggle').html("↙"); } else{ $('#social-block-toggle').html("↗"); } }); }); $( "#sidebar-toggle" ).click(function() { $( "#sidebar" ).slideToggle( "slow", function() { if ($('#sidebar-toggle').html()==$('<div/>').html('&#8599').html()) { $('#sidebar-toggle').html("↙"); } else{ $('#sidebar-toggle').html("↗"); } }); }); // ]]></script> <script>// <![CDATA[ var _paq = _paq || []; _paq.push(["setCookieDomain", "*.charlieharvey.org.uk"]); _paq.push(["trackPageView"]); _paq.push(["enableLinkTracking"]); (function() { var u=(("https:" == document.location.protocol) ? "https" : "http") + "://piwik.charlieharvey.org.uk/"; _paq.push(["setTrackerUrl", u+"piwik.php"]); _paq.push(["setSiteId", "1"]); var d=document, g=d.createElement("script"), s=d.getElementsByTagName("script")[0]; g.type="text/javascript"; g.defer=true; g.async=true; g.src=u+"piwik.js"; s.parentNode.insertBefore(g,s); })(); // ]]> </script>  </body> </html>

CINXE.COM

Fun & Games -- Charlie Harvey