umap-project 2.4.2__py3-none-any.whl → 2.5.1__py3-none-any.whl

umap/static/umap/js/components/alerts/alert.css

@@ -1,4 +1,4 @@
-[role="dialog"] {
+.umap-alert[role="dialog"] {
     box-sizing: border-box;
     min-height: 46px;
     line-height: 46px;
@@ -20,36 +20,36 @@
     width: max-content;
     z-index: var(--zindex-alert);
 }
-[role="dialog"] > div {
+.umap-alert[role="dialog"] > div {
     margin: 0 auto;
     min-width: 60%;
     background-size: 20px;
     background-position: 0 15px;
     padding-left: 28px;
 }
-[role="dialog"][data-level="info"] > div {
+.umap-alert[role="dialog"][data-level="info"] > div {
     background-image: url('../../../img/alert-icon-info.svg');
     background-repeat: no-repeat;
 }
-[role="dialog"][data-level="success"] > div {
+.umap-alert[role="dialog"][data-level="success"] > div {
     background-image: url('../../../img/alert-icon-success.svg');
     background-repeat: no-repeat;
 }
-[role="dialog"][data-level="error"] > div {
+.umap-alert[role="dialog"][data-level="error"] > div {
     background-image: url('../../../img/alert-icon-error.svg');
     background-repeat: no-repeat;
 }
-[role="dialog"][data-level="error"] {
+.umap-alert[role="dialog"][data-level="error"] {
     background-color: var(--color-darkRed);
 }
-[role="dialog"] a {
+.umap-alert[role="dialog"] a {
     text-decoration: underline;
 }
-[role="dialog"] label {
+.umap-alert[role="dialog"] label {
     font-size: .8rem;
     font-weight: normal;
 }
-[role="dialog"] a[target="_blank"] {
+.umap-alert[role="dialog"] a[target="_blank"] {
     background: url('../../../img/icon-external-link.svg') no-repeat right center;
     padding-right: 14px;
     background-size: 12px;
@@ -127,7 +127,7 @@ h3[role="alert"] + p {
 #link-wrapper {
     margin-bottom: 1rem;
 }
-[role="dialog"] #conflict-wrapper a[target="_blank"] {
+.umap-alert[role="dialog"] #conflict-wrapper a[target="_blank"] {
     background-position-y: 16px;
 }
 

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

@@ -6,6 +6,7 @@ import {
 } from '../../vendors/leaflet/leaflet-src.esm.js'
 import { translate } from './i18n.js'
 import { Request, ServerRequest } from './request.js'
+import { escapeHTML, generateId } from './utils.js'
 
 export class BaseAutocomplete {
   constructor(el, options) {
@@ -16,6 +17,7 @@ export class BaseAutocomplete {
       allowFree: true,
       minChar: 2,
       maxResults: 5,
+      throttling: 300,
     }
     this.cache = ''
     this.results = []
@@ -45,6 +47,7 @@ export class BaseAutocomplete {
       placeholder: this.options.placeholder,
       autocomplete: 'off',
       className: this.options.className,
+      name: this.options.name || 'autocomplete',
     })
     DomEvent.on(this.input, 'keydown', this.onKeyDown, this)
     DomEvent.on(this.input, 'keyup', this.onKeyUp, this)
@@ -125,7 +128,10 @@ export class BaseAutocomplete {
       'Control',
     ]
     if (!special.includes(e.key)) {
-      this.search()
+      if (this._typing) window.clearTimeout(this._typing)
+      this._typing = window.setTimeout(() => {
+        this.search()
+      }, this.options.throttling)
     }
   }
 
@@ -345,3 +351,19 @@ export const MultipleMixin = (Base) =>
 export class AjaxAutocompleteMultiple extends MultipleMixin(BaseServerAjax) {}
 
 export class AjaxAutocomplete extends SingleMixin(BaseServerAjax) {}
+
+export class AutocompleteDatalist {
+  constructor(input) {
+    this.input = input
+    this.datalist = document.createElement('datalist')
+    this.datalist.id = generateId()
+    this.input.setAttribute('list', this.datalist.id)
+    this.input.parentElement.appendChild(this.datalist)
+  }
+
+  set suggestions(values) {
+    this.datalist.innerHTML = values
+      .map((value) => `<option>${escapeHTML(value)}</option>`)
+      .join('')
+  }
+}

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

@@ -37,7 +37,7 @@ export default class Browser {
       ? U.Icon.prototype.formatUrl(feature._getIconUrl(), feature)
       : null
     title.textContent = feature.getDisplayName() || '—'
-    const bgcolor = feature.getDynamicOption('color')
+    const bgcolor = feature.getPreviewColor()
     colorBox.style.backgroundColor = bgcolor
     if (symbol && symbol !== U.SCHEMA.iconUrl.default) {
       const icon = U.Icon.makeIconElement(symbol, colorBox)
@@ -107,6 +107,7 @@ export default class Browser {
     this.map.eachBrowsableDataLayer((datalayer) => {
       datalayer.resetLayer(true)
       this.updateDatalayer(datalayer)
+      if (this.map.fullPanel?.isOpen()) datalayer.tableEdit()
     })
     this.toggleBadge()
   }
@@ -149,7 +150,7 @@ export default class Browser {
     DomEvent.disableClickPropagation(container)
 
     DomUtil.createTitle(container, translate('Data browser'), 'icon-layers')
-    const formContainer = DomUtil.createFieldset(container, L._('Filters'), {
+    this.formContainer = DomUtil.createFieldset(container, L._('Filters'), {
       on: this.mode === 'filters',
       className: 'filters',
       icon: 'icon-filters',
@@ -169,7 +170,7 @@ export default class Browser {
       callback: () => this.onFormChange(),
     })
     let filtersBuilder
-    formContainer.appendChild(builder.build())
+    this.formContainer.appendChild(builder.build())
     DomEvent.on(builder.form, 'reset', () => {
       window.setTimeout(builder.syncAll.bind(builder))
     })
@@ -181,12 +182,11 @@ export default class Browser {
       DomEvent.on(filtersBuilder.form, 'reset', () => {
         window.setTimeout(filtersBuilder.syncAll.bind(filtersBuilder))
       })
-      formContainer.appendChild(filtersBuilder.build())
+      this.formContainer.appendChild(filtersBuilder.build())
     }
-    const reset = DomUtil.createButton('flat', formContainer, '', () => {
-      builder.form.reset()
-      if (filtersBuilder) filtersBuilder.form.reset()
-    })
+    const reset = DomUtil.createButton('flat', this.formContainer, '', () =>
+      this.resetFilters()
+    )
     DomUtil.createIcon(reset, 'icon-restore')
     DomUtil.element({
       tagName: 'span',
@@ -202,6 +202,12 @@ export default class Browser {
     this.update()
   }
 
+  resetFilters() {
+    for (const form of this.formContainer?.querySelectorAll('form') || []) {
+      form.reset()
+    }
+  }
+
   static backButton(map) {
     const button = DomUtil.createButtonIcon(
       DomUtil.create('li', '', undefined),

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

@@ -12,8 +12,8 @@ export default class Facets {
     const properties = {}
     let selected
 
-    names.forEach((name) => {
-      const type = defined[name].type
+    for (const name of names) {
+      const type = defined.get(name).type
       properties[name] = { type: type }
       selected = this.selected[name] || {}
       selected.type = type
@@ -22,13 +22,13 @@ export default class Facets {
         selected.choices = selected.choices || []
       }
       this.selected[name] = selected
-    })
+    }
 
     this.map.eachBrowsableDataLayer((datalayer) => {
       datalayer.eachFeature((feature) => {
-        names.forEach((name) => {
+        for (const name of names) {
           let value = feature.properties[name]
-          const type = defined[name].type
+          const type = defined.get(name).type
           const parser = this.getParser(type)
           value = parser(value)
           switch (type) {
@@ -56,7 +56,7 @@ export default class Facets {
                 properties[name].choices.push(value)
               }
           }
-        })
+        }
       })
     })
     return properties
@@ -73,7 +73,7 @@ export default class Facets {
 
   build() {
     const defined = this.getDefined()
-    const names = Object.keys(defined)
+    const names = [...defined.keys()]
     const facetProperties = this.compute(names, defined)
 
     const fields = names.map((name) => {
@@ -90,7 +90,7 @@ export default class Facets {
           handler = 'FacetSearchDateTime'
           break
       }
-      const label = defined[name].label
+      const label = defined.get(name).label
       return [
         `selected.${name}`,
         {
@@ -107,12 +107,14 @@ export default class Facets {
   getDefined() {
     const defaultType = 'checkbox'
     const allowedTypes = [defaultType, 'radio', 'number', 'date', 'datetime']
+    const defined = new Map()
+    if (!this.map.options.facetKey) return defined
     return (this.map.options.facetKey || '').split(',').reduce((acc, curr) => {
       let [name, label, type] = curr.split('|')
       type = allowedTypes.includes(type) ? type : defaultType
-      acc[name] = { label: label || name, type: type }
+      acc.set(name, { label: label || name, type: type })
       return acc
-    }, {})
+    }, defined)
   }
 
   getParser(type) {
@@ -127,4 +129,32 @@ export default class Facets {
         return (v) => String(v || '')
     }
   }
+
+  dumps(parsed) {
+    const dumped = []
+    for (const [property, { label, type }] of parsed) {
+      dumped.push([property, label, type].filter(Boolean).join('|'))
+    }
+    return dumped.join(',')
+  }
+
+  has(property) {
+    return this.getDefined().has(property)
+  }
+
+  add(property, label, type) {
+    const defined = this.getDefined()
+    if (!defined.has(property)) {
+      defined.set(property, { label, type })
+      this.map.options.facetKey = this.dumps(defined)
+      this.map.isDirty = true
+    }
+  }
+
+  remove(property) {
+    const defined = this.getDefined()
+    defined.delete(property)
+    this.map.options.facetKey = this.dumps(defined)
+    this.map.isDirty = true
+  }
 }

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

@@ -0,0 +1,153 @@
+/* Uses globals for: csv2geojson, osmtogeojson, GeoRSSToGeoJSON (not available as ESM) */
+import { translate } from './i18n.js'
+
+export const EXPORT_FORMATS = {
+  geojson: {
+    formatter: async (map) => JSON.stringify(map.toGeoJSON(), null, 2),
+    ext: '.geojson',
+    filetype: 'application/json',
+  },
+  gpx: {
+    formatter: async (map) => await map.formatter.toGPX(map.toGeoJSON()),
+    ext: '.gpx',
+    filetype: 'application/gpx+xml',
+  },
+  kml: {
+    formatter: async (map) => await map.formatter.toKML(map.toGeoJSON()),
+    ext: '.kml',
+    filetype: 'application/vnd.google-earth.kml+xml',
+  },
+  csv: {
+    formatter: async (map) => {
+      const table = []
+      map.eachFeature((feature) => {
+        const row = feature.toGeoJSON().properties
+        const center = feature.getCenter()
+        delete row._umap_options
+        row.Latitude = center.lat
+        row.Longitude = center.lng
+        table.push(row)
+      })
+      return csv2geojson.dsv.csvFormat(table)
+    },
+    ext: '.csv',
+    filetype: 'text/csv',
+  },
+}
+
+export class Formatter {
+  async fromGPX(str) {
+    const togeojson = await import('../../vendors/togeojson/togeojson.es.js')
+    return togeojson.gpx(this.toDom(str))
+  }
+
+  async fromKML(str) {
+    const togeojson = await import('../../vendors/togeojson/togeojson.es.js')
+    return togeojson.kml(this.toDom(str), {
+      skipNullGeometry: true,
+    })
+  }
+
+  async fromGeoJSON(str) {
+    try {
+      return JSON.parse(str)
+    } catch (err) {
+      U.Alert.error(`Invalid JSON file: ${err}`)
+    }
+  }
+
+  async fromOSM(str) {
+    let src
+    try {
+      src = JSON.parse(str)
+    } catch (e) {
+      src = this.toDom(str)
+    }
+    return osmtogeojson(src, { flatProperties: true })
+  }
+
+  fromCSV(str, callback) {
+    csv2geojson.csv2geojson(
+      str,
+      {
+        delimiter: 'auto',
+        includeLatLon: false,
+      },
+      (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.
+        if (result?.features.length) {
+          if (result.features[0].geometry === null) {
+            err = {
+              type: 'Error',
+              message: translate('Cannot determine latitude and longitude columns.'),
+            }
+          }
+        }
+        if (err) {
+          let message
+          if (err.type === 'Error') {
+            message = err.message
+          } else {
+            message = translate('{count} errors during import: {message}', {
+              count: err.length,
+              message: err[0].message,
+            })
+          }
+          U.Alert.error(message, 10000)
+          console.error(err)
+        }
+        if (result?.features.length) {
+          callback(result)
+        }
+      }
+    )
+  }
+
+  async fromGeoRSS(str) {
+    return GeoRSSToGeoJSON(this.toDom(c))
+  }
+
+  toDom(x) {
+    const doc = new DOMParser().parseFromString(x, 'text/xml')
+    const errorNode = doc.querySelector('parsererror')
+    if (errorNode) {
+      U.Alert.error(translate('Cannot parse data'))
+    }
+    return doc
+  }
+
+  async parse(str, format) {
+    switch (format) {
+      case 'csv':
+        return new Promise((resolve, reject) => {
+          return this.fromCSV(str, (data) => resolve(data))
+        })
+      case 'gpx':
+        return await this.fromGPX(str)
+      case 'kml':
+        return await this.fromKML(str)
+      case 'osm':
+        return await this.fromOSM(str)
+      case 'georss':
+        return await this.fromGeoRSS(str)
+      case 'geojson':
+        return await this.fromGeoJSON(str)
+    }
+  }
+
+  async toGPX(geojson) {
+    const togpx = await import('../../vendors/geojson-to-gpx/index.js')
+    for (const feature of geojson.features) {
+      feature.properties.desc = feature.properties.description
+    }
+    const gpx = togpx.default(geojson)
+    return new XMLSerializer().serializeToString(gpx)
+  }
+
+  async toKML(geojson) {
+    const tokml = await import('../../vendors/tokml/tokml.es.js')
+    return tokml.toKML(geojson)
+  }
+}

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

@@ -3,19 +3,23 @@ import {
   uMapAlertConflict as AlertConflict,
   uMapAlertCreation as AlertCreation,
 } from '../components/alerts/alert.js'
-import { AjaxAutocomplete, AjaxAutocompleteMultiple } from './autocomplete.js'
+import { AjaxAutocomplete, AjaxAutocompleteMultiple, AutocompleteDatalist } from './autocomplete.js'
 import Browser from './browser.js'
 import Caption from './caption.js'
 import Facets from './facets.js'
+import { Formatter } from './formatter.js'
 import Help from './help.js'
 import Importer from './importer.js'
 import Orderable from './orderable.js'
 import { HTTPError, NOKError, Request, RequestError, ServerRequest } from './request.js'
 import Rules from './rules.js'
 import { SCHEMA } from './schema.js'
+import Share from './share.js'
+import Slideshow from './slideshow.js'
 import { SyncEngine } from './sync/engine.js'
 import Dialog from './ui/dialog.js'
 import { EditPanel, FullPanel, Panel } from './ui/panel.js'
+import TableEditor from './tableeditor.js'
 import Tooltip from './ui/tooltip.js'
 import URLs from './urls.js'
 import * as Utils from './utils.js'
@@ -30,11 +34,13 @@ window.U = {
   AlertConflict,
   AjaxAutocomplete,
   AjaxAutocompleteMultiple,
+  AutocompleteDatalist,
   Browser,
   Caption,
   Dialog,
   EditPanel,
   Facets,
+  Formatter,
   FullPanel,
   Help,
   HTTPError,
@@ -47,7 +53,10 @@ window.U = {
   Rules,
   SCHEMA,
   ServerRequest,
+  Share,
+  Slideshow,
   SyncEngine,
+  TableEditor,
   Tooltip,
   URLs,
   Utils,

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

@@ -165,6 +165,7 @@ const ENTRIES = {
 export default class Help {
   constructor(map) {
     this.map = map
+    this.dialog = new U.Dialog()
     this.isMacOS = /mac/i.test(
       // eslint-disable-next-line compat/compat -- Fallback available.
       navigator.userAgentData ? navigator.userAgentData.platform : navigator.platform
@@ -190,42 +191,43 @@ export default class Help {
   show(entries) {
     const container = DomUtil.add('div')
     DomUtil.createTitle(container, translate('Help'))
-    // Special dynamic case. Do we still think this dialog is usefull ?
-    if (entries === 'edit') {
+    for (const name of entries) {
       DomUtil.element({
         tagName: 'div',
         className: 'umap-help-entry',
         parent: container,
-      }).appendChild(this._buildEditEntry())
-    } else {
-      for (const name of entries) {
-        DomUtil.element({
-          tagName: 'div',
-          className: 'umap-help-entry',
-          parent: container,
-          innerHTML: ENTRIES[name],
-        })
-      }
+        innerHTML: ENTRIES[name],
+      })
     }
+    this.dialog.open({ template: container, className: 'dark', cancel: false, accept: false })
+  }
+
+  // Special dynamic case. Do we still think this dialog is useful?
+  showGetStarted() {
+    const container = DomUtil.add('div')
+    DomUtil.createTitle(container, translate('Where do we go from here?'))
+    DomUtil.element({
+      tagName: 'div',
+      className: 'umap-help-entry',
+      parent: container,
+    }).appendChild(this._buildEditEntry())
     this.map.dialog.open({ content: container, className: 'dark' })
   }
 
-  button(container, entries, classname) {
+  button(container, entries) {
     const button = DomUtil.createButton(
-      classname || 'umap-help-button',
+      'umap-help-button',
       container,
       translate('Help')
     )
-    entries = typeof entries === 'string' ? [entries] : entries
-    DomEvent.on(button, 'click', DomEvent.stop).on(button, 'click', () =>
-      this.show(entries)
-    )
+    button.addEventListener('click', () => this.show(entries))
     return button
   }
 
-  link(container, entries) {
-    const button = this.button(container, entries, 'umap-help-link')
+  getStartedLink(container) {
+    const button = DomUtil.createButton('umap-help-link', container, translate('Help'))
     button.textContent = translate('Help')
+    button.addEventListener('click', () => this.showGetStarted())
     return button
   }
 
@@ -237,16 +239,14 @@ export default class Help {
 
   _buildEditEntry() {
     const container = DomUtil.create('div', '')
-    const title = DomUtil.create('h4', '', container)
     const actionsContainer = DomUtil.create('ul', 'umap-edit-actions', container)
     const addAction = (action) => {
       const actionContainer = DomUtil.add('li', '', actionsContainer)
-      DomUtil.add('i', action.options.className, actionContainer),
-        DomUtil.add('span', '', actionContainer, action.options.tooltip)
+      DomUtil.add('i', action.options.className, actionContainer)
+      DomUtil.add('span', '', actionContainer, action.options.tooltip)
       DomEvent.on(actionContainer, 'click', action.addHooks, action)
-      DomEvent.on(actionContainer, 'click', this.map.dialog.close, this.map.dialog)
+      DomEvent.on(actionContainer, 'click', this.dialog.close, this.dialog)
     }
-    title.textContent = translate('Where do we go from here?')
     for (const id in this.map.helpMenuActions) {
       addAction(this.map.helpMenuActions[id])
     }

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

@@ -53,7 +53,7 @@ export default class Importer {
     this.TYPES = ['geojson', 'csv', 'gpx', 'kml', 'osm', 'georss', 'umap']
     this.IMPORTERS = []
     this.loadImporters()
-    this.dialog = new Dialog(this.map._controlContainer)
+    this.dialog = new Dialog()
   }
 
   loadImporters() {
@@ -114,7 +114,7 @@ export default class Importer {
   }
 
   get action() {
-    return this.qs('[name=action]:checked').value
+    return this.qs('[name=action]:checked')?.value
   }
 
   get layerId() {
@@ -234,7 +234,7 @@ export default class Importer {
   }
 
   submit() {
-    let hasErrors = false
+    let hasErrors
     if (this.format === 'umap') {
       hasErrors = !this.full()
     } else if (!this.url) {
@@ -242,7 +242,7 @@ export default class Importer {
     } else if (this.action) {
       hasErrors = !this[this.action]()
     }
-    if (!hasErrors) {
+    if (hasErrors === false) {
       Alert.info(translate('Data successfully imported!'))
     }
   }

umap/static/umap/js/modules/importers/communesfr.js

@@ -37,8 +37,10 @@ export class Importer {
     this.autocomplete = new Autocomplete(container, options)
 
     importer.dialog.open({
-      content: container,
+      template: container,
       className: `${this.id} importer dark`,
+      cancel: false,
+      accept: false,
     })
   }
 }

umap/static/umap/js/modules/importers/datasets.js

@@ -30,13 +30,15 @@ export class Importer {
         importer.format = select.options[select.selectedIndex].dataset.format
         importer.layerName = select.options[select.selectedIndex].textContent
       }
-      importer.dialog.close()
     }
-    L.DomUtil.createButton('', container, translate('Choose this dataset'), confirm)
 
-    importer.dialog.open({
-      content: container,
-      className: `${this.id} importer dark`,
-    })
+    importer.dialog
+      .open({
+        template: container,
+        className: `${this.id} importer dark`,
+        accept: translate('Choose this dataset'),
+        cancel: false,
+      })
+      .then(confirm)
   }
 }