philip dorrell's portfolio

This page provides a comprehensive overview of the most interesting of my various "side-projects".


Domkol is an application to visualise complex functions in a web browser. It uses Canvas to render the domain colouring of a function, SVG to render graphs (in 3D) of a chosen circular subset of the domain, and JQuery UI to interact with the visualisation. It allows the function itself to be changed interactively, for example to drag the zeroes of a polynomial around the domain.


Style Adjuster

Style Adjuster is a Chrome extension which enables the "adjustment" of CSS property values. In particular, numerical values such as dimensions and colour components can be adjusted using a slider, so that the user can move the slider left and right while looking at the continuously changing result in the browser. This is more efficient than the typical "try a value, refresh the browser, try another value etc" style of CSS editing.

One issue that arose writing Style Adjuster is that Chrome extensions cannot make Javascript calls directly between a target browser tab and a popup-window. Although Style Adjuster can be made to work with an internal dialog window, an internal dialog will inevitably interfere with the layout of the page being adjusted. Also, one might want style-adjusting dialog to be in a window completely separate from the target tab being adjusted (so, for example, it's not obscuring anything in the target tab).

Dealing with this limitation was sufficiently difficult that I wrote a separate test extension just to figure out how a dialog in a popup window from a Chrome extension can be made to act on the target tab.



Correspondence is an HTML-based format and an accompanying Javascript library which interactively shows the "correspondence" between words of a text and a translation of that text. When you mouse over a "word" (which can actually be a group of words, or even part of a picture), the corresponding word in the translation is highlighted.



Correspondence defines an HTML-based format. Data can be coded in this format manually, but it is somewhat verbose. Correspondence-Markup is a concise markup language I have defined which can be parsed and compiled into the HTML format.

The parser and compiler is written in Ruby, and packaged as a gem. It uses the Treetop parsing library.

Correspondence-Markup is one project where I used test-driven development, i.e. writing tests first, and then writing code to pass the tests. (Tests were written using rspec.)


This project is now somewhat obsolete, as it has been superceded by Correspondence-Bracketup (for which see the project below).


Following from the development of Correspondence-Markup, Bracketup is a generic markup format, or more specifically, a generic framework for defining application-specific markup languages. Bracketup supports the definition of data formats such as that required by Correspondence.

Bracketup makes it easy to write parsers and compilers for application-specific markup languages that one wants to have parsed and compiled inside a web browser. For example, the application-specific code for Correspondence-Bracketup is just 95 lines of CoffeeScript, not counting comments.

Originally I wrote Bracketup in Javascript, but I then rewrote the main part of the implementation in CoffeeScript. The rewrite was done incrementally, class by class (except they're not even called "classes" in Javascript), with a regression test suite to confirm that my rewrite wasn't breaking anything.


Module Simulator

module-simulator.js is a very small Javascript library which simulates the requires/exports functionality of CommonJS, as used by Node. It currently exists as a file in my bracketup project, where I use it to enable the same Javascript files to run in Node or in the browser without having to use the Javascript eval() function, which, unfortunately, discards error information when an error occurs.


Interactive Tags

Interactive Tags is a small Javascript library that supports tags for a blog articles. In particular, it filters the table of contents for the blog when a tag is selected (the assumption being that by default all blog articles are listed in the tabe of contents).


Frictionless Quiz Answering

This small Javascript project is an attempt to answer the following question:

There are many quiz formats on the web, but most of them are cluttered with unnecessary UI.

I have written a quiz.js Javascript library which provides a very simple interface to a quiz where there is a fixed set of possible answers to a set of questions. The interface is:



PrimeShooter is a Javascript game which runs in any modern web browser (but currently a keyboard is required to play it).


One does not simply find the Higg's Boson ...

This item is not software (it's a meme ...), but to write it I had to watch the whole CERN Higg's Boson announcement over streaming video, and I had to understand enough about the statistical techniques in the physicists' presentations to come up with the idea.

And people did seem to like it.

(It should be noted that I make no claim to understand anything about Quantum Field Theory other than the fact that it involves some sort of combination of Quantum Mechanics and Special Relativity.)


Last updated: 23 September 2013