asked on

How to : Auto Reload ?

Hi there, my question may look simple.... i don't know ... you judge!

How can i set a page to reload itself automaticly AFTER THE WHOLE PAGE IS DOWNLOADED ?

In other words... i want a method that will force the page to reload itself in the visitor's browser as soon as all its objects (images, text, apllet, class....etc) become ALL visibale in the browser?

This is important because ... i am intendeing to refresh (or change) the components with each time the page reload...

I have a code that reload the page after a specific number of seconds..... but i don't know how long ,EXACTLY, would it take to download the whole page! It defferes from one browser to another .... and from one connection to another!

I need a method to do this automatically... (applet, html code, jave script , any new use of an old idea , any suggestions MUST envolve the auto reload idea..... etc)

Thanks ....

knightEknight

I'm not sure that this is what you really want to do, because then the page would constantly be reloading, but ...

<BODY onLoad='self.history.go(0)'>

or

<BODY onLoad='location=.location.href+location.search'>

I doubt you will want to do this exactly, but perhaps a variation on this theme will be helpful.

siabod

maybe somethiing to add on kEk suggestion, create another copy of the page without the onload command and refresh from the first page to the new one, that avoids an endless loop.

TTom

how about <body onload=self.reload(true)>. I think that forces a reload from the server (instead of cache), but probably only once. You could also do a setTimeout in the onload event, e.g. <body onload="setTimeout("self.reload(true), 10000>, which will fire 10 seconds after the page finishes reloading.

You might also use a <meta> tag, but I think that will fire even if the page has not reloaded.

Tom

mouatts

Add the following code to every image or loadable component in the document.

onLoad="loaded()"

then add the following to the top of the document

<SCRIPT LANGUAGE="Javascript">
load_counter=0
num_images=5
reload_time=3000
reload()
{

function loaded()
{
++load_counter;
if(load_counter=num_images)
{
setTimeout('self.reload(true)',reload_time)
}
}
</SCRIPT>

Adjust reload_time and num_images as required.
Please note that I've not tested this.

innovator

ASKER

Thanks to all of you.....

But i need a method to reload the page for 4 times untill it stops on the fourth reloaded page.....
Of course , page 1,2 & 3 should NOT start reloading BEFORE the FULL loaded page. (i.e. the pages should be fully downloaded before start to reload)

Thanks again.... waiting for your suggestions!

kamyanlai

Put this scrip at the end of your web page.

Just above the end of </body> tag (See example below)

Your url will need an extra field on the end.
I've used reload=0

so the url will be for example :-

http://yourwebpage.htm?reload=0

This will load all the stuff on your page first and the run the script last.

<html>
<body>

Your html information here !

<script>
var querystring = window.location.search;
var numreload = querystring.split("=");
var counter;

if(numreload[1] != 4){
counter = eval(numreload[1]) + 1;
window.location.href = "yourwebpage.htm?reload=" + counter;
}
</script>
</body>
</html>

I hope this helps

mouatts

The simplest solution would be to use my suggestion, which does allow the entire page to be downloaded before the reload commences unlike kamyanlai which does wait for the images etc. But rather than do a reload have four copies of the page and change the

setTimeout('self.reload(true)',reload_time)

to

setTimeout('document.location="page2.html"',reload_time)

changing the page number on each one.

If you have SSI available to you then you can prevent the actual page duplication by declaring a variable called page_name at the top of the script and include the whole page.

Then after the inclusion set the value of page_name to be the appropriate page (having changed document.location="page2.html" to document.location=page_name

ie The first page would look like this

<SCRIPT LANGUAGE="Javascript">
page_name="page2.html"
</SCRIPT>

and the second page like this

<SCRIPT LANGUAGE="Javascript">
page_name="page3.html"
</SCRIPT>

HTH
Steve

TTom

How about combining all of this together and using kamayanlai's script in the onload handler, e.g

<body onload="reloadifnec()">

<script>
function reloadifnec() {
var querystring = window.location.search;
var numreload = querystring.split("=");
var counter;

if(numreload[1] != 4){
counter = eval(numreload[1]) + 1;
window.location.href = "yourwebpage.htm?reload=" + counter;
}
}
</script>

Don't know if that would work, but...

Tom

innovator

ASKER

Hi there...

Thanks againf for all of the suggestions you gave me!

Maybe i did not describe what i need probably... because English is my
third foriegn language) :)

What i want simply is :

A code that i will insert into "page1.html" , this code will wait untill
the full download of all the components in "page1.html"

then.... immediatly after this, the browser will reload itself but to go to
"page2.html" and also wait until finishing downloading it completaly... then reload to
page3.html.... etc

then reload to "page4.html" and stop there!

As these pages contains some components which are difrent or similar to the other
components in the other pages..... because of this , i want the code to reload the
page from the server NOT the user's cashe!

