added fake replies of "command not found"

build/application.js

@@ -1,4 +1,16 @@
 (function() {
+    function escapeHTML(html) {
+        var fn = function(tag) {
+            var charsToReplace = {
+                "&": "&",
+                "<": "&lt;",
+                ">": "&gt;",
+                '"': "&#34;"
+            };
+            return charsToReplace[tag] || tag;
+        };
+        return html.replace(/[&<>"]/g, fn);
+    }
     function syncTyping() {
         var beforeSelection, selection, afterSelection;
         beforeSelection = this.value.slice(0, this.selectionStart);
@@ -12,4 +24,13 @@
     commandline.onkeydown = syncTyping;
     commandline.onkeyup = syncTyping;
     commandline.onselect = syncTyping;
+    function handleForm() {
+        var scrollback = document.getElementById("scrollback");
+        var val = this.command.value;
+        this.command.value = "";
+        document.getElementById("typing").innerHTML = "";
+        scrollback.innerHTML = scrollback.innerHTML + "a>" + escapeHTML(val) + "<br>Command not found.<br>";
+        return false;
+    }
+    document.forms[0].onsubmit = handleForm;
 })();

build/assets/images/scanline.svg

@@ -1,17 +1,11 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
+	xmlns:dc="http://purl.org/dc/elements/1.1/"
-<svg id="svg2" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="200" width="2000" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
+	xmlns:cc="http://creativecommons.org/ns#"
-<metadata id="metadata7">
+	xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-<rdf:RDF>
+	xmlns:svg="http://www.w3.org/2000/svg"
-<cc:Work rdf:about="">
+	xmlns="http://www.w3.org/2000/svg"
-<dc:format>image/svg+xml</dc:format>
+	version="1.1"
-<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+	width="2000"
-<dc:title/>
+	height="200">
-</cc:Work>
+	<g><path d="M 2000,0 0,200" style="fill:none;stroke:#003f00;stroke-width:5;" /></g>
-</rdf:RDF>
-</metadata>
-<g id="layer1" transform="translate(0,-852.36218)">
-<rect id="rect2985" style="fill:#000000;" height="210" width="2000" y="847.36" x="0"/>
-<path id="path2987" style="stroke-linejoin:miter;stroke:#003f00;stroke-linecap:butt;stroke-miterlimit:4;stroke-dasharray:none;stroke-width:5;fill:none;" d="M1995.1,857.28,4.9182,1047.4"/>
-</g>
 </svg>

build/compiled-styles.css

@@ -19,24 +19,24 @@ label:after {
   right: 0;
 }
 label {
-  top: 0;
   bottom: 0;
+  min-height: 100%;
   padding: 1em;
   font-family: computerfontregular, monospace;
   color: #009900;
-  font-size: 4vw;
+  font-size: 4vmax;
   overflow: hidden;
   word-break: break-all;
 }
 label:before {
   content: "";
   z-index: -1;
-  top: -8vw;
+  top: -8vmax;
-  bottom: -8vw;
+  bottom: -8vmax;
   -webkit-animation: scroll 10s linear infinite;
           animation: scroll 10s linear infinite;
-  background: url('/assets/images/scanline.svg');
+  background: url('/assets/images/scanline.svg') #000000;
-  background-size: 115vw 15vw;
+  background-size: 115vmax 15vmax;
   background-repeat: repeat-y;
   background-position: 50% 0%;
 }
@@ -97,22 +97,22 @@ label:before {
 }
 @-webkit-keyframes scroll {
   0% {
-    -webkit-transform: translate3d(0, -7.5vw, 0);
+    -webkit-transform: translate3d(0, -7.5vmax, 0);
-            transform: translate3d(0, -7.5vw, 0);
+            transform: translate3d(0, -7.5vmax, 0);
   }
   100% {
-    -webkit-transform: translate3d(0, 7.5vw, 0);
+    -webkit-transform: translate3d(0, 7.5vmax, 0);
-            transform: translate3d(0, 7.5vw, 0);
+            transform: translate3d(0, 7.5vmax, 0);
   }
 }
 @keyframes scroll {
   0% {
-    -webkit-transform: translate3d(0, -7.5vw, 0);
+    -webkit-transform: translate3d(0, -7.5vmax, 0);
-            transform: translate3d(0, -7.5vw, 0);
+            transform: translate3d(0, -7.5vmax, 0);
   }
   100% {
-    -webkit-transform: translate3d(0, 7.5vw, 0);
+    -webkit-transform: translate3d(0, 7.5vmax, 0);
-            transform: translate3d(0, 7.5vw, 0);
+            transform: translate3d(0, 7.5vmax, 0);
   }
 }
 @font-face {

build/index.php

@@ -4,6 +4,7 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
 		<title>FHQWHGADS</title>
+		<link rel="icon" href="data:;base64,iVBORw0KGgo=">
 		<style><?php include('compiled-styles.css'); ?></style>
 	</head>
 	<body>
@@ -12,7 +13,7 @@
 				<div id="scrollback">
 					i love u<br>-fhqwhgadshgnsdhjsdbkhsdabkfabkveybvf<br><br>
 				</div>
-				<div id="commandLine">a&gt;<input id="command" type="text" value="" /><span id="typing"></span></div>
+				<div id="commandLine">a&gt;<input id="command" name="command" type="text" value="" /><span id="typing"></span></div>
 			</label>
 		</form>
 		<script type="application/javascript"><?php include('application.js'); ?></script>

src/assets/css/style.less

@@ -16,23 +16,23 @@ label, label:before, label:after {
 	right: 0;
 }
 label {
-	top: 0;
 	bottom: 0;
+	min-height: 100%;
 	padding: 1em;
 	font-family: computerfontregular, monospace;
 	color: @consoleColor;
-	font-size: 4vw;
+	font-size: 4vmax;
 	overflow: hidden;
 	word-break: break-all;
 }
 label:before {
 	content: "";
 	z-index: -1;
-	top: -8vw;
+	top: -8vmax;
-	bottom: -8vw;
+	bottom: -8vmax;
 	animation: scroll 10s linear infinite;
-	background: url('/assets/images/scanline.svg');
+	background: url('/assets/images/scanline.svg') black;
-	background-size: 115vw 15vw;
+	background-size: 115vmax 15vmax;
 	background-repeat: repeat-y;
 	background-position: 50% 0%;
 }
@@ -81,9 +81,9 @@ label:before {
 }
 @keyframes scroll {
 	0% {
-		transform: translate3d(0,-7.5vw,0);
+		transform: translate3d(0,-7.5vmax,0);
 	}
 	100% {
-		transform: translate3d(0,7.5vw,0);
+		transform: translate3d(0,7.5vmax,0);
 	}
 }

src/assets/images/scanline.svg

@@ -1,17 +1,11 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
+	xmlns:dc="http://purl.org/dc/elements/1.1/"
-<svg id="svg2" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="200" width="2000" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
+	xmlns:cc="http://creativecommons.org/ns#"
-<metadata id="metadata7">
+	xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-<rdf:RDF>
+	xmlns:svg="http://www.w3.org/2000/svg"
-<cc:Work rdf:about="">
+	xmlns="http://www.w3.org/2000/svg"
-<dc:format>image/svg+xml</dc:format>
+	version="1.1"
-<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+	width="2000"
-<dc:title/>
+	height="200">
-</cc:Work>
+	<g><path d="M 2000,0 0,200" style="fill:none;stroke:#003f00;stroke-width:5;" /></g>
-</rdf:RDF>
-</metadata>
-<g id="layer1" transform="translate(0,-852.36218)">
-<rect id="rect2985" style="fill:#000000;" height="210" width="2000" y="847.36" x="0"/>
-<path id="path2987" style="stroke-linejoin:miter;stroke:#003f00;stroke-linecap:butt;stroke-miterlimit:4;stroke-dasharray:none;stroke-width:5;fill:none;" d="M1995.1,857.28,4.9182,1047.4"/>
-</g>
 </svg>

src/index.php

@@ -4,6 +4,7 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
 		<title>FHQWHGADS</title>
+		<link rel="icon" href="data:;base64,iVBORw0KGgo=">
 		<style><?php include('compiled-styles.css'); ?></style>
 	</head>
 	<body>
@@ -12,7 +13,7 @@
 				<div id="scrollback">
 					i love u<br>-fhqwhgadshgnsdhjsdbkhsdabkfabkveybvf<br><br>
 				</div>
-				<div id="commandLine">a&gt;<input id="command" type="text" value="" /><span id="typing"></span></div>
+				<div id="commandLine">a&gt;<input id="command" name="command" type="text" value="" /><span id="typing"></span></div>
 			</label>
 		</form>
 		<script type="application/javascript"><?php include('application.js'); ?></script>

src/scripts/index.js

@@ -1,4 +1,17 @@
 (function(){
+	function escapeHTML(html) {
+		var fn=function(tag) {
+			var charsToReplace = {
+				'&': '&',
+				'<': '&lt;',
+				'>': '&gt;',
+				'"': '&#34;'
+			};
+			return charsToReplace[tag] || tag;
+		}
+		return html.replace(/[&<>"]/g, fn);
+	}
+
 	function syncTyping() {
 		var beforeSelection, selection, afterSelection;
 		beforeSelection = this.value.slice(0, this.selectionStart);
@@ -12,4 +25,14 @@
 	commandline.onkeydown = syncTyping;
 	commandline.onkeyup = syncTyping;
 	commandline.onselect = syncTyping;
+
+	function handleForm() {
+		var scrollback = document.getElementById('scrollback');
+		var val = this.command.value;
+		this.command.value = '';
+		document.getElementById("typing").innerHTML = '';
+		scrollback.innerHTML = scrollback.innerHTML + 'a>' + escapeHTML(val) + '<br>Command not found.<br>';
+		return false;
+	}
+	document.forms[0].onsubmit = handleForm;
 }());