dan63
/
Problem-2038-site
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

new info + .toLocaleString(), my beloved

This commit is contained in:
dan63047 2022-04-26 17:35:16 +03:00
parent d1fabef19b
commit 2c0d2cda99
5 changed files with 361 additions and 366 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -0,0 +1 @@
.vscode

132
fullscreen-style.css
View File

@ -1,67 +1,67 @@
@font-face{ @font-face{
font-family: '7Digital'; font-family: '7Digital';
src: url('Orloj.otf'); src: url('Orloj.otf');
font-weight: normal; font-weight: normal;
font-style: monospace; font-style: monospace;
} }
body{ body{
background-color: #000; background-color: #000;
color: #fff; color: #fff;
font-family: 'Heebo', sans-serif; font-family: 'Heebo', sans-serif;
height: 100vh; height: 100vh;
display: flex; display: flex;
flex-flow: column nowrap; flex-flow: column nowrap;
justify-content: center; justify-content: center;
margin: 0 8px; margin: 0 8px;
} }
#prog{ #prog{
width: 100%; width: 100%;
} }
#title_ru, #title_en{ #title_ru, #title_en{
position: fixed; position: fixed;
text-align: center; text-align: center;
top: 0; top: 0;
width: calc(100% - 16px); width: calc(100% - 16px);
} }
#time{ #time{
font-size: 12em; font-size: 12em;
width: calc(100% - 16px); width: calc(100% - 16px);
height: 100%; height: 100%;
font-family: '7Digital'; font-family: '7Digital';
display: flex; display: flex;
align-items: baseline; align-items: baseline;
align-content: center; align-content: center;
justify-content: center; justify-content: center;
overflow: auto; overflow: auto;
cursor: pointer; cursor: pointer;
} }
#time-left-msec{ #time-left-msec{
font-size: 4rem; font-size: 4rem;
} }
#time-left-readable{ #time-left-readable{
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
} }
#bar{ #bar{
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: calc(100% - 16px); width: calc(100% - 16px);
} }
#button-to-fullscreen, #button-fullscreen-exit{ #button-to-fullscreen, #button-fullscreen-exit{
transition: 500ms; transition: 500ms;
position: absolute; position: absolute;
left: 25px; left: 25px;
top: 35px; top: 35px;
cursor: pointer; cursor: pointer;
color: #333; color: #333;
z-index: 1; z-index: 1;
} }
#button-to-fullscreen:hover, #button-fullscreen-exit:hover{ #button-to-fullscreen:hover, #button-fullscreen-exit:hover{
color: #fff; color: #fff;
} }
#button-to-fullscreen, #description_ru, #description_en, footer, #language-selector, #other_countdowns{ #button-to-fullscreen, #description_ru, #description_en, footer, #language-selector, #other_countdowns{
display: none; display: none;
} }
#title{ #title{
text-align: center; text-align: center;
} }

206
index.html
View File

