Add rotation support

Author: strange-v

src/config.ts

@@ -1,4 +1,5 @@
 import env from "env-var";
+import { getRotatedDimensions, Rotation } from "./util.js";
 
 export type DeviceConfig = {
   height: number;                   // px
@@ -11,6 +12,7 @@ export type DeviceConfig = {
   minFrameInterval: number;         // ms (>=0)
   jpegQuality: number;              // 1..100
   maxBytesPerMessage: number;       // bytes (>0)
+  rotation: Rotation;               // degrees
 };
 
 const DEFAULTS = {
@@ -22,6 +24,7 @@ const DEFAULTS = {
   minFrameInterval: 80,
   jpegQuality: 85,
   maxBytesPerMessage: 14336,
+  rotation: 0,
 } as const;
 
 const store = new Map<string, DeviceConfig>();
@@ -65,8 +68,6 @@ function readEnvFallbacks(): Partial<DeviceConfig> {
   const val = (name: string) => env.get(name).asString() ?? undefined;
 
   const out: Partial<DeviceConfig> = {};
-  const H = val("SCREEN_H");
-  const W = val("SCREEN_W");
   const TS = val("TILE_SIZE");
   const FFTC = val("FULL_FRAME_TILE_COUNT");
   const FFAT = val("FULL_FRAME_AREA_THRESHOLD");
@@ -76,8 +77,6 @@ function readEnvFallbacks(): Partial<DeviceConfig> {
   const Q = val("JPEG_QUALITY");
   const MBPM = val("MAX_BYTES_PER_MESSAGE");
 
-  if (H) out.height = intPos(H)!;
-  if (W) out.width = intPos(W)!;
   if (TS) out.tileSize = intPos(TS)!;
   if (FFTC) out.fullFrameTileCount = intPos(FFTC)!;
   if (FFAT != null) out.fullFrameAreaThreshold = float01(FFAT)!;
@@ -94,8 +93,8 @@ export function makeConfigFromParams(params: URLSearchParams): DeviceConfig {
   const envFallbacks = readEnvFallbacks();
 
   // required
-  const height = intPos(params.get("h")) ?? envFallbacks.height;
-  const width = intPos(params.get("w")) ?? envFallbacks.width;
+  let height = intPos(params.get("h")) ?? envFallbacks.height;
+  let width = intPos(params.get("w")) ?? envFallbacks.width;
   if (!height || !width) throw new Error(`missing required params "h" and/or "w"`);
 
   // optional
@@ -107,10 +106,14 @@ export function makeConfigFromParams(params: URLSearchParams): DeviceConfig {
   const everyNthFrame = intPos(params.get("enf")) ?? envFallbacks.everyNthFrame ?? DEFAULTS.everyNthFrame;
   const jpegQuality = clamp(intPos(params.get("q")) ?? envFallbacks.jpegQuality ?? DEFAULTS.jpegQuality, 1, 100);
   const maxBytesPerMessage = intPos(params.get("mbpm")) ?? envFallbacks.maxBytesPerMessage ?? DEFAULTS.maxBytesPerMessage;
+  const rotation = intPos(params.get("r")) as 0 | 90 | 180 | 270 | undefined
+    ?? DEFAULTS.rotation;
+
+  const dimensions = getRotatedDimensions(width, height, rotation);
 
   return {
-    height,
-    width,
+    height: dimensions.height,
+    width: dimensions.width,
     tileSize,
     fullFrameTileCount,
     fullFrameAreaThreshold,
@@ -119,6 +122,7 @@ export function makeConfigFromParams(params: URLSearchParams): DeviceConfig {
     everyNthFrame,
     jpegQuality,
     maxBytesPerMessage,
+    rotation,
   };
 }
 
@@ -137,7 +141,8 @@ export function deviceConfigsEqual(
     a.everyNthFrame === b.everyNthFrame &&
     a.minFrameInterval === b.minFrameInterval &&
     a.jpegQuality === b.jpegQuality &&
-    a.maxBytesPerMessage === b.maxBytesPerMessage
+    a.maxBytesPerMessage === b.maxBytesPerMessage &&
+    a.rotation === b.rotation
   );
 }
 
@@ -153,6 +158,7 @@ export function logDeviceConfig(id: string, cfg: DeviceConfig): void {
     ["minFrameInterval", cfg.minFrameInterval],
     ["jpegQuality", cfg.jpegQuality],
     ["maxBytesPerMessage", cfg.maxBytesPerMessage],
+    ["rotation", cfg.rotation],
   ];
 
   const head = `[client_connect] id=${id}`;

src/deviceManager.ts

@@ -125,7 +125,13 @@ export async function ensureDeviceAsync(id: string, cfg: DeviceConfig): Promise<
       }
       dev.prevFrameHash = h32;
 
-      const { data, info } = await sharp(pngFull).raw().ensureAlpha().toBuffer({ resolveWithObject: true });
+      let img = sharp(pngFull);
+      if (dev.cfg.rotation) img = img.rotate(dev.cfg.rotation);
+
+      const { data, info } = await img
+        .ensureAlpha()
+        .raw()
+        .toBuffer({ resolveWithObject: true });
       const out = await processor.processFrameAsync({ data, width: info.width, height: info.height });
       if (out.rects.length > 0) {
         dev.frameId = (dev.frameId + 1) >>> 0;

src/inputRouter.ts

@@ -1,5 +1,6 @@
 import type { DeviceSession } from "./deviceManager.js";
 import { TouchKind, parseFrameStatsPacket, parseOpenURLPacket, parseTouchPacket } from "./protocol.js";
+import { mapPointForRotation } from "./util.js";
 
 export class InputRouter {
   private _lastMoveAt = 0;
@@ -44,7 +45,12 @@ export class InputRouter {
   private async _dispatchTouchAsync(dev: DeviceSession, kind: TouchKind, x: number, y: number): Promise<void> {
     try {
       const id = 1; // single-finger id
-      const points = [{ x, y, radiusX: 1, radiusY: 1, force: 1, id }];
+      const rotated = mapPointForRotation(
+        x, y,
+        dev.cfg.width, dev.cfg.height,
+        dev.cfg.rotation
+      );
+      const points = [{ x: rotated.x, y: rotated.y, radiusX: 1, radiusY: 1, force: 1, id }];
 
       switch (kind) {
         case TouchKind.Down:

src/util.ts

@@ -8,3 +8,29 @@ export function hash32(buf: Buffer): number {
   }
   return h >>> 0;
 }
+
+export type Rotation = 0 | 90 | 180 | 270;
+
+export function getRotatedDimensions(
+  width: number,
+  height: number,
+  rotation: Rotation
+): { width: number; height: number } {
+  if (rotation === 90 || rotation === 270) {
+    return { width: height, height: width };
+  }
+  return { width, height };
+}
+
+export function mapPointForRotation(
+  xd: number, yd: number,
+  srcW: number, srcH: number, // розмір сторінки у Chrome (до ротації)
+  rotation: Rotation
+): { x: number; y: number } {
+  switch (rotation) {
+    case 0:   return { x: xd,            y: yd };
+    case 90:  return { x: yd,            y: srcH - 1 - xd };
+    case 180: return { x: srcW - 1 - xd, y: srcH - 1 - yd };
+    case 270: return { x: srcW - 1 - yd, y: xd };
+  }
+}