Link to home
Start Free TrialLog in
Avatar of Lundorff2
Lundorff2

asked on

A countdown script for multiply products

Hi,

I am looking for a, presumable, simple script that takes a predetermined date(s) from a mysqldb and displays a countdown for one or several products. Lets say one of the offers expires in 71 hours, 21 minutes and 12 seconds, the timer would look something like this: 71:21:12. Once the time is up, the script needs to redirect to a specified page.

And I actually already have found a working script: http://www.minisitegallery.com/blog/php-javascript-countdown-script-with-timezone-setting.html but unfortunately it only works with 1 product at the time. From what I can understand, it's because it does not use objects.

Another example is this one: http://www.littlewebthings.com/projects/countdown/ but it requires too much tinkering.

So, does anyone have solution?
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

use the settimeout method to call a function every second.

Convert date in DB to time and subtract from current date / time to get seconds - maintain as an internal variable in the script.

Decrement counter in function call on timeout and check for 0 - use windows.location to redirect. If not 0 then update UI.
Here is a javascript countdown timer.
<?php // RAY_countdown_timer.php
error_reporting(E_ALL);

// SET THE TIMER VALUE IN THE PHP SCRIPT
date_default_timezone_set('America/Chicago');
$present = time();
$future  = strtotime('NOW + 7 SECONDS');
$timer   = $future - $present;
?>

<script type="text/javascript">
var interval = "";
var sekonds  = <?php echo $timer; ?>;

function startInterval()
{
    interval = window.setInterval("tTimer()",1000);
}

function stopInterval()
{
    window.clearInterval(interval);
    interval="";
}

function tTimer()
{
    document.thinkTime.tDisplay.value = sekonds--;
    if (sekonds == -1)
    {
        stopInterval();
    }
}
</script>

<script>
document.write('<meta http-equiv=\"Refresh\" content=\"<?php echo $timer; ?>;url=http://lmgtfy.com?q=JavaScript+Timer\">');
</script>

<form name="thinkTime">
This page will automatically search for a JavaScript Timer in
<input readonly class="timerBox" size="1" type="text" name="tDisplay" value="">
<script>startInterval();</script>
seconds.
</form>
<a href="http://lmgtfy.com?q=JavaScript+Timer">Click here if you don't want to wait.</a>

Open in new window

Avatar of Lundorff2
Lundorff2

ASKER

I am sorry, but this is far too unspecific compared to what I need. The first script I linked to has everything I need:

1) Takes a date from the mysqldb in the format of YY:MM:DD HH:MM:SS
2) Counts down in the format of 1 day 20:05:11
3) Redirects in the end

But, as I mentioned, the script only works for 1 product.
far too unspecific compared to what I need
If it's a need for application development instead of a question, you might want to consider hiring an application developer.  We are pretty good at answering questions here at EE, and I can often provide teaching examples, but we are volunteers and can't really write your code for you -- that is something a paid professional would do.

If you want to get the scripts from the minisitegallery and post them here, I'll be glad to try to make a demo for you.  I will not download them because I am not willing to open a ZIP file from a foreign source.
I understand, I was just hoping someone might have working counter laying around :o)

The script from the minisite consists of 2 files: a html and a php page.

The html is only this code: <SCRIPT language="JavaScript" SRC="countdown.php?timezone=Asia/Kuala_Lumpur&countto=2020-01-01 00:00:00&do=r&data=produkter.php"></SCRIPT>

timezone: uses these timezones http://www.php.net/manual/en/timezones.php
countto: the end date in that format
do=r: redirects to produkter.php

---

The php is more complex:
<?php
// we will be sending Javascript codes, remember...
header('Content-Type: text/javascript'); 

// select the timezone for your countdown
$timezone = trim($_GET['timezone']);
putenv("TZ=$timezone");

// Counting down to New Year's on 2020
$countdown_to = trim($_GET['countto']); // 24-Hour Format: YYYY-MM-DD HH:MM:SS"

// Getting the current time
$count_from = date("Y-m-d H:i:s"); // current time -- NO NEED TO CHANGE

