diff --git a/templates/hid.html b/templates/hid.html
index f8c212a..eab86a9 100644
--- a/templates/hid.html
+++ b/templates/hid.html
@@ -1,5 +1,82 @@
-<html>
-	<body>
-		HID input service, POST data to /keyboard or /mouse
-	</body>
-</html>
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Klávesnice remote SSH</title>
+  <style>
+  </style>
+  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
+</head>
+<body>
+	HID input service, POST data to /keyboard or /mouse <br/>
+
+<div>
+</div>
+
+<br/>
+Server response: <span></span>
+
+<script>
+function zapis(t) {
+  $("div").text(t);
+}
+
+var previous;
+
+$(window).bind('keydown', function(event) {
+  event.preventDefault();
+  var str = String.fromCharCode(event.which).toLowerCase();
+
+  var ctrl = event.ctrlKey;
+  if (previous == 17) {
+    ctrl = true;
+  }
+
+  var obj = {
+    ctrlKey: ctrl,
+    shiftKey: event.shiftKey,
+    altKey: event.altKey,
+    which: event.which,
+	code: event.code,
+    str: str
+  }
+
+  if (event.which != 16 && event.which != 17 && event.which != 18) {
+    console.log(obj);
+
+    var ret = $.ajax({
+        type: "POST",
+        url: "hid/keyboard",
+        data: JSON.stringify(obj),
+        contentType: "application/json; charset=utf-8",
+        dataType: "json"
+    });
+
+	$("span").text(ret.responseText);
+	console.log(ret);
+	
+
+  }
+
+  var text = "";
+  if (ctrl) {
+    text = text + ' + Control';
+  }
+  if (event.shiftKey) {
+    text = text + ' + Shift';
+  }
+  if (event.altKey) {
+    text = text + ' + Alt';
+  }
+  text = text + ' + ' + str;
+  text = text.substr(3);
+  zapis(text);
+
+  previous = event.keyCode;
+
+});
+
+</script>
+ 
+</body>
+</html>
\ No newline at end of file
