Warning: Trying to access array offset on value of type null in /home/jwblogger/jwBlogger/wp-content/plugins/codepen-embedded-pen-shortcode/codepen.php on line 16
Warning: Trying to access array offset on value of type null in /home/jwblogger/jwBlogger/wp-content/plugins/codepen-embedded-pen-shortcode/codepen.php on line 17
Last year, a client asked me to create a countdown to show the time left until the start of Black Friday. At the time, I had just started using AngularJS, so naturally, I decided to challenge myself to use AngularJS to make the countdown.
And 9 months later, I’m finally documenting the project! Better late than never, I reckon!
My countdown was largely inspired by a codepen I found by Garth Weaver. However I didn’t fully agree with his implementation. I thought there should be a controller that held the data for the countdown, and I thought the directive should use data binding instead of using jQuery DOM manipulations. Additionally, I needed to stop the countdown once time left equalled 0, which Garth’s directive does not. I did, however, appreciate his use of a factory to calculate the time left.
The Solution
See the Pen Countdown Using AngularJS 1.5 by Jeff Wilkerson (@stljeff1) on CodePen.0
Sadly, however…
It will take some extra work to get this script to handle timezones. Timezones aren’t really important when calculating something relative like the end of the day. But, timezones are crucial when calculating a specific time, like the start of a baseball game.