WorldWideWeb, 30 years on

This month, a collection of some of my favourite geeks got invited to CERN in Geneva to participate in a week-long hackathon with the aim of reimplementing WorldWideWeb – the first web browser, circa 1990-1994 – as a web application. I’m super jealous, but I’m also really pleased with what they managed to produce.

DanQ.me as displayed by the reimagined WorldWideWeb browser circa 1990
With the exception of a few character entity quirks, this site remains perfectly usable in the simulated WorldWideWeb browser. Clearly I wasn’t the only person to try this vanity-check…

This represents a huge leap forward from their last similar project, which aimed to recreate the line mode browser: the first web browser that didn’t require a NeXT computer to run it and so a leap forward in mainstream appeal. In some ways, you might expect reimplementing WorldWideWeb to be easier, because its functionality is more-similar that of a modern browser, but there were doubtless some challenges too: this early browser predated the concept of the DOM and so there are distinct processing differences that must be considered to get a truly authentic experience.

Geeks hacking on WorldWideWeb reborn
It’s just like any other hackathon, if you ignore the enormous particle collider underneath it.

Among their outputs, the team also produced a cool timeline of the Web, which – thanks to some careful authorship – is as legible in WorldWideWeb as it is in a modern browser (if, admittedly, a little less pretty).

WorldWideWeb screenshot by Sir Tim Berners-Lee
When Sir Tim took this screenshot, he could never have predicted the way the Web would change, technically, over the next 25-30 years. But I’m almost more-interested in how it’s stayed the same.

In an age of increasing Single Page Applications and API-driven sites and “apps”, it’s nice to be reminded that if you develop right for the Web, your content will be visible (sort-of; I’m aware that there are some liberties taken here in memory and processing limitations, protocols and negotiation) on machines 30 years old, and that gives me hope that adherence to the same solid standards gives us a chance of writing pages today that look just as good in 30 years to come. Compare that to a proprietary technology like Flash whose heyday 15 years ago is overshadowed by its imminent death (not to mention Java applets or ActiveX <shudders>), iOS apps which stopped working when the operating system went 64-bit, and websites which only work in specific browsers (traditionally Internet Explorer, though as I’ve complained before we’re getting more and more Chrome-only sites).

The Web is a success story in open standards, natural and by-design progressive enhancement, and the future-proof archivability of human-readable code. Long live the Web.

Update 24 February 2019: After I submitted news of the browser to MetaFilter, I (and others) spotted a bug. So I came up with a fix…

DanQ.me as displayed by the reimagined WorldWideWeb browser circa 1990× Geeks hacking on WorldWideWeb reborn× WorldWideWeb screenshot by Sir Tim Berners-Lee×

CSS-driven console graphics

If you’re reading this post via my blog and using a desktop computer, try opening your browser’s debug console (don’t worry; I’ll wait). If you don’t know how, here’s instructions for Firefox and instructions for Chrome. Other browsers may vary. You ought to see something like this in your debugger:

Debug console on DanQ.me showing Dan's head and a speech bubble.
I’m in your console, eating your commands!

What sorcery is this?

The debug console is designed to be used by web developers so that they can write Javascript code right in their browser as well as to investigate any problems with the code run by a web page. The web page itself can also output to the console, which is usually used for what I call “hello-based debugging”: printing out messages throughout a process so that the flow and progress can be monitored by the developer without having to do “proper” debugging. And it gets used by some web pages to deliver secret messages to any of the site users who open their debugger.

Facebook console messaging advising against the use of the console.
Facebook writes to the console a “stop” message, advising against using the console unless you know what you’re doing in an attempt to stop people making themselves victims of console-based social engineering attacks.

Principally, though, the console is designed for textual content and nothing else. That said, both Firefox and Chrome’s consoles permit the use of CSS to style blocks of debug output by using the %c escape sequence. For example, I could style some of a message with italic text:

>> console.log('I have some %citalic %ctext', 'font-style: italic;', '');
   I have some italic text

Using CSS directives like background, then, it’s easy to see how one could embed an image into the console, and that’s been done before. Instead, though, I wanted to use the lessons I’d learned developing PicInHTML 8¾ years ago to use text and CSS (only) to render a colour picture to the console. First, I created my template image – a hackergotchi of me and an accompanying speech bubble, shrunk to a tiny size and posterised to reduce the number of colours used and saved as a PNG.

Hackergotchi of Dan with a speech bubble, "squashed".
The image appears “squashed” to compensate for console monospace letters not being “square”.

