PDA

View Full Version : Universal Countdown script help



Bisonbacker
04-28-2007, 05:07 AM
1) Script Title: Universal Countdown script

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

3) Describe problem: Not able to sync up the local time. Get invalid date

I'd really like to get this countdown timer installed on my forum but am running into some problems and would appreciate a little guidance as I'm sure I'm screwing up something myself but don't know what.
I've installed both pieces of code, this in my header section
<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:White;
color:Green;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80&#37;
}

</style>

<script type="text/javascript">

/***********************************************
* Universal Countdown script- &#169; Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")?

'<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime(0)+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode

on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local

time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br

/>Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+"

seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+"

<sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> UNTIL BISON FOOTBALL GAMEDAY"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("It's Game Day!") //Instead, perform a custom alert
}
return displaystring
}

</script>
and this in my body section

<table width="100%" cellspacing="0" cellpadding="3" border="0">
<tr>
<td align="Center">
<div id="cdcontainer"></div>

<tr><script type="text/javascript">
//cdLocalTime("ID_of_DIV_container", "server_mode", LocaltimeoffsetMinutes, "target_date", "opt_debug_mode")
//cdLocalTime.displaycountdown("base_unit", formatfunction_reference)

//Note: "launchdate" should be an arbitrary but unique variable for each instance of a countdown on your page:

var launchdate=new cdLocalTime("cdcontainer", "server-PHP", 60 , "September 7, 2007 19:00:00", "debugmode")
launchdate.displaycountdown("days", formatresults2)
</script>

I'm getting this message
Debug Mode on!
Current Local time: Invalid Date
Verify this is the correct current local time, in other words, time zone of count down date.

Target Time: Friday, September 07, 2007 7:00:00 PM
Verify this is the date/time you wish to count down to (should be a future date).
Help please.

tech_support
04-28-2007, 05:35 AM
Sticky

jscheuer1
04-28-2007, 06:30 AM
var launchdate=new cdLocalTime("cdcontainer", "server-php", 60 , "September 7, 2007 19:00:00", "debugmode")
launchdate.displaycountdown("days", formatresults2)
</script>

Javascript is case sensitive. There could be other problems.

Bisonbacker
04-28-2007, 11:21 AM
Sticky

Sorry guys it was just me being lazy I guess.
Here's the URL for the script.
http://www.dynamicdrive.com/dynamicindex6/universalcountdown.htm

I tried the other two settings per the instructions regarding whether it's server-php, server-ssi or server-asp

the forum is pbpbb 2.0.21 and the server is my-sql
Thanks guys and sorry for not following protocol. If there is any other information you need please let me know I will be checking this several times today. Just as an aside, I tried installing this script about a month or more ago and was able to get the server time so I know it can work but I had other problems at the time and didn't finish installing the script. I can't for the life of me figure out what it was I did then that is different now. :(

Bisonbacker
04-28-2007, 11:29 AM
I also changed the case setting as per your instructions with no change.

mburt
04-28-2007, 12:20 PM
Does your server support ASP?

Bisonbacker
04-28-2007, 12:44 PM
Does your server support ASP?

I got this information from my host. I hope this answers your question, as it appears ASP is not supported.

A partial list of technologies follows:

HTML, PHP, CGI/Perl scripting, Python, Flash, Java Script, MySQL, PostgreSQL, ODBC

Please note the fact that some of the websites hosted on our servers require that JavaScript support in your browser is enabled, we do not support server-side Java includes. For further, more detailed information, please contact our support team.
Despite the availability of ASP modules for Linux platforms, we have chosen not to offer them on shared hosting machines. The reason is that experimental installations have yielded unfavorable results in terms of system stability and server load.

jscheuer1
04-28-2007, 01:38 PM
Two basic things:


Your page's extension must be .php not .htm or .html.
You may have to edit the script to reflect the required PHP token usage of your server.


For number two, some servers require (from the script, addition red):


var servertimestring=(servermode=="server-php")? '<?php print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'

Bisonbacker
04-28-2007, 06:10 PM
Two basic things:


Your page's extension must be .php not .htm or .html.
You may have to edit the script to reflect the required PHP token usage of your server.


For number two, some servers require (from the script, addition red):


var servertimestring=(servermode=="server-php")? '<?php print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'

My board url is index.php not .html.
My website is www.bisonsports.net
The script is not on the main page however, I was testing it on a different template so as not to goof up my main board. I will change the script to red and see if that helps. Thanks for all the help guys.

Bisonbacker
04-28-2007, 06:52 PM
Unfortunately changing the text color to red didn't help. Any other suggestions?
Thanks

jscheuer1
04-29-2007, 01:02 AM
I never suggested changing the text color of anything. I meant edit this line in the script:


var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'

By adding the explicit php to the opening <? token (this time shown highlighted blue):


var servertimestring=(servermode=="server-php")? '<?php print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'

This has nothing to do with using blue color, I only used red in my previous example and blue here to draw attention to the text only change.

If it still won't work, how about a link to your test page?

Bisonbacker
04-29-2007, 02:39 AM
Ok, I have the file loaded with the original script instructions. Still getting the same result.
Here's the website
www.bisonsports.net
Login is test
password is 123abc

from there you will see the page with the script installed.
Thanks.

jscheuer1
04-29-2007, 04:08 AM
That's the problem, this is not getting resolved:

<? print date("F d, Y H:i:s", time())?>

Try changing it to:

<?php print date("F d, Y H:i:s", time())?>

If that doesn't fix it, perhaps your server has yet another format/syntax that is required to denote that the PHP interpreter should be invoked. If so, use that.

Bisonbacker
04-29-2007, 04:21 AM
I changed it John but no go. Your suggestion
If that doesn't fix it, perhaps your server has yet another format/syntax that is required to de
note that the PHP interpreter should be invoked. If so, use that. I don't know what that would be. Is there any other way to try to denote the time or is it only via the server? Really would like to get this script working for the users of the board :confused:

jscheuer1
04-29-2007, 05:11 AM
I'm not sure either, but it still isn't getting resolved. It's possible that there is a special syntax that needs to be used for your package. Just as an experiment, I would try making up a plain .php page and just putting only:

<? print date("F d, Y H:i:s", time())?><br>
<?php print date("F d, Y H:i:s", time()) ?>

on it and see what you get. Notice the added space in the second string before the ?>. I get this (on a PHP enabled site I master):

April 29, 2007 01:00:09
April 29, 2007 01:00:09

If that works out for you, there is something about the BB package or the script (probably the package), not the server. If it doesn't work out for you, you need to find out from your host what the correct syntax would be.

One thing that was tried before with this sort of script that helped was cutting out the 'guesswork' and just changing this line:


var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="&#37;B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'

to:


var servertimestring = '<?php print date("F d, Y H:i:s", time()) ?>';

and shutting off debugmode.

It's worth a shot but, only if the test I mentioned gets you the date and time.

Bisonbacker
04-29-2007, 05:26 AM
I tried just changing the code and shutting off the debug mode but then I lost the entire display on the page. Guess I will maybe try one more time tomorrow. Getting late.
Thanks John.

thetestingsite
04-29-2007, 05:41 AM
Why not try moving the info to an external js.php file. In other words, place the countdown script in a new file called countdown.js.php (the entire script with the exception of the <script> tags). Then, in overall_header.tpl (which is the header template of the PHPBB forum system), place this:



<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80&#37;
}

</style>

<script type="text/javascript" src="countdown.js.php">

/***********************************************
* Universal Countdown script- &#169; Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>


Hope this helps.

jscheuer1
04-29-2007, 06:14 AM
That's a great idea, thetestingsite - if the server will resolve the PHP token but the BB page won't.

Bisonbacker
04-29-2007, 01:13 PM
Let me see if I understand you correctly (sorry I'm a Newbie).
I only place the reference or this part into the body of my overall_header.tpl file where I want the timer to appear.

<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80&#37;
}

</style>

<script type="text/javascript" src="countdown.js.php">

/***********************************************
* Universal Countdown script- &#169; Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>

and then this into the new countdown.js.php file that I created


<style style="text/css">

.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>

<script type="text/javascript">

/***********************************************
* Universal Countdown script- &#169; Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br />Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+" seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+" <sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until launch time"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Launch time!") //Instead, perform a custom alert
}
return displaystring
}

</script>

Then I suspect the new file would go in the Forum folder in the bb program? Sorry for asking such elementary questions.
Thanks so much for the help you guys. I will try this and let you know if I was successfull.

jscheuer1
04-29-2007, 01:55 PM
Here, use the absolute path to the new countdown.js.php:


<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>

<script type="text/javascript" src="countdown.js.php">

/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>

In the new file (countdown.js.php), use only the script code:


/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br />Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+" seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+" <sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until launch time"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Launch time!") //Instead, perform a custom alert
}
return displaystring
}

Notes: This will not work if the test I outlined before using the plain .php page with only the date tokens on it doesn't work. Also, it may be necessary to actually place the first code block on the page rather than in a template. Hopefully not. If so though, the styles could be placed in an external stylesheet and be linked as well via a link tag.

Bisonbacker
04-29-2007, 02:06 PM
Ok, I still must be doing something wrong. I created the countdown.js.php file, here it is.

<style style="text/css">

.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>


/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")?

'<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode

on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local

time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br

/>Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+"

seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+"

<sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until launch time"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Launch time!") //Instead, perform a custom alert
}
return displaystring
}



then I created my new overall_header.tpl file here's the part of the file that references the timer.

<table width="100%", <td align="center",cellspacing="0" cellpadding="0">

<div id="cdcontainer"></div>
<td align="center">
<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>

<script type="text/javascript" src="templates/subSilver/countdown.js.php">

/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>
<tr>

There is nothing in the Header section of the template file only the body section.

What am I doing wrong?


Now I don't see the timer anywhere on the page. I put the countdown.js.php file in this folder on the server

/public_html/forum/templates/subSilver/countdown.js.php

and directed it to that location in the file.
?????

Bisonbacker
04-29-2007, 02:07 PM
Sorry John I didn't see your post previous to my last one, let me take a look at that

Bisonbacker
04-29-2007, 02:29 PM
Well I tried both of those, tried a different location for the countdown.js.php file and directed it to that but I'm not even getting the script to show up on the page.
I should also include that I checked the permissions on the file also and they were set properly. I don't understand why the timer even if it doesn't show the proper time doesn't appear on the page?

jscheuer1
04-29-2007, 02:30 PM
Did you try the test I mentioned? If so, what did that page output?

thetestingsite
04-29-2007, 02:59 PM
Actually, it would be a better idea to put the countdown.js.php file at the root of the forum directory. This way the file gets parsed no matter what. Also, we know that php is enabled on the server, or else BB would not work.

Also, in overall_header.tpl, make sure you place the style and script in the <head> of the document. Then call the script in the body (like it says on the demo page).

Hope this helps.

//EDIT: Also, we know that the script is being parsed correctly ( countdown.js.php (http://bisonsports.net/forum/templates/subSilver/countdown.js.php) ), see where it says
var servertimestring=(servermode=="server-php")? , the date is actually being displayed and not the php code.

jscheuer1
04-29-2007, 03:04 PM
Actually, it would be a better idea to put the countdown.js.php file at the root of the forum directory. This way the file gets parsed no matter what. Also, we know that php is enabled on the server, or else BB would not work.

Also, in overall_header.tpl, make sure you place the style and script in the <head> of the document. Then call the script in the body (like it says on the demo page).

Hope this helps.

We know PHP is probably enabled, but we don't know if it will resolve the token as expected or if it needs a server specific syntax. To test that, make up a page, call it -say, test.php and just put this and only this in it:


<? print date("F d, Y H:i:s", time())?><br>
<?php print date("F d, Y H:i:s", time()) ?>

Upload that to the server, view it in the browser and see what it outputs.

thetestingsite
04-29-2007, 03:06 PM
I guess you didn't see my //EDIT in my previous post, or we cross posted while I was doing the edit. ANyways, as I said, it is being parsed correctly as shown in the link I posted.

jscheuer1
04-29-2007, 03:09 PM
I guess you didn't see my //EDIT in my previous post, or we cross posted while I was doing the edit. ANyways, as I said, it is being parsed correctly as shown in the link I posted.

Not when I viewed it. If it were being parsed correctly on the server side, none of this would have been a problem to begin with. Yes, the javascript is being parsed, but the PHP date token isn't being resolved to a date.

thetestingsite
04-29-2007, 03:12 PM
Yes, the javascript is being parsed, but the PHP date token isn't being resolved to a date.

That's odd, because as I look at it, I see the correct date and time. Just now, as I looked at it, the script showed this:



var servertimestring=(servermode=="server-php")? 'April 29, 2007 10:09:56' :


Now if I'm not mistaken, that's where the php code is supposed to be parsed at. Anyways, just my two cents.

Ryan Fitton
04-29-2007, 03:16 PM
Look, I hate peaple who place broken links on their posts or websites. Because I mostly have to find the correct link that you misspelt, and it takes quite a long time. So please next time can you check your links before posting!

P.S: Please forgive me if I sound a bit grumpy! :mad:

jscheuer1
04-29-2007, 03:19 PM
Oh, I meant before on the BB page. It wasn't getting resolved there. So, my extra test isn't needed, you're right.

Perhaps, to avoid confusing Bisonbacker any more than we already have, you should take it from here, thetestingsite.

Bisonbacker
04-29-2007, 03:27 PM
Look, I hate peaple who place broken links on their posts or websites. Because I mostly have to find the correct link that you misspelt, and it takes quite a long time. So please next time can you check your links before posting!

P.S: Please forgive me if I sound a bit grumpy! :mad:

?? I just checked the link and it works fine. The others are able to access it. Don't know why you wouldn't be able to?
John I'm totally confused. I will do some more work on this and see if I can at least get it to display the invalid date time using your code examples. Not sure though if I need to still setup the seperate file countdown.js.php or not? I thought I had it in the root directory for the forum but I can see if I can drill down further on the server and place it in the very first folder and see if that resolves that.

Bisonbacker
04-29-2007, 03:39 PM
That's odd, because as I look at it, I see the correct date and time. Just now, as I looked at it, the script showed this:



var servertimestring=(servermode=="server-php")? 'April 29, 2007 10:09:56' :


Now if I'm not mistaken, that's where the php code is supposed to be parsed at. Anyways, just my two cents.

I do not see that date and time when I look at the source. Am I missing something?

thetestingsite
04-29-2007, 03:43 PM
What do you see when in the source? If it is a variation of that time above (or any date/time for that matter), then you are in good shape. If you still see the php token:


<?php echo date(...


then it is not being parsed correctly. Either way, it would be wise to put the script at the root directory (in this case 'forum'), then in overall_header.tpl, place the absolute path to the script location:



<script src="http://www.example.com/forum/countdown.js.php">


Hope this helps.

Bisonbacker
04-29-2007, 03:47 PM
Right now I have switched back to the original instructions on the code.
In my overall_header.tpl file in the body when I look at the source this is the code I get.

<div id="cdcontainer"></div>
<td align="center">
<div id="cdcontainer"></div>

<script type="text/javascript">
//cdLocalTime("ID_of_DIV_container", "server_mode", LocaltimeoffsetMinutes, "target_date", "opt_debug_mode")
//cdLocalTime.displaycountdown("base_unit", formatfunction_reference)

//Note: "launchdate" should be an arbitrary but unique variable for each instance of a countdown on your page:

var launchdate=new cdLocalTime("cdcontainer", "server-php", 60, "April 23, 2010 15:53:00", "debugmode")
launchdate.displaycountdown("days", formatresults2)
</script>

Bisonbacker
04-29-2007, 03:48 PM
Here's what's in the header

<style style="text/css">

.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>

<script type="text/javascript">

/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")?php '<?php print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br />Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+" seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+" <sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until launch time"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Launch time!") //Instead, perform a custom alert
}
return displaystring
}

</script>
<style type="text/css">
}

</script>

Bisonbacker
04-29-2007, 03:50 PM
am I still supposed to be referencing the countdown.js.php file? If so this is what I currently have in that file.

/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")?

'<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode

on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local

time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br

/>Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+"

seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+"

<sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until launch time"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Launch time!") //Instead, perform a custom alert
}
return displaystring
}

But the current overall_header.tpl file on the server isn't referencing this file. Wasn't sure if I was still supposed to.

thetestingsite
04-29-2007, 03:55 PM
So you put that code in the tpl file, right? If you did, then that is the problem (due to the fact that tpl files in BB can't parse PHP code). Try; as suggested before, placing it in an external file (countdown.js.php). Place this file in the forums directory, then call the script in the tpl file as already suggested.

Let me know if you need any further help with this, and I'll see what I can do.

Hope this helps.

//EDIT: Cross posted, yes, you need to reference the external file for the script to work properly.

Bisonbacker
04-29-2007, 04:06 PM
Ok, I have the countdown.js.php file in the forum directory and I changed the overall_header.tpl file with the following code referencing the timer.


<table width="100%", <td align="center",cellspacing="0" cellpadding="0">

<div id="cdcontainer"></div>
<td align="center">
<div id="cdcontainer"></div>

<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>

<script type="text/javascript" src="http://www.bisonsports.net/public_html/forum/countdown.js.php">

/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>
<tr>
When I make this change I don't see any timer vaild date or not.

thetestingsite
04-29-2007, 04:10 PM
This part (the part in red):



<script type="text/javascript" src="http://www.bisonsports.net/public_html/forum/countdown.js.php">


should be this (again, the part in red):



<script type="text/javascript" src="http://www.bisonsports.net/forum/countdown.js.php">


Notice I took the public_html part out of it. That should do it.
Hope this helps.

Bisonbacker
04-29-2007, 04:40 PM
Ok, I made that change but still no display or either a valid date or invalid date. I still must have something wrong but I sure don't know what it would be. Here's how my server is setup.
http://i158.photobucket.com/albums/t114/bri4878/ScreenHunter_01Apr-1.gif

I have the countdown timer script in the forum under the underneath the public.html folder. the tpl file is in the subsilver folder. Not sure it that will tell you anything seeing that but it just seems that the tpl file isn't finding that script.

thetestingsite
04-29-2007, 04:52 PM
Whenever I look at the HTML source code, I don't see where you put the tag that calls the script.



<script type="text/javascript" src="countdown.js.php">


This is why it is not working. I sent you a PM with some suggestions.
Hope this helps.

Bisonbacker
04-29-2007, 05:38 PM
You should have the file in your email.

thetestingsite
04-29-2007, 06:12 PM
Ok, I editted the files and sent them to your email. Simply follow the instruction in the email and let me know if you need any more help (or if it doesn't work).

Hope this helps.

Bisonbacker
04-29-2007, 06:25 PM
Well I tried both those files.
Something is changed in the CSS not sure where that would be but the page is missing something from the CSS?
No countdown timer on the page after placing both files on the server.
??:(

Bisonbacker
04-29-2007, 06:34 PM
I had to take that tpl file off as it messed up the entire page. Guess it's just not going to work. Will look around and see if I can find another type of countdown script that will work with phpbb on my server. Thanks for trying.

jscheuer1
04-29-2007, 07:22 PM
Since you two seem to be giving up, why not try linking the script directly to the page, rather than through the tpl?

Bisonbacker
04-29-2007, 08:20 PM
I had wanted it to be on each page on the board which with the overall header file it would do that. I could go digging around and see if I can find a page specific file but how would that be any different then what we were trying to do with the overall_header.tpl file?

jscheuer1
04-29-2007, 09:12 PM
I had wanted it to be on each page on the board which with the overall header file it would do that. I could go digging around and see if I can find a page specific file but how would that be any different then what we were trying to do with the overall_header.tpl file?

Templates and linked scripts often don't play nice together. If you link the script directly to the pages that you want to have use it, it really isn't all that much extra code to put on each page.

Bisonbacker
04-29-2007, 09:35 PM
I'm game to try it that way, just tell me what I need to do or what files I need to edit.

jscheuer1
04-29-2007, 09:51 PM
Well, I'm not sure what you have, but if you have a valid external script file in the root of the domain with the extension of .php, just link it to the head of the pages:


<script src="\filename.php" type="text/javascript">
/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>

Make sure to include the style on or link it to each page and to include the 'in the body' part of the code in the body of each page as well.

Bisonbacker
04-30-2007, 02:14 AM
Thanks for the recommendations John but that all sounds a little beyond my scope or abilities right now. I need more experience with all this before I think I want to try that. If I had specific file names and instructions on what to do in each file such as many of the mods or addons just like the countdown script instructions I'd be happy to give it a whirl. Thanks though.

jscheuer1
04-30-2007, 05:32 AM
Well, here is a page that can be in any directory on the domain:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style style="text/css">

.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80%
}

</style>
<script src="/countdown.php" type="text/javascript">
/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>
</head>
<body>
<div id="cdcontainer"></div>

<script type="text/javascript">
//cdLocalTime("ID_of_DIV_container", "server_mode", LocaltimeoffsetMinutes, "target_date", "opt_debug_mode")
//cdLocalTime.displaycountdown("base_unit", formatfunction_reference)

//Note: "launchdate" should be an arbitrary but unique variable for each instance of a countdown on your page:

var launchdate=new cdLocalTime("cdcontainer", "server-php", 0, "April 23, 2010 15:53:00", "debugmode")
launchdate.displaycountdown("days", formatresults2)
</script>
</body>
</html>

The countdown.php file it uses is in the root of the domain and has just this in it:



/***********************************************
* Universal Countdown script- Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.targetdate=new Date(targetdate)
this.debugmode=(typeof debugmode!="undefined")? 1 : 0
this.timesup=false
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
}

cdLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}

cdLocalTime.prototype.showresults=function(){
var thisobj=this
var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br />Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=debugstring+this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}

/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

//Create your own custom format function to pass into cdLocalTime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left

//The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

//1) Display countdown using plain text
function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+" seconds</span> left until launch time"
}
else{ //else if target date/time met
var displaystring="Launch time!"
}
return displaystring
}

//2) Display countdown with a stylish LCD look, and display an alert on target date/time
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+" <sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until launch time"
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Launch time!") //Instead, perform a custom alert
}
return displaystring
}

Bisonbacker
04-30-2007, 12:18 PM
I'll take a stab at that later today when I get a chance. Thanks John

Bisonbacker
04-30-2007, 11:47 PM
John,
You mentioned that tpl files don't always play well with js. I have several on the tpl file working fine right now. Is this something to do with the server time issue or is it something else?

thetestingsite
04-30-2007, 11:55 PM
The first file is just HTML code, so name it whatever you see fit (as long as it is parsed as HTML). So file type could be anything from htm, html, php, shtml, etc.

//EDIT: Also, I haven't given up on this one, just had some things I needed to get done.

Bisonbacker
05-01-2007, 01:26 AM
The first file is just HTML code, so name it whatever you see fit (as long as it is parsed as HTML). So file type could be anything from htm, html, php, shtml, etc.

//EDIT: Also, I haven't given up on this one, just had some things I needed to get done.

I don't know if you saw the page when I loaded those files but I lost a lot of my formatting when I put them up? I can put them back up if you would like if you want to take a shot at what's going on. I'm not having much luck but mostly due to my lack of knowledge on the whole subject which frankly pisses me off. I've been trying to wrap my brain around this stuff and some of it makes sense to me and some of it could just as well be written in russian. I guess it will all come with time but still very frustrating.:confused:

thetestingsite
05-01-2007, 01:35 AM
Well, in overall_header.tpl. All you should have to add is this:



<style style="text/css">

.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:black;
color:lime;
font: bold 18px MS Sans Serif;
padding: 3px;
}

.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 80&#37;
}

</style>
<script src="/countdown.php" type="text/javascript">
/***********************************************
* Universal Countdown script- &#169; Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>


just before the ending <head> tag. If you still cannot get it, send me the files again (or the code in a PM) and I'll edit it again. The reason why it lost the formatting (I think) was because I may have taken out a part of the code that should have stayed in there. This time, I'll just add the part that needs to be added and leave the rest alone.

Hope this helps.

jscheuer1
05-01-2007, 03:36 AM
John,
You mentioned that tpl files don't always play well with js. I have several on the tpl file working fine right now. Is this something to do with the server time issue or is it something else?

There could be issues with caching of the server generated data. Other odd things may happen as, you are dealing with various parsing agents at different stages in the process. When scripts do work in templates, its because things are pretty straightforward.


Also, I haven't given up on this one, just had some things I needed to get done.

Sorry, thetestingsite. I jumped the gun. I'll try to restrain myself and let you run with this one unless I hear from you that you are at an impasse with it.

I just want to add in this tidbit for you though:

Even with putting the script call directly on each page, there could be caching of the server side data as, the entire file could be cached on either the server and/or the user's end. It may be necessary to call the script with a small script that writes out the script tag while appending a unique query string to the address of the script each time. This (if needed) may be able to be done in the template, but may be easier if done right on each page.

Bisonbacker
05-01-2007, 04:50 AM
Just a little editing left to do on the file for cosmetics on the page that I'm going to have to work on. I also need to get the debug mode off. Dustin I PM'd you on that if you have an answer.
Thanks

Bisonbacker
05-01-2007, 04:55 AM
I figured out the debug mode

Now just the finishing touches.
Thanks Guys your the best.

Bisonbacker
05-01-2007, 11:21 AM
Well guys with your help it's up and running. I can't thank you guys enough. The layout on the site will be getting frequent updates and changing over time but the timer will be on the page somewhere until it reaches the set time anyway. If you or anyone else wants to take a look at it here's the page. www.bisonsports.net
Thanks again everyone for the help, I only hope that someday I will be able to help someone else like you have done in some area of either programming or design as I learn it. I suspect I will be bald or full of grey hair by then though.;)