@ -1,104 +1,104 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Проблема 2038 года</title> <title>Проблема 2038 года</title>
<link href="https://fonts.googleapis.com/css?family=Heebo&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Heebo&display=swap" rel="stylesheet">
<link rel="shortcut icon" href="icon.png" type="image/x-icon"> <link rel="shortcut icon" href="icon.png" type="image/x-icon">
<link rel="stylesheet" id="style" type="text/css" href="style.css"> <link rel="stylesheet" id="style" type="text/css" href="style.css">
<meta name="theme-color" id="meta-color" content="#000000"> <meta name="theme-color" id="meta-color" content="#000000">
</head> </head>
<body> <body>
<div id="button-to-fullscreen" onclick="document.documentElement.requestFullscreen();"> <div id="button-to-fullscreen" onclick="document.documentElement.requestFullscreen();">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-arrows-fullscreen" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-arrows-fullscreen" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M1.464 10.536a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3.5a.5.5 0 0 1-.5-.5v-3.5a.5.5 0 0 1 .5-.5z"/> <path fill-rule="evenodd" d="M1.464 10.536a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3.5a.5.5 0 0 1-.5-.5v-3.5a.5.5 0 0 1 .5-.5z"/>
<path fill-rule="evenodd" d="M5.964 10a.5.5 0 0 1 0 .707l-4.146 4.147a.5.5 0 0 1-.707-.708L5.257 10a.5.5 0 0 1 .707 0zm8.854-8.854a.5.5 0 0 1 0 .708L10.672 6a.5.5 0 0 1-.708-.707l4.147-4.147a.5.5 0 0 1 .707 0z"/> <path fill-rule="evenodd" d="M5.964 10a.5.5 0 0 1 0 .707l-4.146 4.147a.5.5 0 0 1-.707-.708L5.257 10a.5.5 0 0 1 .707 0zm8.854-8.854a.5.5 0 0 1 0 .708L10.672 6a.5.5 0 0 1-.708-.707l4.147-4.147a.5.5 0 0 1 .707 0z"/>
<path fill-rule="evenodd" d="M10.5 1.5A.5.5 0 0 1 11 1h3.5a.5.5 0 0 1 .5.5V5a.5.5 0 0 1-1 0V2h-3a.5.5 0 0 1-.5-.5zm4 9a.5.5 0 0 0-.5.5v3h-3a.5.5 0 0 0 0 1h3.5a.5.5 0 0 0 .5-.5V11a.5.5 0 0 0-.5-.5z"/> <path fill-rule="evenodd" d="M10.5 1.5A.5.5 0 0 1 11 1h3.5a.5.5 0 0 1 .5.5V5a.5.5 0 0 1-1 0V2h-3a.5.5 0 0 1-.5-.5zm4 9a.5.5 0 0 0-.5.5v3h-3a.5.5 0 0 0 0 1h3.5a.5.5 0 0 0 .5-.5V11a.5.5 0 0 0-.5-.5z"/>
<path fill-rule="evenodd" d="M10 9.964a.5.5 0 0 0 0 .708l4.146 4.146a.5.5 0 0 0 .708-.707l-4.147-4.147a.5.5 0 0 0-.707 0zM1.182 1.146a.5.5 0 0 0 0 .708L5.328 6a.5.5 0 0 0 .708-.707L1.889 1.146a.5.5 0 0 0-.707 0z"/> <path fill-rule="evenodd" d="M10 9.964a.5.5 0 0 0 0 .708l4.146 4.146a.5.5 0 0 0 .708-.707l-4.147-4.147a.5.5 0 0 0-.707 0zM1.182 1.146a.5.5 0 0 0 0 .708L5.328 6a.5.5 0 0 0 .708-.707L1.889 1.146a.5.5 0 0 0-.707 0z"/>
<path fill-rule="evenodd" d="M5.5 1.5A.5.5 0 0 0 5 1H1.5a.5.5 0 0 0-.5.5V5a.5.5 0 0 0 1 0V2h3a.5.5 0 0 0 .5-.5z"/> <path fill-rule="evenodd" d="M5.5 1.5A.5.5 0 0 0 5 1H1.5a.5.5 0 0 0-.5.5V5a.5.5 0 0 0 1 0V2h3a.5.5 0 0 0 .5-.5z"/>
</svg> </svg>
</div> </div>
<div id="button-fullscreen-exit" onclick="document.exitFullscreen();"> <div id="button-fullscreen-exit" onclick="document.exitFullscreen();">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-fullscreen-exit" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-fullscreen-exit" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M5.5 0a.5.5 0 0 1 .5.5v4A1.5 1.5 0 0 1 4.5 6h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5zm5 0a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 10 4.5v-4a.5.5 0 0 1 .5-.5zM0 10.5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 6 11.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5zm10 1a1.5 1.5 0 0 1 1.5-1.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0v-4z"/> <path fill-rule="evenodd" d="M5.5 0a.5.5 0 0 1 .5.5v4A1.5 1.5 0 0 1 4.5 6h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5zm5 0a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 10 4.5v-4a.5.5 0 0 1 .5-.5zM0 10.5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 6 11.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5zm10 1a1.5 1.5 0 0 1 1.5-1.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0v-4z"/>
</svg> </svg>
</div> </div>
<div id="language-selector"><span id="lang-name">language:</span><a id="rus" onclick="languageSwitcher('ru')">ru</a><a id="eng" onclick="languageSwitcher('en')">en</a></div> <div id="language-selector"><span id="lang-name">language:</span><a id="rus" onclick="languageSwitcher('ru')">ru</a><a id="eng" onclick="languageSwitcher('en')">en</a></div>
<div id="counter"> <div id="counter">
<h1 id="title_ru">До смерти 32-битных систем осталось</h1> <h1 id="title_ru">До смерти 32-битных систем осталось</h1>
<h1 id="title_en">Until the death of 32-bit systems remaining</h1> <h1 id="title_en">Until the death of 32-bit systems remaining</h1>
<div id="time"><span id="time-left" onclick="msecDisplaySwitcher()"></span><span id="time-left-msec"></span></div> <div id="time"><span id="time-left" onclick="msecDisplaySwitcher()"></span><span id="time-left-msec"></span></div>
<div id="bar"> <div id="bar">
<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> </div>
</div> </div>
<div id="description_ru"> <div id="description_ru">
<h3>О чём этот сайт?</h3> <h3>О чём этот сайт?</h3>
<p>Проблема 2038 года в вычислительной технике — ожидаемые сбои в программном обеспечении накануне 19 января 2038 года. Данная проблема затронет программы и системы, в которых используется представление времени по <p>Проблема 2038 года в вычислительной технике — ожидаемые сбои в программном обеспечении накануне 19 января 2038 года. Данная проблема затронет программы и системы, в которых используется представление времени по
стандарту POSIX (UNIX-время), которое представляет собой количество секунд, прошедшее с полуночи 1 января 1970 года. Такое представление времени — это стандарт для Unix-подобных операционных систем (из-за повсеместного использования языка Си).</p> стандарту POSIX (UNIX-время), которое представляет собой количество секунд, прошедшее с полуночи 1 января 1970 года. Такое представление времени — это стандарт для Unix-подобных операционных систем (из-за повсеместного использования языка Си).</p>
<p>Сейчас значение Unix timestamp равно <span id="timestamp_ru"></span>.</p> <p>Сейчас значение Unix timestamp равно <span id="timestamp_ru"></span>.</p>
<h3>В чём проблема?</h3> <h3>В чём проблема?</h3>
<p>В старых 32-битных системах (до середины 1990-х) используется тип данных <code>time_t</code> для хранения секунд в виде <code>signed int</code> (32-битного целого со знаком). Самая поздняя дата, которая может быть представлена таким форматом в стандарте POSIX — это 03:14:07, вторник, 19 января 2038 года по Всемирному времени (UTC).</p> <p>В старых 32-битных системах (до середины 1990-х) используется тип данных <code>time_t</code> для хранения секунд в виде <code>signed int</code> (32-битного целого со знаком). Самая поздняя дата, которая может быть представлена таким форматом в стандарте POSIX — это 03:14:07, вторник, 19 января 2038 года по Всемирному времени (UTC).</p>
<p>Более позднее время заставит такое поле данных стать отрицательным, как бы закольцевав таким образом время (поскольку отрицательное число может быть воспринято программами как время в 1970 или 1901 году, в зависимости от реализации). В результате любые расчёты, включающие дату позже 19 января 2038 года, могут привести к сбою программы либо к ошибочным вычислениям.</p> <p>Более позднее время заставит такое поле данных стать отрицательным, как бы закольцевав таким образом время (поскольку отрицательное число может быть воспринято программами как время в 1970 или 1901 году, в зависимости от реализации). В результате любые расчёты, включающие дату позже 19 января 2038 года, могут привести к сбою программы либо к ошибочным вычислениям.</p>
<p>Для проблемы 2038 года не существует простого решения для существующих комбинаций операционных систем и прикладного программного обеспечения. Изменение определения типа time_t на 64 бита нарушит бинарную совместимость программ, существующих хранимых данных и всего другого, использующего представление времени в бинарном виде. А приведение time_t в целое без знака может нарушить работу программ, которые вычисляют разницу во времени.</p> <p>Для проблемы 2038 года не существует простого решения для существующих комбинаций операционных систем и прикладного программного обеспечения. Изменение определения типа time_t на 64 бита нарушит бинарную совместимость программ, существующих хранимых данных и всего другого, использующего представление времени в бинарном виде. А приведение time_t в целое без знака может нарушить работу программ, которые вычисляют разницу во времени.</p>
<h3>Что подвержено этой проблеме?</h3> <h3>Что подвержено этой проблеме?</h3>
<p>Многие структуры данных, которые используются сегодня, имеют 32-битные представления времени, встроенные в их структуру. Полный список этих структур данных практически невозможно составить, но есть хорошо известные структуры данных, у которых есть проблема времени Unix:</p> <p>Многие структуры данных, которые используются сегодня, имеют 32-битные представления времени, встроенные в их структуру. Полный список этих структур данных практически невозможно составить, но есть хорошо известные структуры данных, у которых есть проблема времени Unix:</p>
<ul> <ul>
<li>файловые системы (многие файловые системы используют только 32 бита для представления времени в индексных дескрипторах)</li> <li>файловые системы (многие файловые системы используют только 32 бита для представления времени в индексных дескрипторах)</li>
<li>форматы двоичных файлов (в которых используются 32-битные поля времени)</li> <li>форматы двоичных файлов (в которых используются 32-битные поля времени)</li>
<li>базы данных (которые имеют 32-битные поля времени)</li> <li>базы данных (которые имеют 32-битные поля времени)</li>
<li>языки запросов к базам данных, такие как SQL, которые имеют команды, похожие на <code>UNIX_TIMESTAMP()</code></li> <li>языки запросов к базам данных, такие как SQL, которые имеют команды, похожие на <code>UNIX_TIMESTAMP()</code></li>
</ul> </ul>
<p>Примеры систем, использующих структуры данных, которые могут содержать 32-битные представления времени, включают:</p> <p>Примеры систем, использующих структуры данных, которые могут содержать 32-битные представления времени, включают:</p>
<ul> <ul>
<li>встроенные подсистемы управления и мониторинга завода, НПЗ</li> <li>встроенные подсистемы управления и мониторинга завода, НПЗ</li>
<li>различное медицинское, военное оборудование</li> <li>различное медицинское, военное оборудование</li>
</ul> </ul>
<p>Любая система, использующая структуры данных, содержащие 32-битные представления времени, представляет риск. Степень риска зависит от характера отказа.</p> <p>Любая система, использующая структуры данных, содержащие 32-битные представления времени, представляет риск. Степень риска зависит от характера отказа.</p>
<h3>Использованные материалы при составлении этого текста</h3> <h3>Использованные материалы при составлении этого текста</h3>
<ul> <ul>
<li><a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B1%D0%BB%D0%B5%D0%BC%D0%B0_2038_%D0%B3%D0%BE%D0%B4%D0%B0">Проблема 2038 года - Wikipedia RU</a></li> <li><a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B1%D0%BB%D0%B5%D0%BC%D0%B0_2038_%D0%B3%D0%BE%D0%B4%D0%B0">Проблема 2038 года - Wikipedia RU</a></li>
<li><a href="https://en.wikipedia.org/wiki/Year_2038_problem">Year 2038 problem - Wikipedia EN</a></li> <li><a href="https://en.wikipedia.org/wiki/Year_2038_problem">Year 2038 problem - Wikipedia EN</a></li>
</ul> </ul>
</div> </div>
<div id="description_en"> <div id="description_en">
<h3>What is this site?</h3> <h3>What is this site?</h3>
<p>The Year 2038 problem in computing technology - expected failures in software on the eve of January 19, 2038. This problem will affect the programs and systems that use the presentation view according to the POSIX standard (UNIX-time), which is the number of seconds passed from midnight on January 1, 1970. Such a presentation of time is a standard for UNIX-like operating systems (due to the ubiquitous use of the C language).</p> <p>The Year 2038 problem in computing technology - expected failures in software on the eve of January 19, 2038. This problem will affect the programs and systems that use the presentation view according to the POSIX standard (UNIX-time), which is the number of seconds passed from midnight on January 1, 1970. Such a presentation of time is a standard for UNIX-like operating systems (due to the ubiquitous use of the C language).</p>
<p>Now the UNIX timestamp value is <span id="timestamp_en"></span>.</p> <p>Now the UNIX timestamp value is <span id="timestamp_en"></span>.</p>
<h3>What is the problem?</h3> <h3>What is the problem?</h3>
<p>In the old 32-bit systems (until the mid-1990s), the <code>time_t</code> data type is used to store seconds in the form of <code>signed int</code> (32-bit integer with the sign). The most late date, which can be represented by this format in POSIX Standard - is 03:14:07, Tuesday, January 19, 2038 for World Time (UTC).</p> <p>In the old 32-bit systems (until the mid-1990s), the <code>time_t</code> data type is used to store seconds in the form of <code>signed int</code> (32-bit integer with the sign). The most late date, which can be represented by this format in POSIX Standard - is 03:14:07, Tuesday, January 19, 2038 for World Time (UTC).</p>
<p>Later time will cause such a field to become negative, as if looping the time in this way (since a negative number can be interpreted by programs as time in 1970 or 1901, depending on the implementation). As a result, any calculations that include a date later than January 19, 2038 may cause the program to crash or cause erroneous calculations.</p> <p>Later time will cause such a field to become negative, as if looping the time in this way (since a negative number can be interpreted by programs as time in 1970 or 1901, depending on the implementation). As a result, any calculations that include a date later than January 19, 2038 may cause the program to crash or cause erroneous calculations.</p>
<p>For the year 2038 problem, there is no universal solution for existing combinations of operating systems and application software. Changing the definition of the <code>time_t</code> type to 64 bits will break the binary compatibility of programs, existing stored data, and anything else that uses a binary representation of time. And casting <code>time_t</code> to an unsigned integer can break programs that compute the time difference.</p> <p>For the year 2038 problem, there is no universal solution for existing combinations of operating systems and application software. Changing the definition of the <code>time_t</code> type to 64 bits will break the binary compatibility of programs, existing stored data, and anything else that uses a binary representation of time. And casting <code>time_t</code> to an unsigned integer can break programs that compute the time difference.</p>
<h3>What is affected by this problem?</h3> <h3>What is affected by this problem?</h3>
<p>Many data structures that are used today have 32-bit time presentations built into their structure. The complete list of these data structures is almost impossible to compile, but there are well-known data structures that have a UNIX time problem:</p> <p>Many data structures that are used today have 32-bit time presentations built into their structure. The complete list of these data structures is almost impossible to compile, but there are well-known data structures that have a UNIX time problem:</p>
<ul> <ul>
<li>file Systems (Many file systems use only 32 bits to submit time in index descriptors)</li> <li>file Systems (Many file systems use only 32 bits to submit time in index descriptors)</li>
<li>binary file formats (in which 32-bit time are used)</li> <li>binary file formats (in which 32-bit time are used)</li>
<li>databases (which have 32-bit time fields)</li> <li>databases (which have 32-bit time fields)</li>
<li>languages requests for databases, such as SQL, which have commands similar to <code>UNIX_TIMESTAMP()</code></li> <li>languages requests for databases, such as SQL, which have commands similar to <code>UNIX_TIMESTAMP()</code></li>
</ul> </ul>
<p>Examples of systems using data structures that may contain 32-bit presentations of the time include:</p> <p>Examples of systems using data structures that may contain 32-bit presentations of the time include:</p>
<ul> <ul>
<li>embedded management and monitoring subsystems, refinery</li> <li>embedded management and monitoring subsystems, refinery</li>
<li>various medical, military equipment</li> <li>various medical, military equipment</li>
</ul> </ul>
<p>Any system that uses data structures containing 32-bit time represents the risk. The degree of risk depends on the nature of the failure.</p> <p>Any system that uses data structures containing 32-bit time represents the risk. The degree of risk depends on the nature of the failure.</p>
<h3>Used materials when compiling this text</h3> <h3>Used materials when compiling this text</h3>
<ul> <ul>
<li><a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B1%D0%BB%D0%B5%D0%BC%D0%B0_2038_%D0%B3%D0%BE%D0%B4%D0%B0">Проблема 2038 года - Wikipedia RU</a></li> <li><a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B1%D0%BB%D0%B5%D0%BC%D0%B0_2038_%D0%B3%D0%BE%D0%B4%D0%B0">Проблема 2038 года - Wikipedia RU</a></li>
<li><a href="https://en.wikipedia.org/wiki/Year_2038_problem">Year 2038 problem - Wikipedia EN</a></li> <li><a href="https://en.wikipedia.org/wiki/Year_2038_problem">Year 2038 problem - Wikipedia EN</a></li>
</ul> </ul>
</div> </div>
<div id="other_countdowns"></div> <div id="other_countdowns"></div>
<footer> <footer>
<hr> <hr>
<p><span id="me_tg_ru">Автор сайта: </span><span id="me_tg_en" style="display: none;">Author of the site: </span><a href="https://t.me/dan63047">dan63047</a></p> <p><span id="me_tg_ru">Автор сайта: </span><span id="me_tg_en" style="display: none;">Author of the site: </span><a href="https://t.me/dan63047">dan63047</a></p>
</footer> </footer>
<script type="text/javascript" src="jquery-3.4.1.min.js"></script> <script type="text/javascript" src="jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="script.js"></script> <script type="text/javascript" src="script.js"></script>
</body> </body>
</html> </html>

