Count Down Time

by Good Muyis

HTML

<div class="header-top">
<div class="container">
  
</div>
</div>

CSS

.header-top{
  background: #ccc;
  padding: 5px 9px;
}
body, body*{
  color: green;
  font-size: 12px;
}
.start{
  display: inline-block;
}
.display{
  background: green;
  color: white;
  display:inline-block;
  padding: 5px 9px;

}

JavaScript

jQuery(document).ready(function($) {
  const weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

  const d = new Date();
  let day = d.getUTCDay();
  let hour = d.getHours();
  d.toLocaleString('en-US', {
    timeZone: 'Africa/Lagos'
  })

  let weekDay = String(weekday[d.getUTCDay()]);
  
  if (weekDay !== "Sunday" && weekDay !== "Sunday") {
    if (hour >= 7 && hour <= 16) {
      //**********************************
      var now = d.getHours();
      var end = d.setHours(16, 0, 0); // 04:00pm
      var endHour = new Date(end).getHours();
      var closing = 60 * (endHour - now);
      //***********************************

      $('.header-top .container').append(`<div class="start">Place your order now. Disptach Rider moves in <span class="display">Countdown</span></div>`);
      var display = $('.display');
      startTimer(closing, display);
    }
  }

  //end of ready();   
});
//################################

function startTimer(duration, display) {
  var timer = duration, hours, minutes, seconds;
  setInterval(function() {
    hours 	= parseInt(timer / 60, 10);
    minutes = parseInt(timer / (60*60), 10);
    seconds = parseInt(timer % 60, 10);
    hours 	= hours < 16 ? "0" + hours : hours;
    minutes = minutes < 16 ? "0" + minutes : minutes;
    seconds = seconds < 16 ? "0" + seconds : seconds;
    display.text(hours + ":"+minutes + ":" + seconds);
    if (--timer < 0) {
      timer = duration;
    }
  }, 1000);
}