Javascript Countdown Clock Every Saturday At 11am

I have a request to make that looks a little different than most the answers I found on here. I am looking for a Javascript countdown clock that repeats itself every Saturday at 11

Solution 1:

You can use this to get the next saturaday at 11am date:

functiongetNextSaturday() {
   var now = newDate();
   var nextSaturday = newDate();
   nextSaturday.setDate(now.getDate() + (6 - 1 - now.getDay() + 7) % 7 + 1);
   nextSaturday.setHours(11, 0, 0, 0);
   return nextSaturday;
}

And this to convert it to EST timezone:

functionconvertToEST(date){
    estOffset = -4.0// -5 + 1 daylight savings
    utc = date.getTime() + (date.getTimezoneOffset() * 60000);
    returnnewDate(utc + (3600000 * estOffset));
}

All in all:

functiongetTimeRemaining(endtime) {
  var t = Date.parse(endtime) - Date.parse(newDate());
  var seconds = Math.floor((t / 1000) % 60);
  var minutes = Math.floor((t / 1000 / 60) % 60);
  var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
  var days = Math.floor(t / (1000 * 60 * 60 * 24));
  return {
    'total': t,
    'days': days,
    'hours': hours,
    'minutes': minutes,
    'seconds': seconds
  };
}

functioninitializeClock(id, endtime) {
  var clock = document.getElementById(id);
  var daysSpan = clock.querySelector('.days');
  var hoursSpan = clock.querySelector('.hours');
  var minutesSpan = clock.querySelector('.minutes');
  var secondsSpan = clock.querySelector('.seconds');

  functionupdateClock() {
    var t = getTimeRemaining(endtime);

    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();
  var timeinterval = setInterval(updateClock, 1000);
}

functiongetNextSaturday() {
   var now = newDate();
   var nextSaturday = newDate();
   nextSaturday.setDate(now.getDate() + (6 - 1 - now.getDay() + 7) % 7 + 1);
   nextSaturday.setHours(11, 0, 0, 0);
   return nextSaturday;
}

functionconvertToEST(date){
    estOffset = -5.0
    utc = date.getTime() + (date.getTimezoneOffset() * 60000);
    returnnewDate(utc + (3600000 * estOffset));
}

var deadline = getNextSaturday();
initializeClock('clockdiv', convertToEST(deadline));

body{
	text-align: center;
	background: #00ECB9;
  font-family: sans-serif;
  font-weight: 100;
}

h1{
  color: #396;
  font-weight: 100;
  font-size: 40px;
  margin: 40px0px20px;
}

#clockdiv{
	font-family: sans-serif;
	color: #fff;
	display: inline-block;
	font-weight: 100;
	text-align: center;
	font-size: 30px;
}

#clockdiv > div{
	padding: 10px;
	border-radius: 3px;
	background: #00BF96;
	display: inline-block;
}

#clockdivdiv > span{
	padding: 15px;
	border-radius: 3px;
	background: #00816A;
	display: inline-block;
}

.smalltext{
	padding-top: 5px;
	font-size: 16px;
}

<h1>Countdown Clock</h1><divid="clockdiv"><div><spanclass="days"></span><divclass="smalltext">Days</div></div><div><spanclass="hours"></span><divclass="smalltext">Hours</div></div><div><spanclass="minutes"></span><divclass="smalltext">Minutes</div></div><div><spanclass="seconds"></span><divclass="smalltext">Seconds</div></div></div>