Timer for multiple instances

[h20boynz]

I have a loop creating a block_vars array for displaying records from a database. (In this case auction listings).

The following code creates this array:

// get random selection of 6 items for home page display
$query = "SELECT id, title, current_bid, pict_url, ends, num_bids, minimum_bid, bn_only, buy_now, subtitle, starts, ends, reserve_price
        FROM " . $DBPrefix . "auctions
        WHERE closed = 0 AND suspended = 0 AND starts <= " . $NOW . "
        ORDER BY RAND() DESC LIMIT 6";
$res = mysql_query($query);
$system->check_mysql($res, $query, __LINE__, __FILE__);
   $showendtime = false;
   $has_ended = false;
      
$k = 0;
while($row = mysql_fetch_assoc($res))
{
   $ends = $row['ends'];
   $difference = $ends - time();
   if ($difference > 0)
   {
      $ends_string = FormatTimeLeft($difference);
   }
   else
   {
      $ends_string = $MSG['911'];
   }
   
   $high_bid = ($row['num_bids'] == 0) ? $row['minimum_bid'] : $row['current_bid'];
   $high_bid = ($row['bn_only'] == 'y') ? $row['buy_now'] : $high_bid;
   
   //determine whether the auction has a Buy Now price, show if appropriate.
   if($row['buy_now'] == '0.0000') {
   $bnamount = "";
   } else {
   $bnamount = "<a href='" . $system->SETTINGS['siteurl'] . "buy_now.php?id=" . $row['id'] ."'>$" . substr($row['buy_now'], 0, -2) . "<br />" . "Buy Now</a>";
   }
      
   //determine if the auction has a reserve set and if it has been met. display appropriate symbol
   if($row['reserve_price'] == '0.0000' && $row['bn_only'] == 'n' && ($row['current_bid'] < $row['minimum_bid'])) {
      $flag = '<img src="images/noreserve.gif" alt="No Reserve">';
      $flagdesc = " No Reserve!";
      $bnonly = "Current Bid<br />";
      } else {
         if($row['current_bid'] >= $row['reserve_price']) {
         $flag = '<img src="images/reservemet.gif" alt="Reserve Met">';
         $flagdesc = " Reserve Met!";
         $bnonly = "Current Bid<br />";
         } else {
         $flag = '<img src="images/noflag.gif">';
         $flagdesc = "";
         $bnonly = "Current Bid<br />";
         }
      }
   if($row['reserve_price'] == '0.0000' && $row['bn_only'] == 'y') {
      $flag = '<img src="images/noflag.gif">';
      $flagdesc = "";
      $bnonly = "Asking Price ";
      $bnamount = "";   
      }

   $template->assign_block_vars('randomitems', array(
         'ID' => $row['id'],
         'BID' => $bnonly . "$" . substr($high_bid, 0, -2),
         'IMAGE' => (!empty($row['pict_url'])) ? 'getthumb.php?w=' . $system->SETTINGS['thumb_show'] . '&fromfile=' . $uploaded_path . $row['id'] . '/' . $row['pict_url'] : 'images/email_alerts/default_item_img.jpg',
         'TITLE' => $row['title'],
         'BUY_NOW' => $bnamount,
         'SUBTITLE' => $row['subtitle'],
         'TIMELEFT' => $ends_string,
         'NUMBIDS' => $row['num_bids'],
         'FLAG' => $flag,
         'FLAGDESC' => $flagdesc
         ));
   $k++;
   
}

Pretty straightforward. You will see I have a TIMELEFT value which will show on my home page as no.days, no.hours, no.mins until it closes etc.

Here is the html in the tpl file:

<!-- BEGIN randomitems -->
            <div style="float:left;display:block;width:99%;border-bottom:#CCCCCC 1px solid;padding:2px;">
                <div style="display:block;">
                 <table width="100%">
                  <tr>
          <td align="center" style="vertical-align:middle;width:120px" >
       <a href="{SITEURL}item.php?id={randomitems.ID}"><img src="{randomitems.IMAGE}" alt="{randomitems.TITLE}" style="border: none;width:120px"></a>
       </td>
       <td align="left" width="40%">
        <table style="width:100%; vertical-align:middle; margin:0 auto">
         <tr>
          <td><a id="itemdesc" href="{SITEURL}item.php?id={randomitems.ID}">{randomitems.TITLE}</a><br />
                      {randomitems.SUBTITLE}</td>
                     </tr>
                     <tr>
                      <td id="closes">Closes in:{randomitems.TIMELEFT}</td>
                     </tr>
                     <tr>
                      <td>{randomitems.FLAG}{randomitems.FLAGDESC}</td>
                     </tr>
                    </table>
       </td>
       <td id="buynow" align="center" width="15%">
       {randomitems.BUY_NOW}
       </td>
       <td id="currentbid" align="center" width="25%">
       {randomitems.BID}
       </td>
      </tr>
     </table>
                </div>
            </div>
<!-- END randomitems -->

This works quite nicely for me.

 

What I want, and cannot manage thus far is to have the TIMELEFT value count down.

 

The closest I have come is using a function like this:

 
<script type="text/javascript">
$(document).ready(function() {
var currenttime = '{randomitems.TIMELEFT}';
function padlength(what)
{
  var output=(what.toString().length == 1)? '0' + what : what;
  return output;
}
function displaytime()
{
  currenttime -= 1;
  if (currenttime > 0){
   var hours = Math.floor(currenttime / 3600);
   var mins = Math.floor((currenttime - (hours * 3600)) / 60);
   var secs = Math.floor(currenttime - (hours * 3600) - (mins * 60));
   var timestring = padlength(hours) + ':' + padlength(mins) + ':' + padlength(secs);
   $("#ending_counter").html(timestring);
   setTimeout(displaytime, 1000);
  } else {
   $("#ending_counter").html('<span class="errfont">{L_911}</span>');
  }
}
setTimeout(displaytime, 1000);
});
</script>

This code is placed in the tpl file and I simply give an html element the appropriate ID. The problem with this is that it would only show a countdown timer for the first item returned, which is no good as there are always six items returned.

 

Can anyone offer a suggestion on how I could go about this? I can PM anyone with suggestions with a link to my development site so you know what I am raving about.

[h20boynz]

Anyone with smarty experience?

[h20boynz]

Anyone?...I'm still fumbling with this