Link to home
Start Free TrialLog in
Avatar of iwarner
iwarner

asked on

PHP Loading Bar

I have a time consuming PHP script.

While this is loading I want a DHTML, Javascript, FLASH bar to show the progress of the script.

When the script is finshed it will then show the contents.

Regards

Ian
Avatar of justaphase
justaphase
Flag of Portugal image

hmm that is a good question...
Avatar of iwarner
iwarner

ASKER

Ca you answer it - it may not be possible - as PHP is server side and the other elements are client side - so I want the server to continuously talk to the client - ie by giving time instructions but not effect the script at all!
yes u right, that's why all the examples i know are javascript or xml.... let me see if i can arranje something...
Avatar of iwarner

ASKER

Would be cool if you could I have no clue on Javasctipt or really anything apart from PHP and SQL

E:)
i'm not to good in javascript either, just a few lights...

well... i have two examples that could help...

should i put the full codes?
or should i create a temp url in my server showing the codes?...
Avatar of iwarner

ASKER

temp url please wanna see it in action

E :)
ASKER CERTIFIED SOLUTION
Avatar of verifier
verifier

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of iwarner

ASKER

Hi,

Ok that seems to do the trick - now I need the Javascript or DHTML bar that will adjust depending on how much time is left to download the script can this be done?

Testing Script below:

<html>
<head>
<title>Please wait, working....</title>

<script language="JavaScript">
<!--

// This function wont be invoved until the complete page is loaded.
function Loaded()
{
document.getElementById("loader").style.visibility = "hidden";
document.title = "My nice title";
}
//-->
</script>
</head>

<body onLoad="Loaded()">
<div id="loader" style="background-color: #990000;color:#ffffff">Please wait while the document loads..</div>

rest of the page here...

<?php
flush(); //Make sure that the data isnt cached in PHP.

// HEAVY SCRIPT EXAMPLE GOES HERE

FOR($i = 0; $i <= 10; $i++)
      {
      fopen('http://www.yahoo.com', 'r');
      }
?>
</body>
</html>

E:)
Well. Ask in the html or javascript forums.
hmm i have this example here that have a progress bar in javascript... dunno if can aply to that...

http://www.xiscopia.com/tmp/injava.htm
Hi.

Seems like you have a proplem with the solution above...
You will never know the progress in your "Heavy SCRIPT" part.

For example... you do something  that takes 10 sec first time... and 25 seconds the next... how do you control the speed of the progress bar?

Current status is hard to communicate from the server-side to the client :(

Just a thought...
// J

Ps. There is a way if you use frames and the serverside execution is made in several steps...
Then you could have a hidden frame that are doing the server-side execution and updating the vissible frames (passing parameter to the progress bar control, DHTML) after each step...
If you have one large time consuming task, then it's much harder.
Avatar of iwarner

ASKER

Yes thats similar to what I said in my second comment.

How does it continuously talk to the client about the server side script.

Can you make a demo of what you suggested?

Many people have been asking for something similar I think.

E:)
I'd recommend having an <img src="progress_bar.php" width="400" height="30" /> on your page.  While the PHP script executes, it writes its progress to a flat file, by writing a number from 0 to 100.

progress_bar.php is a php script that generates a dynamic graphic based on the contents of this progress file.  The larger the number, the larger the 'done' portion of the graphic.

Then, use a javascript to periodically refresh the <img> src, appending a get argument to prevent the browser from caching it, something like this:

<script language="javascript">
function updateProgressBar() {
    document.myImage.src="progress_bar.php?unique=" + new Date();
}
</script>

Then set the updateProgressBar() javascript function to execute every 1 or 2 seconds using the setInterval() javascript call.
Try a flush(); at several spots in your code so it will output what it can as it becomes available. Readers then don't notice so much. NOTE- anything inside a table will not output until it sees the close table html tag so flush() wont help in that situation.
Avatar of iwarner

ASKER

Guys I expected a fully working example for 250 points - maybe its just me and Im too demanding.

I have started to create something along the lines of shmert's offering and verifier's.

E:)
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
btw, heres a working example of that:

http://churchoftux.com/jscript.php

and for a much more complex example of this kind of thing...

http://churchoftux.com/hlwebtv2/ (slightly bandwidth taxing)
Hi,

You could do it with PHP and a couple of flush()'s. Every now and then, you output a period (.) or a image or something, then when the page is complete, the javvascript should hide it the <div>


<html><head>
<script language="javascript">
function Loaded()
{
document.getElementById("loader").style.visibility = "hidden";
}
</script>

</head>
<body onLoad="Loaded()">
<div id="loader">
<?php
echo str_repeat(" ", 500);
flush();

// Some work


echo '.';
flush();
/* This prints a dot to the screen, while still loading */


// More work

echo '.';
flush();

// More...

echo '.';
flush();

echo '.';
flush();

echo '.';
flush();

// etc...

?>
</div>
All you normal content here...

</body></html>
Avatar of iwarner

ASKER

Dragged on to long this question if anyone has anymore input then please let me know