I have 8 buttons (with images) on a page generated by a php script. The buttons control an animation of 24 images dynamically created on the server and downloaded using another php script, invoked 24 times. The first time the display page is called, the window status bar shows '8 items remaining' and the animation and buttons are blank until the 24 animation images are loaded. The button images then appear and the animation starts. This is what I want.
The problem is that when I go to this page again, for new images, the button images appear immediately, the status bar this time shows '24 items remaining'. Now, the downloading is frequently BUT NOT ALWAYS! unsuccessful on one or more of the images. So my animation shows blanks. The problem is solved on refreshing the page, and if I clear the cached button images. I have sent session_cache_limiter('no-cache') in an effort to get back to the first visit state, but it makes no difference. The images always appear in the temp files, and I may or may not get blanks in the animation. the buttons have .png static images. The animation are .png created dynamically.
Problem is very frequent in IE6+XP, also seen in IE6+W2K, but I don't remember it with IE5.5
It seems to be an IE threading problem???
Displaying dynamically created png images as an animation
Moderator: General Moderators
-
Jerryscript1
- Forum Newbie
- Posts: 10
- Joined: Thu Jan 27, 2005 4:22 am
- Location: Las Vegas
Sounds more like a cache issue, regardless of the cache_limiter statement. Another method to prevent images with the same URL from being cached is to add a query string with either a random number or a time-stamp. This causes the browser to treat each call to the image as unique.
Code: Select all
$revitalizer=rand();
print "<img src='IMAGE_URL?$revitalizer'<";That did help a bit, thanks! it gets me back to the initial state each time, and my downloads are successful on XP SP1+IE6. I hoped this would solve the problem, even though I didn't understand why, but it seems just to slow the download down enough to handle the animation images. On another machine (XP SP2 IE6) the problem remains.
The images are being corrupted during the download I now believe, as sometimes status bar shows 'Done' but images are still missing.
I have never seen the problem on W2K, (where I did the development!)
I use a display page (animateweather.php), a javascript page (animate.js)to load the animation, and animateimage.php to do the socket stuff. Here is the code
animateimage.php does the work of getting the image from the server:
I am not sure about the header() function. seems there are an infinity of things I could throw in there!
Any help gratefully received!
The images are being corrupted during the download I now believe, as sometimes status bar shows 'Done' but images are still missing.
I have never seen the problem on W2K, (where I did the development!)
I use a display page (animateweather.php), a javascript page (animate.js)to load the animation, and animateimage.php to do the socket stuff. Here is the code
Code: Select all
//animate.js
window.onerror = doNothing;
function doNothing(){
return true;
}
//I found this on some forum, can't remember why it was important!
preloader();
var maps =
ї
preLoad("/tc_animateimage.php?hour=0"),
preLoad("/tc_animateimage.php?hour=1"),
preLoad("/tc_animateimage.php?hour=2"),
preLoad("/tc_animateimage.php?hour=3"),
preLoad("/tc_animateimage.php?hour=4"),
...
preLoad("/tc_animateimage.php?hour=23")
]
var begin = true;
var messages = new Array("Loading : Please Wait",
"Loading : Please Wait.",
"Loading : Please Wait..",
"Loading : Please Wait...",
"Loading : Please Wait....",
"Loading : Please Wait...",
"Loading : Please Wait..",
"Loading : Please Wait.");
var counter = 0;
var homer;
function preloader(){
if(begin==true)
document.getElementById("msgholder").innerHTML = "<font color="red">"+messagesїcounter]+"</font>";
counter++;
if(counter==8){
counter = 0;
}homer = setTimeout("preloader()",200);
}
function preLoad(src,width,height)
{
var temp = new Image(width,height);
temp.src = src ;
return temp;
}
window.onload = function()
{
var cont = document.getElementById("container");
for(var k=0;k<maps.length;k++) {
cont.appendChild(mapsїk]);
}
document.getElementById("msgholder").visibility = "hidden";
animate(maps);
}
etc etc.
//animate maps just shows them one by one using the visibility property.//
//end animate.jsCode: Select all
<?php
session_start();
include ('tc_utilities.php');
$timeoffset = (isset($_GETї'hour']))? $_GETї'hour'] : '0';
//$downloadXML retrieved from $_SESSION
...
$_PORT = $port;
$_ADDRESS = $serveraddress;
$Headers = Protocol and server stuff
$Headers .= "Content-Length: ".strlen ($downloadXML).chr(13).chr(10).chr(13).chr(10);
$SendStr = $Headers.$downloadXML;
error_reporting (E_ALL);
/* Get the port for the WWW service. */
$service_port = $_PORT; //getservbyname ('www', 'tcp');
/* Get the IP address for the target host. */
$address = gethostbyname ($_ADDRESS);
/* Create a TCP/IP socket. */
$socket = socket_create (AF_INET, SOCK_STREAM, 0);
if ($socket < 0) {
//echo "socket_create() failed: reason: " . socket_strerror ($socket) . "<BR>";
} else {
//echo "create OK<BR>";
}
$result = socket_connect ($socket, $address, $service_port);
if ($result < 0) {
//echo "socket_connect() failed.\nReason: ($result) " . socket_strerror($result) . "<BR>";
} else {
//echo "connect OK<BR>";
}
$result = socket_write ($socket, $SendStr, strlen ($SendStr));
if ($result < 0) {
//echo "socket_write() failed.\nReason: ($result) " . socket_strerror($result) . "<BR>";
} else {
$pngstr = '';
while ($out = socket_read ($socket, 2048)) {
$pngstr .= $out;
}
}
header("Content-Type: image/png".chr(13).chr(10));
header("Content-Length: ".strlen($pngstr).chr(13).chr(10).chr(13).chr(10));
echo $pngstr;
socket_close ($socket);
exit();
?>Any help gratefully received!