cas
/
hackernamegen
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
24 Commits
1 Branch
516 KiB
 
 
Branch: master
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'master'
${ noResults }
hackernamegen/hackersite.template

374 lines
9.5 KiB
Raw Permalink Blame History 

  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. 

  10.       @keyframes flicker {

  11.       0% {

  12.       opacity: 0.27861;

  13.   }

  14.   5% {

  15.     opacity: 0.34769;

  16.   }

  17.   10% {

  18.     opacity: 0.23604;

  19.   }

  20.   15% {

  21.     opacity: 0.90626;

  22.   }

  23.   20% {

  24.     opacity: 0.18128;

  25.   }

  26.   25% {

  27.     opacity: 0.83891;

  28.   }

  29.   30% {

  30.     opacity: 0.65583;

  31.   }

  32.   35% {

  33.     opacity: 0.67807;

  34.   }

  35.   40% {

  36.     opacity: 0.26559;

  37.   }

  38.   45% {

  39.     opacity: 0.84693;

  40.   }

  41.   50% {

  42.     opacity: 0.96019;

  43.   }

  44.   55% {

  45.     opacity: 0.08594;

  46.   }

  47.   60% {

  48.     opacity: 0.20313;

  49.   }

  50.   65% {

  51.     opacity: 0.71988;

  52.   }

  53.   70% {

  54.     opacity: 0.53455;

  55.   }

  56.   75% {

  57.     opacity: 0.37288;

  58.   }

  59.   80% {

  60.     opacity: 0.71428;

  61.   }

  62.   85% {

  63.     opacity: 0.70419;

  64.   }

  65.   90% {

  66.     opacity: 0.7003;

  67.   }

  68.   95% {

  69.     opacity: 0.36108;

  70.   }

  71.   100% {

  72.     opacity: 0.24387;

  73.   }

  74.   }

  75.   // color separation

  76. @keyframes textShadow {

  77.   0% {

  78.     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;

  79.   }

  80.   5% {

  81.     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;

  82.   }

  83.   10% {

  84.     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;

  85.   }

  86.   15% {

  87.     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;

  88.   }

  89.   20% {

  90.     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;

  91.   }

  92.   25% {

  93.     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;

  94.   }

  95.   30% {

  96.     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;

  97.   }

  98.   35% {

  99.     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;

  100.   }

  101.   40% {

  102.     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;

  103.   }

  104.   45% {

  105.     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;

  106.   }

  107.   50% {

  108.     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;

  109.   }

  110.   55% {

  111.     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;

  112.   }

  113.   60% {

  114.     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;

  115.   }

  116.   65% {

  117.     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;

  118.   }

  119.   70% {

  120.     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;

  121.   }

  122.   75% {

  123.     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;

  124.   }

  125.   80% {

  126.     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;

  127.   }

  128.   85% {

  129.     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;

  130.   }

  131.   90% {

  132.     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;

  133.   }

  134.   95% {

  135.     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;

  136.   }

  137.   100% {

  138.     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;

  139.   }

  140. }

  141. .crt::after {

  142.   content: " ";

  143.   display: block;

  144.   position: absolute;

  145.   top: 0;

  146.   left: 0;

  147.   bottom: 0;

  148.   right: 0;

  149.   background: rgba(18, 16, 16, 0.1);

  150.   opacity: 0;

  151.   z-index: 2;

  152.   pointer-events: none;

  153.   animation: flicker 0.15s infinite;

  154. }

  155. .crt::before {

  156.   content: " ";

  157.   display: block;

  158.   position: absolute;

  159.   top: 0;

  160.   left: 0;

  161.   bottom: 0;

  162.   right: 0;

  163.   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));

  164.   z-index: 2;

  165.   background-size: 100% 2px, 3px 100%;

  166.   pointer-events: none;

  167. }

  168. .crt {

  169.   // animation: textShadow 1.6s infinite;

  170.   }

  171. 

  172.   body {

  173.   margin-left: 48px;

  174.   margin-right: 48px;

  175.   margin-top: 128px;

  176.   background: black;

  177.   color: green;

  178.   font-size: 48px;

  179.   font-family: "PxPlus VGA SquarePx";

  180.   padding: 1px;

  181.   }

  182. 

  183.   h1 {

  184.   font-size: 1em;

  185.   padding-top: 48px; padding-bottom: 48px;

  186.   line-height: 48px;

  187.   margin: 0;

  188.   padding: 1px;

  189.   }

  190. 

  191.   h2 {

  192.   font-size: 48px;

  193.   padding-top: 48px; padding-bottom: 48px;

  194.   padding-left: 48px;

  195.   line-height: 48px;

  196.   margin: 0;

  197.   padding: 1px;

  198.   }

  199. 

  200.   h3 {

  201.   font-size: 48px;

  202.   padding-top: 48px; padding-bottom: 48px;

  203.   padding-left: 48px;

  204.   line-height: 48px;

  205.   margin: 0;

  206.   padding: 1px;

  207.   }

  208. 

  209.   h4 {

  210.   font-size: 48px;

  211.   padding-top: 48px; padding-bottom: 48px;

  212.   padding-left: 48px;

  213.   line-height: 48px;

  214.   margin: 0;

  215.   padding: 1px;

  216.   }

  217. 

  218.   p { margin: 0;   padding: 1px;}

  219. 

  220.   input:before { content: "[";

  221.   }

  222.   input:after { content: "]" }

  223. 

  224.   input {

  225.   background: black;

  226.   color: lime;

  227.   -webkit-appearance: none;

  228.   -moz-appearance: none;

  229.   font-size: 48px;

  230.   height: 48px;

  231.   margin: 0 0 48px 0;

  232.   padding: 1px 49px 1px 49px;

  233.   font-family: "PxPlus VGA SquarePx";

  234.   border-style: solid;

  235.   border: 0px 10px 0px 0px;

  236.   border-color: green;

  237.   border-width: 0 5px 5px 0;

  238.   }

  239. 

  240.   a.link,

  241.   a,

  242.   a:visited { color: lime; font-decoration: underline; }

  243. 

  244.   .bright { color: lime }

  245. 

  246. </style>

  247. <script src="resources/prototype.js" type="text/javascript"></script>

  248. <script src="resources/scriptaculous.js" type="text/javascript"></script>

  249. 

  250. <script type="text/javascript">

  251. /**

  252.  * Generate a string of random characters of the specified length

  253.  *

  254.  * @param int length   Length of the string to generate

  255.  * @param bool nodupes Set to true if duplicate characters should not be allowed

  256.  * @return string

  257.  */

  258. function getRandomString(length, nodupes)

  259. {

  260. 	// "typecast" the length to an integer

  261. 	length = parseInt(length, 10);

  262. 

  263. 	// make sure the output is at least one character long

  264. 	if (length < 1) {

  265. 		length = 1;

  266. 	}

  267. 

  268. 	// list of characters to use

  269. 	var chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';

  270. 

  271. 	// final output string

  272. 	var output = '';

  273. 

  274. 	// list of used characters (only used if nodupes === true)

  275. 	var used = '';

  276. 

  277. 	// make sure we don't have an infinite loop

  278. 	if ((nodupes === true) && (length > chars.length)) {

  279. 		length = chars.length;

  280. 	}

  281. 

  282. 	// loop as many times as `length` defines

  283. 	do {

  284. 		// get a random number between 0 and length of `chars`

  285. 		var randnum = Math.floor(Math.random() * chars.length)

  286. 

  287. 		// extract the random character

  288. 		var chr = chars.charAt(randnum);

  289. 

  290. 		// check if we are not allowed to include duplicate characters

  291. 		if (nodupes === true) {

  292. 			// true if character already used

  293. 

  294. 			var added = (used.indexOf(chr) !== -1);

  295. 

  296. 			// skip the character if already used

  297. 			if (added === true) {

  298. 				continue;

  299. 			}

  300. 

  301. 			// add character to the list of used ones

  302. 			used += chr;

  303. 		}

  304. 

  305. 		// add character to the output string

  306. 		output += chr;

  307. 	} while (output.length < length);

  308. 

  309. 	return output;

  310. }

  311. 

  312. function getidentifier() {

  313.     var govid = $F($('govid'));

  314.     $('res').style.display = 'none';

  315.     $('congrats').style.display = 'none';

  316.     $('urlpara').style.display = 'none';

  317.     new Ajax.Request('/namegen?govid='+govid,

  318. 		     {

  319. 			 method:'get',

  320. 			     onSuccess: function(transport){

  321. 			     var response = transport.responseText || 'error';

  322. 			     response = response.evalJSON();

  323. 			     $('output').update(response.hackername);

  324. 			     $('res').appear({duration: 0.3});

  325. 			     $('congrats').appear({duration: 0.3});

  326. 			     var url = ''

  327. 			     if (document.URL.toQueryParams().govid != govid) {

  328. 				 url = document.URL.split('?')[0];

  329. 				 url = url.concat('?govid=',govid);

  330. 			     }

  331. 			     $('recoveryurl').href = url;

  332. 			     window.history.pushState({}, 'dataentrails :: operative identification selector', url);

  333. 			     $('urlpara').appear({duration: 0.3});

  334. 			     Effect.Pulsate('output', {duration: 0.75, pulses: 2});

  335. 			 },

  336. 			     onFailure: function(){ }

  337. 		     });

  338.     // $('output').update($F($('govid')));

  339. }

  340. 

  341. function getRandomIdentifer() {

  342.     $('govid').setValue(getRandomString(64,false));

  343.     getidentifier();

  344. }

  345. </script>

  346. </head>

  347. <body class="crt">

  348.   <img src="resources/hlogo-pixel.png" style="float:right; width:256px; margin-left: 16px; margin-right: 16px; padding: 0; ">

  349.   <h1>Operative Name Selector</h1>

  350.   <p style="width: auto;">Please enter your S.I.N., serial number or a random value to obtain your operative identifier.</p>

  351.   <p>&nbsp;</p>

  352.   <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>

  353.   <p>&nbsp;</p>

  354.   <p id="res" style="display: none">

  355.     Selected Handle: <br>

  356.     [<span id="output" class="bright"></span>]

  357.   </p>

  358.   <p id="congrats" style="display: none">

  359.     Congratulations for choosing a new operative identifier. Please contact your handler for further instructions.

  360.   </p>

  361.   <p id="urlpara" style="display: none">

  362.     <a id="recoveryurl" href="">URL TO THIS</a>

  363.   </p>

  364. 

  365.   <script type="text/javascript">

  366.     var potentialgovid = document.URL.toQueryParams().govid;

  367.     if (potentialgovid) {

  368.     $('govid').setValue(potentialgovid);

  369.     getidentifier();

  370. }

  371. </script>

  372. </body>

  373. </html>