prettierrc, websockets, fix in frontend

Summary: Ref T2992

Reviewers: kuba-orlik

Reviewed By: kuba-orlik

Subscribers: kuba-orlik

Maniphest Tasks: T2992

Differential Revision: https://hub.sealcode.org/D1570

.prettierrc

@@ -0,0 +1,28 @@
+{
+	"useTabs": true,
+	"tabWidth": 4,
+	"trailingComma": "es5",
+	"overrides": [
+		{
+			"files": "*.yml",
+			"options": {
+				"tabWidth": 2,
+				"useTabs": false
+			}
+		},
+		{
+			"files": "*.html",
+			"options": {
+				"tabWidth": 2,
+				"useTabs": false
+			}
+		},
+		{
+			"files": "*.json",
+			"options": {
+				"tabWidth": 2,
+				"useTabs": false
+			}
+		}
+	]
+}

android/code/index.js

@@ -1,55 +0,0 @@
-const net = require("net");
-const child_process = require("child_process");
-const fs = require("fs");
-
-const server = net.createServer();
-
-async function spawnPromise(program, args) {
-  return new Promise((resolve, reject) => {
-    const process = child_process.spawn(program, args);
-    process.on("close", (_) => {
-      resolve();
-    });
-  });
-}
-
-//maybe check output of child processe and send errors in some way
-server.on("connection", (socket) => {
-  socket.on("data", async (dataBuf) => {
-    data = dataBuf.toString();
-    if (data === "screenshot") {
-      socket.write("start");
-      await spawnPromise("bash", ["/conf/screenshot.sh"]);
-      socket.write(fs.readFileSync("/screenshot.png"));
-      socket.write("ENDOFMSG");
-    } else if (data.includes("touch")) {
-      const dataSplit = data.split(" ");
-      await spawnPromise("bash", [
-        "/conf/touch.sh",
-        dataSplit[1],
-        dataSplit[2],
-      ]);
-    } else if (data === "back") {
-      await spawnPromise("bash", ["/conf/back.sh"]);
-    } else if (data === "home") {
-      await spawnPromise("bash", ["/conf/home.sh"]);
-    } else if (data.includes("drag")) {
-      const dataSplit = data.split(" ");
-
-      await spawnPromise("bash", [
-        "/conf/drag.sh",
-        dataSplit[1],
-        dataSplit[2],
-        dataSplit[3],
-        dataSplit[4],
-      ]);
-    }
-  });
-  socket.on("close", (_) => {
-    socket.end();
-  });
-});
-
-server.listen(3000, () => {
-  console.log("listening on 3000");
-});

android/code/index.mjs

@@ -0,0 +1,49 @@
+import { WebSocketServer } from "ws";
+import child_process from "child_process";
+import fs from "fs";
+
+async function spawnPromise(program, args) {
+	return new Promise((resolve, reject) => {
+		const process = child_process.spawn(program, args);
+		process.on("close", (_) => {
+			resolve();
+		});
+	});
+}
+
+const wss = new WebSocketServer({ port: 3000 });
+
+//maybe check output of child processes and send errors in some way
+wss.on("connection", (ws) => {
+	ws.on("message", async (dataBuf) => {
+		let data = dataBuf.toString();
+		if (data === "screenshot") {
+			await spawnPromise("bash", ["/conf/screenshot.sh"]);
+			ws.send(fs.readFileSync("/screenshot.png"));
+		} else if (data.includes("touch")) {
+			const dataSplit = data.split(" ");
+			await spawnPromise("bash", [
+				"/conf/touch.sh",
+				dataSplit[1],
+				dataSplit[2],
+			]);
+		} else if (data === "back") {
+			await spawnPromise("bash", ["/conf/back.sh"]);
+		} else if (data === "home") {
+			await spawnPromise("bash", ["/conf/home.sh"]);
+		} else if (data.includes("drag")) {
+			const dataSplit = data.split(" ");
+
+			await spawnPromise("bash", [
+				"/conf/drag.sh",
+				dataSplit[1],
+				dataSplit[2],
+				dataSplit[3],
+				dataSplit[4],
+			]);
+		}
+	});
+	ws.on("close", (_) => {
+		ws.close();
+	});
+});

android/code/package-lock.json

