25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.
 
 

374 satır
9.5 KiB

  1. <html>
  2. <head>
  3. <title>Operative Name Generator</title>
  4. <style>
  5. @font-face {
  6. font-family: "PxPlus VGA SquarePx";
  7. src: url("resources/PxPlus_VGA_SquarePx.woff2");
  8. }
  9. @keyframes flicker {
  10. 0% {
  11. opacity: 0.27861;
  12. }
  13. 5% {
  14. opacity: 0.34769;
  15. }
  16. 10% {
  17. opacity: 0.23604;
  18. }
  19. 15% {
  20. opacity: 0.90626;
  21. }
  22. 20% {
  23. opacity: 0.18128;
  24. }
  25. 25% {
  26. opacity: 0.83891;
  27. }
  28. 30% {
  29. opacity: 0.65583;
  30. }
  31. 35% {
  32. opacity: 0.67807;
  33. }
  34. 40% {
  35. opacity: 0.26559;
  36. }
  37. 45% {
  38. opacity: 0.84693;
  39. }
  40. 50% {
  41. opacity: 0.96019;
  42. }
  43. 55% {
  44. opacity: 0.08594;
  45. }
  46. 60% {
  47. opacity: 0.20313;
  48. }
  49. 65% {
  50. opacity: 0.71988;
  51. }
  52. 70% {
  53. opacity: 0.53455;
  54. }
  55. 75% {
  56. opacity: 0.37288;
  57. }
  58. 80% {
  59. opacity: 0.71428;
  60. }
  61. 85% {
  62. opacity: 0.70419;
  63. }
  64. 90% {
  65. opacity: 0.7003;
  66. }
  67. 95% {
  68. opacity: 0.36108;
  69. }
  70. 100% {
  71. opacity: 0.24387;
  72. }
  73. }
  74. // color separation
  75. @keyframes textShadow {
  76. 0% {
  77. text-shadow: 0.4389924193300848px 0 1px rgba(0,30,255,0.5), -0.4389924193300848px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  78. }
  79. 5% {
  80. text-shadow: 2.7928974010788217px 0 1px rgba(0,30,255,0.5), -2.7928974010788217px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  81. }
  82. 10% {
  83. text-shadow: 0.02956275843481219px 0 1px rgba(0,30,255,0.5), -0.02956275843481219px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  84. }
  85. 15% {
  86. text-shadow: 0.40218538552878136px 0 1px rgba(0,30,255,0.5), -0.40218538552878136px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  87. }
  88. 20% {
  89. text-shadow: 3.4794037899852017px 0 1px rgba(0,30,255,0.5), -3.4794037899852017px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  90. }
  91. 25% {
  92. text-shadow: 1.6125630401149584px 0 1px rgba(0,30,255,0.5), -1.6125630401149584px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  93. }
  94. 30% {
  95. text-shadow: 0.7015590085143956px 0 1px rgba(0,30,255,0.5), -0.7015590085143956px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  96. }
  97. 35% {
  98. text-shadow: 3.896914047650351px 0 1px rgba(0,30,255,0.5), -3.896914047650351px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  99. }
  100. 40% {
  101. text-shadow: 3.870905614848819px 0 1px rgba(0,30,255,0.5), -3.870905614848819px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  102. }
  103. 45% {
  104. text-shadow: 2.231056963361899px 0 1px rgba(0,30,255,0.5), -2.231056963361899px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  105. }
  106. 50% {
  107. text-shadow: 0.08084290417898504px 0 1px rgba(0,30,255,0.5), -0.08084290417898504px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  108. }
  109. 55% {
  110. text-shadow: 2.3758461067427543px 0 1px rgba(0,30,255,0.5), -2.3758461067427543px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  111. }
  112. 60% {
  113. text-shadow: 2.202193051050636px 0 1px rgba(0,30,255,0.5), -2.202193051050636px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  114. }
  115. 65% {
  116. text-shadow: 2.8638780614874975px 0 1px rgba(0,30,255,0.5), -2.8638780614874975px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  117. }
  118. 70% {
  119. text-shadow: 0.48874025155497314px 0 1px rgba(0,30,255,0.5), -0.48874025155497314px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  120. }
  121. 75% {
  122. text-shadow: 1.8948491305757957px 0 1px rgba(0,30,255,0.5), -1.8948491305757957px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  123. }
  124. 80% {
  125. text-shadow: 0.0833037308038857px 0 1px rgba(0,30,255,0.5), -0.0833037308038857px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  126. }
  127. 85% {
  128. text-shadow: 0.09769827255241735px 0 1px rgba(0,30,255,0.5), -0.09769827255241735px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  129. }
  130. 90% {
  131. text-shadow: 3.443339761481782px 0 1px rgba(0,30,255,0.5), -3.443339761481782px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  132. }
  133. 95% {
  134. text-shadow: 2.1841838852799786px 0 1px rgba(0,30,255,0.5), -2.1841838852799786px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  135. }
  136. 100% {
  137. text-shadow: 2.6208764473832513px 0 1px rgba(0,30,255,0.5), -2.6208764473832513px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  138. }
  139. }
  140. .crt::after {
  141. content: " ";
  142. display: block;
  143. position: absolute;
  144. top: 0;
  145. left: 0;
  146. bottom: 0;
  147. right: 0;
  148. background: rgba(18, 16, 16, 0.1);
  149. opacity: 0;
  150. z-index: 2;
  151. pointer-events: none;
  152. animation: flicker 0.15s infinite;
  153. }
  154. .crt::before {
  155. content: " ";
  156. display: block;
  157. position: absolute;
  158. top: 0;
  159. left: 0;
  160. bottom: 0;
  161. right: 0;
  162. background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
  163. z-index: 2;
  164. background-size: 100% 2px, 3px 100%;
  165. pointer-events: none;
  166. }
  167. .crt {
  168. // animation: textShadow 1.6s infinite;
  169. }
  170. body {
  171. margin-left: 48px;
  172. margin-right: 48px;
  173. margin-top: 128px;
  174. background: black;
  175. color: green;
  176. font-size: 48px;
  177. font-family: "PxPlus VGA SquarePx";
  178. padding: 1px;
  179. }
  180. h1 {
  181. font-size: 1em;
  182. padding-top: 48px; padding-bottom: 48px;
  183. line-height: 48px;
  184. margin: 0;
  185. padding: 1px;
  186. }
  187. h2 {
  188. font-size: 48px;
  189. padding-top: 48px; padding-bottom: 48px;
  190. padding-left: 48px;
  191. line-height: 48px;
  192. margin: 0;
  193. padding: 1px;
  194. }
  195. h3 {
  196. font-size: 48px;
  197. padding-top: 48px; padding-bottom: 48px;
  198. padding-left: 48px;
  199. line-height: 48px;
  200. margin: 0;
  201. padding: 1px;
  202. }
  203. h4 {
  204. font-size: 48px;
  205. padding-top: 48px; padding-bottom: 48px;
  206. padding-left: 48px;
  207. line-height: 48px;
  208. margin: 0;
  209. padding: 1px;
  210. }
  211. p { margin: 0; padding: 1px;}
  212. input:before { content: "[";
  213. }
  214. input:after { content: "]" }
  215. input {
  216. background: black;
  217. color: lime;
  218. -webkit-appearance: none;
  219. -moz-appearance: none;
  220. font-size: 48px;
  221. height: 48px;
  222. margin: 0 0 48px 0;
  223. padding: 1px 49px 1px 49px;
  224. font-family: "PxPlus VGA SquarePx";
  225. border-style: solid;
  226. border: 0px 10px 0px 0px;
  227. border-color: green;
  228. border-width: 0 5px 5px 0;
  229. }
  230. a.link,
  231. a,
  232. a:visited { color: lime; font-decoration: underline; }
  233. .bright { color: lime }
  234. </style>
  235. <script src="resources/prototype.js" type="text/javascript"></script>
  236. <script src="resources/scriptaculous.js" type="text/javascript"></script>
  237. <script type="text/javascript">
  238. /**
  239. * Generate a string of random characters of the specified length
  240. *
  241. * @param int length Length of the string to generate
  242. * @param bool nodupes Set to true if duplicate characters should not be allowed
  243. * @return string
  244. */
  245. function getRandomString(length, nodupes)
  246. {
  247. // "typecast" the length to an integer
  248. length = parseInt(length, 10);
  249. // make sure the output is at least one character long
  250. if (length < 1) {
  251. length = 1;
  252. }
  253. // list of characters to use
  254. var chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
  255. // final output string
  256. var output = '';
  257. // list of used characters (only used if nodupes === true)
  258. var used = '';
  259. // make sure we don't have an infinite loop
  260. if ((nodupes === true) && (length > chars.length)) {
  261. length = chars.length;
  262. }
  263. // loop as many times as `length` defines
  264. do {
  265. // get a random number between 0 and length of `chars`
  266. var randnum = Math.floor(Math.random() * chars.length)
  267. // extract the random character
  268. var chr = chars.charAt(randnum);
  269. // check if we are not allowed to include duplicate characters
  270. if (nodupes === true) {
  271. // true if character already used
  272. var added = (used.indexOf(chr) !== -1);
  273. // skip the character if already used
  274. if (added === true) {
  275. continue;
  276. }
  277. // add character to the list of used ones
  278. used += chr;
  279. }
  280. // add character to the output string
  281. output += chr;
  282. } while (output.length < length);
  283. return output;
  284. }
  285. function getidentifier() {
  286. var govid = $F($('govid'));
  287. $('res').style.display = 'none';
  288. $('congrats').style.display = 'none';
  289. $('urlpara').style.display = 'none';
  290. new Ajax.Request('/namegen?govid='+govid,
  291. {
  292. method:'get',
  293. onSuccess: function(transport){
  294. var response = transport.responseText || 'error';
  295. response = response.evalJSON();
  296. $('output').update(response.hackername);
  297. $('res').appear({duration: 0.3});
  298. $('congrats').appear({duration: 0.3});
  299. var url = ''
  300. if (document.URL.toQueryParams().govid != govid) {
  301. url = document.URL.split('?')[0];
  302. url = url.concat('?govid=',govid);
  303. }
  304. $('recoveryurl').href = url;
  305. window.history.pushState({}, 'dataentrails :: operative identification selector', url);
  306. $('urlpara').appear({duration: 0.3});
  307. Effect.Pulsate('output', {duration: 0.75, pulses: 2});
  308. },
  309. onFailure: function(){ }
  310. });
  311. // $('output').update($F($('govid')));
  312. }
  313. function getRandomIdentifer() {
  314. $('govid').setValue(getRandomString(64,false));
  315. getidentifier();
  316. }
  317. </script>
  318. </head>
  319. <body class="crt">
  320. <img src="resources/hlogo-pixel.png" style="float:right; width:256px; margin-left: 16px; margin-right: 16px; padding: 0; ">
  321. <h1>Operative Name Selector</h1>
  322. <p style="width: auto;">Please enter your S.I.N., serial number or a random value to obtain your operative identifier.</p>
  323. <p>&nbsp;</p>
  324. <p class="bright">INPUT: <input type="text" id="govid" onkeydown="if (event.keyCode == 13) $('send').click();" style="width: "><input id="send" type="button" value="send" onclick="getidentifier();"><input id="random" type="button" value="randomize" onclick="getRandomIdentifer();"></p>
  325. <p>&nbsp;</p>
  326. <p id="res" style="display: none">
  327. Selected Handle: <br>
  328. [<span id="output" class="bright"></span>]
  329. </p>
  330. <p id="congrats" style="display: none">
  331. Congratulations for choosing a new operative identifier. Please contact your handler for further instructions.
  332. </p>
  333. <p id="urlpara" style="display: none">
  334. <a id="recoveryurl" href="">URL TO THIS</a>
  335. </p>
  336. <script type="text/javascript">
  337. var potentialgovid = document.URL.toQueryParams().govid;
  338. if (potentialgovid) {
  339. $('govid').setValue(potentialgovid);
  340. getidentifier();
  341. }
  342. </script>
  343. </body>
  344. </html>