Re-enable button, add setting to choose how to add new features

assets/layers/last_click/last_click.json

@@ -3,7 +3,24 @@
   "name": null,
   "description": "This 'layer' is not really a layer, but contains part of the code how the popup to 'add a new marker' is displayed",
   "source": "special",
-  "isShown": "mouse_button=right",
+  "isShown": {
+    "or": [
+      {
+        "and": [
+          "mouse_button=right",
+          "_usermode=button_click_right"
+        ]
+      },
+      "_usermode=button_click",
+      "_usermode=click",
+      {
+        "and": [
+          "mouse_button=right",
+          "_usermode=click_right"
+        ]
+      }
+    ]
+  },
   "title": {
     "mappings": [
       {

assets/layers/usersettings/usersettings.json

@@ -466,6 +466,44 @@
         }
       ]
     },
+    {
+      "id": "add-new-feature",
+      "question": {
+        "en": "How should the menu to add a new feature be opened?"
+      },
+      "mappings": [
+        {
+          "if": "mapcomplete-preferences-add-new-mode=button",
+          "then": {
+            "en": "Adding a new feature is done with the button at the bottom left. Clicking the map does nothing"
+          }
+        },
+        {
+          "if": "mapcomplete-preferences-add-new-mode=click",
+          "then": {
+            "en": "When clicking or tapping the map, a marker pops up where a new feature is added"
+          }
+        },
+        {
+          "if": "mapcomplete-preferences-add-new-mode=click_right",
+          "then": {
+            "en": "When right-clicking or long-pressing the map, a marker pops up where a new feature can be added"
+          }
+        },
+        {
+          "if": "mapcomplete-preferences-add-new-mode=button_click",
+          "then": {
+            "en": "When clicking or tapping the map, a marker pops up where a new feature can be added. Additionally, a button at the bottom left is shown"
+          }
+        },
+        {
+          "if": "mapcomplete-preferences-add-new-mode=button_click_right",
+          "then": {
+            "en": "When right-clicking or long-pressing the map, a marker pops up where a new feature can be added. Additionally, a button at the bottom left is shown"
+          }
+        }
+      ]
+    },
     {
       "id": "fixate-north",
       "question": {

assets/themes/mapcomplete-changes/mapcomplete-changes.json

@@ -1,17 +1,13 @@
 {
   "id": "mapcomplete-changes",
   "title": {
-    "en": "Changes made with MapComplete",
+    "en": "Changes made with MapComplete"
-    "de": "Änderungen mit MapComplete"
   },
   "shortDescription": {
-    "en": "Shows changes made by MapComplete",
+    "en": "Shows changes made by MapComplete"
-    "de": "Änderungen von MapComplete anzeigen"
   },
   "description": {
-    "en": "This maps shows all the changes made with MapComplete",
+    "en": "This maps shows all the changes made with MapComplete"
-    "de": "Diese Karte zeigt alle mit MapComplete vorgenommenen Änderungen",
-    "pl": "Ta mapa pokazuje wszystkie zmiany wprowadzone za pomocą MapComplete"
   },
   "icon": "./assets/svg/logo.svg",
   "hideFromOverview": true,
@@ -22,9 +18,7 @@
     {
       "id": "mapcomplete-changes",
       "name": {
-        "en": "Changeset centers",
+        "en": "Changeset centers"
-        "de": "Zentrum der Änderungssätze",
-        "zh_Hant": "變更集中心"
       },
       "minzoom": 0,
       "source": {
@@ -34,48 +28,41 @@
       },
       "title": {
         "render": {
-          "en": "Changeset for {theme}",
+          "en": "Changeset for {theme}"
-          "de": "Änderungssatz für {theme}"
         }
       },
       "description": {
-        "en": "Shows all MapComplete changes",
+        "en": "Shows all MapComplete changes"
-        "de": "Alle MapComplete-Änderungen anzeigen"
       },
       "tagRenderings": [
         {
           "id": "show_changeset_id",
           "render": {
-            "en": "Changeset <a href='https://openstreetmap.org/changeset/{id}' target='_blank'>{id}</a>",
+            "en": "Changeset <a href='https://openstreetmap.org/changeset/{id}' target='_blank'>{id}</a>"
-            "de": "Änderungssatz <a href='https://openstreetmap.org/changeset/{id}' target='_blank'>{id}</a>"
           }
         },
         {
           "id": "contributor",
           "question": {
-            "en": "What contributor did make this change?",
+            "en": "What contributor did make this change?"
-            "de": "Welcher Mitwirkende hat diese Änderung vorgenommen?"
           },
           "freeform": {
             "key": "user"
           },
           "render": {
-            "en": "Change made by <a href='https://openstreetmap.org/user/{user}' target='_blank'>{user}</a>",
+            "en": "Change made by <a href='https://openstreetmap.org/user/{user}' target='_blank'>{user}</a>"
-            "de": "Änderung vorgenommen von <a href='https://openstreetmap.org/user/{user}' target='_blank'>{user}</a>"
           }
         },
         {
           "id": "theme-id",
           "question": {
-            "en": "What theme was used to make this change?",
+            "en": "What theme was used to make this change?"
-            "de": "Welches Thema wurde für die Änderung verwendet?"
           },
           "freeform": {
             "key": "theme"
           },
           "render": {
-            "en": "Change with theme <a href='https://mapcomplete.org/{theme}'>{theme}</a>",
+            "en": "Change with theme <a href='https://mapcomplete.org/{theme}'>{theme}</a>"
-            "de": "Geändert mit Thema <a href='https://mapcomplete.osm.be/{theme}'>{theme}</a>"
           }
         },
         {
@@ -84,23 +71,19 @@
             "key": "locale"
           },
           "question": {
-            "en": "What locale (language) was this change made in?",
+            "en": "What locale (language) was this change made in?"
-            "de": "In welcher Benutzersprache wurde die Änderung vorgenommen?"
           },
           "render": {
-            "en": "User locale is {locale}",
+            "en": "User locale is {locale}"
-            "de": "Benutzersprache {locale}"
           }
         },
         {
           "id": "host",
           "render": {
-            "en": "Change with with <a href='{host}'>{host}</a>",
+            "en": "Change with with <a href='{host}'>{host}</a>"
-            "de": "Änderung über <a href='{host}'>{host}</a>"
           },
           "question": {
-            "en": "What host (website) was this change made with?",
+            "en": "What host (website) was this change made with?"
-            "de": "Über welchen Host (Webseite) wurde diese Änderung vorgenommen?"
           },
           "freeform": {
             "key": "host"
@@ -121,12 +104,10 @@
         {
           "id": "version",
           "question": {
-            "en": "What version of MapComplete was used to make this change?",
+            "en": "What version of MapComplete was used to make this change?"
-            "de": "Mit welcher MapComplete Version wurde die Änderung vorgenommen?"
           },
           "render": {
-            "en": "Made with {editor}",
+            "en": "Made with {editor}"
-            "de": "Erstellt mit {editor}"
           },
           "freeform": {
             "key": "editor"
@@ -512,9 +493,7 @@
                 }
               ],
               "question": {
-                "en": "Themename contains {search}",
+                "en": "Themename contains {search}"
-                "de": "Themenname enthält {search}",
-                "pl": "Nazwa tematu zawiera {search}"
               }
             }
           ]
@@ -530,8 +509,7 @@
                 }
               ],
               "question": {
-                "en": "Themename does <b>not</b> contain {search}",
+                "en": "Themename does <b>not</b> contain {search}"
-                "de": "Themename enthält <b>not</b> {search}"
               }
             }
           ]