@@ -5,20 +5,36 @@
   "packages": {
     "": {
       "dependencies": {
-        "net": "^1.0.2"
+        "ws": "^8.18.0"
       }
     },
-    "node_modules/net": {
+    "node_modules/ws": {
-      "version": "1.0.2",
+      "version": "8.18.0",
-      "resolved": "https://registry.npmjs.org/net/-/net-1.0.2.tgz",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
-      "integrity": "sha512-kbhcj2SVVR4caaVnGLJKmlk2+f+oLkjqdKeQlmUtz6nGzOpbcobwVIeSURNgraV/v3tlmGIX82OcPCl0K6RbHQ=="
+      "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
     }
   },
   "dependencies": {
-    "net": {
+    "ws": {
-      "version": "1.0.2",
+      "version": "8.18.0",
-      "resolved": "https://registry.npmjs.org/net/-/net-1.0.2.tgz",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
-      "integrity": "sha512-kbhcj2SVVR4caaVnGLJKmlk2+f+oLkjqdKeQlmUtz6nGzOpbcobwVIeSURNgraV/v3tlmGIX82OcPCl0K6RbHQ=="
+      "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
+      "requires": {}
     }
   }
 }

android/code/package.json

@@ -1,5 +1,5 @@
 {
   "dependencies": {
-    "net": "^1.0.2"
+    "ws": "^8.18.0"
   }
 }

android/conf/docker-entrypoint.sh

@@ -3,6 +3,6 @@ npm i -C /code
 bash /conf/iptables_conf.sh
 redsocks -c /conf/redsocks.conf &
 bash /conf/wait_for_sd.sh
-node /code/index.js
+node /code/index.mjs
 
 #tail -f /dev/null

diagram.txt

@@ -36,7 +36,7 @@ RENTGEN_ANDROID docker structure
 |                               :3000                  |
 +---------------------------------+--------------------+
                                   |
-                                  | SOCKETS
+                                  | WEBSOCKETS
                                   |
 +---------------------------------+--------------------+
 | HTTP_SERVER                     |                    |

http_server/code/index.html

@@ -131,7 +131,7 @@
       let startDraggingPosY = 0;
       let endDraggingPosY = 0;
 
-      const screenSize = [320, 640]
+      const screenSize = [320, 640];
 
       const handleDraggStart = (e) => {
         e.preventDefault();
@@ -146,7 +146,8 @@
         endDraggingPosX = e.offsetX;
         endDraggingPosY = e.offsetY;
         if (
-          isDragging && (Math.abs(endDraggingPosY - startDraggingPosY) > 10 ||
+          isDragging &&
+          (Math.abs(endDraggingPosY - startDraggingPosY) > 10 ||
             Math.abs(endDraggingPosX - startDraggingPosX) > 10)
         ) {
           registerClick({
@@ -154,7 +155,7 @@
             logText: `await drag({x:${startDraggingPosX},y:${startDraggingPosY}},{x:${e.offsetX},y:${e.offsetY}});`,
             body: `startX=${startDraggingPosX}&startY=${startDraggingPosY}&endX=${e.offsetX}&endY=${e.offsetY}`,
           });
-        } else {
+        } else if (e.target === screen) {
           const phoneX = event.offsetX;
           const phoneY = event.offsetY;
           if (phoneX <= screenSize[0] && phoneY <= screenSize[1])

http_server/code/index.mjs

@@ -1,6 +1,10 @@
 import express from "express";
 import { readFile } from "node:fs/promises";
-import { guardedScreenshot, socket_client, waitFullBoot } from "./screenshot.mjs";
+import {
+	guardedScreenshot,
+	android_websocket,
+	waitFullBoot,
+} from "./screenshot.mjs";
 
 const device_size_x = 320;
 const device_size_y = 640;
@@ -46,12 +50,12 @@ app.get("/", async function (req, res) {
 
 //POST
 app.post("/back", function (req, res) {
-  socket_client.write(`back`);
+	android_websocket.send(`back`);
 	res.sendStatus(200);
 });
 
 app.post("/home", function (req, res) {
-  socket_client.write(`home`);
+	android_websocket.send(`home`);
 	res.sendStatus(200);
 });
 
@@ -64,7 +68,7 @@ app.post("/touch", function (req, res) {
 			`the query params must be x <= ${device_size_x}, y <= ${device_size_y}\n`
 		);
 	} else {
-    socket_client.write(`touch ${x} ${y}`);
+		android_websocket.send(`touch ${x} ${y}`);
 		res.sendStatus(200);
 	}
 });
@@ -75,8 +79,9 @@ app.post("/drag", function (req, res) {
 	const startY = Number(body.startY);
 	const endX = Number(body.endX);
 	const endY = Number(body.endY);
-  socket_client.write(`drag ${startX} ${startY} ${endX} ${endY}`);
+	android_websocket.send(`drag ${startX} ${startY} ${endX} ${endY}`);
 	res.sendStatus(200);
 });
 
 app.listen(8080, () => console.log("Listening in port 8080"));
+	

http_server/code/package-lock.json

@@ -6,8 +6,8 @@
     "": {
       "dependencies": {
         "express": "^4.18.2",
-        "net": "^1.0.2",
+        "preact": "^10.18.1",
-        "preact": "^10.18.1"
+        "ws": "^8.18.0"
       },
       "devDependencies": {
         "esbuild": "^0.19.5"
@@ -774,11 +774,6 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/net": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/net/-/net-1.0.2.tgz",
-      "integrity": "sha512-kbhcj2SVVR4caaVnGLJKmlk2+f+oLkjqdKeQlmUtz6nGzOpbcobwVIeSURNgraV/v3tlmGIX82OcPCl0K6RbHQ=="
-    },
     "node_modules/object-inspect": {
       "version": "1.12.3",
       "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.3.tgz",
@@ -1003,6 +998,26 @@
       "engines": {
         "node": ">= 0.8"
       }
+    },
+    "node_modules/ws": {
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
+      "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
     }
   }
 }

http_server/code/package.json

@@ -4,8 +4,8 @@
   },
   "dependencies": {
     "express": "^4.18.2",
-    "net": "^1.0.2",
+    "preact": "^10.18.1",
-    "preact": "^10.18.1"
+    "ws": "^8.18.0"
   },
   "devDependencies": {
     "esbuild": "^0.19.5"

http_server/code/screenshot.mjs

@@ -1,15 +1,18 @@
-import net from "net";
 import fs from "fs";
 import { sleep } from "./utils.mjs";
+import { WebSocket } from "ws";
 
-export const socket_client = net.createConnection({ port: 3000, host: "android" });
+export const android_websocket = new WebSocket("ws://android:3000");
 
 let doneWrite = 0;
 let screenshotPromise = null;
 
 async function screenshot() {
 	const time_start = Date.now();
-  socket_client.write("screenshot");
+	while (android_websocket.readyState != WebSocket.OPEN) {
+		await sleep(15);
+	}
+	android_websocket.send("screenshot");
 	while (!doneWrite) {
 		await sleep(15);
 		if (Date.now() - time_start > 2000) {
@@ -22,10 +25,10 @@ async function screenshot() {
 }
 
 export async function guardedScreenshot() {
-  console.log("Requesting a screenshot");
 	if (!screenshotPromise) {
-    console.log("no ongoing promise, starting a new one");
 		screenshotPromise = screenshot();
+	} else {
+		console.log("ongoing screenshot promise not taking a new one");
 	}
 	return screenshotPromise;
 }
@@ -48,15 +51,10 @@ export async function waitFullBoot() {
 	throw new Error("wait for screenshot time to be less than 0.5s timed out");
 }
 
-let fd;
+android_websocket.on("message", (dataBuf) => {
-socket_client.on("data", (dataBuf) => {
+	let fd;
-  if (dataBuf.toString() === "start")
 	fd = fs.openSync("/code/screenshot.png", "w");
-  else {
-    if (dataBuf.toString().includes("ENDOFMSG")) {
 	fs.writeSync(fd, dataBuf);
 	fs.close(fd);
 	doneWrite = 1;
-    } else fs.writeSync(fd, dataBuf);
-  }
 });

http_server/code/waitSocket.mjs

@@ -1,14 +1,14 @@
-import net from "net";
 import { exit } from "process";
+import { WebSocket } from "ws";
 
 async function sleep(time) {
 	return new Promise((resolve) => setTimeout(resolve, time));
 }
 
 while (true) {
-	let socket = net.createConnection({ port: 3000, host: "android" });
+	let socket = new WebSocket("ws://android:3000");
 
-	socket.on("connect", () => {
+	socket.on("open", () => {
 		exit(0);
 	});
 	socket.on("error", () => {});