Next, I wrote a quick Ruby program, consolepic.rb, to do the hard work. It analyses each pixel of the image and for each distinct colour assigns to a variable the CSS code used to set the background colour to that colour. It looks for “strings” of like pixels and combines them into one, and then outputs the Javascript necessary to write out all of the above. Finally, I made a few hand-tweaks to insert the text into the speech bubble.

The resulting output weighs in at 31.6kB – about a quarter of the size of the custom Javascript on the frontend of my site and so quite a bit larger than I’d have liked and significantly less-efficient than the image itself, even base64-encoded for embedding directly into the code, but that really wasn’t the point of the exercise, was it? (I’m pretty sure there’s significant room for improvement from a performance perspective…)

Scatmania.org in 2012
I’ll be first to admit it’s not as cool as the “pop-up Dan” in the corner of my 2012 design. You might enjoy my blog post about my 20 years of blogging or the one about how “pop-up Dan” worked.

What it achieved was an interesting experiment into what can be achieved with Javascript, CSS, the browser console, and a little imagination. An experiment that can live here on my site, for anybody who looks in the direction of their debugger, for the foreseeable future (or until I get bored of it). Anybody with any more-exotic/silly ideas about what this technique could be used for is welcome to let me know!

Update: 17 April 2019 – fun though this was, it wasn’t worth continuing to deliver an additional 25% Javascript payload to every visitor just for this, so I’ve stopped it for now. You can still read the source code (and even manually run it in the console) if you like. And I have other ideas for fun things to do with the console, so keep an eye out for that…

Debug console on DanQ.me showing Dan's head and a speech bubble.× Facebook console messaging advising against the use of the console.× Hackergotchi of Dan with a speech bubble, "squashed".× Scatmania.org in 2012×

The Signal and the Noise

The Signal and The Noise
The Signal and The Noise, by Andrew Paul Regan.

I’d just like to say a few words of praise for Andy‘s new album, The Signal and the Noise. It’s not the first time I’ve said nice things about him, but it’s the first time since he’s been recording under his full name, rather than as “Pagan Wanderer Lu”.

I can say this for sure, though: The Signal and the Noise has finally dethroned my previous favourite Lu album, Build Library Here (or else!). It’s catchy, it’s quirky, and it’s full of songs that will make you wish that you were cleverer: so far, so good. I think that one of the things that particularly appealed to me in this album were that the lyrical themes touched on so many topics that interest me: religion and superstition, artificial intelligence, the difficulties of overcoming materialism, cold war style espionage, and cryptography/analysis… all wrapped up in fun and relatable human stories, and with better-than average running-themes, links, and connections.

One of the joys of Andy’s (better) music comes from the fact that rather than interpretation, it lends itself far better to being issued with a reading list. To which end, here’s a stack of Wikipedia articles that might help you appreciate this spectacular album a little better, for the benefit of those of you who weren’t lucky enough to have read all of this stuff already:

Oh; backing vocals, you’re too kind! But this is just another chapter in the story of my life.

The Omniscient Narrator

The final track’s a little weaker than the rest (the actual final track, not the “hidden track” bit), and I’m left with a feeling that this was so-close but not quite a concept album (which would have been even more spectacular an achievement), but these are minor niggles in the shadow of an otherwise monumental album.

Go get a copy.

By the way; I’ve got a spare – who wants it? Spare copy’s gone to Claire as an early birthday present. Somehow she failed to preorder a copy of her own.

Looking for an alternate opinion? Here’s a guy who didn’t “get it”.

The Signal and The Noise×

Quickly, Before They Turn The Glass Into Lesbians!

So, what have I been up to this weekend, you ask. Well…

“Cover The Mirrors” Launch Party

On Friday I took the train up to Preston. The train I was on broke down at Machynlleth when they linked it up to the carriages that had come down the Pwllheli line, and the repairs set me back by almost an hour, but it turns out that the rest of the rail network was running behind schedule that day, too, and so I didn’t miss any important connections. I arrived in time for a quick “birthday tea” with my family (for my dad’s birthday) before rushing off to the Waterstones for the launch party for my friend Faye‘s first published novel, Cover The Mirrors.

Dan with author Faye at the book launch

I drank as much wine as the store were willing to give me and bought myself a signed copy of the book. I even managed to get the photo, above, under the proviso that it’s only allowed to appear on the internet thanks to the fact that I’m holding a carrier bag in front of Faye’s face (she’s more than a little camera-shy). I haven’t started reading Cover The Mirrors yet, because I’m virtually at the end of The Night Watch by Sergei Lukyanenko, and I’d like to finish that first, but little doubt you’ll hear about it here in due course.

