Countdown timer w moment and countdown
HTML
<div class="listWrap">
<table>
<thead>
<tr>
<th>Given ddd</th>
<th>time remaining</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>2014-02-19T15:10:00+09:30</td>
<td class="time" endTime="2014-02-19T16:10:00+09:30"></td>
<td></td>
</tr>
<tr>
<td>2014-02-19T15:05:00+09:30</td>
<td class="time" endTime="2014-02-19T16:45:00+09:30"></td>
<td></td>
</tr>
<tr>
<td>2014-02-19T15:14:00+09:30</td>
<td class="time" endTime="2014-02-20T18:14:00+09:30"></td>
<td></td>
</tr>
<tr>
<td>2017-02-19T16:32:00+11:00</td>
<td class="time" endTime="2014-03-19T16:53:00+11:00"></td>
<td></td>
</tr>
</tbody>
</table>
</div>
<button id="toggleTimer" timerOn="false">Start Timer</button>
<script src="https://rawgithub.com/moment/moment/develop/min/moment.min.js"></script>
<script>
/*
countdown.js v2.3.3 http://countdownjs.org
Copyright (c)2006-2012 Stephen M. McKamey.
Licensed under The MIT License.
*/
var module, countdown = function(r) {
function v(a, b) {
var c = a.getTime();
a.setUTCMonth(a.getUTCMonth() + b);
return Math.round((a.getTime() - c) / 864E5)
}
function t(a) {
var b = a.getTime(),
c = new Date(b);
c.setUTCMonth(a.getUTCMonth() + 1);
return Math.round((c.getTime() - b) / 864E5)
}
function f(a, b) {
return a + " " + (1 === a ? p[b] : q[b])
}
function n() {}
function l(a, b, c, g, x, d) {
0 <= a[c] && (b += a[c], delete a[c]);
b /= x;
if (1 >= b + 1) return 0;
if (0 <= a[g]) {
a[g] = +(a[g] + b).toFixed(d);
switch (g) {
case "seconds":
if (60 !== a.seconds || isNaN(a.minutes)) break;
a.minutes++;
a.seconds = 0;
case "minutes":
if (60 !== a.minutes || isNaN(a.hours))...
CSS
table {
border: none;
}
table thead {
background-color: #969696;
border-left: solid 1px #ededed;
border-right: solid 1px #fcfcfc;
}
table thead th {
padding: 5px 10px;
}
table td {
border-left: solid 1px #ededed;
border-right: solid 1px #fcfcfc;
padding: 5px 2px;
}
JavaScript
/*
moment.lang('en', {
relativeTime : {
future: "in %s",
past: "%s ago",
s: "s",
m: "m",
mm: "%d m",
h: "h",
hh: "%d h",
d: "d",
dd: "%d d",
M: "m",
MM: "%d months",
y: "a year",
yy: "%d years"
}
});
*/
var tick;
$(function() {
$('#toggleTimer').click(function(e) {
if ($(e.target).attr("timerOn") == "false") {
tick = window.setInterval(function() {
$(window).trigger('tick');
}, 1000);
$(e.target).attr("timerOn", "true").html('Stop Timer');
} else {
window.clearInterval(tick);
$(e.target).attr("timerOn", "false").html('Start Timer');
}
});
$(window).on('tick', function() {
$('.time').each(function(i, obj) {
processTimeTo(obj);
});
});
/*
var localTime = moment();
var eventTime = moment("2014-03-19T18:20:00+11:00");
var timeRemaining = localTime.countdown(eventTime,
countdown.MONTHS | countdown.DAYS | countdown.HOURS | countdown.MINUTES | countdown.SECONDS
).toString();
console.log("timeremaining ", timeRemaining);
//timeRemaining = timeRemaining.replace(', and', '');
//var outputTime = timeRemaining.match(/(\d. seconds)?(\d. seconds)?/);
//var seconds = timeRemaining.match(/^(\d.).*days?(\d.).*hours?(\d.).*minutes?.*(\d.) .*seconds?/);
var months = timeRemaining.match(/(\d+).(month[s]?)/);
var days = timeRemaining.match(/(\d+).(day[s]?)/);
var hours = timeRemaining.match(/(\d+).(hour[s]?)/);
var minutes = timeRemaining.match(/(\d+).(minute[s]?)/);
var seconds = timeRemaining.match(/(\d+).(second[s]?)/);
//console.log("arg ", timeRemaining.match(/(\d+)/g));
console.log(months, days, hours, minutes, seconds);
var outputString = '';
if (months) {
outputString = months[1] + " " + months[2]
} else if (days) {
outputString = days[1] + " "...