240
script.js
View File

@ -1,124 +1,118 @@
const maxtimestamp = 2147483647; const maxtimestamp = 2147483647;
var readable_timer_mode = 0; var readable_timer_mode = 0;
var msec_display = true; var msec_display = true;
var fullscreen = false; var fullscreen = false;
var other_counters = [ var other_counters = [ // Title EN, Title RU, Start Unix timestamp, End Unix timestamp, Description EN, Description RU
["UNIX unsinged 32-bit timestamp", "UNIX 32 бита без знака", 0, 4294967295], ["UNIX unsinged 32-bit timestamp", "UNIX 32 бита без знака", 0n, 4294967295n, "Developers of some systems have thought that singed 32-bit may not be enough and decided to use unsinged 32-bit.", "Разработчики некоторых систем додумались, что 32 бита со знаком однажды может не хватить и решили использовать 32 бита без знака."],
["FAT filesystems timestamps", "Штампы времени файловой системы FAT", 351907200, 4354819200], ["FAT filesystems timestamps", "Штампы времени файловой системы FAT", 315532800n, 4354819200n, "", "На каждую отметку времени отводится четыре байта: два - на дату и два - на время. Год хранится в формате количества лет от начала эпохи Microsoft. Отсюда и диапазон - от 1980 до 2107 года"],
["ext4 filesystems timestamps", "Штампы времени файловой системы ext4", -2147470217, 17176838400], ["ext4 filesystems timestamps", "Штампы времени файловой системы ext4", -2147472000n, 17176838400n, "", ""],
["NTFS filesystems timestamps", "Штампы времени файловой системы NTFS", -11644473600, 1833029913600], ["NTFS filesystems timestamps", "Штампы времени файловой системы NTFS", -11644473600n, 1833029913600n, "File times are 64-bit numbers counting 100-nanosecond intervals (ten million per second) since 1601, which is 58,000+ years", "Для хранения даты и времени отведено 64 бита; шаг — 100 наносекунд (десять миллионов интервалов в секунду). Это позволяет указать дату и время в промежутке из 58 тысяч лет."],
// ["Year 32,768 bug", "Проблема 32 768 года", -62167219200, 971890963200], // ["Year 32,768 bug", "Проблема 32 768 года", -62167219200, 971890963200, "", ""],
// ["Year 65,536 bug", "Проблема 65 536 года", -62167219200, 2005949145600], // ["Year 65,536 bug", "Проблема 65 536 года", -62167219200, 2005949145600, "", ""],
["UNIX singed 64-bit timestamp", "UNIX 64 бита со знаком", 0, 9223372036854775807], ["UNIX singed 64-bit timestamp", "UNIX 64 бита со знаком", 0n, 9223372036854775807n, "Proposed as a solution to problem 2038 and turns it into problem 292277026596 because the extreme time that can be represented by this format is December 4, 292,277,026,596, 15:30:08 UTC.", "Предлагается в качестве решения проблемы 2038 и превращает её в проблему 292277026596 года, потому что крайнее время, которое может быть представлено данным форматом - 4 Декабря 292 277 026 596 года, 15:30:08 UTC."],
["UNIX unsinged 64-bit timestamp", "UNIX 64 бита без знака", 0, 18446744073709551615], ["UNIX unsinged 64-bit timestamp", "UNIX 64 бита без знака", 0n, 18446744073709551615n, "Humanity will never get to that point, don't worry", "Человечество никогда не доживёт до этого момента, не волнуйтесь"],
]; ];
var language_user = window.navigator ? (window.navigator.language || var language_user = window.navigator ? (window.navigator.language ||
window.navigator.systemLanguage || window.navigator.systemLanguage ||
window.navigator.userLanguage) : "ru"; window.navigator.userLanguage) : "ru";
language_user = language_user.substr(0, 2).toLowerCase(); language_user = language_user.substr(0, 2).toLowerCase();
language_site = (language_user == "ru" || language_user == "by" || language_user == "ua") ? "ru" : "en"; language_site = (language_user == "ru" || language_user == "by" || language_user == "ua") ? "ru" : "en";
function ReadableTimerSwitcher(){ function ReadableTimerSwitcher(){
readable_timer_mode++ readable_timer_mode++
if(readable_timer_mode > 2){readable_timer_mode = 0} if(readable_timer_mode > 2){readable_timer_mode = 0}
} }
addEventListener("fullscreenchange", (event) => { addEventListener("fullscreenchange", (event) => {
if(!fullscreen){ if(!fullscreen){
$("#style").attr("href", "fullscreen-style.css"); $("#style").attr("href", "fullscreen-style.css");
$("#description_en").css("display", "none"); $("#description_en").css("display", "none");
$("#description_ru").css("display", "none"); $("#description_ru").css("display", "none");
fullscreen = true; fullscreen = true;
}else{ }else{
$("#style").attr("href", "style.css"); $("#style").attr("href", "style.css");
languageSwitcher(language_site) languageSwitcher(language_site)
fullscreen = false; fullscreen = false;
} }
}) })
function languageSwitcher(lang_code){ function languageSwitcher(lang_code){
switch (lang_code) { switch (lang_code) {
case "ru": case "ru":
$("#title_en").css("display", "none"); $("#title_en").css("display", "none");
$("#title_ru").css("display", "block"); $("#title_ru").css("display", "block");
$("#description_en").css("display", "none"); $("#description_en").css("display", "none");
$("#description_ru").css("display", "block"); $("#description_ru").css("display", "block");
$("#me_tg_en").css("display", "none"); $("#me_tg_en").css("display", "none");
$("#me_tg_ru").css("display", ""); $("#me_tg_ru").css("display", "");
language_site = "ru"; language_site = "ru";
break; break;
case "en": case "en":
$("#title_ru").css("display", "none"); $("#title_ru").css("display", "none");
$("#title_en").css("display", "block"); $("#title_en").css("display", "block");
$("#description_ru").css("display", "none"); $("#description_ru").css("display", "none");
$("#description_en").css("display", "block"); $("#description_en").css("display", "block");
$("#me_tg_ru").css("display", "none"); $("#me_tg_ru").css("display", "none");
$("#me_tg_en").css("display", ""); $("#me_tg_en").css("display", "");
language_site = "en"; language_site = "en";
break; break;
} }
} }
languageSwitcher(language_site); languageSwitcher(language_site);
function msecDisplaySwitcher(){ function msecDisplaySwitcher(){
if(msec_display){ if(msec_display){
msec_display = false msec_display = false
$("#time-left-msec").css("display", "none"); $("#time-left-msec").css("display", "none");
}else{ }else{
msec_display = true msec_display = true
$("#time-left-msec").css("display", "unset"); $("#time-left-msec").css("display", "unset");
} }
} }
function Cycle() { function Cycle() {
var timestamp = Date.now() / 1000, var timestamp = Date.now() / 1000,
left = maxtimestamp - timestamp, left = maxtimestamp - timestamp,
lmsec = Math.floor(left * 1000) % 1000, lmsec = Math.floor(left * 1000) % 1000,
t = Math.floor(left); t = Math.floor(left);
$("#time-left").html(t.toLocaleString('ru')); $("#time-left").html(t.toLocaleString(language_site));
$("#time-left-msec").html("." + ("00" + lmsec).slice(-3)) $("#time-left-msec").html("." + ("00" + lmsec).slice(-3))
$("#prog").val(timestamp); $("#prog").val(timestamp);
$("#timestamp_ru").html(Math.trunc(timestamp).toLocaleString('ru')); $("#timestamp_ru").html(Math.trunc(timestamp).toLocaleString(language_site));
$("#timestamp_en").html(Math.trunc(timestamp).toLocaleString('ru')); $("#timestamp_en").html(Math.trunc(timestamp).toLocaleString(language_site));
if (left < 60 && readable_timer_mode != 2) { $("#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");
$("#time-left-msec").html("000") $("#time-left-msec").html("000")
$("#title").html("С͓̪̩̳͕͍̄ͮͤ̚̚м̦͎͉̝̋̄е̥͕̫̫̱̱͓̞̾р̞̤̰͖̤̟̫͓̏̍͒ͣ͐͂̚ͅт̗̥̲̩̣̯̹̅ͅь̙͍̟̟̮̩̦̹ͩͤ"); $("#title").html("С͓̪̩̳͕͍̄ͮͤ̚̚м̦͎͉̝̋̄е̥͕̫̫̱̱͓̞̾р̞̤̰͖̤̟̫͓̏̍͒ͣ͐͂̚ͅт̗̥̲̩̣̯̹̅ͅь̙͍̟̟̮̩̦̹ͩͤ");
} }
switch (readable_timer_mode){ switch (readable_timer_mode){
case 0: case 0:
var tsec = Math.floor(left % 60), var tsec = Math.floor(left % 60),
tmin = Math.floor(left / 60) % 60, tmin = Math.floor(left / 60) % 60,
thour = Math.floor(left / 60 / 60) % 24, thour = Math.floor(left / 60 / 60) % 24,
tday = Math.floor(left / 60 / 60 / 24); tday = Math.floor(left / 60 / 60 / 24);
$("#time-left-readable").html("(" + tday + ":" + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")"); $("#time-left-readable").html("(" + tday + ":" + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")");
break; break;
case 1: case 1:
var tsec = Math.floor(left % 60), var tsec = Math.floor(left % 60),
tmin = Math.floor(left / 60) % 60, tmin = Math.floor(left / 60) % 60,
thour = Math.floor(left / 60 / 60) % 24, thour = Math.floor(left / 60 / 60) % 24,
tday = Math.floor(left / 60 / 60 / 24) % 365, tday = Math.floor(left / 60 / 60 / 24) % 365,
tyear = Math.floor(left / 60 / 60 / 24 / 365); tyear = Math.floor(left / 60 / 60 / 24 / 365);
switch (language_site) { $("#time-left-readable").html("(" + tyear.toLocaleString(language_site, {style: "unit", unit: "year"}) + " " + tday.toLocaleString(language_site, {style: "unit", unit: "day"}) + " " + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")");
case "ru": break;
$("#time-left-readable").html("(" + tyear + " л. " + tday + " дн. " + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")"); case 2:
break; $("#time-left-readable").html(Math.trunc(timestamp).toLocaleString(language_site)+" / "+maxtimestamp.toLocaleString(language_site)+" ("+(timestamp/maxtimestamp).toLocaleString(language_site, {style: "percent", minimumFractionDigits: 8})+")");
case "en": break;
$("#time-left-readable").html("(" + tyear + " y. " + tday + " d. " + ("0" + thour).slice(-2) + ":" + ("0" + tmin).slice(-2) + ":" + ("0" + tsec).slice(-2) + ")"); }
break; let other_counters_html = (language_site == "ru") ? "<h3>Другие, более далёкие проблемы времени в вычислительной технике</h3>" : "<h3>Other, more distant time problems in computing</h3>";
} other_counters.forEach(element => {
break; l = element[3] - BigInt(Math.trunc(timestamp));
case 2: other_counters_html = other_counters_html + '<div id="other_counter"><h4>'+ element[(language_site == "ru") ? 1 : 0] + '</h4><span style="font-size: 2rem; font-family: \'7Digital\'">'
var precentage = (timestamp/maxtimestamp)*100; + l.toLocaleString(language_site) + '</span><div class="othr_progress" style="float: right">' // second argument: {notation: "compact", compactDisplay: "long", style: "unit", unit: "second", unitDisplay: 'long'}
$("#time-left-readable").html(Math.trunc(timestamp).toLocaleString('ru')+" / "+maxtimestamp.toLocaleString('ru')+" ("+precentage.toFixed(8)+"%)"); + ((timestamp-parseInt(element[2]))/(parseInt(element[3])-parseInt(element[2]))).toLocaleString(language_site, {style: "percent", minimumFractionDigits: 8})
break; + " · " + new Date(parseInt(element[2])*1000).toUTCString() + " - " + new Date(parseInt(element[3])*1000).toUTCString()
} + ' · ' + (l / 60n / 60n / 24n / 365n).toLocaleString(language_site, {style: "unit", unit: "year"}) + ' ' + (l / 60n / 60n / 24n % 365n).toLocaleString(language_site, {style: "unit", unit: "day"}) + ' ' + ("0" + (l / 60n / 60n % 24n)).slice(-2) + ':' + ("0" + (l / 60n % 60n)).slice(-2) + ':' + ("0" + (l % 60n)).slice(-2)
let other_counters_html = (language_site == "ru") ? "<h3>Другие, более далёкие проблемы времени в вычислительной технике</h3>" : "<h3>Other, more distant time problems in computing</h3>"; + '</div><p>' + element[(language_site == "ru") ? 5 : 4] + '</p></div>';
other_counters.forEach(element => { });
l = element[3] - timestamp; $("#other_countdowns").html(other_counters_html)
other_counters_html = other_counters_html + '<div id="other_counter"><h4>'+ element[(language_site == "ru") ? 1 : 0] + '</h4><span style="font-size: 2rem; font-family: \'7Digital\'">' + Math.trunc(l).toLocaleString('ru') + }
'</span><div class="othr_progress" style="float: right">' + new Date(element[3]*1000).toUTCString() + " · " +(((timestamp-element[2])/(element[3]-element[2]))*100).toFixed(8).toString() +
'% · ' + Math.floor(l / 60 / 60 / 24 / 365).toLocaleString('ru') + ((language_site == "ru") ? " л. " : " y. ") + (Math.floor(l / 60 / 60 / 24) % 365).toString() + ((language_site == "ru") ? " дн. " : " d. ") +
("0" + (Math.floor(l / 60 / 60) % 24)).slice(-2) + ':' + ("0" + (Math.floor(l / 60) % 60)).slice(-2) + ':' + ("0" + (Math.floor(l) % 60)).slice(-2) + '</div>' + '</div>';
});
$("#other_countdowns").html(other_counters_html)
}
var c = setInterval(Cycle, 1000 / 15); var c = setInterval(Cycle, 1000 / 15);

