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.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | <!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> |
<!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>