umap-project 3.4.0b3__py3-none-any.whl → 3.6.0__py3-none-any.whl

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

@@ -1,12 +1,15 @@
 // Goes here all code related to Leaflet, DOM and user interactions.
 import {
   Map as BaseMap,
+  Browser,
   Control,
   DomEvent,
-  DomUtil,
   latLng,
-  latLngBounds,
+  LatLng,
+  LatLngBounds,
+  stamp,
   setOptions,
+  TileLayer,
 } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import { uMapAlert as Alert } from '../../components/alerts/alert.js'
 import DropControl from '../drop.js'
@@ -18,6 +21,7 @@ import {
   EmbedControl,
   EditControl,
   HomeControl,
+  LocateControl,
   MoreControl,
   PermanentCreditsControl,
   TileLayerChooser,
@@ -46,7 +50,6 @@ const ControlsMixin = {
     'caption',
     'locate',
     'measure',
-    'editinosm',
     'print',
     'tilelayers',
   ],
@@ -68,19 +71,7 @@ const ControlsMixin = {
     })
     this._controls.datalayers = new DataLayersControl(this._umap)
     this._controls.caption = new CaptionControl(this._umap)
-    this._controls.locate = new U.Locate(this, {
-      strings: {
-        title: translate('Center map on your location'),
-      },
-      showPopup: false,
-      // We style this control in our own CSS for consistency with other controls,
-      // but the control breaks if we don't specify a class here, so a fake class
-      // will do.
-      icon: 'umap-fake-class',
-      iconLoading: 'umap-fake-class',
-      flyTo: this.options.easing,
-      onLocationError: (err) => U.Alert.error(err.message),
-    })
+    this._controls.locate = new LocateControl(this._umap)
     this._controls.fullscreen = new Control.Fullscreen({
       title: {
         false: translate('View Fullscreen'),
@@ -91,17 +82,9 @@ const ControlsMixin = {
     this._controls.embed = new EmbedControl(this._umap)
     this._controls.print = new PrintControl(this._umap)
     this._controls.tilelayersChooser = new TileLayerChooser(this._umap)
-    this._controls.editinosm = new Control.EditInOSM({
-      position: 'topleft',
-      widgetOptions: {
-        helpText: translate(
-          'Open this map extent in a map editor to provide more accurate data to OpenStreetMap'
-        ),
-      },
-    })
     this._controls.measure = new L.MeasureControl().initHandler(this)
     this._controls.more = new MoreControl()
-    this._controls.scale = L.control.scale()
+    this._controls.scale = new Control.Scale()
     this._controls.permanentCredit = new PermanentCreditsControl(this)
     this._umap.drop = new DropControl(this._umap, this, this._container)
     this._controls.tilelayers = new U.TileLayerControl(this)
@@ -138,11 +121,10 @@ const ControlsMixin = {
       const control = this._controls[name]
       if (!control) continue
       control.addTo(this)
-      if (status === undefined || status === null) {
-        DomUtil.addClass(control._container, 'display-on-more')
-      } else {
-        DomUtil.removeClass(control._container, 'display-on-more')
-      }
+      control._container.classList.toggle(
+        'display-on-more',
+        status === undefined || status === null
+      )
     }
     if (this._umap.getProperty('permanentCredit'))
       this._controls.permanentCredit.addTo(this)
@@ -176,13 +158,25 @@ const ManageTilelayerMixin = {
     if (this._controls) this._controls.tilelayers.setLayers()
   },
 
-  createTileLayer: (tilelayer) => new L.TileLayer(tilelayer.url_template, tilelayer),
+  createTileLayer: (tilelayer) => new TileLayer(tilelayer.url_template, tilelayer),
 
   selectTileLayer: function (tilelayer) {
     if (tilelayer === this.selectedTilelayer) {
       return
     }
+    const onLoading = () => {
+      this._umap.loader.start(stamp(tilelayer))
+    }
+    const onLoad = () => {
+      this._umap.loader.stop(stamp(tilelayer))
+    }
     try {
+      tilelayer.on('loading', onLoading)
+      tilelayer.on('load', onLoad)
+      tilelayer.on('remove', () => {
+        tilelayer.off('loading', onLoading)
+        tilelayer.off('load', onLoad)
+      })
       this.addLayer(tilelayer)
       this.fire('baselayerchange', { layer: tilelayer })
       if (this.selectedTilelayer) {
@@ -261,19 +255,13 @@ export const LeafletMap = BaseMap.extend({
 
     BaseMap.prototype.initialize.call(this, element, options)
 
-    // After calling parent initialize, as we are doing initCenter our-selves
-
-    this.loader = new Control.Loading()
-    this.loader.onAdd(this)
-
-    if (!this.options.noControl) {
-      DomEvent.on(document.body, 'dataloading', (event) =>
-        this.fire('dataloading', event.detail)
-      )
-      DomEvent.on(document.body, 'dataload', (event) =>
-        this.fire('dataload', event.detail)
-      )
-    }
+    document.body.addEventListener('mapview:update', (event) => {
+      let { zoom, latlng } = event.detail
+      if (!Utils.LatLngIsValid(latlng)) return
+      zoom = Math.min(zoom, this.getMaxZoom())
+      zoom = Math.max(zoom, this.getMinZoom())
+      this.setView(latlng, zoom)
+    })
 
     this.on('baselayerchange', (e) => {
       if (this._controls.miniMap) this._controls.miniMap.onMainMapBaseLayerChange(e)
@@ -284,6 +272,21 @@ export const LeafletMap = BaseMap.extend({
     this.initControls()
     // Needs locate control and hash to exist
     this.initCenter()
+
+    // Wait for URL to have been parsed before modifying the hash
+    const updateHash = () => {
+      const center = this.getCenter()
+      document.body.dispatchEvent(
+        new CustomEvent('mapview:updated', {
+          detail: {
+            zoom: this.getZoom(),
+            latlng: [center.lat.toFixed(6), center.lng.toFixed(6)],
+          },
+        })
+      )
+    }
+    this.on('moveend', updateHash)
+    updateHash()
     this.initTileLayers()
     this.renderUI()
   },
@@ -303,7 +306,7 @@ export const LeafletMap = BaseMap.extend({
       // when scrolling the main page and touching the
       // map in an iframe. May be a bit dumb, but let's
       // try like this for now.
-      if (L.Browser.mobile) this.dragging.disable()
+      if (Browser.mobile) this.dragging.disable()
     }
     // Needs tilelayer to exist for minimap
     this.renderControls()
@@ -312,7 +315,7 @@ export const LeafletMap = BaseMap.extend({
 
   latLng: (a, b, c) => {
     // manage geojson case and call original method
-    if (!(a instanceof L.LatLng) && a.coordinates) {
+    if (!(a instanceof LatLng) && a.coordinates) {
       // Guess it's a geojson
       a = [a.coordinates[1], a.coordinates[0]]
     }
@@ -324,14 +327,13 @@ export const LeafletMap = BaseMap.extend({
     this.setView(this.options.center, this.options.zoom)
   },
 
-  initCenter: function () {
+  initCenter: async function () {
     this._setDefaultCenter()
-    if (this.options.hash) this.addHash()
-    if (this.options.hash && this._hash.parseHash(location.hash)) {
+    if (this.options.hash && window.location.hash) {
       // FIXME An invalid hash will cause the load to fail
-      this._hash.update()
+      this._umap.hash.parse()
     } else if (this.options.defaultView === 'locate' && !this.options.noControl) {
-      this._controls.locate.start()
+      await this._controls.locate.start()
     } else if (this.options.defaultView === 'data') {
       this._umap.onceDataLoaded(this._umap.fitDataBounds)
     } else if (this.options.defaultView === 'latest') {
@@ -351,17 +353,17 @@ export const LeafletMap = BaseMap.extend({
   },
 
   handleLimitBounds: function () {
-    const south = Number.parseFloat(this.options.limitBounds.south)
-    const west = Number.parseFloat(this.options.limitBounds.west)
-    const north = Number.parseFloat(this.options.limitBounds.north)
-    const east = Number.parseFloat(this.options.limitBounds.east)
+    const south = Number.parseFloat(this.options.limitBounds?.south)
+    const west = Number.parseFloat(this.options.limitBounds?.west)
+    const north = Number.parseFloat(this.options.limitBounds?.north)
+    const east = Number.parseFloat(this.options.limitBounds?.east)
     if (
       !Number.isNaN(south) &&
       !Number.isNaN(west) &&
       !Number.isNaN(north) &&
       !Number.isNaN(east)
     ) {
-      const bounds = latLngBounds([
+      const bounds = new LatLngBounds([
         [south, west],
         [north, east],
       ])
@@ -381,7 +383,7 @@ export const LeafletMap = BaseMap.extend({
   setMaxBounds: function (bounds) {
     // Hack. Remove me when fix is released:
     // https://github.com/Leaflet/Leaflet/pull/4494
-    bounds = latLngBounds(bounds)
+    bounds = new LatLngBounds(bounds)
 
     if (!bounds.isValid()) {
       this.options.maxBounds = null
@@ -390,6 +392,14 @@ export const LeafletMap = BaseMap.extend({
     return BaseMap.prototype.setMaxBounds.call(this, bounds)
   },
 
+  getLayersBounds: (layers) => {
+    const bounds = new LatLngBounds()
+    for (const layer of layers) {
+      bounds.extend(layer.getBounds())
+    }
+    return bounds
+  },
+
   initEditTools: function () {
     this.editTools = new U.Editable(this._umap)
   },

umap/static/umap/js/modules/rendering/popup.js

@@ -1,11 +1,11 @@
 import {
   Popup as BasePopup,
   DomEvent,
-  DomUtil,
   Path,
 } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import Browser from '../browser.js'
 import loadTemplate from './template.js'
+import * as DOMUtils from '../domutils.js'
 
 export default function loadPopup(name) {
   switch (name) {
@@ -25,7 +25,8 @@ const Popup = BasePopup.extend({
   },
 
   loadContent: async function () {
-    const container = DomUtil.create('div', 'umap-popup')
+    const container = document.createElement('div')
+    container.classList.add('umap-popup')
     const name = this.feature.getOption('popupTemplate')
     this.content = await loadTemplate(name, this.feature, container)
     const elements = container.querySelectorAll('img,iframe')
@@ -34,7 +35,9 @@ const Popup = BasePopup.extend({
     }
     if (!elements.length && container.textContent.replace('\n', '') === '') {
       container.innerHTML = ''
-      DomUtil.add('h3', '', container, this.feature.getDisplayName())
+      container.appendChild(
+        DOMUtils.loadTemplate(`<h3>${this.feature.getDisplayName()}</h3>`)
+      )
     }
     this.setContent(container)
   },

umap/static/umap/js/modules/rendering/template.js

@@ -1,8 +1,4 @@
-import {
-  DomEvent,
-  DomUtil,
-  CircleMarker,
-} from '../../../vendors/leaflet/leaflet-src.esm.js'
+import { DomEvent, CircleMarker } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import { getLocale, translate } from '../i18n.js'
 import { Request } from '../request.js'
 import * as Utils from '../utils.js'
@@ -38,8 +34,7 @@ export default async function loadTemplate(name, feature, container) {
 class PopupTemplate {
   renderTitle(feature) {}
 
-  renderBody(feature) {
-    const template = feature.getOption('popupContentTemplate')
+  toHTML(feature, template) {
     const target = feature.getOption('outlinkTarget')
     const properties = feature.extendedProperties()
     // Resolve properties inside description
@@ -48,9 +43,15 @@ class PopupTemplate {
       properties
     )
     properties.name = properties.name ?? feature.getDisplayName()
-    let content = Utils.greedyTemplate(template, properties)
-    content = Utils.toHTML(content, { target: target })
-    return Utils.loadTemplate(`<div class="umap-popup-container text">${content}</div>`)
+    const content = Utils.greedyTemplate(template, properties)
+    return Utils.toHTML(content, { target })
+  }
+
+  renderBody(feature) {
+    const template = feature.getOption('popupContentTemplate')
+    return Utils.loadTemplate(
+      `<div class="umap-popup-container text">${this.toHTML(feature, template)}</div>`
+    )
   }
 
   renderFooter(feature) {
@@ -92,7 +93,11 @@ class PopupTemplate {
     const title = this.renderTitle(feature)
     if (title) container.appendChild(title)
     const body = await this.renderBody(feature)
-    if (body) DomUtil.add('div', 'umap-popup-content', container, body)
+    if (body) {
+      const div = DOMUtils.loadTemplate('<div class="umap-popup-content"></div>')
+      div.appendChild(body)
+      container.appendChild(div)
+    }
     const footer = this.renderFooter(feature)
     if (footer) container.appendChild(footer)
   }
@@ -108,18 +113,9 @@ export const TitleMixin = (Base) =>
   }
 
 class Table extends TitleMixin(PopupTemplate) {
-  getValue(feature, key) {
-    // TODO, manage links (url, mailto, wikipedia...)
-    const value = Utils.escapeHTML(feature.properties[key]).trim()
-    if (value.indexOf('http') === 0) {
-      return `<a href="${value}" target="_blank">${value}</a>`
-    }
-    return value
-  }
-
-  makeRow(feature, key) {
+  makeRow(feature, field) {
     return Utils.loadTemplate(
-      `<tr><th>${key}</th><td>${this.getValue(feature, key)}</td></tr>`
+      `<tr><th>${field.key}</th><td>${field.render(feature.properties[field.key])}</td></tr>`
     )
   }
 
@@ -130,7 +126,7 @@ class Table extends TitleMixin(PopupTemplate) {
       if (U.LABEL_KEYS.includes(field.key)) {
         continue
       }
-      table.appendChild(this.makeRow(feature, field.key))
+      table.appendChild(this.makeRow(feature, field))
     }
     return table
   }
@@ -138,16 +134,17 @@ class Table extends TitleMixin(PopupTemplate) {
 
 class GeoRSSImage extends TitleMixin(PopupTemplate) {
   async renderBody(feature) {
-    const body = DomUtil.create('a')
-    body.href = feature.properties.link
-    body.target = '_blank'
+    const body = DOMUtils.loadTemplate(
+      `<a href="${feature.properties.link}" target="_blank"></a>`
+    )
     if (feature.properties.img) {
-      const img = DomUtil.create('img', '', body)
-      img.src = feature.properties.img
       // Sadly, we are unable to override this from JS the clean way
       // See https://github.com/Leaflet/Leaflet/commit/61d746818b99d362108545c151a27f09d60960ee#commitcomment-6061847
-      img.style.maxWidth = '500px'
-      img.style.maxHeight = '500px'
+      body.appendChild(
+        DOMUtils.loadTemplate(
+          `<img src=${feature.properties.img} style="max-width: 500px; max-height: 500px;">`
+        )
+      )
     }
     return body
   }
@@ -165,15 +162,16 @@ class GeoRSSLink extends PopupTemplate {
 
 class OSM extends PopupTemplate {
   renderTitle(feature) {
-    const title = DomUtil.add('h3', 'popup-title')
     const color = feature.getPreviewColor()
-    title.style.backgroundColor = color
+    const [title, { iconContainer }] = DOMUtils.loadTemplateWithRefs(`
+    <h3 class="popup-title" style="background-color: ${color};">
+      <span data-ref="iconContainer"></span> ${this.getName(feature)}
+    </h3>`)
     const iconUrl = feature.getDynamicOption('iconUrl')
-    const icon = Icon.makeElement(iconUrl, title)
-    DomUtil.addClass(icon, 'icon')
+    const icon = Icon.makeElement(iconUrl, iconContainer)
+    icon.classList.add('icon')
     Icon.setContrast(icon, title, iconUrl, color)
     if (DOMUtils.contrastedColor(title, color)) title.style.color = 'white'
-    DomUtil.add('span', '', title, this.getName(feature))
     return title
   }
 
@@ -190,15 +188,16 @@ class OSM extends PopupTemplate {
     const locale = getLocale()
     const street = props['addr:street']
     if (street) {
-      const row = DomUtil.add('address', 'address', body)
       const number = props['addr:housenumber']
+      let content
       if (number) {
         // Poor way to deal with international forms of writing addresses
-        DomUtil.add('span', '', row, `${translate('No.')}: ${number}`)
-        DomUtil.add('span', '', row, `${translate('Street')}: ${street}`)
+        content = `<span>${translate('№')}: ${number}</span><span>${translate('Street')}: ${street}</span>`
       } else {
-        DomUtil.add('span', '', row, street)
+        content = street
       }
+      const row = DOMUtils.loadTemplate(`<address class="address">${content}</address>`)
+      body.appendChild(row)
     }
     if (props.website) {
       body.appendChild(
@@ -383,7 +382,8 @@ class Route extends TitleMixin(PopupTemplate) {
       }).addTo(map)
     })
     if (feature.properties.description) {
-      root.appendChild(Utils.loadTemplate(`<p>${feature.properties.description}</p>`))
+      const content = this.toHTML(feature, feature.properties.description)
+      root.appendChild(Utils.loadTemplate(`<p>${content}</p>`))
     }
     return root
   }

umap/static/umap/js/modules/rendering/ui.js

@@ -2,7 +2,6 @@
 import {
   CircleMarker as BaseCircleMarker,
   DomEvent,
-  DomUtil,
   GeoJSON,
   LatLng,
   LatLngBounds,
@@ -314,7 +313,7 @@ const PathMixin = {
       this.enableEdit()
     } else {
       this._map._umap.tooltip.open({
-        content: L._('Please zoom in to edit the geometry'),
+        content: translate('Please zoom in to edit the geometry'),
       })
       this.disableEdit()
     }

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

@@ -6,6 +6,7 @@ import Orderable from './orderable.js'
 import * as Utils from './utils.js'
 import * as Icon from './rendering/icon.js'
 import { SCHEMA } from './schema.js'
+import { Registry as Fields } from './data/fields.js'
 
 const EMPTY_VALUES = ['', undefined, null]
 
@@ -28,12 +29,12 @@ class Rule {
     // cf https://caniuse.com/?search=public%20class%20field
     this._condition = null
     this.OPERATORS = [
-      ['>', this.gt],
-      ['<', this.lt],
+      ['>', 'gt'],
+      ['<', 'lt'],
       // When sent by Django
-      ['&lt;', this.lt],
-      ['!=', this.not_equal],
-      ['=', this.equal],
+      ['&lt;', 'lt'],
+      ['!=', 'not_equal'],
+      ['=', 'equal'],
     ]
     this.parent = parent
     this._umap = umap
@@ -47,58 +48,47 @@ class Rule {
     this.parent.render(fields)
   }
 
-  equal(other) {
-    return this.expected === other
-  }
-
-  not_equal(other) {
-    return this.expected !== other
-  }
-
-  gt(other) {
-    return other > this.expected
-  }
-
-  lt(other) {
-    return other < this.expected
-  }
-
   parse() {
     let vars = []
     this.cast = (v) => v
     this.operator = undefined
-    for (const [sign, func] of this.OPERATORS) {
+    let operator = undefined
+    for (const [sign, funcName] of this.OPERATORS) {
       if (this.condition.includes(sign)) {
-        this.operator = func
+        operator = funcName
         vars = this.condition.split(sign)
         break
       }
     }
     if (vars.length !== 2) return
-    this.key = vars[0]
+    this.field = this.parent.fields.get(vars[0]) || new Fields.String(vars[0])
+    this.operator = this.field[operator]
     this.expected = vars[1]
     if (EMPTY_VALUES.includes(this.expected)) {
       this.cast = (v) => EMPTY_VALUES.includes(v)
     }
-    // Special cases where we want to be lousy when checking isNaN without
-    // coercing to a Number first because we handle multiple types.
-    // See https://developer.mozilla.org/en-US/docs/Web/JavaScript/
-    // Reference/Global_Objects/Number/isNaN
-    // biome-ignore lint/suspicious/noGlobalIsNan: expected might not be a number.
-    else if (!isNaN(this.expected)) {
-      this.cast = Number.parseFloat
-    } else if (['true', 'false'].includes(this.expected)) {
-      this.cast = (v) => {
-        if (`${v}`.toLowerCase() === 'true') return true
-        if (`${v}`.toLowerCase() === 'false') return false
+    // TODO: deal with legacy rules on non typed fields
+    else {
+      this.cast = this.field.parse
+      if (
+        // Special cases where we want to be lousy when checking isNaN without
+        // coercing to a Number first because we handle multiple types.
+        // See https://developer.mozilla.org/en-US/docs/Web/JavaScript/
+        // Reference/Global_Objects/Number/isNaN
+        // biome-ignore lint/suspicious/noGlobalIsNan: expected might not be a number.
+        !isNaN(this.expected) &&
+        ['gt', 'lt'].includes(operator) &&
+        this.field.TYPE !== 'Number'
+      ) {
+        this.cast = Number.parseFloat
       }
     }
     this.expected = this.cast(this.expected)
   }
 
   match(props) {
-    if (!this.operator || !this.active) return false
-    return this.operator(this.cast(props[this.key]))
+    if (!this.operator || !this.active || !this.field) return false
+    return this.operator(this.expected, this.cast(props[this.field.key]))
   }
 
   getOption(option) {
@@ -118,6 +108,7 @@ class Rule {
       'name',
       'properties.color',
       'properties.iconClass',
+      'properties.iconSize',
       'properties.iconUrl',
       'properties.iconOpacity',
       'properties.opacity',
@@ -132,7 +123,7 @@ class Rule {
     const container = document.createElement('div')
     container.appendChild(builder.build())
     const autocomplete = new AutocompleteDatalist(builder.helpers.condition.input)
-    const properties = this.parent.fieldKeys
+    const properties = Array.from(this.parent.fields.keys())
     autocomplete.suggestions = properties
     autocomplete.input.addEventListener('input', (event) => {
       const value = event.target.value
@@ -140,9 +131,11 @@ class Rule {
         autocomplete.suggestions = [`${value}=`, `${value}!=`, `${value}>`, `${value}<`]
       } else if (value.endsWith('=')) {
         const key = value.split('!')[0].split('=')[0]
-        autocomplete.suggestions = this.parent
-          .sortedValues(key)
-          .map((str) => `${value}${str ?? ''}`)
+        if (key) {
+          autocomplete.suggestions = this.parent
+            .sortedValues(key)
+            .map((str) => `${value}${str ?? ''}`)
+        }
       }
     })
     const backButton = Utils.loadTemplate(`

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

@@ -123,13 +123,6 @@ export const SCHEMA = {
   edit_status: {
     type: Number,
   },
-  editinosmControl: {
-    type: Boolean,
-    impacts: ['ui'],
-    nullable: true,
-    label: translate('Display the control to open OpenStreetMap editor'),
-    default: null,
-  },
   editors: {
     type: Array,
   },