umap-project 3.1.2__py3-none-any.whl → 3.2.0__py3-none-any.whl

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

@@ -1,4 +1,4 @@
-import { DomEvent, DomUtil, stamp } from '../../vendors/leaflet/leaflet-src.esm.js'
+import { DomEvent, DomUtil } from '../../vendors/leaflet/leaflet-src.esm.js'
 import { translate } from './i18n.js'
 import * as Utils from './utils.js'
 
@@ -25,7 +25,7 @@ export default class Facets {
     }
 
     this._umap.datalayers.browsable().map((datalayer) => {
-      datalayer.eachFeature((feature) => {
+      datalayer.features.forEach((feature) => {
         for (const name of names) {
           let value = feature.properties[name]
           const type = defined.get(name).type

umap/static/umap/js/modules/form/fields.js

@@ -131,12 +131,13 @@ class BaseElement {
 
 Fields.Textarea = class extends BaseElement {
   getTemplate() {
-    return `<textarea placeholder="${this.properties.placeholder || ''}" data-ref=textarea></textarea>`
+    return `<textarea placeholder="${this.properties.placeholder || ''}" name="${this.name}" data-ref=textarea></textarea>`
   }
 
   build() {
     super.build()
     this.textarea = this.elements.textarea
+    this.input = this.textarea
     this.fetch()
     this.textarea.addEventListener(
       'input',
@@ -363,6 +364,9 @@ Fields.Select = class extends BaseElement {
   }
 
   getOptions() {
+    if (this.properties.getOptions) {
+      return this.properties.getOptions()
+    }
     return this.properties.selectOptions
   }
 
@@ -421,7 +425,7 @@ Fields.IntSelect = class extends Fields.Select {
 
 Fields.EditableText = class extends BaseElement {
   getTemplate() {
-    return `<span contentEditable class="${this.properties.className || ''}" data-ref=input></span>`
+    return `<span class="${this.properties.className || ''}" data-ref=input></span>`
   }
 
   buildTemplate() {
@@ -435,6 +439,24 @@ Fields.EditableText = class extends BaseElement {
     this.fetch()
     this.input.addEventListener('input', () => this.sync())
     this.input.addEventListener('keypress', (event) => this.onKeyPress(event))
+    this.input.addEventListener('dblclick', () => {
+      if (this.input.contentEditable !== true) {
+        this.input.contentEditable = true
+        this.input.focus()
+      }
+    })
+    this.input.addEventListener('blur', () => {
+      this.input.contentEditable = false
+    })
+    this.input.addEventListener('mouseover', () => {
+      this.builder._umap.tooltip.open({
+        content: translate('Double click to edit the name'),
+        anchor: this.input,
+        position: 'bottom',
+        delay: 500,
+        duration: 5000,
+      })
+    })
   }
 
   value() {
@@ -654,7 +676,7 @@ Fields.PropertyInput = class extends Fields.BlurInput {
     super.build()
     const autocomplete = new AutocompleteDatalist(this.input)
     // Will be used on Umap and DataLayer
-    const properties = this.builder.obj.allProperties()
+    const properties = this.builder.obj.fieldKeys
     autocomplete.suggestions = properties
   }
 }
@@ -691,10 +713,10 @@ Fields.IconUrl = class extends Fields.BlurInput {
 
   async onDefine() {
     this.footer.innerHTML = ''
-    const [{ pictogram_list }, response, error] = await this.builder._umap.server.get(
+    const [{ data }, response, error] = await this.builder._umap.server.get(
       this.builder._umap.properties.urls.pictogram_list_json
     )
-    if (!error) this.pictogram_list = pictogram_list
+    if (!error) this.pictogramCollections = data
     this.buildTabs()
     const value = this.value()
     if (Icon.RECENT.length) this.showRecentTab()
@@ -807,36 +829,51 @@ Fields.IconUrl = class extends Fields.BlurInput {
     this.updatePreview()
   }
 
-  addCategory(items, name) {
+  addCategory(items, name, parent, attribution = null) {
     const hidden = name ? '' : ' hidden'
-    const [parent, { grid }] = Utils.loadTemplateWithRefs(`
+    const [container, { grid }] = Utils.loadTemplateWithRefs(`
       <div class="umap-pictogram-category">
         <h6${hidden}>${name}</h6>
         <div class="umap-pictogram-grid" data-ref=grid></div>
       </div>
     `)
     let hasIcons = false
-    for (const item of items) {
+    const sorted = items.sort((a, b) => Utils.naturalSort(a.name, b.name, U.lang))
+    for (const item of sorted) {
+      item.attribution ??= attribution
       hasIcons = this.addIconPreview(item, grid) || hasIcons
     }
-    if (hasIcons) this.grid.appendChild(parent)
+    if (hasIcons) parent.appendChild(container)
   }
 
   buildSymbolsList() {
     this.grid.innerHTML = ''
     const categories = {}
     let category
-    for (const props of this.pictogram_list) {
-      category = props.category || translate('Generic')
-      categories[category] = categories[category] || []
-      categories[category].push(props)
-    }
-    const sorted = Object.entries(categories).sort(([a], [b]) =>
-      Utils.naturalSort(a, b, U.lang)
+    const collectionsNames = Object.keys(this.pictogramCollections)
+    const [container, { select, icons }] = Utils.loadTemplateWithRefs(
+      '<div><select data-ref="select"></select><div data-ref="icons"></div></div>'
     )
-    for (const [name, items] of sorted) {
-      this.addCategory(items, name)
+    for (const name of collectionsNames) {
+      const option = Utils.loadTemplate(`<option value="${name}">${name}</option>`)
+      select.appendChild(option)
     }
+    this.grid.appendChild(container)
+    select.hidden = collectionsNames.length === 1
+    const loadCollection = (name) => {
+      icons.innerHTML = ''
+      const collection = this.pictogramCollections[name || collectionsNames[0]]
+      const sorted = Object.entries(collection.categories).sort(([a], [b]) =>
+        Utils.naturalSort(a, b, U.lang)
+      )
+      for (const [name, items] of sorted) {
+        this.addCategory(items, name, icons, collection.attribution)
+      }
+    }
+    loadCollection()
+    select.addEventListener('change', (event) => {
+      loadCollection(event.target.value)
+    })
   }
 
   buildRecentList() {
@@ -844,7 +881,7 @@ Fields.IconUrl = class extends Fields.BlurInput {
     const items = U.Icon.RECENT.map((src) => ({
       src,
     }))
-    this.addCategory(items)
+    this.addCategory(items, null, this.grid)
   }
 
   isDefault() {

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

@@ -2,6 +2,19 @@ import { uMapAlert as Alert } from '../components/alerts/alert.js'
 /* Uses globals for: csv2geojson, osmtogeojson (not available as ESM) */
 import { translate } from './i18n.js'
 
+const parseTextGeom = async (geom) => {
+  try {
+    return JSON.parse(geom)
+  } catch (e) {
+    try {
+      const betterknown = await import('../../vendors/betterknown/betterknown.mjs')
+      return betterknown.wktToGeoJSON(geom)
+    } catch {
+      return null
+    }
+  }
+}
+
 export const EXPORT_FORMATS = {
   geojson: {
     formatter: async (umap) => JSON.stringify(umap.toGeoJSON(), null, 2),
@@ -81,15 +94,30 @@ export class Formatter {
         sexagesimal: false,
         parseLatLon: (raw) => Number.parseFloat(raw.toString().replace(',', '.')),
       },
-      (err, result) => {
-        // csv2geojson fallback to null geometries when it cannot determine
-        // lat or lon columns. This is valid geojson, but unwanted from a user
-        // point of view.
+      async (err, result) => {
         if (result?.features.length) {
-          if (result.features[0].geometry === null) {
-            err = {
-              type: 'Error',
-              message: translate('Cannot determine latitude and longitude columns.'),
+          const first = result.features[0]
+          if (first.geometry === null) {
+            const geomFields = ['geom', 'geometry', 'wkt', 'geojson']
+            for (const field of geomFields) {
+              if (first.properties[field]) {
+                for (const feature of result.features) {
+                  feature.geometry = await parseTextGeom(feature.properties[field])
+                  delete feature.properties[field]
+                }
+                break
+              }
+            }
+            if (first.geometry === null) {
+              // csv2geojson fallback to null geometries when it cannot determine
+              // lat or lon columns. This is valid geojson, but unwanted from a user
+              // point of view.
+              err = {
+                type: 'Error',
+                message: translate(
+                  'No geo column found: must be either `lat(itude)` and `lon(gitude)` or `geom(etry)`.'
+                ),
+              }
             }
           }
         }

umap/static/umap/js/modules/importers/opendata.js

@@ -70,15 +70,33 @@ export class Importer {
     this.portals = options.choices || PORTALS
   }
 
+  async fetchDatasets(baseUrl) {
+    let results = []
+    let total = null
+    const hardLimit = 500
+    while (total === null || results.length < total) {
+      const offset = results.length
+      const response = await this.umap.request.get(
+        `${baseUrl}/api/explore/v2.1/catalog/datasets?where=features%20in%20%28%22geo%22%29&limit=100&offset=${offset}&order_by=title asc`
+      )
+      if (!response.ok) break
+      const data = await response.json()
+      if (total === null) {
+        total = data.total_count
+      }
+      results = results.concat(data.results)
+      if (total === null || results.length > hardLimit) break
+    }
+    return results
+  }
+
   async open(importer) {
     let fields_map = {}
     const [container, { portals, datasets, geofield }] =
       Utils.loadTemplateWithRefs(TEMPLATE)
     portals.addEventListener('change', async (event) => {
-      const response = await this.umap.request.get(
-        `${event.target.value}/api/explore/v2.1/catalog/datasets?where=features%20in%20%28%22geo%22%29&limit=-1&offset=0&timezone=UTC`
-      )
-      if (response.ok) {
+      const results = await this.fetchDatasets(event.target.value)
+      if (results) {
         fields_map = {}
         Array.from(datasets.children).forEach((option) => {
           if (!option.disabled) {
@@ -87,8 +105,7 @@ export class Importer {
             option.selected = true
           }
         })
-        const data = await response.json()
-        for (const result of data.results) {
+        for (const result of results) {
           const fields = result.fields.filter((field) => field.type === 'geo_point_2d')
           if (!fields.length) {
             console.debug('No geofield found for', result)

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

@@ -1,3 +1,5 @@
+import * as Utils from './utils.js'
+
 export class DataLayerManager extends Object {
   add(datalayer) {
     this[datalayer.id] = datalayer
@@ -43,4 +45,61 @@ export class DataLayerManager extends Object {
     if (!next.canBrowse()) return this.next(next)
     return next
   }
+  first() {
+    return this.active()[0]
+  }
+  last() {
+    const layers = this.active()
+    return layers[layers.length - 1]
+  }
+}
+
+export class FeatureManager extends Map {
+  add(feature) {
+    if (this.has(feature.id)) {
+      console.error('Duplicate id', feature, this.get(feature.id))
+      feature.id = Utils.generateId()
+    }
+    this.set(feature.id, feature)
+  }
+
+  del(feature) {
+    this.delete(feature.id)
+  }
+
+  count() {
+    return this.size
+  }
+
+  sort(by) {
+    const features = Array.from(this.values())
+    Utils.sortFeatures(features, by, U.lang)
+    this.clear()
+    for (const feature of features) {
+      this.set(feature.id, feature)
+    }
+  }
+
+  getIndex(feature) {
+    const entries = Array.from(this)
+    return entries.findIndex(([id]) => id === feature.id)
+  }
+
+  first() {
+    return this.values().next().value
+  }
+
+  last() {
+    return Array.from(this.values())[this.size - 1]
+  }
+
+  next(feature) {
+    const index = this.getIndex(feature)
+    return Array.from(this.values())[index + 1]
+  }
+
+  prev(feature) {
+    const index = this.getIndex(feature)
+    return Array.from(this.values())[index - 1]
+  }
 }

umap/static/umap/js/modules/rendering/icon.js

@@ -249,11 +249,9 @@ export function isImg(src) {
 export function makeElement(src, parent) {
   let icon
   if (isImg(src)) {
-    icon = DomUtil.create('img')
-    icon.src = src
+    icon = Utils.loadTemplate(`<img loading="lazy" src="${src}">`)
   } else {
-    icon = DomUtil.create('span')
-    icon.textContent = src
+    icon = Utils.loadTemplate(`<span>${src}</span>`)
   }
   parent.appendChild(icon)
   return icon
@@ -273,7 +271,7 @@ export function setContrast(icon, parent, src, bgcolor) {
   if (DomUtil.contrastedColor(parent, bgcolor)) {
     // Decide whether to switch svg to white or not, but do it
     // only for internal SVG, as invert could do weird things
-    if (Utils.isPath(src) && src.endsWith('.svg') && src !== SCHEMA.iconUrl.default) {
+    if (src.endsWith('.svg') && src !== SCHEMA.iconUrl.default) {
       // Must be called after icon container is added to the DOM
       // An image
       icon.style.filter = 'invert(1)'

umap/static/umap/js/modules/rendering/layers/classified.js

@@ -67,7 +67,7 @@ const ClassifiedMixin = {
 
   getValues: function () {
     const values = []
-    this.datalayer.eachFeature((feature) => {
+    this.datalayer.features.forEach((feature) => {
       const value = this._getValue(feature)
       if (value !== undefined) values.push(value)
     })
@@ -198,7 +198,7 @@ export const Choropleth = FeatureGroup.extend({
         'properties.choropleth.property',
         {
           handler: 'Select',
-          selectOptions: this.datalayer.allProperties(),
+          selectOptions: this.datalayer.fieldKeys,
           label: translate('Choropleth property value'),
         },
       ],
@@ -307,7 +307,7 @@ export const Circles = FeatureGroup.extend({
         'properties.circles.property',
         {
           handler: 'Select',
-          selectOptions: this.datalayer.allProperties(),
+          selectOptions: this.datalayer.fieldKeys,
           label: translate('Property name to compute circles'),
         },
       ],
@@ -384,8 +384,7 @@ export const Categorized = FeatureGroup.extend({
 
   _getValue: function (feature) {
     const key =
-      this.datalayer.properties.categorized.property ||
-      this.datalayer.allProperties()[0]
+      this.datalayer.properties.categorized.property || this.datalayer.fieldKeys[0]
     return feature.properties[key]
   },
 
@@ -438,7 +437,7 @@ export const Categorized = FeatureGroup.extend({
         'properties.categorized.property',
         {
           handler: 'Select',
-          selectOptions: this.datalayer.allProperties(),
+          selectOptions: this.datalayer.fieldKeys,
           label: translate('Category property'),
         },
       ],
@@ -447,7 +446,7 @@ export const Categorized = FeatureGroup.extend({
         {
           handler: 'Select',
           label: translate('Color palette'),
-          selectOptions: this.getColorSchemes(this._classes),
+          getOptions: () => this.getColorSchemes(this._classes),
         },
       ],
       [
@@ -481,6 +480,8 @@ export const Categorized = FeatureGroup.extend({
       if (builder) builder.helpers['properties.categorized.mode'].fetch()
     }
     this.compute()
+    // Rebuild list of color palettes when aggregation property changes.
+    builder?.helpers['properties.categorized.brewer']?.fetch()
     // If user changes the mode
     // then update the categories input value
     if (field === 'properties.categorized.mode') {

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

@@ -335,7 +335,7 @@ export const LeafletMap = BaseMap.extend({
         const datalayer = this._umap.datalayers.visible()[0]
         let feature
         if (datalayer) {
-          const feature = datalayer.getFeatureByIndex(-1)
+          const feature = datalayer.features.last()
           if (feature) {
             feature.zoomTo({ callback: this.options.noControl ? null : feature.view })
             return

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

@@ -238,6 +238,14 @@ export const LeafletMarker = Marker.extend({
     this._redraw()
     this._resetZIndex()
   },
+
+  _resetZIndex() {
+    // Override Leaflet default behaviour, which set the zIndex
+    // according to feature's y coordinate, and group features
+    // zIndex by their datalayer order
+    this._zIndex = this.feature.datalayer.getDOMOrder()
+    this._updateZIndex(0)
+  },
 })
 
 const PathMixin = {
@@ -296,6 +304,11 @@ const PathMixin = {
     if (this._tooltip) this._tooltip.setLatLng(this.getCenter())
   },
 
+  beforeAdd: function (map) {
+    this.options.renderer = this.feature.datalayer.renderer
+    this.parentClass.prototype.beforeAdd.call(this, map)
+  },
+
   onAdd: function (map) {
     this._container = null
     FeatureMixin.onAdd.call(this, map)

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

@@ -4,6 +4,8 @@ import { MutatingForm } from './form/builder.js'
 import { translate } from './i18n.js'
 import Orderable from './orderable.js'
 import * as Utils from './utils.js'
+import * as Icon from './rendering/icon.js'
+import { SCHEMA } from './schema.js'
 
 const EMPTY_VALUES = ['', undefined, null]
 
@@ -12,12 +14,16 @@ class Rule {
     return this._condition
   }
 
+  get label() {
+    return this.name || this.condition
+  }
+
   set condition(value) {
     this._condition = value
     this.parse()
   }
 
-  constructor(umap, parent, condition = '', options = {}) {
+  constructor(umap, parent, condition = '', name = '', properties = {}) {
     // TODO make this public properties when browser coverage is ok
     // cf https://caniuse.com/?search=public%20class%20field
     this._condition = null
@@ -32,8 +38,9 @@ class Rule {
     this.parent = parent
     this._umap = umap
     this.active = true
-    this.options = options
+    this.properties = properties
     this.condition = condition
+    this.name = name
   }
 
   render(fields) {
@@ -95,7 +102,7 @@ class Rule {
   }
 
   getOption(option) {
-    return this.options[option]
+    return this.properties[option]
   }
 
   edit() {
@@ -108,23 +115,24 @@ class Rule {
           placeholder: translate('key=value or key!=value'),
         },
       ],
-      'options.color',
-      'options.iconClass',
-      'options.iconUrl',
-      'options.iconOpacity',
-      'options.opacity',
-      'options.weight',
-      'options.fill',
-      'options.fillColor',
-      'options.fillOpacity',
-      'options.smoothFactor',
-      'options.dashArray',
+      'name',
+      'properties.color',
+      'properties.iconClass',
+      'properties.iconUrl',
+      'properties.iconOpacity',
+      'properties.opacity',
+      'properties.weight',
+      'properties.fill',
+      'properties.fillColor',
+      'properties.fillOpacity',
+      'properties.smoothFactor',
+      'properties.dashArray',
     ]
     const builder = new MutatingForm(this, options)
     const container = document.createElement('div')
     container.appendChild(builder.build())
     const autocomplete = new AutocompleteDatalist(builder.helpers.condition.input)
-    const properties = this.parent.allProperties()
+    const properties = this.parent.fieldKeys
     autocomplete.suggestions = properties
     autocomplete.input.addEventListener('input', (event) => {
       const value = event.target.value
@@ -143,7 +151,7 @@ class Rule {
       </button>`)
     backButton.addEventListener('click', () =>
       this.parent.edit().then((panel) => {
-        panel.container.querySelector('details#rules').open = true
+        panel.scrollTo('details#rules')
       })
     )
 
@@ -160,7 +168,7 @@ class Rule {
         <button class="icon icon-16 icon-eye" title="${translate('Toggle rule')}" data-ref=toggle></button>
         <button class="icon icon-16 icon-edit show-on-edit" title="${translate('Edit')}" data-ref=edit></button>
         <button class="icon icon-16 icon-delete show-on-edit" title="${translate('Delete rule')}" data-ref=remove></button>
-        <span>${this.condition || translate('empty rule')}</span>
+        <span>${this.label || translate('empty rule')}</span>
         <i class="icon icon-16 icon-drag" title="${translate('Drag to reorder')}"></i>
       </li>
     `
@@ -171,7 +179,7 @@ class Rule {
     remove.addEventListener('click', () => {
       if (!confirm(translate('Are you sure you want to delete this rule?'))) return
       this._delete()
-      this._umap.editPanel.close()
+      this.parent.edit().then((panel) => panel.scrollTo('details#rules'))
     })
     toggle.addEventListener('click', () => {
       this.active = !this.active
@@ -181,8 +189,11 @@ class Rule {
   }
 
   _delete() {
+    // TODO refactor this call to update
+    const oldRules = Utils.CopyJSON(this.parent.properties.rules || {})
     this.parent.rules.rules = this.parent.rules.rules.filter((rule) => rule !== this)
     this.parent.rules.commit()
+    this.parent.sync.update('properties.rules', this.parent.properties.rules, oldRules)
   }
 
   setter(key, value) {
@@ -191,6 +202,20 @@ class Rule {
     this.parent.rules.commit()
     this.parent.sync.update('properties.rules', this.parent.properties.rules, oldRules)
   }
+
+  renderLegend(ul) {
+    const [li, { colorBox }] = Utils.loadTemplateWithRefs(
+      `<li><span class="color-box" data-ref=colorBox></span>${this.label}</li>`
+    )
+    const bgcolor = this.properties.color || this.parent.getColor()
+    const symbol = this.properties.iconUrl
+    colorBox.style.backgroundColor = bgcolor
+    if (symbol && symbol !== SCHEMA.iconUrl.default) {
+      const icon = Icon.makeElement(symbol, colorBox)
+      Icon.setContrast(icon, colorBox, symbol, bgcolor)
+    }
+    ul.appendChild(li)
+  }
 }
 
 export default class Rules {
@@ -203,9 +228,17 @@ export default class Rules {
   load() {
     this.rules = []
     if (!this.parent.properties.rules?.length) return
-    for (const { condition, options } of this.parent.properties.rules) {
+    for (const { condition, name, properties, options } of this.parent.properties
+      .rules) {
       if (!condition) continue
-      this.rules.push(new Rule(this._umap, this.parent, condition, options))
+      const rule = new Rule(
+        this._umap,
+        this.parent,
+        condition,
+        name,
+        properties || options
+      )
+      this.rules.push(rule)
     }
   }
 
@@ -250,6 +283,19 @@ export default class Rules {
     container.appendChild(body)
   }
 
+  count() {
+    return this.rules.length
+  }
+
+  renderLegend(container, keys = new Set()) {
+    const ul = Utils.loadTemplate('<ul class="rules-caption"></ul>')
+    container.appendChild(ul)
+    for (const rule of this.rules) {
+      if (keys.size && !keys.has(rule.key)) continue
+      rule.renderLegend(ul)
+    }
+  }
+
   addRule() {
     const rule = new Rule(this._umap, this.parent)
     this.rules.push(rule)
@@ -259,17 +305,24 @@ export default class Rules {
   commit() {
     this.parent.properties.rules = this.rules.map((rule) => {
       return {
+        name: rule.name,
         condition: rule.condition,
-        options: rule.options,
+        properties: rule.properties,
       }
     })
   }
 
-  getOption(option, feature) {
+  getOption(name, feature) {
     for (const rule of this.rules) {
       if (rule.match(feature.properties)) {
-        if (Utils.usableOption(rule.options, option)) return rule.options[option]
+        if (Utils.usableOption(rule.properties, name)) return rule.properties[name]
       }
     }
   }
+
+  *[Symbol.iterator]() {
+    for (const rule of this.rules) {
+      yield rule
+    }
+  }
 }

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

@@ -147,6 +147,9 @@ export const SCHEMA = {
     placeholder: translate('Example: key1,key2|Label 2,key3|Label 3|checkbox'),
     label: translate('Filters keys'),
   },
+  fields: {
+    type: Object,
+  },
   fill: {
     type: Boolean,
     impacts: ['data'],