diff --git a/webcrab/res/page.html b/webcrab/res/page.html
new file mode 100755
index 0000000..1159d26
--- /dev/null
+++ b/webcrab/res/page.html
@@ -0,0 +1,164 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<title>webmouse client</title>
+		<style>
+body {
+	width: 100%;
+	position: absolute;
+	bottom: 0;
+	top: 0;
+	padding: 0;
+	margin: 0;
+	background-color: black;
+	color: gray;
+}
+button{
+	text-align: center;
+	outline: none;
+	background-color: black;
+	border: 1px solid gray;
+	border-radius: 0;
+	color: gray;
+	font-size: medium;
+}
+button:active {
+	background-color: silver;
+}
+button:focus, button:hover, button:focus-visible {
+
+}
+
+.touchpad {
+	height: 60%;
+	display: flex;
+}
+#canvas {
+	width: 100%;
+	background-color: #111;
+	outline: gray solid 1px;
+}
+.buttonrow {
+	height: 10%;
+	display: flex;
+	align-items: stretch;
+}
+.buttonrow input{
+	background-color: #111;
+	color: gray;
+	outline: gray solid 1px;
+	border: none;
+}
+
+		</style>
+	</head>
+	<body>
+	<div class="buttonrow">
+		<button style="flex:1">menu</button>
+		<button onclick="sendmessage('key', 'k=del')"  style="flex:1">del</button>
+		<button onclick="sendmessage('key', 'k=bksp')"  style="flex:1">bksp</button>
+		<button onclick="sendmessage('key', 'k=enter')"  style="flex:1">enter</button>
+		<input id="typebox" placeholder="type here" size=8 style="flex:2">
+	</div>
+	<div class="touchpad">
+		<span id="canvas"></span>
+	</div>
+	<div class="buttonrow">
+		<button onclick="sendmessage('left', '')" style="flex:2">left (toggle)</button>
+		<button onclick="sendmessage('wheel', 'd=1')" style="flex:1">up</button>
+		<button onclick="sendmessage('middle', '')" style="flex:1">mid</button>
+		<button onclick="sendmessage('wheel', 'd=-1')" style="flex:1">dn</button>
+		<button onclick="sendmessage('right', '')" style="flex:2">right</button>
+	</div>
+	<div class="buttonrow">
+		<button onclick="sendmessage('volume', 'd=-1')" style="flex:2">vol -</button>
+		<button onclick="sendmessage('volume', 'd=0')" style="flex:1">mute</button>
+		<button onclick="sendmessage('volume', 'd=1')"  style="flex:2">vol +</button>
+		<!--<button onclick="sendmessage('volume', 1, 0)"  style="flex:2">vol +</button>-->
+	</div>
+	<div class="buttonrow">
+		<button onclick="sendmessage('media', 'act=stop')" style="flex:1">stop</button>
+		<button onclick="sendmessage('media', 'act=prev')" style="flex:1">prev</button>
+		<button onclick="sendmessage('media', 'act=play')"  style="flex:1">play/pause</button>
+		<button onclick="sendmessage('media', 'act=next')"  style="flex:1">next</button>
+	</div>
+	<script>
+function startup() {
+	var el = document.getElementById("canvas");
+	el.addEventListener("touchstart", handleStart, false);
+	el.addEventListener("touchend", handleEnd, false);
+	el.addEventListener("touchcancel", handleCancel, false);
+	el.addEventListener("touchmove", handleMove, false);
+	
+	document.getElementById("typebox").addEventListener("change", handlekeypress, false);
+	
+	//setInterval(updatepos, 50);
+	
+}
+
+document.addEventListener("DOMContentLoaded", startup);
+var currenttouch = null;
+
+var packetnum = 0;
+
+function handleStart(evt) {
+	if (currenttouch == null) {
+		currenttouch = evt.changedTouches[0];
+		sendmessage("start", "x=" + currenttouch.pageX + "&y=" + currenttouch.pageY)
+	}
+}
+
+function handleMove(evt) {
+  var touches = evt.changedTouches;
+  if (currenttouch == null) { 
+	return 0;
+  }
+  for (var i = 0; i < touches.length; i++) {
+	if (touches[i].identifier == currenttouch.identifier) {
+		currenttouch = evt.changedTouches[0];
+		sendmessage("move", "x=" + currenttouch.pageX + "&y=" + currenttouch.pageY)
+	}
+  }
+}
+
+function handleEnd(evt) {
+  var touches = evt.changedTouches;
+  for (var i = 0; i < touches.length; i++) {
+    if (touches[i].identifier == currenttouch.identifier) {
+		currenttouch = evt.changedTouches[0];
+		sendmessage("end", "x=" + currenttouch.pageX + "&y=" + currenttouch.pageY)
+		currenttouch = null;
+	}
+  }
+}
+
+function handleCancel(evt) {
+  var touches = evt.changedTouches;
+  for (var i = 0; i < touches.length; i++) {
+    if (touches[i].identifier == currenttouch.identifier) {
+		currenttouch = evt.changedTouches[0];
+		sendmessage("end", "x=" + currenttouch.pageX + "&y=" + currenttouch.pageY)
+		currenttouch = null;
+	}
+  }
+}
+
+function handlekeypress(evt) {
+	evt.preventDefault();
+	sendmessage("text", evt.target.value, 0)
+	evt.target.value = "";
+}
+
+function sendmessage(opt, q) {
+	fetch("/" + opt + "/?" + q + "&seq=" + packetnum);
+	packetnum++;
+}
+
+
+
+
+		</script>
+	</body>
+</html>
\ No newline at end of file
diff --git a/webcrab/webcrab.vbproj b/webcrab/webcrab.vbproj
index 6c104c1..64fccdb 100755
--- a/webcrab/webcrab.vbproj
+++ b/webcrab/webcrab.vbproj
@@ -124,6 +124,9 @@
       <LastGenOutput>Settings.Designer.vb</LastGenOutput>
     </None>
   </ItemGroup>
+  <ItemGroup>
+    <Content Include="page.html" />
+  </ItemGroup>
   <Import Project="$(MSBuildToolsPath)\Microsoft.VisualBasic.targets" />
   <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
        Other similar extension points exist, see Microsoft.Common.targets.