@@ -547,8 +525,7 @@
                 }
               ],
               "question": {
-                "en": "Made by contributor {search}",
+                "en": "Made by contributor {search}"
-                "de": "Erstellt vom Mitwirkenden {search}"
               }
             }
           ]
@@ -564,8 +541,7 @@
                 }
               ],
               "question": {
-                "en": "<b>Not</b> made by contributor {search}",
+                "en": "<b>Not</b> made by contributor {search}"
-                "de": "<b>Nicht</b> erstellt von Mitwirkendem {search}"
               }
             }
           ]
@@ -582,8 +558,7 @@
                 }
               ],
               "question": {
-                "en": "Made before {search}",
+                "en": "Made before {search}"
-                "de": "Erstellt vor {search}"
               }
             }
           ]
@@ -600,8 +575,7 @@
                 }
               ],
               "question": {
-                "en": "Made after {search}",
+                "en": "Made after {search}"
-                "de": "Erstellt nach {search}"
               }
             }
           ]
@@ -617,8 +591,7 @@
                 }
               ],
               "question": {
-                "en": "User language (iso-code) {search}",
+                "en": "User language (iso-code) {search}"
-                "de": "Benutzersprache (ISO-Code) {search}"
               }
             }
           ]
@@ -634,8 +607,7 @@
                 }
               ],
               "question": {
-                "en": "Made with host {search}",
+                "en": "Made with host {search}"
-                "de": "Erstellt mit Host {search}"
               }
             }
           ]
