<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Testing, testing...</title>
<style>
	body {
		font-family: "Courier New", Courier, monospace;
		font-size: 22px;
		color: #26FF00;
		background: black;
	}

	#page-container {
		text-align: center;
		margin: auto;
		margin-top: 50px;
		white-space: nowrap;
	}
</style>
<script>
	var avn = "\
               .o######0o.                      <br>\
              0###########0.      .             <br>\
             o####\"^\"######0.    (## m#o        <br>\
             ####(^^^^######0  ._ ##.##\"nn      <br>\
             0####o^^^###\"^## (##o.######\"      <br>\
     o00o.    0#####o,##.^,#\"  \"#######(        <br>\
   .0#####0.   0###########0     ########       <br>\
  .0#######0.   \"0#########\"  _.o###'\"00\"       <br>\
 .0###########o._ \"\"################       _  . <br>\
 0####\" \"#########################0      .0#0n0 <br>\
 #####.   \"\"#####################\"    _  0##### <br>\
 0#####.     \"###################._.o##o.#####\" <br>\
 \"0#####..##mn \"\"#############################  <br>\
   \"0#######\"\"_    \"\"##################\"#####\"  <br>\
      \"\"####m###m      \"\"############\"   ####   <br>\
     .########\"\"\"         .########\"     \"##\"   <br>\
     ####\"##\"###o        (0######\"        \"\"    <br>\
     \"##\".###,##     .o#o \"\"####.               <br>\
          \"##\"      .0############.             <br>\
                   .n####AVNSS######            ";

	function textMatrix(container) {
		var str = avn;
		var ret = "";
		var tab = new Array(str.length);

		for (let i = 0; i < str.length; i++) {
			let c = str.charAt(i);
			tab[i] = (c === " " || c === "^") ? randomLetter(1) : c;
		}

		setInterval(function() {
			let cnt = Math.floor(Math.random() * 50) + 25;
			let pos = new Array(cnt);

			for (let i = 0; i < cnt; i++) {
				pos[i] = Math.floor(Math.random() * str.length);
				let c = str.charAt(pos[i]);
				if (c === " " || c === "^") {
					tab[pos[i]] = randomLetter(1);
				} else {
					i--;
					continue;
				}
			}

			ret = "";
			for (let i = 0; i < str.length; i++) {
				let c = str.charAt(i);
				if (c === "^" && pos.indexOf(i) > -1)
					ret += "<span style=\"color:#FF0000\">" + tab[i] + "</span>";
				else if (c === " ")
					ret += "<span style=\"color:#2C2C2C\">" + tab[i] + "</span>";
				else
					ret += c;
			}
			document.getElementById(container).innerHTML = ret;
		}, 100);
	}

	function randomLetter(length) {
		let text = "";
		let possible = "abcdefghijklmnopqrstuvwxyz0123456789";
		for (let i = 0; i < length; i++) {
			text += possible.charAt(Math.floor(Math.random() * possible.length));
		}
		return text;
	}

	onload = function() { textMatrix("logo"); }
</script>
</head>
<body>
	<div id="page-container">
		<div id="logo">Loading...</div>
	</div>
</body>
</html>
