How I implemented the navigation bar

The navigation bar is what I describe the bar on the right side of the page. It's not really a bar I guess, more like a column, but "navbar" sounds better :)

All the pages that need the bar just have this tag:

@navbar {
    Contents of page that should be next to the navbar, sharing the page width with it
}
 Contents that should be beneath the navbar, getting the full page width

@navbar is a macro. With the advent of meta-quoting, it finally can be defined in the smart.local.sl file.

As you can see, the macro creates a two-element table: the left side contains whatever is given to the macro as the parameter, and the right side just includes the file navbar.inc.

The navbar.inc file contains a table cell which then contains the news page (again a file included) and then the layout of the site. Things are indented with the @space{} tag which produces a non-breakable space. Both news and the link collection sit inside a @box macro.

Finally, news.inc contains the news box. I wrote a small Perl function to format the news box properly: standard @ul and @li did not give the desired result, so I used a table. That Perl function is the makeNewsTable in smart.local.pl. It splits on colon, putting the first field in the first cell and the right into the right cell.

This approach leaves the main page source code relatively free of extra tags. I just have the @navbar in there. By controlling the placement of the { and } after the navbar, I can control how far the table stretches. The parts covered by the table are smaller, due to the navigation bar taking up some horizontal space. For most pages, the navbar covers the entire page, but for some pages, I stop the navbar before the main text of the table which is perhaps extra wide.

Site navigation
Home and links MUD Code snippets 16K - tiny MUD competition Letters about MUD Development MUD Client for UNIX Webring for MERC programmers MERC FAQ mudFTP New MUD codebases listing MUD personality test Other projects LeakTracer SmartHTML Misc code Email me

External links for this page