a weblog by Ed Eliot

Full of lovely web standards information and a large helping of PHP

This weblog is the online home of , a Senior Technical Manager at GCap Media living and working in London, United Kingdom.

Entries for June 2007

You are currently viewing posts from the archive. Click here to return to the latest posts.

  • Caching added to my template class

    10 months, 26 days ago

    I've just finished adding caching to my template class which I first posted details of in "PHP Tip: Extract, Variable Variables and Templating". Here's an example of implementing caching:

    1. <?php
    2. require('template-engine-v2.inc.php');
    3. $oTemplate = new Template('test.php');
    4. $oTemplate->AddCacheCondition('home');
    5. if (!$oTemplate->IsCached()) {
    6. $oTemplate->Set('title', 'Do links on your site make sense out of context?');
    7. $oTemplate->Set('author', 'Ed Eliot');
    8. $oTemplate->Set('content', new Template('content.php'));
    9. }
    10. echo $oTemplate->Display();
    11. ?>

    The class now supports two additional methods:

    • SetCacheLength($iCacheLength) - this takes a single parameter which specifies the number of seconds you want the output cached for.
    • AddCacheCondition($vCondition) - this takes a string or array representing one or more data values which should be used to form the cache key. You might add the current post id, for example, as a condition to ensure individual caching of each post.

    When sub-templates are directly assigned to the Set method of a parent template they inherit the parent's cache settings. If you want to specify caching properties for sub-templates individually you'll need to instead assign their output to the parent template.

    Download version 2 of the template class. You'll also need to download a copy of my caching class. Alternatively you can view the source of the cache class.

  • Opera struggles with ordered and unordered lists

    10 months, 27 days ago

    Whilst writing what initially seemed like some rather simple code I stumbled across a couple of obscure Opera bugs relating to the display of ordered and unordered lists which have proved rather difficult to work round. Extensive searching revealed only one site which contained any information about these bugs so I therefore thought it was worth documenting the details.

    Ordered/Unordered Lists and Relative Positioning

    Applying position:relative to list items which also contain block level elements (either those inherently block level or those set to block level via CSS) causes Opera to hide display of the list item markers (numbers or bullets). Interestingly the space they occupy remains.

    View an example of this relative positioning bug

    Floating List Items

    Applying a float to list items also triggers this bug

    My Code

    An example of the code I wrote, which triggers this bug, positions images absolutely, relative to their parent list item. A left padding is applied to each list item to push the heading, summary and call to action link displayed to the right of each image.

    I tried floating the image, rather than positioning it absolutely, but this caused several browsers to display the list item markers over the top of the of the image. This is fixable by applying a negative left margin to the list itself and an equal positive left margin to each list item but once again Opera throws a spanner in the works requiring padding rather than a margin to be applied to each list item. The only way I found to achieve this (without server-side intervention) was to use CSS3 Media Queries to serve separate rules to Opera. This approach isn't without issues, I've read that the latest versions of WebKit also read these rules, although in testing I haven't found that to be the case. View an example using CSS3 Media Queries.

    Revisiting my first version (relative positioning) I found that setting each list items' child elements to display:inline caused the list item markers to re-appear. I was then able to force text items onto a new line using break tags. It's not pretty and certainly not semantically nice but this approach worked across the board and seems more robust than using a CSS hack which will almost certainly break as browser support for CSS3 improves. View an example of this approach.

    If you've come across these bugs before and have managed to find an alternative, nicer way, to work around them I'd love hear about it.

    Further Reading

  • Mac OS X 10.4.10 system update broke my laptop

    10 months, 28 days ago

    On Friday morning I installed the Mac OS X 10.4.10 system update. One crash and a reboot later my keyboard and track pad weren't responding to input essentially rendering my MacBook Pro useless. Plugging in an external keyboard and mouse didn't help either. I'm back up and running now thanks to a standalone update package Stuart found for me. I'm posting this incase anyone else has the misfortune of suffering the same problem. Here's the steps it took to fix:

    1. Rebooted from a firewire drive containing a backup of Mac OS X (once again, thanks Stuart). To select a different boot volume hold down "alt" when booting.
    2. Once up and running used Super Duper to back up my entire hard drive to an external USB 2 hard drive (I only had a back up of my files, not my full system).
    3. Downloaded and ran the "Mac OS X 10.4.10 Combo Update" DMG which contains all updates to Mac OS X since 10.4. This package is really cool because it let's you specify a target volume (it doesn't have to be the one the computer is currently booted from).
    4. Rebooted from my internal drive - success!

    The Combo package for both Intel and PowerPC systems is listed in this MacFixIt article as well as the full set of steps to run through.