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

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

@@ -32,7 +32,7 @@ export const copyToClipboard = (textToCopy) => {
   tooltip.open({ content: translate('✅ Copied!'), duration: 5000 })
 }
 
-export const copiableInput = (parent, label, value) => {
+export const copiableInput = (parent, label, value = '') => {
   const [container, { input, button }] = Utils.loadTemplateWithRefs(`
     <div class="copiable-input">
       <label>${label}<input type="text" readOnly value="${value}" data-ref=input /></label>
@@ -82,6 +82,10 @@ export const hexToRGB = (hex) => {
     .match(/.{2}/g)
     .map((x) => Number.parseInt(x, 16))
 }
+export const colorToRGB = (color) => {
+  if (!color.startsWith('#')) color = colorNameToHex(color)
+  return hexToRGB(color)
+}
 
 const CACHE_CONTRAST = {}
 export const contrastedColor = (el, bgcolor) => {
@@ -107,3 +111,23 @@ export const contrastedColor = (el, bgcolor) => {
   if (bgcolor) CACHE_CONTRAST[bgcolor] = out
   return out
 }
+
+export const createFieldset = (parent, title, options) => {
+  options = options || {}
+  const [details, { summary, fieldset }] = loadTemplateWithRefs(`
+    <details class="${options.className || ''}">
+      <summary data-ref="summary"><h4>${title}</h4></summary>
+      <fieldset data-ref="fieldset"></fieldset>
+    </details>
+  `)
+  details.open = options.on === true
+  parent.appendChild(details)
+  if (options.icon) {
+    const icon = loadTemplate(`<i class="icon icon-16 ${options.icon}"></i>`)
+    summary.insertBefore(icon, summary.firstChild)
+  }
+  return fieldset
+}
+
+export const loadTemplateWithRefs = Utils.loadTemplateWithRefs
+export const loadTemplate = Utils.loadTemplate

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

@@ -6,27 +6,6 @@ import { Fields } from './form/fields.js'
 
 const EMPTY_VALUE = translate('<empty value>')
 
-const getParser = (type) => {
-  switch (type) {
-    case 'Number':
-      return Number.parseFloat
-    case 'Datetime':
-      return (v) => new Date(v)
-    case 'Date':
-      return Utils.parseNaiveDate
-    case 'Boolean':
-      return Boolean
-    case 'Enum':
-      return (v) => {
-        if (!v) return [EMPTY_VALUE]
-        return String(v || '')
-          .split(',')
-          .map((s) => s.trim())
-      }
-    default:
-      return (v) => String(v || '')
-  }
-}
 const Widgets = {}
 
 class BaseWidget {
@@ -73,13 +52,13 @@ Widgets.MinMax = class extends BaseWidget {
     return this.userData.min !== undefined || this.userData.max !== undefined
   }
   getFormField(field) {
-    if (field.type === 'Number') {
+    if (field.TYPE === 'Number') {
       return 'FilterByNumber'
     }
-    if (field.type === 'Date') {
+    if (field.TYPE === 'Date') {
       return 'FilterByDate'
     }
-    if (field.type === 'Datetime') {
+    if (field.TYPE === 'Datetime') {
       return 'FilterByDateTime'
     }
     return super.getFormField(field)
@@ -186,16 +165,15 @@ export class Filters {
   // and max values.
   computeInitialData() {
     const initialData = Object.fromEntries(
-      this.available.keys().map((name) => [name, {}])
+      Array.from(this.available.keys()).map((name) => [name, {}])
     )
 
     for (const [name, filter] of this.available.entries()) {
       const field = this._parent.fields.get(name)
       if (!field) continue
-      const parser = getParser(field.type)
       this._parent.eachFeature((feature) => {
         let value = feature.properties[name]
-        value = parser(value)
+        value = field.parse(value)
         filter.computeInitialData(initialData[name], value)
       })
     }
@@ -214,6 +192,7 @@ export class Filters {
         {
           initialData: initialData[name] || {},
           handler: filter.getFormField(field),
+          dataField: field,
           label: Utils.escapeHTML(this.available.get(name).label || field.key),
           onClick: () => {
             this._parent
@@ -228,14 +207,8 @@ export class Filters {
   }
 
   load() {
-    let filters = this._parent.properties.filters || []
-    // TMP fix for dev server to update map created before changing
-    // filters to be an array
-    if (typeof filters === 'object' && !Array.isArray(filters) && filters !== null) {
-      filters = Object.entries(filters).map(([fieldKey, props]) => {
-        return { fieldKey, ...props }
-      })
-    }
+    let filters = this._parent.properties.filters
+    if (!Array.isArray(filters)) filters = []
     for (const filter of filters) {
       this._add({ ...filter })
     }
@@ -377,9 +350,9 @@ export class Filters {
   createFilterForm(fieldKey) {
     let widget = 'Checkbox'
     const field = this._parent.fields.get(fieldKey)
-    if (['Number', 'Date', 'Datetime'].includes(field?.type)) {
+    if (['Number', 'Date', 'Datetime'].includes(field?.TYPE)) {
       widget = 'MinMax'
-    } else if (field?.type === 'Boolean') {
+    } else if (field?.TYPE === 'Boolean') {
       widget = 'Switch'
     }
     const properties = {
@@ -392,7 +365,9 @@ export class Filters {
       ? [fieldKey]
       : [
           '',
-          ...this._parent.fieldKeys.filter((fieldKey) => !this.available.has(fieldKey)),
+          ...Array.from(this._parent.fields.keys()).filter(
+            (fieldKey) => !this.available.has(fieldKey)
+          ),
         ]
     const metadata = [
       [
@@ -474,8 +449,7 @@ export class Filters {
       // This field may only exist on another layer.
       if (!field) continue
       let value = feature.properties[fieldKey]
-      const parser = getParser(field.type)
-      value = parser(value)
+      value = field.parse(value)
       if (obj.match(value)) return true
     }
     return false
@@ -510,6 +484,10 @@ class FiltersForm extends Form {
 
 const FilterBase = class extends Fields.Base {
   buildLabel() {}
+
+  cast(value) {
+    return this.properties.dataField.cast(value) || EMPTY_VALUE
+  }
 }
 
 const FilterByChoices = class extends FilterBase {
@@ -545,8 +523,8 @@ const FilterByChoices = class extends FilterBase {
 
   toJS() {
     return {
-      selected: [...this.elements.ul.querySelectorAll('input:checked')].map(
-        (i) => i.dataset.value
+      selected: [...this.elements.ul.querySelectorAll('input:checked')].map((i) =>
+        this.cast(i.dataset.value)
       ),
     }
   }
@@ -573,6 +551,10 @@ Fields.MinMaxBase = class extends FilterBase {
     return value?.valueOf() ?? null
   }
 
+  prepareForJS(value) {
+    return this.cast(value)
+  }
+
   getTemplate() {
     const [minLabel, maxLabel] = this.getLabels()
     const { min, max } = this.properties.initialData
@@ -654,10 +636,6 @@ Fields.FilterByNumber = class extends Fields.MinMaxBase {
   getInputType(type) {
     return 'number'
   }
-
-  prepareForJS(value) {
-    return new Number(value)
-  }
 }
 
 Fields.FilterByDate = class extends Fields.MinMaxBase {
@@ -665,10 +643,6 @@ Fields.FilterByDate = class extends Fields.MinMaxBase {
     return 'date'
   }
 
-  prepareForJS(value) {
-    return new Date(value)
-  }
-
   toLocaleDateTime(dt) {
     return new Date(dt.valueOf() - dt.getTimezoneOffset() * 60000)
   }

umap/static/umap/js/modules/form/builder.js

@@ -56,30 +56,31 @@ export class Form extends Utils.WithEvents {
     return this.helpers[field]
   }
 
-  getter(field) {
-    const path = field.split('.')
+  getter(helper) {
+    const path = helper.field.split('.')
     let value = this.obj
     for (const sub of path) {
       try {
         value = value[sub]
       } catch {
-        console.debug(field)
+        console.debug(helper.field)
       }
     }
     return value
   }
 
-  setter(field, value) {
+  setter(helper, value) {
     if ('setter' in this.obj) {
-      this.obj.setter(field, value)
+      this.obj.setter(helper.field, value)
     } else {
-      Utils.setObjectValue(this.obj, field, value)
+      Utils.setObjectValue(this.obj, helper.field, value)
     }
   }
 
   restoreField(field) {
-    const initial = this.helpers[field].initial
-    this.setter(field, initial)
+    const helper = this.helpers[field]
+    const initial = helper.initial
+    this.setter(helper, initial)
   }
 
   getName(field) {
@@ -127,9 +128,9 @@ export class Form extends Utils.WithEvents {
 export class MutatingForm extends Form {
   constructor(obj, fields, properties) {
     super(obj, fields, properties)
+    this.debounce = true
     this._umap = obj._umap || properties.umap
     this.computeDefaultProperties()
-    // this.on('finish', this.finish)
   }
 
   computeDefaultProperties() {
@@ -180,21 +181,21 @@ export class MutatingForm extends Form {
     }
   }
 
-  setter(field, value) {
-    const oldValue = this.getter(field)
-    super.setter(field, value)
+  setter(helper, value) {
+    const oldValue = this.getter(helper)
+    super.setter(helper, value)
     if ('render' in this.obj) {
-      this.obj.render([field], this)
+      this.obj.render([helper.field], this)
     }
-    if ('sync' in this.obj) {
-      this.obj.sync.update(field, value, oldValue)
+    if ('sync' in this.obj && helper.properties.sync !== false) {
+      this.obj.sync.update(helper.field, value, oldValue)
     }
   }
 
   getTemplate(helper) {
     let template
     if (helper.properties.inheritable) {
-      const extraClassName = this.getter(helper.field) === undefined ? ' undefined' : ''
+      const extraClassName = this.getter(helper) === undefined ? ' undefined' : ''
       template = `
         <div class="umap-field-${helper.name} formbox inheritable${extraClassName}">
           <div class="header" data-ref=header>

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

@@ -87,7 +87,7 @@ Fields.Base = class {
     const path = this.field.split('.')
     const key = path[path.length - 1]
     if (!this.properties.inheritable) {
-      value = this.builder.getter(this.field)
+      value = this.builder.getter(this)
     } else {
       value = this.obj.getOption(key)
     }
@@ -108,8 +108,16 @@ Fields.Base = class {
     this.builder.fire('set', { helper: this })
   }
 
+  listenForSync(element) {
+    let callback = () => this.sync()
+    if (this.builder.form.debounce) {
+      callback = Utils.debounce(callback, 300)
+    }
+    element.addEventListener('input', callback)
+  }
+
   set() {
-    this.builder.setter(this.field, this.toJS())
+    this.builder.setter(this, this.toJS())
   }
 
   getLabelTemplate() {
@@ -139,10 +147,7 @@ Fields.Textarea = class extends Fields.Base {
     this.textarea = this.elements.textarea
     this.input = this.textarea
     this.fetch()
-    this.textarea.addEventListener(
-      'input',
-      Utils.debounce(() => this.sync(), 300)
-    )
+    this.listenForSync(this.textarea)
     this.textarea.addEventListener('keypress', (event) => this.onKeyPress(event))
   }
 
@@ -194,7 +199,7 @@ Fields.Input = class extends Fields.Base {
       this.input.disabled = true
     }
     this.fetch()
-    this.listenForSync()
+    this.listenForSync(this.input)
     this.input.addEventListener('keydown', (event) => this.onKeyDown(event))
   }
 
@@ -204,13 +209,6 @@ Fields.Input = class extends Fields.Base {
     this.input.value = value
   }
 
-  listenForSync() {
-    this.input.addEventListener(
-      'input',
-      Utils.debounce(() => this.sync(), 300)
-    )
-  }
-
   type() {
     return this.properties.type || 'text'
   }
@@ -644,7 +642,7 @@ const BaseDataLayerSwitcher = class extends Fields.Select {
 
   set() {
     this.builder._umap.lastUsedDataLayer = this.toJS()
-    this.builder.setter(this.field, this.toJS())
+    this.builder.setter(this, this.toJS())
   }
 }
 
@@ -746,7 +744,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.fieldKeys
+    const properties = Array.from(this.builder.obj.fields.keys())
     autocomplete.suggestions = properties
   }
 }
@@ -762,7 +760,7 @@ Fields.IconUrl = class extends Fields.BlurInput {
     // in the super method, maybe it's useless for all fields.
     const path = this.field.split('.')
     const key = path[path.length - 1]
-    return this.builder.getter(this.field)
+    return this.builder.getter(this)
   }
 
   getTemplate() {
@@ -1217,8 +1215,9 @@ Fields.ManageOwner = class extends Fields.Base {
     super.build()
     const options = {
       className: 'edit-owner',
-      on_select: L.bind(this.onSelect, this),
+      on_select: (choice) => this.onSelect(choice),
       placeholder: translate("Type new owner's username"),
+      url: this.properties.url,
     }
     this.autocomplete = new AjaxAutocomplete(this.container, options)
     const owner = this.toHTML()
@@ -1248,9 +1247,10 @@ Fields.ManageEditors = class extends Fields.Base {
     super.build()
     const options = {
       className: 'edit-editors',
-      on_select: L.bind(this.onSelect, this),
-      on_unselect: L.bind(this.onUnselect, this),
+      on_select: (choice) => this.onSelect(choice),
+      on_unselect: (choice) => this.onUnselect(choice),
       placeholder: translate("Type editor's username"),
+      url: this.properties.url,
     }
     this.autocomplete = new AjaxAutocompleteMultiple(this.container, options)
     this._values = this.toHTML() || []

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

@@ -71,7 +71,15 @@ export class Formatter {
     } catch (e) {
       src = this.toDom(str)
     }
-    return osmtogeojson(src, { flatProperties: true })
+    const data = osmtogeojson(src, { flatProperties: true })
+    // FIXME: make a PR to osmtogeojson when it's more active
+    // cf https://github.com/umap-project/umap/issues/3072
+    for (const feature of data.features || []) {
+      const [osm_type, osm_id] = feature.properties.id.split('/')
+      feature.properties.osm_id = osm_id
+      feature.properties.osm_type = osm_type
+    }
+    return data
   }
 
   fromCSV(str, callback) {

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

@@ -1,7 +1,7 @@
-import { DomEvent, DomUtil } from '../../vendors/leaflet/leaflet-src.esm.js'
 import { translate } from './i18n.js'
 import Dialog from './ui/dialog.js'
 import * as Utils from './utils.js'
+import * as DOMUtils from './domutils.js'
 
 const SHORTCUTS = {
   DRAW_MARKER: {
@@ -209,15 +209,15 @@ export default class Help {
   }
 
   show(entries) {
-    const container = DomUtil.add('div')
-    DomUtil.createTitle(container, translate('Help'))
+    const container = DOMUtils.loadTemplate(`
+      <div>
+        <h3><i class="icon icon-16 icon-help"></i> ${translate('Help')}</h3>
+      </div>
+    `)
     for (const name of entries) {
-      DomUtil.element({
-        tagName: 'div',
-        className: 'umap-help-entry',
-        parent: container,
-        innerHTML: ENTRIES[name],
-      })
+      container.appendChild(
+        DOMUtils.loadTemplate(`<div class="umap-help-entry">${ENTRIES[name]}</div>`)
+      )
     }
     this.dialog.open({ template: container })
   }
@@ -253,11 +253,10 @@ export default class Help {
   }
 
   button(container, entries) {
-    const button = DomUtil.createButton(
-      'umap-help-button',
-      container,
-      translate('Help')
+    const button = DOMUtils.loadTemplate(
+      `<button class="umap-help-button" type="button">${translate('Help')}</button>`
     )
+    container.appendChild(button)
     button.addEventListener('click', () => this.show(entries))
     return button
   }

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

@@ -1,13 +1,10 @@
-import {
-  DomEvent,
-  DomUtil,
-  LatLngBounds,
-} from '../../vendors/leaflet/leaflet-src.esm.js'
+import { LatLngBounds } from '../../vendors/leaflet/leaflet-src.esm.js'
 import { uMapAlert as Alert } from '../components/alerts/alert.js'
 import { translate } from './i18n.js'
 import { SCHEMA } from './schema.js'
 import Dialog from './ui/dialog.js'
 import * as Utils from './utils.js'
+import * as DOMUtils from './domutils.js'
 
 const TEMPLATE = `
   <div class="umap-import">
@@ -203,18 +200,15 @@ export default class Importer extends Utils.WithTemplate {
       button.toggleAttribute('hidden', false)
     }
     for (const type of this.TYPES) {
-      DomUtil.element({
-        tagName: 'option',
-        parent: this.qs('[name=format]'),
-        value: type,
-        textContent: type,
-      })
+      this.qs('[name=format]').appendChild(
+        DOMUtils.loadTemplate(`<option value="${type}">${type}</option>`)
+      )
     }
     this._umap.help.parse(this.container)
     this.qs('[name=submit]').addEventListener('click', () => this.submit())
-    DomEvent.on(this.qs('[type=file]'), 'change', this.onFileChange, this)
+    this.qs('[type=file]').addEventListener('change', () => this.onFileChange())
     for (const element of this.container.querySelectorAll('[onchange]')) {
-      DomEvent.on(element, 'change', this.onChange, this)
+      element.addEventListener('change', () => this.onChange())
     }
   }
 
@@ -253,21 +247,18 @@ export default class Importer extends Utils.WithTemplate {
     layerSelect.innerHTML = ''
     this._umap.datalayers.reverse().map((datalayer) => {
       if (datalayer.isLoaded() && !datalayer.isRemoteLayer()) {
-        DomUtil.element({
-          tagName: 'option',
-          parent: layerSelect,
-          textContent: datalayer.getName(),
-          value: datalayer.id,
-        })
+        layerSelect.appendChild(
+          DOMUtils.loadTemplate(
+            `<option value="${datalayer.id}">${datalayer.getName()}</option>`
+          )
+        )
       }
     })
-    DomUtil.element({
-      tagName: 'option',
-      value: '',
-      textContent: translate('Import in a new layer'),
-      parent: layerSelect,
-      selected: true,
-    })
+    layerSelect.appendChild(
+      DOMUtils.loadTemplate(
+        `<option value="" selected>${translate('Import in a new layer')}</option>`
+      )
+    )
   }
 
   open() {

umap/static/umap/js/modules/importers/banfr.js

@@ -1,4 +1,3 @@
-import { DomUtil } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import { uMapAlert as Alert } from '../../components/alerts/alert.js'
 import { BaseAjax, SingleMixin } from '../autocomplete.js'
 import { translate } from '../i18n.js'

umap/static/umap/js/modules/importers/cadastrefr.js

@@ -1,26 +1,28 @@
-import { DomUtil } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import { uMapAlert as Alert } from '../../components/alerts/alert.js'
 import { BaseAjax, SingleMixin } from '../autocomplete.js'
 import { translate } from '../i18n.js'
 import * as Util from '../utils.js'
+import * as DOMUtils from '../domutils.js'
 import { AutocompleteCommunes } from './communesfr.js'
 
 const TEMPLATE = `
-  <h3>Cadastre</h3>
-  <p>Importer les données cadastrales d’une commune française.</p>
-  <div class="formbox">
-    <select name="theme">
-      <option value="batiments">Bâtiments</option>
-      <option value="communes">Communes</option>
-      <option value="feuilles">Feuilles</option>
-      <option value="lieux_dits">Lieux dits</option>
-      <option value="parcelles" selected>Parcelles</option>
-      <option value="prefixes_sections">Préfixes sections</option>
-      <option value="sections">Sections</option>
-      <option value="subdivisions_fiscales">Subdivisions fiscales</option>
-    </select>
-    <label id="boundary">
-    </label>
+  <div>
+    <h3>Cadastre</h3>
+    <p>Importer les données cadastrales d’une commune française.</p>
+    <div class="formbox">
+      <select name="theme" data-ref="select">
+        <option value="batiments">Bâtiments</option>
+        <option value="communes">Communes</option>
+        <option value="feuilles">Feuilles</option>
+        <option value="lieux_dits">Lieux dits</option>
+        <option value="parcelles" selected>Parcelles</option>
+        <option value="prefixes_sections">Préfixes sections</option>
+        <option value="sections">Sections</option>
+        <option value="subdivisions_fiscales">Subdivisions fiscales</option>
+      </select>
+      <label id="boundary">
+      </label>
+    </div>
   </div>
 `
 
@@ -33,9 +35,7 @@ export class Importer {
   async open(importer) {
     let boundary = null
     let boundaryName = null
-    const container = DomUtil.create('div')
-    container.innerHTML = TEMPLATE
-    const select = container.querySelector('select')
+    const [container, { select }] = DOMUtils.loadTemplateWithRefs(TEMPLATE)
     const options = {
       placeholder: 'Nom ou code INSEE…',
       url: 'https://geo.api.gouv.fr/communes?nom={q}&limit=5',

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

@@ -1,6 +1,6 @@
-import { DomUtil } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import { BaseAjax, SingleMixin } from '../autocomplete.js'
 import * as Util from '../utils.js'
+import * as DOMUtils from '../domutils.js'
 
 export class AutocompleteCommunes extends SingleMixin(BaseAjax) {
   createResult(item) {
@@ -29,13 +29,12 @@ export class Importer {
   }
 
   async open(importer) {
-    const container = DomUtil.create('div')
-    DomUtil.createTitle(container, this.name)
-    DomUtil.element({
-      tagName: 'p',
-      parent: container,
-      textContent: "Importer les contours d'une commune française.",
-    })
+    const container = DOMUtils.loadTemplate(`
+      <div>
+        <h3>${this.name}</h3>
+        <p>Importer les contours d'une commune française.</p>
+      </div>
+    `)
     const options = {
       placeholder: 'Nom ou code INSEE…',
       url: 'https://geo.api.gouv.fr/communes?nom={q}&limit=5',