| Server IP : 167.235.67.158 / Your IP : 216.73.216.95 Web Server : Apache System : Linux ubuntu-8gb-nbg1-1 6.8.0-111-generic #111-Ubuntu SMP PREEMPT_DYNAMIC Sat Apr 11 23:16:02 UTC 2026 x86_64 User : root ( 0) PHP Version : 8.3.6 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : OFF Directory : /var/www/bc.the-word.com/timer/ |
Upload File : |
<!doctype html>
<html lang="en" class="h-100">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>How long until 2027</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
</head>
<body class="text-center h-100">
<div class="container h-100">
<div class="row h-100 align-items-center justify-content-center">
<div class="col-12">
<div class="row">
<div class="col-12">
<h5 class="d-flex align-items-center justify-content-center"><span class="col-auto">How long
until </span><span class="col-auto ms-2"><input id="year" type="number" min="0"
max="3000" step="1" value="2027" class="form-control d-inline" /></span>
</h5>
<h1 id="howLong" class="text-primary my-4">1 day</h1>
<div id="actions" class="btn-group" role="group">
<button type="button" class="btn btn-primary" data-type="millisecond">Milliseconds</button>
<button type="button" class="btn btn-secondary" data-type="second">Seconds</button>
<button type="button" class="btn btn-secondary" data-type="minute">Minutes</button>
<button type="button" class="btn btn-secondary" data-type="hour">Hours</button>
<button type="button" class="btn btn-secondary" data-type="day">Days</button>
<button type="button" class="btn btn-secondary" data-type="year">Years</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-4.0.0.min.js"
integrity="sha256-OaVG6prZf4v69dPg6PhVattBXkcOWQB62pdZ3ORyrao=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"
integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
crossorigin="anonymous"></script>
<script>
jQuery('#actions .btn').on('click', function () {
jQuery(this).siblings().removeClass('btn-primary').addClass('btn-secondary');
jQuery(this).addClass('btn-primary').removeClass('btn-secondary');
});
function updateDate(type) {
const now = new Date();
let target = new Date('01/01/2027');
target = target.setFullYear(jQuery('#year').val());
const diffTime = target - now;
let calc = 1;
let roundingType = 'floor';
switch (type) {
case 'second':
calc = 1000;
break;
case 'minute':
calc = 1000 * 60;
break;
case 'hour':
calc = 1000 * 60 * 60;
break;
case 'day':
calc = 1000 * 60 * 60 * 24;
roundingType = 'ceil';
break;
case 'year':
calc = 1000 * 60 * 60 * 24 * 365;
roundingType = 'round';
break;
}
let returnedValue = diffTime / calc;
switch (roundingType) {
case 'floor':
returnedValue = Math.floor(returnedValue);
break;
case 'ceil':
returnedValue = Math.ceil(returnedValue);
break;
case 'round':
returnedValue = returnedValue.toFixed(2);
break;
}
jQuery('#howLong').text(new Intl.NumberFormat("en-GB").format(returnedValue) + ' ' + type + (returnedValue != 1 ? 's' : ''));
}
setInterval(() => {
updateDate(jQuery('#actions .btn-primary').data('type'));
}, 1);
</script>
</body>
</html>