// Date difference function. Will be using below
function datediff($interval, $datefrom, $dateto, $using_timestamps = false) {
  /*
    $interval can be:
    yyyy - Number of full years
    q - Number of full quarters
    m - Number of full months
    y - Difference between day numbers
      (eg 1st Jan 2004 is "1", the first day. 2nd Feb 2003 is "33". The datediff is "-32".)
    d - Number of full days
    w - Number of full weekdays
    ww - Number of full weeks
    h - Number of full hours
    n - Number of full minutes
    s - Number of full seconds (default)
  */
  
  if (!$using_timestamps) {
    $datefrom = strtotime($datefrom, 0);
    $dateto = strtotime($dateto, 0);
  }
  $difference = $dateto - $datefrom; // Difference in seconds
   
  switch($interval) {
   
    case 'yyyy': // Number of full years

      $years_difference = floor($difference / 31536000);
      if (mktime(date("H", $datefrom), date("i", $datefrom), date("s", $datefrom), date("n", $datefrom), date("j", $datefrom), date("Y", $datefrom)+$years_difference) > $dateto) {
        $years_difference--;
      }
      if (mktime(date("H", $dateto), date("i", $dateto), date("s", $dateto), date("n", $dateto), date("j", $dateto), date("Y", $dateto)-($years_difference+1)) > $datefrom) {
        $years_difference++;
      }
      $datediff = $years_difference;
      break;

    case "q": // Number of full quarters

      $quarters_difference = floor($difference / 8035200);
      while (mktime(date("H", $datefrom), date("i", $datefrom), date("s", $datefrom), date("n", $datefrom)+($quarters_difference*3), date("j", $dateto), date("Y", $datefrom)) < $dateto) {
        $months_difference++;
      }
      $quarters_difference--;
      $datediff = $quarters_difference;
      break;

    case "m": // Number of full months

      $months_difference = floor($difference / 2678400);
      while (mktime(date("H", $datefrom), date("i", $datefrom), date("s", $datefrom), date("n", $datefrom)+($months_difference), date("j", $dateto), date("Y", $datefrom)) < $dateto) {
        $months_difference++;
      }
      $months_difference--;
      $datediff = $months_difference;
      break;

    case 'y': // Difference between day numbers

      $datediff = date("z", $dateto) - date("z", $datefrom);
      break;

    case "d": // Number of full days

      $datediff = floor($difference / 86400);
      break;

    case "w": // Number of full weekdays

      $days_difference = floor($difference / 86400);
      $weeks_difference = floor($days_difference / 7); // Complete weeks
      $first_day = date("w", $datefrom);
      $days_remainder = floor($days_difference % 7);
      $odd_days = $first_day + $days_remainder; // Do we have a Saturday or Sunday in the remainder?
      if ($odd_days > 7) { // Sunday
        $days_remainder--;
      }
      if ($odd_days > 6) { // Saturday
        $days_remainder--;
      }
      $datediff = ($weeks_difference * 5) + $days_remainder;
      break;

    case "ww": // Number of full weeks

      $datediff = floor($difference / 604800);
      break;

    case "h": // Number of full hours

      $datediff = floor($difference / 3600);
      break;

    case "n": // Number of full minutes

      $datediff = floor($difference / 60);
      break;

    default: // Number of full seconds (default)

      $datediff = $difference;
      break;
  }    

  return $datediff;
}

// getting Date difference in SECONDS
$diff = datediff("s", $count_from, $countdown_to);
?>

// Here’s where the Javascript starts
countdown = <?=$diff?>;

// Converting date difference from seconds to actual time
function convert_to_time(secs)
{
	secs = parseInt(secs);	
	hh = secs / 3600;	
	hh = parseInt(hh);	
	mmt = secs - (hh * 3600);	
	mm = mmt / 60;	
	mm = parseInt(mm);	
	ss = mmt - (mm * 60);	
		
	if (hh > 23)	
	{	
	   dd = hh / 24;	
	   dd = parseInt(dd);	
	   hh = hh - (dd * 24);	
	} else { dd = 0; }	
		
	if (ss < 10) { ss = "0"+ss; }	
	if (mm < 10) { mm = "0"+mm; }	
	if (hh < 10) { hh = "0"+hh; }	
	if (dd == 0) { return (hh+":"+mm+":"+ss); }	
	else {	
		if (dd > 1) { return (dd+" days "+hh+":"+mm+":"+ss); }
		else { return (dd+" day "+hh+":"+mm+":"+ss); }
	}	
}

// Our function that will do the actual countdown
function do_cd()
{
	if (countdown < 0)	
	{ 	
		<?php
			if(strtolower(trim($_GET['do'])) == 'r' )
			{
		?>
		// redirect web page
		document.location.href = "<?=$_GET['data']?>";
		<?php } ?>

		<?php
			if(strtolower(trim($_GET['do'])) == 't' )
			{
		?>
		// change text
		document.getElementById('cd').innerHTML = "<?=$_GET['data']?>";
		<?php } ?>

	}	
	else	
	{	
		document.getElementById('cd').innerHTML = convert_to_time(countdown);
		setTimeout('do_cd()', 1000);
	}	
	countdown = countdown - 1;	
}

document.write("<div id='cd'></div>\n");

do_cd();

<? exit(); ?>

Open in new window


I have no idea how good or updated this is, but it does work.
Sorry, I'm not having any luck with it.  I can only get it to work with one field, too.
I take it there is no easy solution?

I was actually about to settle with the one counter and then make it larger instead, but it would appear that large font-sizes look terrible in IE8. So great.
Not sure what the issue is - if I understand you correctly you want to maintain a number of timers on the same page?

You create the page with an element having an attribute of the remaining time (or a hidden input) - give these a particular class.

Set a timeout to happen every second and then use a JQuery .each function on the class to get the current time - decrement by 1 (or 1000 if working in ms) and set the value back after updating the associated display box.

If this is what you are looking for let me know I will knock some code together.

Track record on getting gist of posts right not quite 100% so putting this out there first before jumping in to the coding deep end so to speak.
Hi Julian, yes if you can make something along those lines, I will gladly accept your post as the solution.

(Regarding the font size looking bad, it was just a mixup, forget that part.)
ASKER CERTIFIED SOLUTION
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I will tinker with it, thank you.