148
style.css
View File

@ -1,75 +1,75 @@
@font-face{ @font-face{
font-family: '7Digital'; font-family: '7Digital';
src: url('Orloj.otf'); src: url('Orloj.otf');
font-weight: normal; font-weight: normal;
font-style: monospace; font-style: monospace;
} }
body{ body{
background-color: #000; background-color: #000;
color: #fff; color: #fff;
font-family: 'Heebo', sans-serif; font-family: 'Heebo', sans-serif;
} }
#prog{ #prog{
width: 100%; width: 100%;
} }
#time{ #time{
text-align: center; text-align: center;
font-size: 10em; font-size: 10em;
font-family: '7Digital'; font-family: '7Digital';
cursor: pointer; cursor: pointer;
} }
#time-left-msec{ #time-left-msec{
font-size: 2rem; font-size: 2rem;
} }
#time-left-readable{ #time-left-readable{
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
} }
#button-to-fullscreen, #button-fullscreen-exit{ #button-to-fullscreen, #button-fullscreen-exit{
transition: 500ms; transition: 500ms;
position: absolute; position: absolute;
left: 25px; left: 25px;
top: 35px; top: 35px;
cursor: pointer; cursor: pointer;
color: #333; color: #333;
} }
#button-to-fullscreen:hover, #button-fullscreen-exit:hover{ #button-to-fullscreen:hover, #button-fullscreen-exit:hover{
color: #fff; color: #fff;
} }
#button-fullscreen-exit, #title_en, #description_en{ #button-fullscreen-exit, #title_en, #description_en{
display: none; display: none;
} }
#title_ru, #title_en{ #title_ru, #title_en{
text-align: center; text-align: center;
} }
a{ a{
transition: 500ms; transition: 500ms;
color: #333; color: #333;
text-decoration: none; text-decoration: none;
} }
a:hover{ a:hover{
color: #fff; color: #fff;
} }
a:visited{ a:visited{
color: #999; color: #999;
} }
a:visited:hover{ a:visited:hover{
color: #fff; color: #fff;
} }
#language-selector{ #language-selector{
position: absolute; position: absolute;
right: 25px; right: 25px;
top: 35px; top: 35px;
color: #333; color: #333;
} }
#lang-name, #rus{ #lang-name, #rus{
padding-right: 7px; padding-right: 7px;
} }
#rus, #eng{ #rus, #eng{
transition: 500ms; transition: 500ms;
} }
#rus:hover, #eng:hover{ #rus:hover, #eng:hover{
cursor: pointer; cursor: pointer;
color: #fff; color: #fff;
} }