Today, after some frustration, I needed to vent a little bit. To do this, I created a JavaScript countdown routine.

See the Pen Countdown Timer by Christopher Vachon (@liaodrake) on CodePen.

This of course leads to some interesting thinking. How do you count down to a date / time in a readable format?

## How To Make A Timer

Most Languages have a means to produce a timestamp. A timestamp is the number milliseconds from a point in time (In most cases, the date is January 1 1970 UTC, though some systems and languages use a different time reference, but this is not important to this topic). Because we can generate 2 numeric timestamps, we can use simple math to find out time remaining.

```
var _now = new Date('2014-09-04');
var _then = new Date('2014-09-26');
var _remaining_time = _then - _now;
```

The variable `_remaining_time`

is now the number of milliseconds between the two dates. So now we want to parse that into useable blocks. And we do this by finding the number of milliseconds in a day, an hour, a minute, and a second.

```
var _dayMultiple = 86400000; // 1000ms × 60sec × 60mins × 24hours
var _hourMultiple = 3600000; // 1000ms × 60sec × 60mins
var _minMultiple = 60000; // 1000ms × 60sec
var _secMultiple = 1000; // 1000ms
```

From here, we want to start finding our individual remaining time intervals.

```
var _timer_days = Math.floor(_remaining_time / _dayMultiple);
_remaining_time = _remaining_time - (_timer_days * _dayMultiple);
var _timer_hours = Math.floor(_remaining_time / _hourMultiple);
_remaining_time = _remaining_time - (_timer_hours * _hourMultiple);
var _timer_mins = Math.floor(_remaining_time / _minMultiple); _remaining_time = _remaining_time - (_timer_mins * _minMultiple);
var _timer_sec = Math.floor(_remaining_time / _secMultiple);
```

By subtracting the used intervals as we go, we are left with only the time that is remaining.

From there, its a simple matter of formatting the string you want to display.