skip to Main Content

I’m new to javascript and I’m really confused about what I need to do. I have added a javascript countdown timer to my site, it was easy to add.

This is the javascript:

<script LANGUAGE="JavaScript">
// This following statement must be left intact.
// Copyright (c) Michael Bloch and Taming The Beast.
// Countdown timer script v1.2 April 20 2009
// Taming the Beast.net - http://www.tamingthebeast.net
// Free Web Marketing and Ecommerce articles and tools
// By using this code you agree to indemnify Taming the Beast
// from from any liability that might arise from its use.
// The preceding statement be left intact.


var present;
var future;
var tseconds;
var seconds;
var minutes;
var hours;
var days;
ID=setTimeout("countdown();", 1000);

function countdown()
{
present = new Date();
present = present.getTime() + (60000) + (12 * 60 * 60 * 1000);
future = new Date("June 30, 2014 12:10:30");

tseconds = (future - present) / 1000;

days = tseconds /24/60/60;
days = Math.floor(days);
tseconds = tseconds - (days * 24 * 60 * 60);

hours = tseconds /60/60;
hours = Math.floor(hours);
tseconds = tseconds - (hours * 60 * 60);

minutes = tseconds /60;
minutes = Math.floor(minutes);
tseconds = tseconds - (minutes * 60);

seconds = tseconds;
seconds = Math.floor(seconds);

document.getElementById('days').innerHTML = days;
document.getElementById('hours').innerHTML = hours;
document.getElementById('minutes').innerHTML = minutes;
document.getElementById('seconds').innerHTML = seconds;
ID=setTimeout("countdown();", 1000);
}
</script>

This is the code to display the timer on the page:

<SPAN id="days">0</SPAN> &nbsp;days &nbsp;&nbsp;
<SPAN id="hours">0</SPAN> &nbsp;hr.&nbsp;&nbsp;
<SPAN id="minutes">0</SPAN>&nbsp;min,&nbsp;
<SPAN id="seconds">0</SPAN>&nbsp;sec.&nbsp;

However, the timer is using a date that is specified in the javascript. I need it to use a date from a mysql database. I need a countdown timer to show when a product sale is ending. It needs to pull the correct date based on product id.

I have a module installed that displays the date the sale is ending. It doesn’t use javascript, it’s just php. I’m wondering if I can somehow use it with the javascript to display the countdown instead of the ending date?

This is the function that gets the end date from the database for the module that I am using now:

<?php 
// Sale Special Ending - Copyright That Software Guy, Inc. 2010.
// http://www.thatsoftwareguy.com
// Some portions copyright 2003-2010 Zen Cart Development Team
// Some portions copyright 2003 osCommerce
function countdown($id, $longdate = true, $one_day_back = false) { 
   $id = (int)$id; 
   global $db; 

   if (zen_get_products_special_price($id, true)) {
      $specials = $db->Execute("select expires_date, UNIX_TIMESTAMP(expires_date) as unix_expires_date from " . TABLE_SPECIALS . " where products_id = '" . $id . "' and status='1' AND expires_date !='0001-01-01'");
      if (!$specials->EOF) { 
         if (!$one_day_back) { 
            $enddate = $specials->fields['expires_date']; 
         } else { 
            $enddate = $specials->fields['unix_expires_date']; 
            $enddate_ts = strtotime("-1 day", $enddate);
            $enddate = date("Y-m-d H:i:s", $enddate_ts); 
         }
         if ($longdate) {
            $date_str = zen_date_long($enddate);
         } else { 
            $date_str = zen_date_short($enddate);
         }
         return $date_str; 
      }
   } 
   if (zen_get_products_special_price($id, false)) { 
      $product_price = zen_get_products_base_price($id);
      $product_to_categories = $db->Execute("select master_categories_id from " . TABLE_PRODUCTS . " where products_id = '" . $id . "'");
      $category = $product_to_categories->fields['master_categories_id'];
      $sales = $db->Execute("select sale_date_end, UNIX_TIMESTAMP(sale_date_end) as unix_sale_date_end from " . TABLE_SALEMAKER_SALES . " where sale_categories_all like '%," . $category . ",%' and sale_status = '1' and (sale_date_start <= now() or sale_date_start = '0001-01-01') and (sale_date_end >= now() or sale_date_end = '0001-01-01') and (sale_pricerange_from <= '" . $product_price . "' or sale_pricerange_from = '0') and (sale_pricerange_to >= '" . $product_price . "' or sale_pricerange_to = '0')");
      if ($sales->EOF) return ''; 
      if ($sales->fields['sale_date_end'] == '0001-01-01') return ''; 
      if (!$one_day_back) { 
         $enddate = $sales->fields['sale_date_end']; 
      } else { 
         $enddate = $sales->fields['unix_sale_date_end']; 
         $enddate_ts = strtotime("-1 day", $enddate);
         $enddate = date("m d Y H:i:s", $enddate_ts); 
      }
      if ($longdate) {
         $date_str = zen_date_long($enddate);
      } else { 
         $date_str = zen_date_short($enddate);
      }
      return TEXT_SALE_EXPIRES . $date_str; 
   }
   return ''; 
}
?>

And this is the code that displays the end date on the product page:

<!--bof Sale Special Ending block -->
<?php
$ssblock = countdown((int)$_GET['products_id']);
if ($ssblock != '') {
  echo "<div class='ssblock'>" . $ssblock . "</div>"; 
}
?>
<!--eof Sale Special Ending block -->

I just can’t figure out how to make it all work together.

2

Answers


  1. i make this for you, maybe can help you:

    http://jsfiddle.net/CnV5A/

    var days=10,hours=1,minutes=1,seconds=5;
    
    var container = document.getElementById("countdown");
    
    function countdown(){
            if(seconds == 0){
                seconds = 59;
                minutes--;
            }else{
                seconds--;
            }
            if(minutes == -1){
                minutes = 59;
                hours--;
             }
             if(hours == -1){
                 days--;
            }
        container.innerHTML = "days:"+days+", hours:"+hours+", minutes:"+minutes+", seconds:"+seconds;
        setTimeout(countdown,1000);
    
        }
    
    countdown();
    
    Login or Signup to reply.
  2. You can use PHP to fetch the date from the database and then write a script tag to set the start date for the countdown state.

    I assume you know how to fetch the date from the database, since you already have a module that displays the end date.

    Suppose the date is in $end. The following would … like, create a future global variable in JavaScript.

    <script>var future = new Date("<?php echo $end; ?>");</script>
    

    Then remove that line with the hardcoded date,

    future = new Date("June 30, 2014 12:10:30");
    

    Anyway, there are lots of ways to improve on the code in this answer.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search