******
When i inserted kamyanlai's code... the page generated an script errors
"Object doesn't support this property or method" i don't know if i did anything wrong!
what is meant by reload=0 ,
in window.location.href = "yourwebpage.htm?reload=" + counter; should i write
the page's name or the page location ?

******
to mouatts
I don't know the reload time.... so i can't adugst the time as i want... simply because
i don't know how long exactly should it take to load .

*****
i will try TTom's suggestion later.

Thanks to all of you.

innovator

ASKER

Adjusted points to 215

kamyanlai

From you description, it seems that you're not reloading the same page but a new page each time.

If this is the case you will need to put a script within each page to tell the browser to load the next page.

So

page1.html ---> page2.html
page2.html ---> page3.html
page3.html ---> page4.html

in page1.html

<script>
window.location.href="page2.html";
</script>

in page2.html

<script>
window.location.href="page3.html";
</script>

and so on.....

(Note put script at the end of the web page. Just above the </body> tag.)

Unless you use frames to control the windows, but get abit messy if you're a beginner.
There are other ways but just gets messy with all the jumping around.

The above code is simple, and is low maintance.
Also it depends on what you're loading, and what scripting languages (could simplify if your using ASP)

mouatts

The reload time in my time was simply the final delay after the page and all its components have loaded. Because the onLoad on each component is being monitored it won;t fire until everything is there which is what you wanted ie

<HTML>
<SCRIPT LANGUAGE="Javascript">
load_counter=0;
num_images=5 ;
reload_time=3000 ;
page_name="";
reload()
{

function loaded()
{
++load_counter;
if(load_counter=num_images)
{
setTimeout('document.location=page_name',reload_time) ;

}
}
</SCRIPT>
<BODY>
<IMG SRC="mygif1.gif" onLoad="loaded()">
<IMG SRC="mygif2.gif" onLoad="loaded()">
<IMG SRC="mygif3.gif" onLoad="loaded()">
<IMG SRC="mygif4.gif" onLoad="loaded()">
<IMG SRC="mygif5.gif" onLoad="loaded()">
</BODY>
<SCRIPT LANGUAGE="Javascript">
page_name="page2.html"
</SCRIPT>

</HTML>

basman

Put this in the header of your pages.
__________________________________________________________________

<html>
<head>
<meta http-equiv="refresh" content="5;url=http://www.innovator.com/page2.html">
<meta NAME="keywords" CONTENT="Automatic redirect or something">
<meta NAME="description" CONTENT="Redirect to page 2">
<meta NAME="ROBOTS" CONTENT="ALL">
<title>Page 1</title>
</head>
<body>

</body>
</html>
__________________________________________________________________

options:
content="5;url=http://www.innovator.com/page2.html">
5 = duration page is diplayed
url="page.htm" = new page to load

Greetings,
Basman

TTom

innovator:

Seems to me (apologies to my fellow experts for repetition/'poaching') that what you need is:

page1.htm:
<body onload="window.location = 'page2.htm'">

page2.htm:
<body onload="window.location = 'page3.htm'">

page3.htm:
<body onload="window.location = 'page4.htm'">

That will load each of the pages successively after the page has completed loading.

Tom

mouatts

Tom and the others:
Body onLoad will force the reload after the page of HTML has loaded but the images etc may not have!
This is why I suggested putting the onLoad on the actual objects rather than just the body.

Innovator: Have you tried my suggestion yet?

Steve

TTom

Steve:

Thanks for clarifying. Didn't know that.

Tom

innovator

ASKER

Hi ... what "mouatts" said in : Friday, July 16 1999
was true!

There is one problem .... every time i try mouatts suggestions... several errors windows poped up!

I don't know if i made a mistake or what... but this is what is happining...

Ok, to simplfy the issue.... lets say that i have only one object in each page which is "photo.gif"
and my home page is www.mydomainxyz.com , pages are page1.html page2.html page3.html & page4.html

so what should i write in each page's html code.....

Please mouatts try to review your code to know if i am making any mistake!

Thanks.

innovator

ASKER

Adjusted points to 240

mouatts

Just looking back at it there are loads of missing semi-colons for starters (thats doing too much ASP that does that).

I've been through this loop before and I would suggest that you post you code and I will check it over. That way we can make sure that we are both singing from same song sheet.

Steve

innovator

ASKER

mouatts,

Well, the problem is that i know too little about java script..... so i hope that you will give me a "clear" example to reload the page into a second page after the first page's components are all loaded.

i think that i got cunfused because you gave me several answers and options! :)

in one of your answers you asked me to change

setTimeout('self.reload(true)',reload_time)

to setTimeout('document.location="page2.html"',reload_time)

i did not understand if i should write "reload_time" or should i write 3000 ? document location.... is it the http..... or just a "document.location"

I am sorry that i took all that time... but as i said above i know too litle about java, and my english (reading/understanding) is my second problem! :)

Thanks.

innovator

ASKER

mouatts

Happy to but I'm afraid you will have to wait a couple of days as I'm going away.

