feat: add new "Back to home" icon (#2551)

![image](https://github.com/user-attachments/assets/415a7e36-fb34-459e-8890-cd3c6830512b)

docs-users/requirements.txt

@@ -1,5 +1,5 @@
 # Force rtfd to use a recent version of mkdocs
 mkdocs==1.6.1
 pymdown-extensions==10.14.3
-mkdocs-material==9.6.4
+mkdocs-material==9.6.7
 mkdocs-static-i18n==1.3.0

docs/requirements.txt

@@ -1,5 +1,5 @@
 # Force rtfd to use a recent version of mkdocs
 mkdocs==1.6.1
 pymdown-extensions==10.14.3
-mkdocs-material==9.6.4
+mkdocs-material==9.6.7
 mkdocs-static-i18n==1.3.0

pyproject.toml

@@ -44,10 +44,10 @@ dependencies = [
 [project.optional-dependencies]
 dev = [
   "hatch==1.14.0",
-  "ruff==0.9.9",
+  "ruff==0.9.10",
   "djlint==1.36.4",
   "mkdocs==1.6.1",
-  "mkdocs-material==9.6.4",
+  "mkdocs-material==9.6.7",
   "mkdocs-static-i18n==1.3.0",
   "vermin==1.6.0",
   "pymdown-extensions==10.14.3",
@@ -57,18 +57,18 @@ test = [
   "daphne==4.1.2",
   "factory-boy==3.3.3",
   "playwright>=1.39",
-  "pytest==8.3.4",
+  "pytest==8.3.5",
   "pytest-django==4.10.0",
   "pytest-playwright==0.7.0",
   "pytest-rerunfailures==15.0",
   "pytest-xdist>=3.5.0,<4",
-  "moto[s3]==5.0.28"
+  "moto[s3]==5.1.1"
 ]
 docker = [
   "uwsgi==2.0.28",
 ]
 s3 = [
-  "django-storages[s3]==1.14.4",
+  "django-storages[s3]==1.14.5",
 ]
 sync = [
   "pydantic==2.10.6",

umap/static/umap/css/icon.css

@@ -143,6 +143,9 @@ html[dir="rtl"] .icon {
 .icon-marker {
     background-position: calc(var(--tile) * 7) var(--tile);
 }
+.icon-marker-plus {
+    background-position: calc(var(--tile) * 8) var(--tile);
+}
 .icon-multipolygon {
     background-position: calc(var(--tile) * 7) calc(var(--tile) * 5);
 }
@@ -155,6 +158,9 @@ html[dir="rtl"] .icon {
 .icon-polygon {
     background-position: calc(var(--tile) * 7) calc(var(--tile) * 4);
 }
+.icon-polygon-plus {
+    background-position: calc(var(--tile) * 8) calc(var(--tile) * 4);
+}
 .icon-polyline {
     background-position: calc(var(--tile) * 7) calc(var(--tile) * 6);
 }

umap/static/umap/img/16-white.svg

@@ -1,4 +1,4 @@
-<svg id="svg2" width="192" height="192" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+<svg id="svg2" width="216" height="192" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
  <defs id="defs4">
   <clipPath id="clip0_241_10857">
    <rect id="rect586" width="18.05" height="19.01" fill="#fff"/>
@@ -15,6 +15,9 @@
   <clipPath id="clip0_2695_1939">
    <rect id="rect1" width="20" height="20" fill="#fff"/>
   </clipPath>
+  <clipPath id="clip0_3071_861">
+   <rect id="rect3" width="18" height="20" fill="#fff"/>
+  </clipPath>
  </defs>
  <metadata id="metadata7">
   <rdf:RDF>
@@ -210,5 +213,13 @@
   </g>
   <path id="star" class="sprite" d="m7.6698 998.86 1.3886-5.255-4.0585-3.2468h5.1831l1.8193-5.4949 1.8147 5.4939h5.1829l-4.0615 3.2496 1.3838 5.2564-4.3249-3.0123z" fill="#efefef"/>
   <path id="starred" class="sprite" d="m31.67 998.86 1.3886-5.255-4.0585-3.2468h5.1831l1.8193-5.4949 1.8147 5.4939h5.1829l-4.0615 3.2496 1.3838 5.2565-4.3249-3.0123z" fill="none" stroke="#efefef" stroke-linecap="square" stroke-linejoin="round"/>
+  <g id="g3" transform="translate(194.89 910.26)" clip-path="url(#clip0_3071_861)" stroke="#efefef">
+   <path id="path1-9" d="m1.8947 0.69727v2.3256h1.1013l-1.0184 13.953h-1.2671v2.3256h2.3684v-1.3953l9.4737-1.8605v0.9302h2.3684v-2.3255h-0.9237l1.8355-8.1396h1.4448v-2.3256h-2.3685v0.84883l-10.646-2.8605v-1.4767z" clip-rule="evenodd" fill="none" fill-rule="evenodd" stroke-width="1.2"/>
+   <path id="path2-1" d="m8.5972 6.8457v5.8915" stroke-width="1.0133"/>
+   <path id="path3-2" d="m11.598 9.791h-6" stroke-width="1.0133"/>
+  </g>
+  <path id="path1-0" d="m204.42 838.96c-2.9773 0-5.9659 1.9462-6.8182 5.85 0 2.3354 1.7046 7.0178 6.8182 12.467 5.1136-5.4608 6.8182-10.132 6.8182-12.467-0.8523-3.8924-3.8409-5.85-6.8182-5.85z" fill="none" stroke="#efefef" stroke-width="1.2"/>
+  <path id="path2-9" d="m204.42 843.98v6.0446" fill="none" stroke="#efefef" stroke-width="1.056"/>
+  <path id="path3-36" d="m207.42 847h-6" fill="none" stroke="#efefef" stroke-width="1.056"/>
  </g>
 </svg>

umap/static/umap/img/home.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="38" height="38" viewBox="0 0 38 38" fill="none" version="1.1" id="svg3" sodipodi:docname="home.svg" inkscape:version="1.4 (e7c3feb100, 2024-10-09)" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
+  <defs id="defs3" />
+  <sodipodi:namedview id="namedview3" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:zoom="18.394737" inkscape:cx="19" inkscape:cy="19.027182" inkscape:window-width="1920" inkscape:window-height="1011" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="svg3" />
+  <path d="M14.2749 9C12.0205 10.0243 10.1979 11.7511 9.10659 13.8966C8.01529 16.042 7.72026 18.4785 8.27002 20.8054C8.81977 23.1324 10.1816 25.2114 12.1316 26.7006C14.0816 28.1898 16.5038 29.0007 19 29C10.4948 21.4138 8.53607 12.0542 14.2749 9ZM19 29C21.4962 29.0007 23.9184 28.1898 25.8684 26.7006C27.8184 25.2114 29.1802 23.1324 29.73 20.8054C30.2797 18.4785 29.9847 16.042 28.8934 13.8966C27.8021 11.7511 25.9795 10.0243 23.7251 9C29.4639 12.0542 27.5052 21.4138 19 29Z" fill="#263B58" id="path2" />
+  <path d="M23.072 13.532C23.072 14.0431 22.9666 14.5491 22.762 15.0213C22.5574 15.4934 22.2574 15.9224 21.8793 16.2838C21.5011 16.6452 21.0522 16.9318 20.5582 17.1274C20.0641 17.323 19.5346 17.4236 18.9998 17.4236C18.465 17.4236 17.9355 17.323 17.4415 17.1274C16.9474 16.9318 16.4985 16.6452 16.1203 16.2838C15.7422 15.9224 15.4423 15.4934 15.2376 15.0213C15.033 14.5491 14.9276 14.0431 14.9276 13.532C14.9276 12.4999 15.3567 11.51 16.1203 10.7802C16.884 10.0504 17.9198 9.64039 18.9998 9.64039C20.0798 9.64039 21.1156 10.0504 21.8793 10.7802C22.6429 11.51 23.072 12.4999 23.072 13.532Z" fill="#263B58" id="path3" />
+</svg>

umap/static/umap/img/source/16-white.svg

@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <!-- Created with Inkscape (http://www.inkscape.org/) -->
 
-<svg width="192" height="192" id="svg2" version="1.1" inkscape:version="1.4 (e7c3feb100, 2024-10-09)" sodipodi:docname="16-white.svg" inkscape:export-filename="16-white.png" inkscape:export-xdpi="96" inkscape:export-ydpi="96" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
+<svg width="216" height="192" id="svg2" version="1.1" inkscape:version="1.4 (e7c3feb100, 2024-10-09)" sodipodi:docname="16-white.svg" inkscape:export-filename="16-white.png" inkscape:export-xdpi="96" inkscape:export-ydpi="96" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
   <defs id="defs4">
     <clipPath id="clip0_241_10857">
       <rect width="18.049999" height="19.01" fill="#ffffff" id="rect586" x="0" y="0" />
@@ -18,8 +18,11 @@
     <clipPath id="clip0_2695_1939">
       <rect width="20" height="20" fill="#ffffff" id="rect1" x="0" y="0" />
     </clipPath>
+    <clipPath id="clip0_3071_861">
+      <rect width="18" height="20" fill="#ffffff" id="rect3" x="0" y="0" />
+    </clipPath>
   </defs>
-  <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="2.9474763" inkscape:cx="149.28025" inkscape:cy="54.623002" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" inkscape:window-width="1920" inkscape:window-height="1011" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" showguides="true" inkscape:guide-bbox="true" inkscape:snap-grids="true" inkscape:snap-to-guides="true" inkscape:showpageshadow="2" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1">
+  <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="22.311152" inkscape:cx="196.69536" inkscape:cy="36.932203" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" inkscape:window-width="1920" inkscape:window-height="1011" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" showguides="true" inkscape:guide-bbox="true" inkscape:snap-grids="true" inkscape:snap-to-guides="true" inkscape:showpageshadow="2" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1">
     <inkscape:grid type="xygrid" id="grid3004" empspacing="4" visible="true" enabled="true" snapvisiblegridlinesonly="true" originx="0" originy="0" spacingy="1" spacingx="1" units="px" />
     <inkscape:grid id="grid1" units="px" originx="0" originy="0" spacingx="24" spacingy="24" empcolor="#203fff" empopacity="0.85490196" color="#3f3fff" opacity="0.1254902" empspacing="1" enabled="true" visible="true" />
   </sodipodi:namedview>
@@ -221,5 +224,13 @@
     </g>
     <path style="fill:#efefef;fill-opacity:1;stroke:none;stroke-width:6.97518;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" inkscape:transform-center-x="-0.0010932573" inkscape:transform-center-y="-0.7377641" d="m 7.6698317,998.8588 1.3886278,-5.25497 -4.0584591,-3.24679 h 5.1830926 l 1.819345,-5.49493 1.81469,5.49392 h 5.182872 l -4.06154,3.24965 1.383849,5.25642 -4.324867,-3.01228 z" id="star" inkscape:connector-curvature="0" sodipodi:nodetypes="ccccccccccc" class="sprite" />
     <path style="fill:none;fill-opacity:1;stroke:#efefef;stroke-width:1;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" inkscape:transform-center-x="-0.0010925804" inkscape:transform-center-y="-0.73776941" d="m 31.669832,998.8588 1.388628,-5.25501 -4.05846,-3.24679 h 5.183093 l 1.819345,-5.49493 1.814694,5.49392 h 5.182868 l -4.06154,3.24964 1.383849,5.25647 -4.324874,-3.01232 z" id="starred" inkscape:connector-curvature="0" sodipodi:nodetypes="ccccccccccc" class="sprite" />
+    <g clip-path="url(#clip0_3071_861)" id="g3" transform="translate(194.88955,910.26491)">
+      <path fill-rule="evenodd" clip-rule="evenodd" d="m 1.89466,0.697266 v 2.325584 h 1.10132 l -1.01843,13.95345 h -1.267101 v 2.3256 h 2.368421 v -1.3953 l 9.47373,-1.8605 v 0.9302 h 2.3684 v -2.3255 h -0.9237 l 1.8355,-8.13958 h 1.4448 v -2.32558 h -2.3685 v 0.84883 l -10.64602,-2.86046 v -1.476744 z" stroke="#efefef" stroke-width="1.2" id="path1-9" style="fill:none" />
+      <path d="m 8.59717,6.8457 v 5.8915" stroke="#efefef" stroke-width="1.01333" id="path2-1" />
+      <path d="m 11.5977,9.79102 h -6.00004" stroke="#efefef" stroke-width="1.01333" id="path3-2" />
+    </g>
+    <path d="m 204.41818,838.96218 c -2.97727,0 -5.96591,1.94619 -6.81818,5.85003 0,2.33543 1.70455,7.01777 6.81818,12.46707 5.11362,-5.4608 6.81822,-10.13164 6.81822,-12.46707 -0.8523,-3.89239 -3.8409,-5.85003 -6.81822,-5.85003 z" stroke="#efefef" stroke-width="1.2" id="path1-0" style="fill:none" />
+    <path d="m 204.41812,843.97585 v 6.04463" stroke="#efefef" stroke-width="1.056" id="path2-9" style="fill:none" />
+    <path d="m 207.4181,846.99929 h -5.99998" stroke="#efefef" stroke-width="1.056" id="path3-36" style="fill:none" />
   </g>
 </svg>

umap/static/umap/js/modules/rendering/map.js

@@ -91,6 +91,10 @@ const ControlsMixin = {
     }
     if (this.options.noControl) return
 
+    // Do not display in an iframe.
+    if (window.self === window.top) {
+      this._controls.home = new U.HomeControl().addTo(this)
+    }
     this._controls.attribution = new U.AttributionControl().addTo(this)
     if (this.options.miniMap) {
       this.whenReady(function () {

umap/static/umap/js/modules/umap.js

@@ -101,10 +101,10 @@ export default class Umap extends ServerStored {
     this.urls = new URLs(this.properties.urls)
     this.slideshow = new Slideshow(this, this._leafletMap)
 
-    this._leafletMap.setup()
-
     if (geojson.properties.schema) this.overrideSchema(geojson.properties.schema)
 
+    this._leafletMap.setup()
+
     this.panel = new Panel(this, this._leafletMap)
     this.dialog = new Dialog({ className: 'dark' })
     this.topBar = new TopBar(this, this._leafletMap._controlContainer)
@@ -1757,4 +1757,8 @@ export default class Umap extends ServerStored {
     this.isDirty = true
     this._defaultExtent = false
   }
+
+  getStaticPathFor(name) {
+    return SCHEMA.iconUrl.default.replace('marker.svg', name)
+  }
 }

umap/static/umap/js/umap.controls.js

@@ -1,3 +1,17 @@
+U.HomeControl = L.Control.extend({
+  options: {
+    position: 'topleft',
+  },
+
+  onAdd: (map) => {
+    const path = map._umap.getStaticPathFor('home.svg')
+    const container = U.Utils.loadTemplate(
+      `<a href="/" class="home-button" title="${L._('Back to home')}"><img src="${path}" alt="${L._('Home logo')}" width="38px" height="38px" /></a>`
+    )
+    return container
+  },
+})
+
 U.EditControl = L.Control.extend({
   options: {
     position: 'topright',
@@ -432,8 +446,8 @@ U.Search = L.PhotonSearch.extend({
   formatResult: function (feature, el) {
     const [tools, { point, geom }] = U.Utils.loadTemplateWithRefs(`
       <span class="search-result-tools">
-        <button type="button" title="${L._('Save this geometry as a new feature')}" data-ref=geom><i class="icon icon-16 icon-polygon"></i></button>
-        <button type="button" title="${L._('Save this place as a new feature')}" data-ref=point><i class="icon icon-16 icon-marker"></i></button>
+        <button type="button" title="${L._('Add this geometry to my map')}" data-ref=geom><i class="icon icon-16 icon-polygon-plus"></i></button>
+        <button type="button" title="${L._('Add this place to my map')}" data-ref=point><i class="icon icon-16 icon-marker-plus"></i></button>
       </span>
     `)
     geom.hidden = !['R', 'W'].includes(feature.properties.osm_type)
@@ -462,7 +476,7 @@ U.Search = L.PhotonSearch.extend({
     })
     el.appendChild(tools)
     this._formatResult(feature, el)
-    const path = U.SCHEMA.iconUrl.default.replace('marker.svg', 'target.svg')
+    const path = this.map._umap.getStaticPathFor('target.svg')
     const icon = L.icon({
       iconUrl: path,
       iconSize: [24, 24],

umap/static/umap/map.css

@@ -247,7 +247,16 @@ html[dir="rtl"] .leaflet-tooltip-pane > * {
 .leaflet-iconLayers:hover .leaflet-iconLayers-layerCell-plus {
     display: block;
 }
-
+.home-button {
+    cursor: pointer;
+    line-height: 0;
+    border: 1px solid var(--color-darkBlue);
+    border-radius: 50%;
+    background-color: var(--background-color);
+}
+.home-button:hover {
+    background-color: var(--color-lighterGray);
+}
 
 
 
@@ -277,10 +286,14 @@ ul.photon-autocomplete {
     margin: 0;
 }
 .photon-autocomplete button:hover {
-    background-color: var(--color-brightCyan);
+    background-color: var(--color-darkCyan);
+}
+.photon-autocomplete button:hover i {
+    /* TODO deal with this in icon.css  */
+    background-image: url('./img/16-white.svg');
 }
 .photon-autocomplete li.on {
-    border-inline-start: 4px solid var(--color-brightCyan);
+    border-inline-start: 4px solid var(--color-darkCyan);
     cursor: pointer;
     background-color: var(--color-lightCyan);
 }

umap/static/umap/vars.css

@@ -12,6 +12,7 @@
     --color-limeGreen: #b9f5d2;
     --color-brightCyan: #46ece6;
     --color-lightCyan: #d4fbf9;
+    --color-darkCyan: #43a39f;
     --color-red: #c60f13;
     --color-darkRed: #5b2a2a;