PDA

View Full Version : a simple way of preloading images - maybe weird...?


-okapi-
07-30-2005, 12:52 AM
i realized a simple way of preloading the previous and the next image by modifying the index.php

on line 238 i added:
$ahead_image_preload = "<img src='images/$image' alt='' title='' width='1' height='1' border='0' />";
$tpl = str_replace("<AHEAD_IMAGE_PRELOAD>",$ahead_image_preload,$tpl);


on line 250 i added:
$behind_image_preload = "<img src='images/$image' alt='' title='' width='1' height='1' border='0' />";
$tpl = str_replace("<BEHIND_IMAGE_PRELOAD>",$behind_image_preload,$tpl);


i'm using the new tags
<AHEAD_IMAGE_PRELOAD> and <BEHIND_IMAGE_PRELOAD>
which represent the previous image and the next image, each 1 pixel sized,
to put it at the bottom of the image_template.html, almost invisible, to get them preloaded in the browser cache.

maybe this way of preloading images is weird, but - it works, without javascript.
then, instead of modifying the index.php i tried to make an addon, but, of course, i failed. i'm not skilled enough to do this.

maybe anybody can help me, or tell me, if i'm running into problems with this hack...?

thank you.

Connie
07-30-2005, 05:28 AM
Michael,


you will just have to keep an eye at every update...
can't you try to do this as an AddOn, that would be far more update-compliant :lol:

well, this preload is ok, I do not see any problems, I would set these preloaded images in a CSS-ID or CSS-Class, visibility: hidden..

-okapi-
07-30-2005, 07:58 AM
thank you connie,
i didn't think of css and visibility:hidden - this is by far more elegant.

well, i hate to touch the core, as i said, i tried to do this as an addon, following the way how the random thumb addon is done, and copied a part from the index... but that was just a trial, i'm really not skilled enough. name and description of my "addon" could not even be seen at the admin panel (parse error, unexpected T_VARIABLE on line 7...)

raminia
07-30-2005, 08:25 AM
thank you connie,
i didn't think of css and visibility:hidden - this is by far more elegant.

well, i hate to touch the core, as i said, i tried to do this as an addon, following the way how the random thumb addon is done, and copied a part from the index... but that was just a trial, i'm really not skilled enough. name and description of my "addon" could not even be seen at the admin panel (parse error, unexpected T_VARIABLE on line 7...)
parse error means that you have only some typos!
check your code. check for ending ; and paranthesis

-okapi-
07-30-2005, 10:56 AM
thanks for the encouragement!

i can't believe that i did it. it's my first addon :)
and it works!

ramin, could you please help me with cleaning up the code a little bit, if this is necessary?


<?php

$addon_name = "Preload Images";
$addon_description = "Enables preloading of next and previous images. New tags: <AHEAD_IMAGE_PRELOAD> and <BEHIND_IMAGE_PRELOAD>. ";
$addon_version = "0.1";

/*
-----------------------------------------------------------------------------------------------------------
Enables preloading of next and previous images. New tags: <AHEAD_IMAGE_PRELOAD> and <BEHIND_IMAGE_PRELOAD>.
Put these tags at the bottom (!) of your image_template.html, so that they load as last elements of the page.
for example:
<div style="visibility:hidden;line-height:1px"><AHEAD_IMAGE_PRELOAD><BEHIND_IMAGE_PRELOAD></div>.
Previous and the next images are preloaded into the browser's cache so that when they are needed, they are displayed immediately.
michael singer, a-visual-notebook, http://www.a-visual-notebook.at
-----------------------------------------------------------------------------------------------------------
*/

if(function_exists(gd_info)) {
$gd_info = gd_info();
if($gd_info != "") { // check that gd is here before this
$aheadnumb = sql_array("select count(*) as count from ".$pixelpost_db_prefix."pixelpost where (datetime > '$image_datetime') and (datetime<='$cdate')");
$aheadnumb = $aheadnumb['count'];
$behindnumb = sql_array("select count(*) as count from ".$pixelpost_db_prefix."pixelpost where (datetime < '$image_datetime') and (datetime<='$cdate')");
$behindnumb = $behindnumb['count'];
$aheadlimit = round(($cfgrow['thumbnumber']-1)/2);
$behindlimit = round(($cfgrow['thumbnumber']-1)/2);
if($aheadnumb <= $aheadlimit) {
$behindlimit = ($cfgrow['thumbnumber']-1)-$aheadnumb;
$aheadlimit = $aheadnumb;
}
if($behindnumb <= $behindlimit) {
$aheadlimit = ($cfgrow['thumbnumber']-1)-$behindnumb;
$behindlimit = $behindnumb;
}
$totalthumbcounter = 1;

$thumbs_ahead = mysql_query("select id,headline,image from ".$pixelpost_db_prefix."pixelpost where (datetime > '$image_datetime') and (datetime<='$cdate') order by datetime asc limit 0,$aheadlimit");
while(list($id,$headline,$image) = mysql_fetch_row($thumbs_ahead)) {
$headline = pullout($headline);
$headline = htmlspecialchars($headline,ENT_QUOTES);
$ahead_image_preload = "<img src='images/$image' alt='' title='' width='1' height='1' border='0' />";
$tpl = str_replace("<AHEAD_IMAGE_PRELOAD>",$ahead_image_preload,$tpl);
$totalthumbcounter++;
}

$thumbs_behind = mysql_query("select id,headline,image from ".$pixelpost_db_prefix."pixelpost where (datetime < '$image_datetime') and (datetime<='$cdate') order by datetime desc limit 0,$behindlimit");
while(list($id,$headline,$image) = mysql_fetch_row($thumbs_behind)) {
$headline = pullout($headline);
$headline = htmlspecialchars($headline,ENT_QUOTES);
$behind_image_preload = "<img src='images/$image' alt='' title='' width='1' height='1' border='0' />";
$tpl = str_replace("<BEHIND_IMAGE_PRELOAD>",$behind_image_preload,$tpl);
$totalthumbcounter++;
}
} // gd_info()
} // func exist

?>

UPDATED: i removed style='visibility:hidden', because in some browsers the images won't load.

raminia
07-30-2005, 11:39 AM
doesn't it make loading time longer?

raminia
07-30-2005, 11:43 AM
I don't think that in all browsers invisible images do load.

Do they load?

-okapi-
07-30-2005, 12:04 PM
you're right, in IE they don't load, in firefox they do.
i deleted style="visibility:hidden" from the addon.
the images are only 1 pixel, height and width, at the end of the page, so the are loading while all other images of the page are already displayed.

but what about the php code? do you think it's ok?