Avoid wasted bandwidth: rotate.php should transfer only CSS information, not images on each page load

As it stands, the rotate.php script returns then entire image for banners that need rotating. This is a massive waste of bandwidth, especially if there are many banners, or they are high quality. Note that the largest of the included banners is currently avaro.jpg at 106030 bytes.

This problem can be overcome by modifying rotate.php script to return CSS style information that defines the background style for the #header element at random and references a random image file, rather than returning that image file directly. In this way much bandwidth can be saved as the browser will cache referenced image files. The only file not to be cached being the CSS style rotate.php which is now usually less than 100 bytes.

I have made such a change and tested and this works perfectly here.

Instead of rolling a patch which may become outdated, here are the steps to make this improvement:

1. Remove the #header style from graphics.css. This line (which is line 20 in my version):

#header {background: #000033 url(img/banners/rotate.php) no-repeat 0px 0px; /*rotates images in the banners folder */}

2. Replace the rotate.php script in img/banners directory with the one attached. Note due to upload restrictions on Drupal.org remember to rename the file appropriately.

3. Place the following line at the bottom of template.php to reference the dynamically updating rotate.php:

drupal_add_css(drupal_get_path('theme','marinelli').'/img/banners/rotate.php', 'theme', 'all', FALSE);

Enjoy the bandwidth and speed savings!