Dad’s Birthday

After the book launch, my sisters and I took my dad out for a few drinks to celebrate his 51st birthday. It turns out that, in my absence, Preston’s nightclub scene has really taken off. We started out in an 80s-themed bar which is part of a chain called Reflex. It’s so 80s it’s unreal: all 80s hits playing, David Hasselhoff and Mr. T decorating every wall, glitter balls and spots and mirrors everywhere… deely-boppers available at the bar… and so on. Really quite a fantastic theme venue. Then, under my sister Sarah’s recommendation, we tootled up the street and into a cafe/club called Manyana, where my dad got hit on by somebody young enough to be his daughter.

My dad and some 20-something year-old

I snatched this picture. I’ve no idea who she is – we didn’t get her name – but she seemed genuinely surprised to hear my dad’s age. So I had the DJ announce it, just to make sure there was no doubt in anybody’s mind that there was an old person on the dancefloor.

This influx of Preston nightclubs is making them all remarkably competitive with their drinks prices, too. I bought a few rounds for the four of us and none of them ever came to over a tenner, and one – thanks to the “buy one get one free” policy at Manyana – came to under £6, which is quite remarkable for a city nightclub on a Friday night for four people!

Back To Aberystwyth

On Saturday I had brunch with my sister Becky, my mum, and her boyfriend and then got back onto the trains to head back to Aberystwyth. Owing to line maintenance, the stretch of track between Crewe and Preston is unusable every weekend within sight, and so I was re-directed via Manchester Piccadilly. Yet again, my train ran late, and I found myself sprinting across Piccadilly station, trying to find a train that was heading Shrewsbury-way…

…meanwhile, my friend Katie, having slept through her stop, woke up in Manchester Piccadilly and, not quite awake, clambered off her train in an attempt to find a connection. I’d apparently featured in her dream, and so she was quite surprised (and not quite sure if she was seeing things) when I sprinted past her. She sent a text (which I chose to ignore: my pocket beeped but I was too busy looking for a train to take the time to get my phone out) and then phoned me before she was able to confirm that yes, it really was me.

As we were headed the same way, she joined me on my train for one stop, which was a nice surprise for what was a long and overcomplicated train journey. A few folks have suggested that this might not be a coincidence, and that she might be stalking me, but I’m yet to be convinced.

In any case, I don’t have a picture to go with this part of the story. Sorry.

Jimmy, Beth, and Troma Night

YATN. If you were there, you know how it went. Big thanks to Jimmy and Beth for coming along.

Lloyd Kaufman’s Visit

In case you’ve not been anywhere that I can pounce on you and go “squee!” recently, here’s what you missed out on. You’ll remember that last week I mentioned that PoultrygeistTroma‘s new movie – was coming to Aberystwyth. Well, it did. And it rocked…

…and better yet, Ruth, Claire, JTA, Paul and I got to hang out with Lloyd Kaufman, president of Troma Studios and producer of The Toxic Avenger, for a couple of pints and to share a bowl of nachos. The guy’s fabulously chatty and friendly, and if it weren’t for the awestruck feeling of “wow, we’re just sat here chatting with Lloyd Kaufman in Lord Beechings” we’d have probably been more interesting company.

Dan, Claire, !!!LLOYD KAUFMAN!!!, JTA, and Ruth

When he said goodbye, kissing the cheeks of each of the girls, I genuinely thought that they were in danger of exploding with excitement. Thankfully they didn’t, because I’d already bought them tickets to see Poultrygeist later on.

Which was, as I’ve said before, fantastic. It’s even better seen with a nice, energised audience, and better still when the director and several other people who worked on the film are hanging around afterwards to answer questions, chat, autograph things and so on. There are apparently 15 prints of Poultrygeist and the capacity to make more on demand, so if you want to see it and can’t wait for the DVD release, go speak to your local cinema now and ask if they’ll show Poultrygeist, even if only for a week (as Lloyd himself said, it’s better than showing Transformers on all 24 screens of some soulless megaplex). And hell, with Troma’s current financial situation, they could probably do with a helping hand with getting into as many projection booths as possible!

The title of this post – Quickly, Before They Turn The Glass Into Lesbians! – is a reference to one of my favourite lines in the film.