@@ -646,8 +618,7 @@
             {
               "osmTags": "add-image>0",
               "question": {
-                "en": "Changeset added at least one image",
+                "en": "Changeset added at least one image"
-                "de": "Änderungssatz hat mindestens ein Bild hinzugefügt"
               }
             }
           ]
@@ -658,8 +629,7 @@
             {
               "osmTags": "theme!=grb",
               "question": {
-                "en": "Exclude GRB theme",
+                "en": "Exclude GRB theme"
-                "de": "GRB-Thema ausschließen"
               }
             }
           ]
@@ -670,8 +640,7 @@
             {
               "osmTags": "theme!=etymology",
               "question": {
-                "en": "Exclude etymology theme",
+                "en": "Exclude etymology theme"
-                "de": "Etymologie-Thema ausschließen"
               }
             }
           ]
@@ -686,8 +655,7 @@
           {
             "id": "link_to_more",
             "render": {
-              "en": "More statistics can be found <a href='https://github.com/pietervdvn/MapComplete/tree/develop/Docs/Tools/graphs' target='_blank'>here</a>",
+              "en": "More statistics can be found <a href='https://github.com/pietervdvn/MapComplete/tree/develop/Docs/Tools/graphs' target='_blank'>here</a>"
-              "de": "Weitere Statistiken gibt es <a href='https://github.com/pietervdvn/MapComplete/tree/develop/Docs/Tools/graphs' target='_blank'>hier</a>"
             }
           },
           {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mapcomplete",
-  "version": "0.44.1",
+  "version": "0.44.2",
   "repository": "https://github.com/pietervdvn/MapComplete",
   "description": "A small website to edit OSM easily",
   "bugs": "https://github.com/pietervdvn/MapComplete/issues",

src/Logic/FeatureSource/Sources/LastClickFeatureSource.ts

@@ -1,5 +1,5 @@
 import LayoutConfig from "../../../Models/ThemeConfig/LayoutConfig"
-import { ImmutableStore, Store } from "../../UIEventSource"
+import { ImmutableStore, Store, UIEventSource } from "../../UIEventSource"
 import { Feature, Point } from "geojson"
 import { TagUtils } from "../../Tags/TagUtils"
 import BaseUIElement from "../../../UI/BaseUIElement"
@@ -18,10 +18,13 @@ export class LastClickFeatureSource implements FeatureSource {
     private readonly hasNoteLayer: boolean
     public static readonly newPointElementId = "new_point_dialog"
     public readonly features: Store<Feature[]>
+    private _usermode: UIEventSource<string>
     constructor(
         layout: LayoutConfig,
-        clickSource: Store<{ lon: number; lat: number; mode: "left" | "right" | "middle" }>
+        clickSource: Store<{ lon: number; lat: number; mode: "left" | "right" | "middle" }>,
+        usermode?: UIEventSource<string>
     ) {
+        this._usermode = usermode
         this.hasNoteLayer = layout.hasNoteLayer()
         this.hasPresets = layout.hasPresets()
         const allPresets: BaseUIElement[] = []
@@ -65,6 +68,7 @@ export class LastClickFeatureSource implements FeatureSource {
             number_of_presets: "" + this.renderings.length,
             first_preset: this.renderings[0],
             mouse_button: mode ?? "none",
+            _usermode: this._usermode?.data
         }
         this.i++
 

src/Logic/MetaTagging.ts

@@ -118,6 +118,9 @@ export default class MetaTagging {
         }
         const state = this.state
         const layer = state.layout.getMatchingLayer(feature.properties)
+        if(!layer){
+            return
+        }
         // Force update if the tags of the element changed
         MetaTagging.addMetatags(
             [feature],

src/Logic/State/UserRelatedState.ts

@@ -61,6 +61,9 @@ export default class UserRelatedState {
         7 * 24 * 60 * 60,
         "gps_location_retention"
     )
+
+    public readonly addNewFeatureMode = new UIEventSource<"button" | "button_click_right" | "button_click" | "click" | "click_right">("button_click_right")
+
     /**
      * Preferences as tags exposes many preferences and state properties as record.
      * This is used to bridge the internal state with the usersettings.json layerconfig file
@@ -127,6 +130,14 @@ export default class UserRelatedState {
             }
         )
 
+        this.addNewFeatureMode = this.osmConnection.GetPreference(
+            "preferences-add-new-mode",
+            "button_click_right",
+            {
+                documentation: "How adding a new feature is done"
+            }
+        )
+
         this.imageLicense = this.osmConnection.GetPreference("pictures-license", "CC0", {
             documentation: "The license under which new images are uploaded",
         })

src/Logic/State/UserSettingsMetaTagging.ts

@@ -4,39 +4,11 @@ export class ThemeMetaTagging {
    public static readonly themeName = "usersettings"
 
    public metaTaggging_for_usersettings(feat: {properties: Record<string, string>}) {
-        Utils.AddLazyProperty(feat.properties, "_mastodon_candidate_md", () =>
+      Utils.AddLazyProperty(feat.properties, '_mastodon_candidate_md', () => feat.properties._description.match(/\[[^\]]*\]\((.*(mastodon|en.osm.town).*)\).*/)?.at(1) ) 
-            feat.properties._description
+      Utils.AddLazyProperty(feat.properties, '_d', () => feat.properties._description?.replace(/&lt;/g,'<')?.replace(/&gt;/g,'>') ?? '' ) 
-                .match(/\[[^\]]*\]\((.*(mastodon|en.osm.town).*)\).*/)
+      Utils.AddLazyProperty(feat.properties, '_mastodon_candidate_a', () => (feat => {const e = document.createElement('div');e.innerHTML = feat.properties._d;return Array.from(e.getElementsByTagName("a")).filter(a => a.href.match(/mastodon|en.osm.town/) !== null)[0]?.href   }) (feat)  ) 
-                ?.at(1)
+      Utils.AddLazyProperty(feat.properties, '_mastodon_link', () => (feat => {const e = document.createElement('div');e.innerHTML = feat.properties._d;return Array.from(e.getElementsByTagName("a")).filter(a => a.getAttribute("rel")?.indexOf('me') >= 0)[0]?.href})(feat)  ) 
-        )
+      Utils.AddLazyProperty(feat.properties, '_mastodon_candidate', () => feat.properties._mastodon_candidate_md ?? feat.properties._mastodon_candidate_a ) 
-        Utils.AddLazyProperty(
+      feat.properties['__current_backgroun'] = 'initial_value'
-            feat.properties,
-            "_d",
-            () => feat.properties._description?.replace(/&lt;/g, "<")?.replace(/&gt;/g, ">") ?? ""
-        )
-        Utils.AddLazyProperty(feat.properties, "_mastodon_candidate_a", () =>
-            ((feat) => {
-                const e = document.createElement("div")
-                e.innerHTML = feat.properties._d
-                return Array.from(e.getElementsByTagName("a")).filter(
-                    (a) => a.href.match(/mastodon|en.osm.town/) !== null
-                )[0]?.href
-            })(feat)
-        )
-        Utils.AddLazyProperty(feat.properties, "_mastodon_link", () =>
-            ((feat) => {
-                const e = document.createElement("div")
-                e.innerHTML = feat.properties._d
-                return Array.from(e.getElementsByTagName("a")).filter(
-                    (a) => a.getAttribute("rel")?.indexOf("me") >= 0
-                )[0]?.href
-            })(feat)
-        )
-        Utils.AddLazyProperty(
-            feat.properties,
-            "_mastodon_candidate",
-            () => feat.properties._mastodon_candidate_md ?? feat.properties._mastodon_candidate_a
-        )
-        feat.properties["__current_backgroun"] = "initial_value"
    }
 }

