One of my big problems with working in NYC and living in NJ is there are “departure windows” where I can catch the right subway to get the right PATH train to catch the right bus in NJ to get me home. Otherwise, I get stuck cooling my heels somewhere in Jersey City waiting for the next bus. I coded myself up a tiny webapp using a jQuery countdown plugin to help me keep track of when my departure windows are.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>BMC Departure Countdown</title>
<style type="text/css">
@import "jquery.countdown.css";
#homeA, #homeB, #homeC, #homeD, #homeE { width: 240px; height: 65px; margin: 10px}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.countdown.js"></script>
<script type="text/javascript">
$(function () {
var toDay = new Date();
$('#today').text(toDay.toLocaleDateString());
var home804 = new Date(toDay.getFullYear(), toDay.getMonth(),
toDay.getDate(), 18, 57, 00);
$('#homeA').countdown({ until: home804,
description: 'Leave @ 6:57, Home @ 8:04 pm'});
var home849 = new Date(toDay.getFullYear(), toDay.getMonth(),
toDay.getDate(), 19, 51, 00);
$('#homeB').countdown({ until: home849,
description: 'Leave @ 7:51, Home @ 8:49 pm'});
var home934 = new Date(toDay.getFullYear(), toDay.getMonth(),
toDay.getDate(), 20, 27, 00);
$('#homeC').countdown({ until: home934,
description: 'Leave @ 8:27, Home @ 9:34 pm'});
var home1019 = new Date(toDay.getFullYear(), toDay.getMonth(),
toDay.getDate(), 21, 18, 00);
$('#homeD').countdown({ until: home1019,
description: 'Leave @ 9:18, Home @ 10:19 pm'});
var home1104 = new Date(toDay.getFullYear(), toDay.getMonth(),
toDay.getDate(), 21, 59, 00);
$('#homeE').countdown({ until: home1104,
description: 'Leave @ 9:59, Home @ 11:04 pm'});
});
</script>
</head>
<body style="text-align: center">
<h1>BMC Departure times for<br><span id="today">today</span></h1>
<center>
<div id="homeA"></div>
<div id="homeB"></div>
<div id="homeC"></div>
<div id="homeD"></div>
<div id="homeE"></div>
</center>
</body>
</html>