JavaScript Help

WOIKeller · **Posted:** Mon May 25, 2009 6:53 pm

I have recently been learning some JavaScript and have come across a small issue I'm not sure how to solve.

I have been writing a website randomize and was wondering if there was anyway of assigning a timed refresh within the JavaScript code as the randomizer points to sites not controlled by myself.

If you don't know what is happening please read the comments. I don't put them in there for my benefit.

code:

<html>
<head>
<title>Loading...</title>
<script language="javascript" type="text/javascript">
// Sets up and assigns an array of pages to be chosen from
pages=new Array()
pages[1]="http://www.site1.com"
pages[2]="http://www.site2.com"
pages[3]="http://www.site3.com"
// Assigns the number of pages
maxPages=3
// randomly selects a page from 0 to whatever "maxPages" is. (which is in
// this case is 3) it then adds 1 (It add 1 because arrays start at 0) and
// then selects that record and stores it in the procedure newPage
newPage= function (){return Math.floor(Math.random()*maxPages)+1}
</script>
</head>

<body onload="window.location.href=pages[newPage()]">
</body>
</html>

DtY · **Posted:** Mon May 25, 2009 8:29 pm

You can use frames, and make one that's height is zero for the javascript, then the other with a height of 100%, for the page to show.

the randomize will look something like this:

Javascript:

function newpage() {
//stuff to get the page to go to, url in variable newpage
window.frames[1].location.href = newpage;
window.setTimeout(delayinms, newpage);
}

window.setTimeout(delayinms, newpage);

**Probably contains errors, have not tested

WOIKeller · **Posted:** Mon May 25, 2009 10:01 pm

I never even thought of using a zero frame... Thank you very much.

gianni · **Posted:** Sat Jun 13, 2009 9:36 pm

Just FYIzzle, we can simplify this code greatly:

Firstly, we can take advantage of array literals so you don't have to worry about array indices (arrays are zero-based as well).
We can also get rid of the maxPages variable because we can use the array length property.
And finally, instead of relying on a global variable (a no-no) to compute your random page, let's make a more general method we can re-use.

Javascript:

Array.prototype.random = function() {
return this[Math.round(Math.random() * (this.length - 1))];
};

var pages = ["http://www.site1.com", "http://www.site2.com", "http://www.site3.com"];

Now the random method will be available on all array instances. So in your page chooser code you can call:

Javascript:

pages.random()

A couple things to keep an eye on: don't forget that JS vars should be declared, and statements should end in a semi-colon. Happy coding!

gianni · **Posted:** Sat Jun 13, 2009 9:52 pm

DtY @ Mon May 25, 2009 8:29 pm wrote:

You can use frames, and make one that's height is zero for the javascript, then the other with a height of 100%, for the page to show.

the randomize will look something like this:

Javascript:

function newpage() {
//stuff to get the page to go to, url in variable newpage
window.frames[1].location.href = newpage;
window.setTimeout(delayinms, newpage);
}

window.setTimeout(delayinms, newpage);

**Probably contains errors, have not tested

Great idea, using frames, that's exactly what I would have done. A couple things, the setTimeout function is declared globally, so there's no need to call it on the window object (which is the default context in browsers). And instead of having setTimeout call a function that calls setTimeout again, and so forth. I would try and DRY things up slightly by using the setInterval function, which will execute code at the defined interval. And finally, I don't think one will have access to the location object on the frame due to the Same Origin Policy, instead I would reset the frame src attribute. E.g.:

Javascript:

var myInterval = setInterval(function(){
document.getElementById('my-frame').src = pages.random();
}, 10000);

DtY · **Posted:** Sat Jun 13, 2009 10:33 pm

Aha! I knew there was function to do that (setInterval), but the name escaped me. Thanks for fixing all that up.
Good idea attaching a new method, I never did care for OOP in javascript, seems like overkill to me. Oh well, that method does look much nicer.

gianni · **Posted:** Sat Jun 13, 2009 10:43 pm

Yea, OOP in JS is a bit funky cause it's prototype-based and not class-based (which is much more popular). It's just a different way of thinking of objects.

	Computer Science Canada Programming C, C++, Java, PHP, Ruby, Turing, VB Username: Password: Register
Wiki Blog Search Turing Chat Room Members