src/Models/ThemeViewState.ts

@@ -331,6 +331,7 @@ export default class ThemeViewState implements SpecialVisualizationState {
         this.lastClickObject = new LastClickFeatureSource(
             this.layout,
             this.mapProperties.lastClickLocation,
+            this.userRelatedState.addNewFeatureMode
         )
 
         this.osmObjectDownloader = new OsmObjectDownloader(

src/UI/BigComponents/SelectedElementView.svelte

@@ -12,6 +12,7 @@
   import Delete_icon from "../../assets/svg/Delete_icon.svelte"
   import BackButton from "../Base/BackButton.svelte"
   import TagRenderingEditableDynamic from "../Popup/TagRendering/TagRenderingEditableDynamic.svelte"
+  import { LastClickFeatureSource } from "../../Logic/FeatureSource/Sources/LastClickFeatureSource"
 
   export let state: SpecialVisualizationState
   export let selectedElement: Feature
@@ -25,7 +26,7 @@
     if (properties.id === "settings") {
       return UserRelatedState.usersettingsConfig
     }
-    if (properties.id === "new_point_dialog") {
+    if (properties.id.startsWith(LastClickFeatureSource.newPointElementId)) {
       return state.layout.layers.find((l) => l.id === "last_click")
     }
     if (properties.id === "location_track") {

src/UI/Map/MapLibreAdaptor.ts

@@ -148,10 +148,8 @@ export class MapLibreAdaptor implements MapProperties, ExportableMap {
             map.on("click", (e) => {
                 handleClick(e)
             })
-            map.on("contextmenu", (e) => {
+
-                // This one only works on desktop
+            // map.on("contextmenu", ...) only works on desktop, hence we listen to the container:
-                handleClick(e, "right")
-            })
 
             map._container.addEventListener("contextmenu", (e) => {
                 const lngLat = map.unproject([e.x, e.y])

src/UI/ThemeViewGUI.svelte

@@ -108,7 +108,7 @@
     if (element.properties.id.startsWith("current_view")) {
       return currentViewLayer
     }
-    if (element.properties.id === "new_point_dialog") {
+    if (element.properties.id.startsWith(LastClickFeatureSource.newPointElementId)) {
       return layout.layers.find((l) => l.id === "last_click")
     }
     if (element.properties.id === "location_track") {
@@ -206,6 +206,7 @@
   }
   let openFilterButton: UIEventSource<HTMLElement> = new UIEventSource<HTMLElement>(undefined)
   let openBackgroundButton: UIEventSource<HTMLElement> = new UIEventSource<HTMLElement>(undefined)
+  let addNewFeatureMode = state.userRelatedState.addNewFeatureMode
 </script>
 
 <main>
@@ -306,7 +307,7 @@
     <div class="flex w-full items-end justify-between px-4">
       <div class="flex flex-col">
         <If condition={featureSwitches.featureSwitchEnableLogin}>
-          {#if (state.layout.hasPresets() && state.layout.enableAddNewPoints) || state.layout.hasNoteLayer()}
+          {#if $addNewFeatureMode.indexOf("button") >= 0 && ((state.layout.hasPresets() && state.layout.enableAddNewPoints) || state.layout.hasNoteLayer())}
             <button
               class="low-interaction pointer-events-auto w-fit"
               class:disabled={$currentZoom < Constants.minZoomLevelToAddNewPoint}