PDA

View Full Version : period of change of Random Content order



jimlongo
03-04-2010, 04:24 AM
1) Random Content Order script

2) http://www.dynamicdrive.com/dynamicindex17/randomcontentorder.htm

3) The script works fine for me in that it changes the order of the divs every time the page loads. What i'd like to ask is if it's possible to have it so that the order only changes every 24 hours or some other preset period of time.

Thanks for any help,
jim

jscheuer1
03-04-2010, 11:28 AM
Use this version:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.group1{
visibility: hidden;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<script type="text/javascript">

/***********************************************
* Random Content Order script- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
* Modified 03/04/2010 cookie persistence by jscheuer1 in http://www.dynamicdrive.com/forums/
***********************************************/

function randomizeContent(classname, days){
var $ = jQuery, contents = {
ref: $('.' + classname),
text: [],
cookie: (function(){return randomizeContent.cookie.get(classname)? randomizeContent.cookie.get(classname).split('::') : [];})()
};
contents.ref.each(function(i){
contents.text[i] = [this.innerHTML, i];
});
if(contents.cookie.length === 0){
contents.text.sort(function(){return 0.5 - Math.random();});
contents.ref.each(function(i){
$(this).html(contents.text[i][0]).css('visibility', 'visible');
contents.cookie[i] = contents.text[i][1];
});
randomizeContent.cookie.set(classname, contents.cookie.join('::'), days || 0);
} else {
contents.ref.each(function(i){
$(this).html(contents.text[contents.cookie[i]][0]).css('visibility', 'visible');
});
}
}

randomizeContent.cookie = {
set: function(n, v, d){ // cookie.set takes (name, value, optional_persist_days) - defaults to session if no days specified
if(d){var dt = new Date();
dt.setDate(dt.getDate() + d);
d = '; expires=' + dt.toGMTString();}
document.cookie = n + '=' + escape(v) + (d || '') + '; path=/';
},
get: function(n){ // cookie.get takes (name)
var c = document.cookie.match('(^|;)\x20*' + n + '=([^;]*)');
return c? unescape(c[2]) : null;
},
kill: function(n){ // cookie.kill takes (name)
randomizeContent.cookie.set(n, '', -1);
}
};
</script>
</head>
<body>
<div class="group1">
Content 1
</div>

<div class="group1">
Content 2
</div>

<div class="group1">
Content 3
</div>

<div class="group1">
Content 4
</div>

<div class="group1">
Content 5
</div>


<script type="text/javascript">

//randomize order of contents with DIV class="group1" to persist for 1 day (use 0 for session only persistence)
randomizeContent('group1', 1);

</script>
</body>
</html>

Notes: This version uses jQuery, make sure to include it in your page as highlighted in the above. The method for invoking it has changed slightly (from the above):


<script type="text/javascript">

//randomize order of contents with DIV class="group1" to persist for 1 day (use 0 for session only persistence)
randomizeContent('group1', 1);

</script>

Which is pretty self explanatory.

If there are images in the randomized content, there might be an issue in IE with the page never completely loading. This would likely only happen, if at all, once the page is live. If it does, let me know, it can be fixed.

Any questions, feel free to ask.

jimlongo
03-04-2010, 11:55 AM
Thanks so much John for your quick reply.

I guess I'll know tomorrow if it works :).

Am I right to assume the cookie is the variable that determines the page change? And it changes at GMT midnight every day?

There are images in each row of the table, I'll have to check in IE, I don't have access to a box with Windows.
Here's a quick test (http://rdiv.com/p3P/test_D.html)

jscheuer1
03-04-2010, 12:34 PM
Seems to be working fine. No problem in IE. What can sometimes happen in IE is if an image is loading and gets removed from the DOM it will continue attempting to load, but never can. But it all depends upon how that is done and upon whether or not the image is returned to the DOM and also how that's done. Apparently this is not an issue here.

FYI, if you want to clear the cookie for testing purposes, enter this into the browser's address bar:


javascript:void(randomizeContent.cookie.kill('group1'))

and hit enter. You may then refresh the page and it will act (one time) as though the cookie hasn't been set yet, because it isn't. When you do so, the cookie will be set again. But you may repeat this process as many times as you like to test the randomness.

As to your question about GMT, no. The cookie will be set for 24 hours from the time the user views the page. This is tracked on their computer only if they have cookies enabled (most do), and although GMT is required to satisfy the inner workings of the cookie object, the time tracking will be relative to the user's local time as set by their computer's clock.

If you want something a little different, use 0 for the persist. That way whenever the user closes the browser (all windows and tabs of it), the cookie will be deleted. This is known as session only. However, to test that after having set the 24 hour cookie, you will first have to clear the cookie as described above.

jimlongo
03-04-2010, 03:52 PM
Thanks that's becoming clearer to me.

So then for each viewer the view will be different. And that view will change for them when they view the page more than 24 hours in the future. Is that right?

For the sake of argument is there a method where one could have a global view, that is it looks the same for everyone today, and changes to a different global view tomorrow?

jim

jscheuer1
03-04-2010, 05:37 PM
That's right.

To make the view global, you would have to abandon random, at least as far as javascript goes. Things could be shuffled around and how they would be shuffled could be date dependent, but either an algorithm would have to be established, perhaps on the basis of the day of the year (0 to 364 most years), or a set of various possible combinations, one for each day of the week set up so that the user's could all order the content the same way on a given day. No cookie would be required though, and that's a good thing. As with the current scheme, if the user doesn't have javascript, they see the order 'as is' on the page.

However, if one were to use PHP or another server side language, one could randomly sort once every 24hrs or whatever period you liked and all users would see the same thing each time, even if they didn't have javascript enabled.

Either way it would take me a bit of time to figure it out. The timezone to be used for when things should change would be important. If on the server side, the server's zone could be used or converted to the desired zone, if on the client (javascript) side we would have to convert the user's time to UT then back to the desired zone. It would be difficult to have an already loaded page update if the trigger time passed while a user was viewing it. In javascript we could have a poll, in PHP I'm not sure if it could be done without some sort of background process on the server, if even that would work, but we could use a javascript poll for just that part of it.

In fact, various mixtures of server side and client side code could be used.

Unless this is crucial for some reason, it would be far easier to go with what we've already got. And if it truly is crucial, a server side method would be best. Anything that relies upon javascript will not work for users who have it disabled or unavailable, and anything that relies upon the user's clock in any way other than relativistically (as our current code does, but that this could not) would be subject to inaccuracies if the user's clock were set incorrectly.

jimlongo
03-04-2010, 05:58 PM
I think I see the possibilities. Let me see how this works out for now. Thanks for all your help up to his point, I'll check back in when i have some more feedback.