pincodegen.html 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <!DOCTYPE html><html lang="ru"><head><script>"use strict";
  2. const salt = "abcde";
  3. </script>
  4. <!--
  5. ЭЛЕКТРОННЫЙ ЖУРНАЛ «ШКАЛА»: ПОЛУЧЕНИЕ ПИН-КОДА ДЛЯ ВЫСТАВЛЕНИЯ
  6. ОТМЕТКИ ПОСЛЕ ДАТЫ ЗАПРЕТА НА РЕДАКТИРОВАНИЕ ОТМЕТОК
  7. Copyright © 2021, А.М.Гольдин. Modified BSD License
  8. -->
  9. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  10. <meta http-equiv="Cache-Control" content="no-cache">
  11. <link rel="stylesheet" type="text/css" href="style.css">
  12. <title>ЭЖ «Шкала»: Пин-код</title>
  13. <style>
  14. body {margin: 0px; padding: 10px 0px; font: 18px sans-serif;
  15. text-align: center; border-top: 30px solid #963;
  16. background: #f6f3f0;}
  17. h1, h3 {color:#963; margin:12pt 0px 6pt; font-size:1.3em;
  18. font-weight: normal;}
  19. h2 {color: #ff6; font: 18px sans-serif;
  20. position: absolute; top: -9px; left: 20px;}
  21. h3 {font-size:1.1em;}
  22. input[type="text"], button {display: block; margin: 20px auto;
  23. font-size: 120%;}
  24. input[type="number"], input[type="date"], select {font-size: 120%;}
  25. input[type="number"] {width: 3em;}
  26. button.inline {display: inline; margin: 0px; position: relative; top: -5px;}
  27. input[type="text"] {margin-top: 20px; padding: 5px; border: 1px solid #c60;
  28. border-radius: 3px;}
  29. output {display: inline-block; width: 4em; background: white;
  30. padding: 5px; border: 1px solid #c60; border-radius: 3px;
  31. font-size: 200%; color: red;}
  32. div {width: 100%; color: red; margin: 20px 0px;}
  33. </style>
  34. </head>
  35. <body>
  36. <h2>ЭЖ «ШКАЛА»</h2>
  37. <h1>ПИН-КОД ДЛЯ РЕДАКТИРОВАНИЯ ОТМЕТОК</h1>
  38. <input type="text" placeholder="Логин учителя" autofocus>
  39. <h3>Класс/группа</h3>
  40. <input type="number" min="1" max="99" value="8"><select></select>
  41. <h3>Дата, для которой нужно предоставить права редактирования</h3>
  42. <input type=date>
  43. <button type="button" onclick="getPwd()">Получить ПИН-код</button>
  44. <output>&nbsp;</output>
  45. <button class="inline" type="button" onclick="delPwd()">&#10060;</button>
  46. <div>ПИН-код действителен только сегодня!</div>
  47. <script>"use strict";
  48. const dqs = elem => document.querySelector(elem);
  49. const delPwd = () => dqs("output").innerHTML = "&nbsp;";
  50. const getPwd = () => {
  51. const dtf = d => d.toString().padStart(2, '0');
  52. let now = new Date(),
  53. dn = 'd'+now.getFullYear()+dtf(now.getMonth()+1)+dtf(now.getDate()),
  54. dq = dqs("input[type=date]").value,
  55. lg = dqs("input[type=text]").value.trim(),
  56. cl = dqs("input[type=number]").value + dqs("select").value,
  57. str = lg + cl + dn + dq;
  58. let pwd = '', s, h = 0;
  59. for (let j = 0; j < 4; j++) {
  60. s = salt + j + str;
  61. for (let i=0; i<s.length; i++) h = ((h << 5) - h) + s.charCodeAt(i);
  62. pwd += Math.abs(h) % 10;
  63. }
  64. dqs("output").innerHTML = pwd;
  65. }
  66. const liters = "АБВГДЕЖЗИКЛМНОПРСТУФХЦЧШЩЫЭЮЯ";
  67. for (let c of liters) dqs("select").innerHTML += `<option>${c}</option>`;
  68. </script>
  69. </body>
  70. </html>