Countdown based on timezone with jQuery-CodePudding

I worked with this:

(function() {

  var timeElement, eventTime, currentTime, duration, interval, intervalId;

  interval = 1000; // 1 second

  // get time element
  timeElement = document.querySelector("#countdown");
  // calculate difference between two times
  eventTime = moment.tz("2022-05-29T08:00:00", "Europe/Berlin");
  // based on time set in user's computer time / OS
  currentTime = moment.tz();
  // get duration between two times
  duration = moment.duration(eventTime.diff(currentTime));

  // loop to countdown every 1 second
  setInterval(function() {
    // get updated duration
    duration = moment.duration(duration - interval, 'milliseconds');

    // if duration is >= 0
    if (duration.asSeconds() <= 0) {
      clearInterval(intervalId);
      // hide the countdown element
      timeElement.classList.add("hidden");
    } else {
      // otherwise, show the updated countdown
      timeElement.innerText = duration.days()   ":"   duration.hours()   ":"   duration.minutes()   ":"   duration.seconds();
    }
  }, interval);

}());

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment-with-locales.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.17/moment-timezone-with-data-2012-2022.min.js"></script>

<div id="countdown"></div>

Unfortunately, the time doesn't get calculated correctly. If you change for example 2022-05-29 to 2022-08-29, nothing changes. Additionally, every value should have two digits.

Has someone an idea to fix that? Would be very thankful!

CodePudding user response：

Your question about momentjs is answered here; use asDays() not days()

You can pad a string with 0's using the function padStart(length, withWhat) Mozilla Developer Network Documentation

//...snip...
    } else {
      // otherwise, show the updated countdown
      timeElement.innerText =
        duration.asDays().toFixed().padStart(2, 0)   ":"  
        duration.hours().toString().padStart(2, 0)   ":"  
        duration.minutes().toString().padStart(2, 0)   ":"   
        duration.seconds().toString().padStart(2, 0);
    }
//...snip...