L.PM.setOptIn() Bug fix and pmIgnore improvements with the editing tools

cypress/integration/polygon.spec.js

@@ -53,6 +53,64 @@ describe('Draw & Edit Poly', () => {
     cy.hasVertexMarkers(0);
   });
 
+  it('OptIn drawing without error', () => {
+    cy.window().then(({ L }) => {
+      L.PM.setOptIn(true);
+    });
+    cy.toolbarButton('polygon').click();
+    cy.get(mapSelector)
+      .click(120, 150)
+      .click(120, 100)
+      .click(300, 100)
+      .click(300, 200)
+      .click(120, 150);
+
+    cy.hasDrawnLayers(1);
+  });
+
+  it('pmIgnore:true disable editing', () => {
+    cy.window().then(({ map }) => {
+      map.on('pm:create',(e)=> {
+        e.layer.options.pmIgnore = true;
+      })
+    });
+
+    cy.toolbarButton('polygon').click();
+    cy.get(mapSelector)
+      .click(120, 150)
+      .click(120, 100)
+      .click(300, 100)
+      .click(300, 200)
+      .click(120, 150);
+
+    cy.hasDrawnLayers(1);
+    cy.toolbarButton('edit').click();
+    cy.hasVertexMarkers(0);
+  });
+
+
+  it('pmIgnore:true disable deleting', () => {
+    cy.window().then(({ map }) => {
+      map.on('pm:create',(e)=> {
+        e.layer.options.pmIgnore = true;
+      })
+    });
+
+    cy.toolbarButton('polygon').click();
+    cy.get(mapSelector)
+      .click(120, 150)
+      .click(120, 100)
+      .click(300, 100)
+      .click(300, 200)
+      .click(120, 150);
+
+    cy.hasDrawnLayers(1);
+    cy.toolbarButton('delete').click();
+    cy.get(mapSelector)
+      .click(220, 160);
+    cy.hasDrawnLayers(1);
+  });
+
   it('respects pmIgnore with optIn', () => {
     cy.window().then(({ L }) => {
       L.PM.setOptIn(true);

cypress/support/commands.js

@@ -32,6 +32,13 @@ Cypress.Commands.add('hasLayers', count => {
   });
 });
 
+Cypress.Commands.add('hasDrawnLayers', count => {
+  cy.window().then(({ map }) => {
+    const layerCount = Object.keys(map._layers).filter(l => map._layers[l]._drawnByGeoman).length;
+    cy.wrap(layerCount).should('eq', count);
+  });
+});
+
 Cypress.Commands.add('testLayerAdditionPerformance', () => {
   let t0;
 

src/js/Draw/L.PM.Draw.Cut.js

@@ -74,6 +74,13 @@ Draw.Cut = Draw.Polygon.extend({
       .map(l => all[l])
       // only layers handled by leaflet-geoman
       .filter(l => l.pm)
+      .filter(l => !l._pmTempLayer)
+      // filter out everything that ignore leaflet-geoman
+      .filter(l => (
+          (!L.PM.optIn && !l.options.pmIgnore) || // if optIn is not set / true and pmIgnore is not set / true (default)
+          (L.PM.optIn && l.options.pmIgnore === false) // if optIn is true and pmIgnore is false);
+        )
+      )
       // only polyline instances
       .filter(l => l instanceof L.Polyline)
       // exclude the drawn one

src/js/Draw/L.PM.Draw.js

@@ -174,10 +174,10 @@ const Draw = L.Class.extend({
     return this[name] ? this[name]._shape : name;
   },
   _finishLayer(layer){
-    // add the pm options from drawing to the new layer (edit)
-    layer.pm.setOptions(this.options);
-    // set the shape (can be a custom shape)
-    if(layer.pm) {
+    if (layer.pm) {
+      // add the pm options from drawing to the new layer (edit)
+      layer.pm.setOptions(this.options);
+      // set the shape (can be a custom shape)
       layer.pm._shape = this._shape;
     }
     this._addDrawnLayerProp(layer);

src/js/L.PM.Utils.js

@@ -29,6 +29,13 @@ const Utils = {
     // filter out everything that's leaflet-geoman specific temporary stuff
     layers = layers.filter(layer => !layer._pmTempLayer);
 
+    // filter out everything that ignore leaflet-geoman
+    layers = layers.filter(layer => (
+        (!L.PM.optIn && !layer.options.pmIgnore) || // if optIn is not set / true and pmIgnore is not set / true (default)
+        (L.PM.optIn && layer.options.pmIgnore === false) // if optIn is true and pmIgnore is false);
+      )
+    );
+
     return layers;
   },
   circleToPolygon(circle, sides = 60) {

src/js/Mixins/Modes/Mode.Removal.js

@@ -2,14 +2,10 @@ import Utils from "../../L.PM.Utils";
 
 const GlobalRemovalMode = {
   enableGlobalRemovalMode() {
-    const isRelevant = layer =>
-      layer.pm &&
-      !(layer instanceof L.LayerGroup);
-
     this._globalRemovalMode = true;
     // handle existing layers
     this.map.eachLayer(layer => {
-      if (isRelevant(layer)) {
+      if (this._isRelevant(layer)) {
         layer.pm.disable();
         layer.on('click', this.removeLayer, this);
       }
@@ -58,8 +54,7 @@ const GlobalRemovalMode = {
   },
   reinitGlobalRemovalMode({ layer }) {
     // do nothing if layer is not handled by leaflet so it doesn't fire unnecessarily
-    const isRelevant = !!layer.pm && !layer._pmTempLayer;
-    if (!isRelevant) {
+    if (!this._isRelevant(layer)) {
       return;
     }
 
@@ -79,8 +74,7 @@ const GlobalRemovalMode = {
     const layer = e.target;
     // only remove layer, if it's handled by leaflet-geoman,
     // not a tempLayer and not currently being dragged
-    const removeable =
-      !layer._pmTempLayer && (!layer.pm || !layer.pm.dragging());
+    const removeable = this._isRelevant(layer) && !layer.pm.dragging();
 
     if (removeable) {
       layer.removeFrom(this.map.pm._getContainingLayer());
@@ -95,6 +89,15 @@ const GlobalRemovalMode = {
 
     }
   },
+  _isRelevant(layer){
+    return layer.pm
+      && !(layer instanceof L.LayerGroup)
+      && (
+        (!L.PM.optIn && !layer.options.pmIgnore) || // if optIn is not set / true and pmIgnore is not set / true (default)
+        (L.PM.optIn && layer.options.pmIgnore === false) // if optIn is true and pmIgnore is false
+      )
+      && !layer._pmTempLayer
+  }
 };
 
 export default GlobalRemovalMode

src/js/Mixins/Snapping.js

@@ -216,6 +216,12 @@ const SnapMixin = {
 
     // save snaplist from layers and the other snap layers added from other classes/scripts
     if (this._otherSnapLayers) {
+      this._otherSnapLayers.forEach(()=>{
+        // this is for debugging
+        const debugLine = L.polyline([], {color: 'red', pmIgnore: true});
+        debugLine._pmTempLayer = true;
+        debugIndicatorLines.push(debugLine);
+      })
       this._snapList = layers.concat(this._otherSnapLayers);
     } else {
       this._snapList = layers;
@@ -245,8 +251,10 @@ const SnapMixin = {
       // find the closest latlng, segment and the distance of this layer to the dragged marker latlng
       const results = this._calcLayerDistances(latlng, layer);
 
-      // show indicator lines, it's for debugging
-      this.debugIndicatorLines[index].setLatLngs([latlng, results.latlng]);
+      if(this.debugIndicatorLines[index]) {
+        // show indicator lines, it's for debugging
+        this.debugIndicatorLines[index].setLatLngs([latlng, results.latlng]);
+      }
 
       // save the info if it doesn't exist or if the distance is smaller than the previous one
       if (