Site more interactive

This commit is contained in:
dan63047 2020-07-03 15:53:13 +03:00
parent 04011aa9b9
commit ab54c476ea
3 changed files with 19 additions and 3 deletions

View File

@ -12,7 +12,7 @@
<body> <body>
<h1 id="title">До смерти 32-битных систем осталось</h1> <h1 id="title">До смерти 32-битных систем осталось</h1>
<div style="text-align: center;"><span id="time-left"></span><span id="time-left-msec"></span></div> <div style="text-align: center;"><span id="time-left" onclick="msecDisplaySwitcher()"></span><span id="time-left-msec"></span></div>
<p id="time-left-readable" onclick="ReadableTimerSwitcher()"></p> <p id="time-left-readable" onclick="ReadableTimerSwitcher()"></p>
<progress id="prog" max="2147483647"></progress> <progress id="prog" max="2147483647"></progress>
<div id="decsription"> <div id="decsription">

View File

@ -1,9 +1,20 @@
const maxtimestamp = 2147483647; const maxtimestamp = 2147483647;
var readable_timer_mode = 0; var readable_timer_mode = 0;
var msec_display = true;
function ReadableTimerSwitcher(){ function ReadableTimerSwitcher(){
readable_timer_mode++ readable_timer_mode++
if(readable_timer_mode > 1){readable_timer_mode = 0} if(readable_timer_mode > 2){readable_timer_mode = 0}
}
function msecDisplaySwitcher(){
if(msec_display){
msec_display = false
$("#time-left-msec").css("display", "none");
}else{
msec_display = true
$("#time-left-msec").css("display", "unset");
}
} }
function Cycle() { function Cycle() {
@ -15,7 +26,7 @@ function Cycle() {
$("#time-left-msec").html("." + ('00' + tmsec).slice(-3)); $("#time-left-msec").html("." + ('00' + tmsec).slice(-3));
$("#prog").val(timestamp); $("#prog").val(timestamp);
$("#timestamp").html(Math.trunc(timestamp).toLocaleString('ru')); $("#timestamp").html(Math.trunc(timestamp).toLocaleString('ru'));
if (left < 60) { $("#time-left-readable").css("display", "none") } if (left < 60 && readable_timer_mode != 2) { $("#time-left-readable").css("display", "none") }
if (left <= 0) { if (left <= 0) {
clearInterval(c); clearInterval(c);
$("#time-left").html("0"); $("#time-left").html("0");
@ -38,6 +49,10 @@ function Cycle() {
tyear = Math.floor(left / 60 / 60 / 24 / 365); tyear = Math.floor(left / 60 / 60 / 24 / 365);
$("#time-left-readable").html("(" + tyear + " л. " + tday + " дн. " + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")"); $("#time-left-readable").html("(" + tyear + " л. " + tday + " дн. " + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")");
break; break;
case 2:
var precentage = (timestamp/maxtimestamp)*100;
$("#time-left-readable").html(Math.trunc(timestamp).toLocaleString('ru')+" / "+maxtimestamp.toLocaleString('ru')+" ("+precentage.toFixed(8)+"%)");
break;
} }
} }
var c = setInterval(Cycle, 1000 / 60); var c = setInterval(Cycle, 1000 / 60);

View File

@ -8,6 +8,7 @@ body{
} }
#time-left{ #time-left{
font-size: 10em; font-size: 10em;
cursor: pointer;
} }
#time-left-readable{ #time-left-readable{
text-align: center; text-align: center;