Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<div id="clockdiv">
<div>
<span class="days"></span>
<div class="smalltext"><%= t(".days") %></div>
</div>
<div>
<span class="hours"></span>
<div class="smalltext"><%= t(".hours") %></div>
</div>
<div>
<span class="minutes"></span>
<div class="smalltext"><%= t(".minutes") %></div>
</div>
<div>
<span class="seconds"></span>
<div class="smalltext"><%= t(".seconds") %></div>
</div>
</div>
function getTimeRemaining(endtime) {
const total = Date.parse(endtime) - Date.parse(new Date());
const seconds = Math.floor((total / 1000) % 60);
const minutes = Math.floor((total / 1000 / 60) % 60);
const hours = Math.floor((total / (1000 * 60 * 60)) % 24);
const days = Math.floor(total / (1000 * 60 * 60 * 24));
return {
total,
days,
hours,
minutes,
seconds,
};
}
function initializeClock(id) {
const endtime = document.getElementById("auctionEndTime");
if(endtime) {
const innerEndtime = endtime.innerHTML
const clock = document.getElementById(id);
const daysSpan = clock.querySelector(".days");
const hoursSpan = clock.querySelector(".hours");
const minutesSpan = clock.querySelector(".minutes");
const secondsSpan = clock.querySelector(".seconds");
function updateClock() {
const t = getTimeRemaining(innerEndtime);
daysSpan.innerHTML = t.days;
hoursSpan.innerHTML = ("0" + t.hours).slice(-2);
minutesSpan.innerHTML = ("0" + t.minutes).slice(-2);
secondsSpan.innerHTML = ("0" + t.seconds).slice(-2);
if (t.total <= 0) {
clearInterval(timeinterval);
}
}
updateClock();
const timeinterval = setInterval(updateClock, 1000);
}
}
export { initializeClock };
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment