diff --git a/Drawing.js b/Drawing.js
index 7d129b0..0cc7c57 100644
--- a/Drawing.js
+++ b/Drawing.js
@@ -22,8 +22,7 @@ const map = new mapboxgl.Map({
 const draw = new MapboxDraw({
     displayControlsDefault: false,
     controls: {
-        line_string: true,
-        trash: true
+        line_string: true
     },
     defaultMode: 'draw_line_string',
     styles: [
@@ -94,16 +93,8 @@ const draw = new MapboxDraw({
 
 
 map.addControl(draw, 'top-left');
+
 map.on('draw.create', handleDraw);
-map.on('draw.delete', () => {
-    draw.deleteAll();
-    clearAllArrowLayers();
-    clearAllFrontlineLayers();
-    hideArrowEditor();
-    hideFrontlineEditor();
-    document.getElementById('calculated-area').innerHTML = '';
-});
-map.on('draw.update', handleDraw);
 map.on('click', (e) => {
     const arrowFeatures = map.queryRenderedFeatures(e.point, {
         layers: map.getStyle().layers
@@ -121,7 +112,6 @@ map.on('click', (e) => {
             const params = arrowParamsMap.get(featureId);
             if (params) {
                 showArrowEditor(params);
-                hideFrontlineEditor();
             }
 
             draw.changeMode('direct_select', { featureId: featureId });
@@ -129,37 +119,35 @@ map.on('click', (e) => {
         return;
     }
 
-    // Pokud to není arrow, zkus frontline
-    const frontlineFeatures = map.queryRenderedFeatures(e.point, {
-        layers: map.getStyle().layers
-            .filter(l => l.id.startsWith('frontline-'))
-            .map(l => l.id)
-    });
-
-    if (frontlineFeatures.length > 0) {
-        const frontlineFeature = frontlineFeatures[0];
-        const featureId = frontlineFeature.layer.id.replace('frontline-', '');
-
-        const allFeatures = draw.getAll().features;
-        currentFeature = allFeatures.find(f => f.id === featureId);
-
-        if (currentFeature) {
-            const params = frontlineParamsMap.get(featureId);
-            if (params) {
-                showFrontlineEditor(params);
-                hideArrowEditor();
-            }
-
-            draw.changeMode('direct_select', { featureId: featureId });
-        }
-        return;
-    }
 
     hideArrowEditor();
-    hideFrontlineEditor();
 });
 map.dragPan.enable();
 
+function MyDelete()
+{
+    if (!currentFeature) return;
+    
+    const id = currentFeature.id;
+
+    draw.delete(id);
+    //ARROW
+    const arrowLayerId = `arrow-${id}`;
+    if (map.getLayer(arrowLayerId)) map.removeLayer(arrowLayerId);
+    if (map.getSource(arrowLayerId)) map.removeSource(arrowLayerId);
+
+    arrowParamsMap.delete(id);
+
+    //Frontline
+    const frontlineLayerId = `frontline-${id}`;
+    if (map.getLayer(frontlineLayerId)) map.removeLayer(frontlineLayerId);
+    if (map.getSource(frontlineLayerId)) map.removeSource(frontlineLayerId);
+    frontlineParamsMap.delete(id);
+
+    hideArrowEditor();
+    hideFrontlineEditor();
+    document.getElementById('calculated-area').innerHTML = '';
+}
 
 function handleDraw(e) {
     const data = draw.getAll();
@@ -198,6 +186,7 @@ function handleDraw(e) {
                     { widthArrow: params.widthArrow, lengthArrow: params.lengthArrow }
                 );
 
+                console.log('Draw');
                 drawArrowOnMap(arrowGeoJSON, `arrow-${id}`);
 
             } else if (currentDrawStyle === 'frontline') {
@@ -289,17 +278,17 @@ function drawFrontlineOnMap(frontlineGeoJSON, id) {
 }
 
 function clearAllArrowLayers() {
-    const layers = map.getStyle().layers;
-    if (!layers) return;
+    const allLayerIds = map.getStyle().layers.map(l => l.id);
 
-    layers.forEach(layer => {
-        if (layer.id.startsWith('arrow-')) {
-            if (map.getLayer(layer.id)) map.removeLayer(layer.id);
-            if (map.getSource(layer.id)) map.removeSource(layer.id);
+    allLayerIds.forEach(id => {
+        if (id.startsWith('arrow-')) {
+            if (map.getLayer(id)) map.removeLayer(id);
+            if (map.getSource(id)) map.removeSource(id);
         }
     });
 }
 
+
 function clearAllFrontlineLayers() {
     const layers = map.getStyle().layers;
     if (!layers) return;
@@ -360,111 +349,116 @@ function hideFrontlineEditor() {
 }
 
 document.addEventListener('DOMContentLoaded', () => {
-document.getElementById('applyArrowChanges').addEventListener('click', () => {
-    
-    console.log("arrowFeatures");
-    console.log(arrowFeatures);
-    if (!currentFeature) return;
-    console.log("Test");
-    const coords = currentFeature.geometry.coordinates;
-    const id = currentFeature.id;
 
-    const splineStep = parseFloat(document.getElementById('splineStep').value);
-    const offsetDistance = parseFloat(document.getElementById('offsetDistance').value);
-    const range = parseFloat(document.getElementById('range').value);
-    const minValue = parseFloat(document.getElementById('minValue').value);
-    const widthArrow = parseFloat(document.getElementById('widthArrow').value);
-    const lengthArrow = parseFloat(document.getElementById('lengthArrow').value);
-
-    arrowParamsMap.set(id, {
-        splineStep,
-        offsetDistance,
-        calculation: ARROW_BODY_STYLE_LINEAR,
-        range,
-        minValue,
-        widthArrow,
-        lengthArrow
+    document.getElementById('removeArrow').addEventListener('click', () => {
+        
+        MyDelete();
     });
 
-    const arrowGeoJSON = getArrowPolygon({
-        points: coords,
-        splineStep,
-        offsetDistance
-    }, {
-        calculation: ARROW_BODY_STYLE_LINEAR,
-        range,
-        minValue
-    }, {
-        widthArrow,
-        lengthArrow
+    document.getElementById('applyArrowChanges').addEventListener('click', () => {
+        
+        if (!currentFeature) return;
+        console.log("Test");
+        const coords = currentFeature.geometry.coordinates;
+        const id = currentFeature.id;
+
+        const splineStep = parseFloat(document.getElementById('splineStep').value);
+        const offsetDistance = parseFloat(document.getElementById('offsetDistance').value);
+        const range = parseFloat(document.getElementById('range').value);
+        const minValue = parseFloat(document.getElementById('minValue').value);
+        const widthArrow = parseFloat(document.getElementById('widthArrow').value);
+        const lengthArrow = parseFloat(document.getElementById('lengthArrow').value);
+
+        arrowParamsMap.set(id, {
+            splineStep,
+            offsetDistance,
+            calculation: ARROW_BODY_STYLE_LINEAR,
+            range,
+            minValue,
+            widthArrow,
+            lengthArrow
+        });
+
+        const arrowGeoJSON = getArrowPolygon({
+            points: coords,
+            splineStep,
+            offsetDistance
+        }, {
+            calculation: ARROW_BODY_STYLE_LINEAR,
+            range,
+            minValue
+        }, {
+            widthArrow,
+            lengthArrow
+        });
+        drawArrowOnMap(arrowGeoJSON, `arrow-${id}`);
     });
 
-    drawArrowOnMap(arrowGeoJSON, `arrow-${id}`);
-});
+    document.getElementById('applyFrontlineChanges').addEventListener('click', () => {
+        if (!currentFeature) return;
 
-document.getElementById('applyFrontlineChanges').addEventListener('click', () => {
-    if (!currentFeature) return;
+        const coords = currentFeature.geometry.coordinates;
+        const id = currentFeature.id;
 
-    const coords = currentFeature.geometry.coordinates;
-    const id = currentFeature.id;
+        const splineStep = parseFloat(document.getElementById('splineStepFrontline').value);
+        const spacing = parseFloat(document.getElementById('spacing').value);
+        const offsetDistance = parseFloat(document.getElementById('offsetDistanceFrontline').value);
+        const style = document.getElementById('styleFrontline').value;
 
-    const splineStep = parseFloat(document.getElementById('splineStepFrontline').value);
-    const spacing = parseFloat(document.getElementById('spacing').value);
-    const offsetDistance = parseFloat(document.getElementById('offsetDistanceFrontline').value);
-    const style = document.getElementById('styleFrontline').value;
+        const length = parseFloat(document.getElementById('protrusionLength').value);
+        const startSize = parseFloat(document.getElementById('protrusionStartSize').value);
+        const endSize = parseFloat(document.getElementById('protrusionEndSize').value);
+        const gap = parseFloat(document.getElementById('protrusionGap').value);
 
-    const length = parseFloat(document.getElementById('protrusionLength').value);
-    const startSize = parseFloat(document.getElementById('protrusionStartSize').value);
-    const endSize = parseFloat(document.getElementById('protrusionEndSize').value);
-    const gap = parseFloat(document.getElementById('protrusionGap').value);
+        frontlineParamsMap.set(id, {
+            splineStep,
+            spacing,
+            offsetDistance,
+            style,
+            protrusion: {
+                length,
+                startSize,
+                endSize,
+                gap
+            }
+        });
 
-    frontlineParamsMap.set(id, {
-        splineStep,
-        spacing,
-        offsetDistance,
-        style,
-        protrusion: {
-            length,
-            startSize,
-            endSize,
-            gap
+        const frontlineData = {
+            points: coords,
+            splineStep,
+            spacing,
+            offsetDistance,
+            style
+        };
+
+        const protrusionData = frontlineParamsMap.get(id).protrusion;
+
+        const frontlineGeoJSON = getFrontline(frontlineData, protrusionData);
+
+        let polygonToDraw = frontlineGeoJSON;
+        if (frontlineGeoJSON.leftPoly || frontlineGeoJSON.rightPoly) {
+            polygonToDraw = frontlineGeoJSON.leftPoly || frontlineGeoJSON.rightPoly;
         }
+
+        drawFrontlineOnMap(polygonToDraw, `frontline-${id}`);
     });
 
-    const frontlineData = {
-        points: coords,
-        splineStep,
-        spacing,
-        offsetDistance,
-        style
-    };
+    const buttonsContainer = document.getElementById('drawStyleButtons');
+    buttonsContainer.addEventListener('click', (event) => {
+        if (event.target.tagName !== 'BUTTON') return;
 
-    const protrusionData = frontlineParamsMap.get(id).protrusion;
+        // Odeber aktivní třídu ze všech tlačítek
+        Array.from(buttonsContainer.querySelectorAll('button')).forEach(btn => btn.classList.remove('active'));
 
-    const frontlineGeoJSON = getFrontline(frontlineData, protrusionData);
+        // Nastav aktivní třídu na kliknuté tlačítko
+        event.target.classList.add('active');
 
-    let polygonToDraw = frontlineGeoJSON;
-    if (frontlineGeoJSON.leftPoly || frontlineGeoJSON.rightPoly) {
-        polygonToDraw = frontlineGeoJSON.leftPoly || frontlineGeoJSON.rightPoly;
-    }
+        // Nastav styl podle data atributu
+        currentDrawStyle = event.target.getAttribute('data-style');
 
-    drawFrontlineOnMap(polygonToDraw, `frontline-${id}`);
-});
-
-const buttonsContainer = document.getElementById('drawStyleButtons');
-buttonsContainer.addEventListener('click', (event) => {
-    if (event.target.tagName !== 'BUTTON') return;
-
-    // Odeber aktivní třídu ze všech tlačítek
-    Array.from(buttonsContainer.querySelectorAll('button')).forEach(btn => btn.classList.remove('active'));
-
-    // Nastav aktivní třídu na kliknuté tlačítko
-    event.target.classList.add('active');
-
-    // Nastav styl podle data atributu
-    currentDrawStyle = event.target.getAttribute('data-style');
-
-    // Při změně stylu překreslíme aktuální kreslené prvky
-    handleDraw({ type: 'draw.update' });
-});
+        // Při změně stylu překreslíme aktuální kreslené prvky
+        
+                    console.log('handleDraw');
+        handleDraw({ type: 'draw.update' });
+    });
 });
\ No newline at end of file
diff --git a/index.html b/index.html
index dfe9928..89acccf 100644
--- a/index.html
+++ b/index.html
@@ -70,6 +70,7 @@ MAPBOX - DRAWING
     <label>Width Arrow: <input id="widthArrow" type="number" step="1"></label><br>
     <label>Length Arrow: <input id="lengthArrow" type="number" step="1"></label><br>
     <button id="applyArrowChanges">Apply Changes</button>
+    <button id="removeArrow">Remove Arrow</button>
 </div>
 
 <div id="frontline-editor" style="position: absolute; background: white; padding: 10px; border: 1px solid #ccc; display: none; z-index: 1000;">
@@ -90,6 +91,7 @@ MAPBOX - DRAWING
     <label>End Size: <input id="protrusionEndSize" type="number" step="100"></label><br>
     <label>Gap: <input id="protrusionGap" type="number" step="100"></label><br>
     <button id="applyFrontlineChanges">Apply Changes</button>
+    <button id="removeFrontline">Remove Arrow</button>
 </div>
 
     <div id="drawStyleButtons" style="position: absolute; top: 10px; left: 50px; background: white; padding: 5px; z-index: 10;">