floot plan editor

app/assets/js/floor-svg-editor.js

@@ -15,6 +15,7 @@
         const controls = {
             startPolyline: document.getElementById('floor-start-polyline'),
             finishPolyline: document.getElementById('floor-finish-polyline'),
+            removeLastPoint: document.getElementById('floor-remove-last-point'),
             deletePolyline: document.getElementById('floor-delete-polyline'),
             clearDrawing: document.getElementById('floor-clear-drawing'),
             lock45: document.getElementById('floor-lock-45'),
@@ -56,6 +57,30 @@
             render(svg, controls, state, hiddenInput);
         });
 
+        if (controls.removeLastPoint) {
+            controls.removeLastPoint.addEventListener('click', () => {
+                const targetId = state.activePolylineId || state.selectedPolylineId;
+                if (!targetId) {
+                    return;
+                }
+                const targetLine = state.polylines.find((line) => line.id === targetId);
+                if (!targetLine || targetLine.points.length === 0) {
+                    return;
+                }
+                targetLine.points.pop();
+                if (targetLine.points.length === 0) {
+                    state.polylines = state.polylines.filter((line) => line.id !== targetLine.id);
+                    if (state.activePolylineId === targetLine.id) {
+                        state.activePolylineId = null;
+                    }
+                    if (state.selectedPolylineId === targetLine.id) {
+                        state.selectedPolylineId = null;
+                    }
+                }
+                render(svg, controls, state, hiddenInput);
+            });
+        }
+
         controls.deletePolyline.addEventListener('click', () => {
             if (!state.selectedPolylineId) {
                 return;
@@ -212,7 +237,9 @@
     }
 
     function render(svg, controls, state, hiddenInput) {
-        const selected = state.polylines.find((line) => line.id === state.selectedPolylineId) || null;
+        const activeLine = state.polylines.find((line) => line.id === state.activePolylineId) || null;
+        const selectedLine = state.polylines.find((line) => line.id === state.selectedPolylineId) || null;
+        const undoLine = state.polylines.find((line) => line.id === (state.activePolylineId || state.selectedPolylineId)) || null;
 
         svg.innerHTML = '';
         svg.setAttribute('viewBox', `0 0 ${VIEWBOX_WIDTH} ${VIEWBOX_HEIGHT}`);
@@ -258,8 +285,8 @@
             svg.appendChild(line);
         });
 
-        if (selected) {
+        if (selectedLine) {
-            selected.points.forEach((point, index) => {
+            selectedLine.points.forEach((point, index) => {
                 const vertex = createSvgElement('circle');
                 vertex.setAttribute('cx', String(point.x));
                 vertex.setAttribute('cy', String(point.y));
@@ -267,7 +294,7 @@
                 vertex.setAttribute('fill', '#ffffff');
                 vertex.setAttribute('stroke', '#dc3545');
                 vertex.setAttribute('stroke-width', '3');
-                vertex.setAttribute('data-polyline-id', selected.id);
+                vertex.setAttribute('data-polyline-id', selectedLine.id);
                 vertex.setAttribute('data-vertex-index', String(index));
                 svg.appendChild(vertex);
             });
@@ -284,6 +311,16 @@
             controls.guideList.appendChild(li);
         });
 
+        if (controls.finishPolyline) {
+            controls.finishPolyline.disabled = !(activeLine && activeLine.points.length >= 2);
+        }
+        if (controls.removeLastPoint) {
+            controls.removeLastPoint.disabled = !(undoLine && undoLine.points.length > 0);
+        }
+        if (controls.deletePolyline) {
+            controls.deletePolyline.disabled = !selectedLine;
+        }
+
         hiddenInput.value = buildSvgMarkup(state.polylines, state.guides);
     }
 

app/modules/device_types/edit.php

@@ -15,6 +15,8 @@ $deviceTypeId = (int)($_GET['id'] ?? 0);
 $deviceType = null;
 $ports = [];
 
+//TODO port hinzufügen geht nicht
+
 if ($deviceTypeId > 0) {
     $deviceType = $sql->single(
         "SELECT * FROM device_types WHERE id = ?",

app/modules/floors/edit.php

@@ -99,6 +99,7 @@ if (!empty($floor['svg_path'])) {
                     <h4>Zeichenwerkzeug</h4>
                     <button type="button" class="button" id="floor-start-polyline">Neue Linie starten</button>
                     <button type="button" class="button" id="floor-finish-polyline">Linie beenden</button>
+                    <button type="button" class="button" id="floor-remove-last-point">Letzten Punkt entfernen</button>
                     <button type="button" class="button button-danger" id="floor-delete-polyline">Ausgewählte Linie löschen</button>
                     <button type="button" class="button button-danger" id="floor-clear-drawing">Alles löschen</button>