Uber first loads up the requested document and extracts the author, title, date. It then just dumps the rest into the content div. If no document is requested, Uber loads up the index.txt file. If loading the text file fails, it falls back on a pre-generated 404 error message.
To create the background image, the attributes of the divs are stored in a PHP object called square. Square has six variables, controlling the RGB color components, and the dimension and position of the square. It has three methods, a blank constructor (there’s a reason for this), init_first(), and print_css(). init_first() is used to randomize the color, size, and position of the first square. print_css() prints out the relevant CSS markup for the square.
The background color of the page is randomly selected next, as is the number of div elements. The array of square elements is created next, and the first element is initialized. The colors of the divs blend from the color of the first div to the color of the background, so to do this blending, the direction to blend for each color component has to be found next. It then finds the change in color component per div element.
The position of the divs are determined by a parametric equation, the components of which are randomly selected from four equations which I happened to like. It has the ability to draw other things than what I’ve put in as the defaults.
After it determines all of the values needed for the colors and positioning, it executes a for loop that creates and assigns values to the rest of the div elements.
It then goes about actually writing HTML markup, the header, the css (from the print_css() method of the square objects), and the actual divs themselves. They’re contained in a fixed position div that is the size of the entire viewport, which clips the content outside of it. The author/date, title, content, and menu divs are rendered next, from the respective content files.
And that’s about it. The most complex part of the code is the parametrics, and certain variables involving scaling and such of the figure.