Paul might have bitten off more than he can chew, though, as he hinted on his blog. After some discussion with Lloyd, Paul is likely to be responsible for:

  • Re-establishing the UK division of the Troma fan club.
  • Acting as president of the above, for the forseeable future.
  • Investigating UK distribution of Troma films.
  • Oh, and making an official DVD subtitle track for Poultrygeist: Night Of The Chicken Dead, which describes the Troma Night drinking rules and reminds you when you should be drinking. He’s got a few ideas about things that should be in such a subtitle track, too, and if you’re familiar with the rules you’ll probably be able to guess what he’s thinking about.

I’ll leave it to him to go into detail, if he wishes.

Matt In Hospital

Between places, we also joined a growing crowd at the foot of Matt‘s bed in Bronglais Hospital. His operation was a success, but he’s reacted unusually to the general anaesthetic and they’re likely to keep him in for observation for another few days. If you haven’t had a chance to visit him already, he’d probably appreciate the company (although Sarah seems to have barely left his side): visiting hours are 3pm-5pm, 6pm-8pm: just ask if you need to know what ward he’s in and how to get there. If you’re feeling particularly cruel, mock him by talking about how well your bodily excretions are working, or swap his drip with his catheter bag while he’s not looking.

But seriously: I’m sure we all wish him well.

Curry!

Finally – as if we weren’t full enough from a large Sunday lunch – after leaving the cinema, Gareth, Penny, Amy, Ruth, JTA, Rory, Paul, Claire and I slipped down for a late-night curry at the Spice of Bengal. Which was delicious, although there was a little much food for those of us who were already quite full.

Dan eating curry!

Nonetheless, a fantastic end to a fantastic weekend! I’m sure everybody else will have a different story to tell (Paul spent longer with Lloyd and went to more films; Claire and Jimmy got horribly drunk together on Friday night after she, Ruth and JTA failed to see a Meatloaf concert; Matt’ll have his own morphine-fuelled tale to spin, and so on), because it’s been a rich, full couple of days for many of us abnibbers.

Dan with author Faye at the book launch× My dad and some 20-something year-old× Dan eating curry!×

Troma Night CLXI – Tonight

CHANGE OF PLANS: All of the tickets for Pan’s Labyrinth are sold out. For those that didn’t get a ticket in time and for those that weren’t coming to Pan’s Labyrinth anyway, Troma Night now starts as usual at The Cottage at 8pm. Tell anybody who might not know.

Tonight is the 161st Troma Night (based on liberal estimation and basic guesswork), and it’s a somewhat unusual one. The plan is as follows:

  • 8:00 pm – start at the Arts Centre for the stunning-looking Pan’s Labyrinth. Yes, this means that we won’t be ordering pizza at 8pm: instead, I suggest that people either (A) eat beforehand or (B) have a snack beforehand to keep them going, and we’ll order pizza later. I suspect I’ll be doing option B.
  • 10:20 pm – return to The Cottage, order pizza for anybody who’s hungry, and watch something else. I propose an MST3K, or perhaps one of the B-movies Jimmy provided some weeks back, because I anticipate that something silly, bad, and/or funny will be quite welcome after the psychological thriller than Pan’s Labyrinth is likely to be, but I’m open to suggestions and I’m happy to do things democratically.

If there’s anybody who doesn’t want to come along to Pan’s Labyrinth but does want to come for the rest, let me know and I can give you a bell when we leave the cinema, so you can meet us in a timely fashion. But really, you should come.

A Very Merry Troma Night – Tonight At The Cottage

Tonight’s Troma Night will be held at The Cottage. It’s the final Troma Night of the year, and it’ll be our least Christmassy of the “Christmas” Troma Nights ever, we suspect! Here’s the plan:

  • 8pm prompt start – order pizza and start watching xXx Top Gun (we can’t get hold of a copy of xXx – sorry!)… with a RiffTrax! This’ll be our third RiffTrax experiment; hopefully it’ll be as great as the last two.
  • Second; Bernard & The Genie; wonderful Christmassy comedy starring Lenny Henry, Alan Cumming, and Rowan Atkinson.
  • Third and finally; Snakes On A Plane, perhaps the most overhyped movie ever (or, if folks can’t survive another feature length film, I suggest MST3K ep 602 [Paul, would you be so kind as to bring this, please?]).

One more thing – as a small “thank you” to everybody who’s made Troma Night so fantastic this last year – and as a Christmas gift to our friends in general – Claire and I have decided to “buy a round”: we’ve racked up a sizable quantity of ales for tonight’s attendees to drink. So come along for some good films, bad films, pizza, and – just this once – you can get pissed on us. So to speak. Ahem.

See you later.