Steve

innovator

ASKER

Ok.. Steve .... I will wait ! :)

mouatts

The code below is what you are looking for. (some of the names are different from whats above as I couldn't remember what I had used but the principles are the same.

<HTML>
<HEAD>
<SCRIPT LANGUAGE="javascript">
var new_page;
var wait_time=5000;
var image_count=0;
var image_limit=2;
function next_page()
{
      document.location=new_page;
}
function loaded()
{
      image_count++;
      if(image_count==image_limit)
      {
            setTimeout("next_page()",wait_time);
      }
}
</SCRIPT>
</HEAD>
<BODY>
<IMG SRC="moon.gif" onLoad="loaded();">
<IMG SRC="tree.gif" onLoad="loaded();">
</BODY>
<SCRIPT LANGUAGE="javascript">
new_page="test2.html"
</SCRIPT>
</HTML>

The variables that you need to manipulate are as follows

wait_time is the time (in 1000th of a second) to wait after the last image has loaded.
image_limit is the number of images on the page that we are waiting to load.
new_page is the next page to be loaded.

It is this final variable (in the second SCRIPT block) that needs to be changed to cycle through each (you may wish to also change the image_limit as well if subsequent pages have a different number of images in the same way.

So with each ASP page you would simply need to change these two variables for the whole shooting match to cycle through your set of pages.

HTH
Steve

innovator

ASKER

Steve... Thanks alot for your comment dated July 28 1999

I tried out the code and changed the variancies as mentioned and it worked just great!

I just have the following uncleared pointsand hope to get your comments :

1) What if the page contains text.... shall the browser wait for the text
too?

2) I tried the code on an html page... what is ASP page you mentioned?

3) Well, i knoow that i did not say this before... cuz i thought it is not
important ..... but what if my page contains a link to a banner exchange site!

so it should wait for the banner to show up.... the banner ,however, is
not a normal imaje link... i.e. it is not : <IMG SRC="tree.gif">

the link that i should put in the page looks like :


<center><iframe src="http://leader.bannerxchange.com/1/X1112366/showiframe?" width=468 height=60 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 scrolling=no>
<a href="http://leader.bannerxchange.com/1/X1112366/clickle" target="_top"><img width=468 height=60 border=0 ismap alt="" src="http://leader.bannerxchange.com/1/X1112366/showle?"></a></iframe><br><a href="http://leader.bannerxchange.com/1/X1112366/clicklogo" target="_top"><img src="http://leader.bannerxchange.com/1/X1112366/showlogo?" width=468 height=16 border=0 ismap alt=""></a><br></center>


so, how can i set the code to wait for the banner also?

If this may help you.... i have one banner only... i.e. the other refered pages does not contain the banner exchange link! (i don't know if this is useful or not?)

Please submit your comment as an answer.... unless you don't want to take the credit points ! :)

Thanks again... waiting for your comment.

innovator

ASKER

Adjusted points to 250

ASKER CERTIFIED SOLUTION

mouatts

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

innovator

ASKER

Hi mouatts ..... i know that this question took more than it should take! :)

final point: You said that itMAY work if i put "onLoad bit on the Iframe and the IMG tag .......and if the server is slow i may use onError="loaded()"

could you please, place what you suggested above in the code below? just copy and paste it after putting the variances you think would be useful!

Should i count the banner as one image, so i must modify the image counter?

Your answer is accepted..... just add this last comment, and i will try it myself!

Thanks alot for your answer!

Here is the banner exchange code :


<center><iframe src="http://leader.bannerxchange.com/1/X1112366/showiframe?" width=468 height=60 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 scrolling=no>
<a href="http://leader.bannerxchange.com/1/X1112366/clickle" target="_top"><img width=468 height=60 border=0 ismap alt="" src="http://leader.bannerxchange.com/1/X1112366/showle?"></a></iframe><br><a href="http://leader.bannerxchange.com/1/X1112366/clicklogo" target="_top"><img src="http://leader.bannerxchange.com/1/X1112366/showlogo?" width=468 height=16 border=0 ismap alt=""></a><br></center>

mouatts

<center><iframe src="http://leader.bannerxchange.com/1/X1112366/showiframe?" width=468 height=60 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 scrolling=no onLoad="loaded();" onError="loaded();">
<a href="http://leader.bannerxchange.com/1/X1112366/clickle" target="_top"><img width=468 height=60 border=0 ismap alt="" src="http://leader.bannerxchange.com/1/X1112366/showle?" onLoad="loaded();"></a></iframe><br><a href="http://leader.bannerxchange.com/1/X1112366/clicklogo" target="_top"><img src="http://leader.bannerxchange.com/1/X1112366/showlogo?" width=468 height=16 border=0 ismap alt="" onLoad="loaded();"></a><br></center>


You need to add 2 to image_limit (one for the iframe or the image if iframe is not supported and one for the second image)

innovator

ASKER

thanks!