Time Demo
HTML
<script src="http://tests.arieh.co.il/Time/Source/Time.js"></script>
<input type='number' id='num' value='1' />
<select id='range'>
<option value='seconds'>seconds</option>
<option value='minutes'>minutes</option>
<option value='hours'>hours</option>
<option value='days'>days</option>
<option value='weeks'>weeks</option>
<option value='months'>months</option>
<option value='years'>years</option>
</select>
<label for='future'>
<input type='radio' checked name='when' id='future' />from now</label>
<label for='past'>
<input type='radio' name='when' id='past' />ago</label>
<div id='result'></div>
JavaScript
var res = $('result'),
num = $('num'),
past = $('past'),
future = $('future'),
range = $('range');
/*
I know this can be done much more efficeintly,
but I wanted the syntax to be visible
*/
function change(e) {
var value = num.value.toInt(),
r = range.getSelected()[0].value;
switch (r) {
case 'seconds':
res.set('html',
past.checked ? value.seconds().ago() : value.seconds().from_now());
break;
case 'minutes':
res.set('html',
past.checked ? value.minutes().ago() : value.minutes().from_now());
break;
case 'hours':
res.set('html',
past.checked ? value.hours().ago() : value.hours().from_now());
break;
case 'days':
res.set('html',
past.checked ? value.days().ago() : value.days().from_now());
break;
case 'weeks':
res.set('html',
past.checked ? value.weeks().ago() : value.weeks().from_now());
break;
case 'months':
res.set('html',
past.checked ? value.months().ago() : value.months().from_now());
break;
case 'years':
res.set('html',
past.checked ? value.years().ago() : value.years().from_now());
break;
}
}
range.addEvent('change', change);
num.addEvent('change', change);
past.addEvent('change', change);
future.addEvent('change', change);