Birmingham, Troma Night, And Open Mic

The Aber folks seem to have a busy weekend ahead. Tomorrow about a half-dozen people seem to be planning a trip to Birmingham. Not me: I’m busy, but I thought I’d share the news. Oh; scratch that. I’ve just heard that it’s been cancelled. Apparently there might be a more popular trip to Brum in a few weeks time. Tomorrow evening’s Troma Night will be at The Cottage, for such film delights as the fantastic Children Of Men, Phantasm, and, between the two, something who’s name I forget. Paul‘ll remind me, I’m sure. Because we’ve got three full-length films lined up, we’ll be pushing the latest episode of Drawn Together forward to 7:30pm, so if you want to see that, that’s when to be around, and we’ll be kicking off promptly with the films at 8pm. You have been warned. There might even be one or two new people, from what I hear, and you all know what that means. Sunday Night I’ll be doing the comedy open mic at The Angel, after last time turned out to be Gorilla Monsoon and not open mic night at all. If you haven’t heard enough of my worst jokes on Troma Night or just generally during the rest of the time you’ve known me, I’d love for you to come along and give me a little support. At least that way somebody’ll be laughing if I mistakenly slip in to in-jokes-mode again. The open mic night acts are sometimes great, sometimes not-so-great, but it’s always a nice chillin’ night out. Oh, and here’s a news story that tickled me: Backside Firework Prank Misfires. I remember that in the year I turned 16, they increased the age requirement for firework sales from 16 to 18. It turns out that age wasn’t the problem after all, but plain old human stupidity. Thanks for reading.

OpenID For WordPress

Update: 12th October 2007 – this project is to be considered abandoned. Please see How To Set Up OpenID For WordPress Comments instead. Thanks for the support and for your interest in OpenID.

THIS IS ALL HORRIBLY OUT OF DATE. THE DOWNLOAD LINKS DON’T WORK, I KNOW. GET OVER IT. More seriously now, I am working on a new version of this that actually works as a WordPress 2.0.x plugin. It’s very nice, but it’s not finished. Watch this space. In the meantime, why not take a look at OpenID Comments For WordPress (which is based on my preliminary work, here). Thanks for all the attention, guys.

As promised, I’m releasing the first usable version (v0.4) of my WordPress OpenID plugin tool. It’s very, very messy and a little buggy. Plus, installing it requires that you hack a few PHP files… use at your own risk. You’ll need a WordPress v1.5 weblog. Download this package and decompress it to your WordPress directory. It will create an openid_icons directory, a file called openid.php (the main codebase), and a file called openidform.php (the form that appears on your blog). Edit openid.php and substitute your own weblog URL in at the appropriate places (near the top). Link in the login form wherever you like. I’ve done so in my theme’s “sidebar.php” file, with the following code: <?php include (TEMPLATEPATH . '/openidform.php'); ?> In your main index.php, add a line to include the openid.php file. This will allow logins and logouts to be processed. Something like this: <?php require_once('openid.php'); ?> In wp-comments-post.php (the comments processor), substitute the following code in under “// If the user is logged in”: // If the user is logged in get_currentuserinfo(); if ( $user_ID ) { $comment_author = addslashes($user_identity); $comment_author_email = addslashes($user_email); $comment_author_url = addslashes($user_url); } elseif ($_SESSION['sess_openid_auth_code'] != "") { $comment_author = addslashes($_SESSION['sess_openid_auth_code']); $comment_author_email = "openid@example.com"; $comment_author_url = addslashes($_SESSION['sess_openid_auth']); } else { if ( get_option('comment_registration') ) die( __('Sorry, you must be logged in to post a comment.') ); } Notice the extra section, relying upon $_SESSION[‘sess_openid_auth_code’]. That’s the magic bit. And it should ‘just work’. Let me know if it doesn’t; I’ll be improving the codebase over the coming weeks and I’d like to include your suggestions. If you need any help setting it up, I can probably help with that too, or even with adapting the code to work with other applications (than WordPress). Features so far:

  • Authenticate OpenID users
  • Easily authenticate OpenID users from particular servers, including members of LiveJournal, DeadJournal, and Level9
  • Authenticated OpenID users can post comments

Features to come:

  • Cookie-based “remember me”
  • Ability to authenticate WordPress users (e.g. the weblog owner) by an OpenID
  • “Friends Only” protected posts, which can only be read by certain authenticated users
  • AJAX-powered log-in (to save users from having their browsers redirected excessively, and because it can be made to look swish), where supported

If you want to help code, just drop me a message.