3D Cube CountDown script - Auto start

**The Code** · 02-23-2016, 04:48 AM

1) Script Title: 3D Cube CountDown script

2) Script URL (on DD):http://www.dynamicdrive.com/dynamici...htm#responsive

3) Describe problem: I hope this is simple. How do I make this clock countdown count a time period (Like every 24 hours) and restart automatically... not to a specific date?? Like every Thursday at 7pm. After seven PM, the clock starts a fresh 24 hours... ticking down again for next week, so on and so on.

THX people

**jscheuer1** · 02-23-2016, 05:27 AM

Every Thursday at 7pm would be a lot longer than 24 hours between each restart. Make up your mind, then I'm sure we can work it out.

**The Code** · 02-23-2016, 01:44 PM

Originally Posted by jscheuer1

Every Thursday at 7pm would be a lot longer than 24 hours between each restart. Make up your mind, then I'm sure we can work it out.

I meant weekly specifically. So every 168 hours. This should be adjustable to what ever time period right? Thanks for helping!

**jscheuer1** · 02-23-2016, 05:25 PM

I don't think so, once done for one time period should at least make it a little easier to do it for another. Javascript time is finicky and applying logic to it can get messy if you want reliable results in every circumstance that could apply during the achievement of the objective. That said, (every) next Thursday at 7pm is now a reality (I think), let me know if there are any problems:

Code:

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="ddcubeclass.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script src="ddcubeclass.js"></script>

<script src="ddcubecountdown.js">

/***********************************************
* 3D Cube Countdown script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Please keep this notice intact
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script>
jQuery(function($){ // on DOM load

	function nextthursdayat7pm(){
		var now = new Date(), thur = 4, _7pm = 19, curday = now.getDay(), curhour = now.getHours();
		if(curday === thur && curhour >= _7pm){now.setDate(now.getDate() + 1);}
		while (curday !== thur){
			now.setDate(now.getDate() + 1);
			curday = now.getDay();
		}
		return new Date(now.getFullYear(), now.getMonth(), now.getDate(), _7pm);
	}

	var mycountdown;

	function setcountdown(){
		var theDate = nextthursdayat7pm();
		mycountdown = new cubecountdown({
			containerid: 'futuredate',
			targetdate: theDate,
			size: ['10em', '6em'], // specify cube dimensions in "em" only
			unit: ['days']
		});
		$('#nextthursday').html((theDate.getMonth() + 1) + '/' + theDate.getDate() + '/' + theDate.getFullYear());
		mycountdown.onEnd = function(){setcountdown();};
	}

	setcountdown();
});

</script>
</head>
<body>
<div id="futuredate"></div>
<div style="width:25em;text-align:center;font-weight:bold">until Next Thursday <span id="nextthursday"></span> at 7pm!</div>
</body>
</html>

**The Code** · 02-24-2016, 05:20 PM

Thanks John. I will try this over the next few days and let you know. Has anyone told you that you are awesome today! Thank you

**jscheuer1** · 02-26-2016, 12:09 AM

Woops, I left out one crucial bit to enable proper 7pm and later on a Thursday, plus turnaround on the day itself, handling. In the meantime (while waiting to see if that worked), I made a couple of cosmetic changes to the display div's nested div. Here's the updated code, the crucial addition (to the javascript code) and the cosmetic change (to the div that says "until . . .") are each highlighted:

Code:

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="ddcubeclass.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script src="ddcubeclass.js"></script>

<script src="ddcubecountdown.js">

/***********************************************
* 3D Cube Countdown script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Please keep this notice intact
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script>
jQuery(function($){ // on DOM load

	function nextthursdayat7pm(){
		var now = new Date(), thur = 4, _7pm = 19, curday = now.getDay(), curhour = now.getHours();
		if(curday === thur && curhour >= _7pm){now.setDate(now.getDate() + 1); curday = now.getDay();}
		while (curday !== thur){
			now.setDate(now.getDate() + 1);
			curday = now.getDay();
		}
		return new Date(now.getFullYear(), now.getMonth(), now.getDate(), _7pm);
	}

	var mycountdown;

	function setcountdown(){
		var theDate = nextthursdayat7pm();
		mycountdown = new cubecountdown({
			containerid: 'futuredate',
			targetdate: theDate,
			size: ['10em', '6em'], // specify cube dimensions in "em" only
			unit: ['days']
		});
		$('#nextthursday').html((theDate.getMonth() + 1) + '/' + theDate.getDate() + '/' + theDate.getFullYear());
		mycountdown.onEnd = function(){setcountdown();};
	}

	setcountdown();
});

</script>
</head>
<body>
<div id="futuredate"></div>
<div style="width:26em;text-align:center;font-weight:bold">Until Thursday <span id="nextthursday"></span> at 7pm!</div>
</body>
</html>

**The Code** · 03-01-2016, 02:15 AM

Brilliant John! It works. I took the liberty of changing a few things to see if I could get it to work for another day, and it seems to be ok. I just swapped everything that said thurs for sat. Anything to be careful of here?

Otherwise, you have made my day sir! The only thing I have not tested is the restart.

Oh yeah, I'm not getting any notifications to this thread for some reason. Is that something I have to switch on?

**jscheuer1** · 03-01-2016, 05:48 AM

If it's working, it's fine. The thing is though that thur is actually just an arbitrary variable name. It's its value - set at 4 (the day number in javascript for Thursday), that makes it work. Saturday is 6, so you could just change that 4 to 6, but it would be confusing. By also changing the name of the variable to sat it makes it clearer what the code is doing. Or you could just call it targetday or something like that, then all you would have to do is change the number and it would still be fairly clear what you are doing and could be used for any day of the week. Just for reference, in javascript days of the week are numbered 0 through 6, with Sunday equal to 0. Similarly the months are numbered 0 to 11 with 0 being January. everything else about javascript date/time numbering is more intuitive, at least for the most part with hours minutes and seconds being just what you would think, with the exception of hours being in 24 hour notation. Years are also intuitive as long as you are dealing with the (get or set) FullYear, otherwise you can often get y2k artifacts from the older style methods of getting and setting years.

Similar to thur I had used _7pm to be the variable name for 19 hours (7pm in 24 hour time). Again, the variable name could be changed to something like targettime and then set to any time (as long as it's still in 24 hour notation). Or another more specific/descriptive time variable name could be used. These things (names of variables) are pretty much up to whoever is writing or editing the code. As long as no illegal/invalid name is employed, they can be whatever we choose. It's the values of the variables that dictate what will happen when the code is run.

As for notification, yes I believe you have to turn them on for a given post. Not sure if they always work or not. I never use them. I just check in from time to time to see if anything I'm involved in might use some attention.

**The Code** · 03-01-2016, 08:21 PM

I totally understand. I've modified it several times now successfully. I learned something as well. Thank you thank you. Nice to have someone around.
Notifications... I didn't want you to think I was ignoring you. I'm used to getting notifications for most forums. I know now.