bug(Polygon UI): Fix polygon edit UI not taking rotation into account

Author: Kruptein

CHANGELOG.md

@@ -12,6 +12,7 @@ tech changes will usually be stripped from release notes for the public
 
 ### Fixed
 
+-   Polygon edit UI: was not taking rotation of shape into account
 -   Teleport: shapes would not be removed on the old location until a refresh
 
 ## [2023.3.0] - 2023-09-17

client/src/game/shapes/variants/polygon.ts

@@ -230,6 +230,8 @@ export class Polygon extends Shape implements IShape {
     cutPolygon(point: GlobalPoint): void {
         let lastVertex = -1;
         let nearVertex: GlobalPoint | null = null;
+        const oldCenter = this.center;
+
         for (let i = 1; i <= this.vertices.length - (this.openPolygon ? 1 : 0); i++) {
             const prevVertex = this.vertices[i - 1]!;
             const vertex = this.vertices[i % this.vertices.length]!;
@@ -253,12 +255,14 @@ export class Polygon extends Shape implements IShape {
             newPolygon.setLayer(this.floorId!, this.layerName!);
             newPolygon.fromDict({
                 ...oldDict,
+                angle: 0,
                 uuid,
                 trackers: oldDict.trackers.map((t) => ({ ...t, uuid: uuidv4() as unknown as TrackerId })),
                 auras: oldDict.auras.map((a) => ({ ...a, uuid: uuidv4() as unknown as AuraId })),
             });
-            newPolygon._refPoint = nearVertex!;
-            newPolygon._vertices = newVertices;
+            newPolygon._refPoint = rotateAroundPoint(nearVertex!, oldCenter, this.angle);
+            newPolygon._vertices = newVertices.map((v) => rotateAroundPoint(v, oldCenter, this.angle));
+            newPolygon._center = newPolygon.__center();
 
             const props = getProperties(this.id)!;
 

client/src/game/tools/variants/select/index.ts

@@ -15,7 +15,7 @@ import {
 } from "../../../../core/geometry";
 import type { GlobalPoint, LocalPoint } from "../../../../core/geometry";
 import { baseAdjust } from "../../../../core/http";
-import { equalPoints, snapToPoint } from "../../../../core/math";
+import { equalPoints, rotateAroundPoint, snapToPoint } from "../../../../core/math";
 import { InvalidationMode, NO_SYNC, SyncMode } from "../../../../core/models/types";
 import { ctrlOrCmdPressed } from "../../../../core/utils";
 import { i18n } from "../../../../i18n";
@@ -970,7 +970,7 @@ class SelectTool extends Tool implements ISelectTool {
 
         const pw = g2lz(polygon.lineWidth[0]!);
 
-        const pv = polygon.vertices;
+        const pv = polygon.vertices.map((v) => rotateAroundPoint(v, polygon.center, polygon.angle));
         let smallest = { distance: polygon.lineWidth[0]! * 2, nearest: gp, angle: 0, point: false };
         for (let i = 1; i < pv.length; i++) {
             const prevVertex = pv[i - 1]!;

client/src/game/ui/tools/SelectTool.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { onMounted, toRef } from "vue";
 
+import type { GlobalPoint } from "../../../core/geometry";
+import { rotateAroundPoint } from "../../../core/math";
 import type { Polygon } from "../../shapes/variants/polygon";
 import { selectedSystem } from "../../systems/selected";
 import { selectTool } from "../../tools/variants/select";
@@ -21,6 +23,10 @@ onMounted(() => {
     selectTool.checkRuler();
 });
 
+function getGlobalRefPoint(polygon: Polygon): GlobalPoint {
+    return rotateAroundPoint(selectTool.polygonTracer!.refPoint, polygon.center, -polygon.angle);
+}
+
 function toggleShowRuler(event: MouseEvent): void {
     const state = (event.target as HTMLButtonElement).getAttribute("aria-pressed") ?? "false";
     _$.showRuler = state === "false";
@@ -29,17 +35,17 @@ function toggleShowRuler(event: MouseEvent): void {
 
 function cutPolygon(): void {
     const selection = selectedSystem.get({ includeComposites: false })[0] as Polygon;
-    selection.cutPolygon(selectTool.polygonTracer!.refPoint);
+    selection.cutPolygon(getGlobalRefPoint(selection));
 }
 
 function addPoint(): void {
     const selection = selectedSystem.get({ includeComposites: false })[0] as Polygon;
-    selection.addPoint(selectTool.polygonTracer!.refPoint);
+    selection.addPoint(getGlobalRefPoint(selection));
 }
 
 function removePoint(): void {
     const selection = selectedSystem.get({ includeComposites: false })[0] as Polygon;
-    selection.removePoint(selectTool.polygonTracer!.refPoint);
+    selection.removePoint(getGlobalRefPoint(selection));
 }
 </script>