The words Under construction in black text on a yellow background with diagonal black stipes surrounding it
I'm in the process of moving my site. It's still a work in progress. Please excuse the mess and broken links.

Countdown To Kickoff

TODO: Pull subtitle into page object

Texas at Bama - Sept. 9, 2023 - 7:00pm ET

Days Hours Min Sec
- - - -
css_start_default_section css_end_default_section script_start_default_section script_end_default_section

Debugging Stuff

I'm moving stuff around right now. All this below is helping me figure out where to put stuff

        -- title

Countdown To Kickoff

-- h2

Texas at Bama - Sept. 9, 2023 - 7:00pm ET

-- html

<table
<thead>
<tr>
<th class="left">Days</th>
<th class="left">Hours</th>
<th class="left">Min</th>
<th class="left">Sec</th>
</tr>
</thead>
<tbody>
<tr>
<td id="days" class="left">-</td>
<td id="hours" class="left">-</td>
<td id="min" class="left">-</td>
<td id="sec" class="left">-</td>
</tr>
</tbody>
</table>

-- css/

body {
  background-color: #440000;
}


.center {
  min-width: 6ch;
  text-align: center;
}

.left{
  min-width: 6ch;
  text-align: left;
}

-- /css


-- script/

const targetDate = new Date("9/9/2023 7:00 PM")

const countdown = () => {
  let delta = targetDate - new Date()
  const payload = {
    days: Math.abs(Math.floor(delta / 86400000)),
    hours: Math.abs(Math.floor((delta % 86400000) / 3600000)),
    min: Math.abs(Math.floor((delta % 3600000) / 60000)),
    sec: Math.abs(Math.floor((delta % 60000) / 1000)),
    ms: Math.abs(Math.floor((delta % 1000) ))
  }
  return payload
}

const renderCountdown = () => {
  const numbers = countdown()
  days.innerHTML = numbers.days
  hours.innerHTML = numbers.hours
  min.innerHTML = numbers.min
  sec.innerHTML = `${numbers.sec}.${numbers.ms}`
  window.requestAnimationFrame(renderCountdown)
}

document.addEventListener("DOMContentLoaded", () => {
  renderCountdown()
})

-- /script

-- categories
-- Bama 


-- metadata
-- date: 2023-08-03 19:00:30
-- id: 2tuhacgk
-- site: aws
-- type: post
-- status: published