From 8219a5445cf8282eea24cf6373bf7935f67c9609 Mon Sep 17 00:00:00 2001
From: admin <tim.leikauf@gmail.com>
Date: Sat, 25 Apr 2026 21:07:51 +0200
Subject: [PATCH] =?UTF-8?q?Polygon:=20Standard-Modus=20+=20Schlie=C3=9Fen-?=
 =?UTF-8?q?Button?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Polygon ist jetzt der Standard-Modus beim Öffnen
- Neuer Button "Polygon schließen" erscheint im Polygon-Modus
- Button aktiviert sich nach dem 2. gesetzten Punkt
- Klick schließt das Polygon automatisch (kein Doppelklick mehr nötig)
- Auswahl hinzufügen schließt offenes Polygon ebenfalls automatisch

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/components/DrawCanvas.tsx | 15 ++++++++++++++-
 frontend/src/pages/DrawIt.tsx          | 11 ++++++++++-
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/DrawCanvas.tsx b/frontend/src/components/DrawCanvas.tsx
index ae17623..7f6d8a5 100644
--- a/frontend/src/components/DrawCanvas.tsx
+++ b/frontend/src/components/DrawCanvas.tsx
@@ -13,6 +13,7 @@ const imageCache = new Map<string, HTMLImageElement>()
 export interface DrawCanvasHandle {
   getCurrentSelection: () => Selection | null
   resetSelection: () => void
+  closePolygon: () => void
 }
 
 interface Props {
@@ -200,7 +201,11 @@ export default forwardRef<DrawCanvasHandle, Props>(function DrawCanvas(
           },
         }
       } else {
-        if (!isPolygonClosed.current || polygonPoints.current.length < 3) return null
+        if (polygonPoints.current.length < 2) return null
+        if (!isPolygonClosed.current) {
+          isPolygonClosed.current = true
+          redraw()
+        }
         return {
           mode: 'polygon',
           polygon: polygonPoints.current.map(p => ({
@@ -219,6 +224,13 @@ export default forwardRef<DrawCanvasHandle, Props>(function DrawCanvas(
       onHasSelectionRef.current(false)
       redraw()
     },
+    closePolygon() {
+      if (polygonPoints.current.length >= 2) {
+        isPolygonClosed.current = true
+        onHasSelectionRef.current(true)
+        redraw()
+      }
+    },
   }), [redraw])
 
   // Reset drawing when mode changes
@@ -306,6 +318,7 @@ export default forwardRef<DrawCanvasHandle, Props>(function DrawCanvas(
         }
         polygonPoints.current.push({ x, y })
         isDragging.current = true
+        if (polygonPoints.current.length >= 2) onHasSelectionRef.current(true)
       }
       redraw()
     }
diff --git a/frontend/src/pages/DrawIt.tsx b/frontend/src/pages/DrawIt.tsx
index 01d38f5..fc56d7b 100644
--- a/frontend/src/pages/DrawIt.tsx
+++ b/frontend/src/pages/DrawIt.tsx
@@ -35,7 +35,7 @@ export default function DrawIt() {
   const [userNotes, setUserNotes] = useState('')
   const [parentId, setParentId] = useState<string | null>(null)
   const [editingNotes, setEditingNotes] = useState<{ id: string; notes: string } | null>(null)
-  const [mode, setMode] = useState<'rect' | 'polygon'>('rect')
+  const [mode, setMode] = useState<'rect' | 'polygon'>('polygon')
   const [hasSelection, setHasSelection] = useState(false)
   const [saving, setSaving] = useState(false)
   const [status, setStatus] = useState('')
@@ -258,6 +258,15 @@ export default function DrawIt() {
               </label>
             </div>
             <div className="action-group">
+              {mode === 'polygon' && (
+                <button
+                  className="btn-primary btn-sm btn-block"
+                  onClick={() => canvasRef.current?.closePolygon()}
+                  disabled={!hasSelection}
+                >
+                  Polygon schließen
+                </button>
+              )}
               <button className="btn-ghost btn-sm btn-block" onClick={() => canvasRef.current?.resetSelection()}>
                 Auswahl zurücksetzen
               </button>