The template for my pages, visible here, originated with the menu creation.

The intention was to have a general function for creating menus that had the same content on all pages, but showed which page was currently open. This required server-side file system parsing, and so the obvious choice was to use PHP for the menu creation.

I started by writing a recursive function that searches each directory (to a max depth of 10 directories (as a value which would not be exceeded for this purpose)) in a path to find any files with extensions in an array (provided as an argument, but in this case, phtml). This leads to the return of an array containing any phtml files as well as child arrays containing files from sub-directories. The template also contains a function to get information about the currently displayed page at this point.

Now in possession of a list of files and information about which page is calling the functions, the template calls a menu creation function, which creates the title bar (including the title and the menu).

This function starts by reordering the array based on an ordering file, which has two, caret (since it is an uncommon symbol) separated, lists of filenames, one for pages that should remain at the beginning of the menu, and the other for those at the end.

The title of each page is stored in a meta tag, which is interrogated by a function that obtains information by use of DOM.

The title of the current page is displayed as would be expected, then the navigation menu is created. Each page in the array is checked to see whether its title matches that of the current page, and the a tag that is linked to that page is given a different css class, depending on the outcome.

Finally, the template also creates the cookie warning at the bottom of the page, and checks the cookie created by that warning (to prevent it from being shown), as well as those created by the collapsibles discussed below.

I find that collapsible sections are useful for displaying what is on a webpage without overwhelming a visitor with text that they are not looking for.

I used javascript to trigger the collapsible (client-side) behaviour. This included swapping the visibility of the hide and show labels, setting the background colour of the title div, and toggling the maximum size of the portion that becomes hidden between 0 and MAX_INT so that any sub-collapsibles will also show.

Finally, a cookie, which lasts until the browser is closed, is created to inform the page about which collapsibles should be open if the page is returned to after navigating away.

The initial tag for a collapsible is created in php to avoid having to copy and paste, then replace multiple cases of the id for each collapsible created.