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

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

@@ -1,13 +1,9 @@
-import {
-  DomEvent,
-  DomUtil,
-  Util,
-  setOptions,
-} from '../../vendors/leaflet/leaflet-src.esm.js'
+import { DomEvent, Util, setOptions } from '../../vendors/leaflet/leaflet-src.esm.js'
 import { translate } from './i18n.js'
 import { Request, ServerRequest } from './request.js'
 import { escapeHTML, generateId } from './utils.js'
 import * as Utils from './utils.js'
+import * as DOMUtils from './domutils.js'
 
 export class BaseAutocomplete {
   constructor(parent, options) {
@@ -41,26 +37,18 @@ export class BaseAutocomplete {
   }
 
   createInput() {
-    this.input = DomUtil.element({
-      tagName: 'input',
-      type: 'text',
-      parent: this.parent,
-      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)
-    DomEvent.on(this.input, 'blur', this.onBlur, this)
+    this.input = DOMUtils.loadTemplate(`
+      <input type="text" placeholder="${this.options.placeholder}" autocomplete="off" class="${this.options.className}" name="${this.options.name || 'autocomplete'}">
+    `)
+    this.parent.appendChild(this.input)
+    this.input.addEventListener('keydown', (event) => this.onKeyDown(event))
+    this.input.addEventListener('keyup', (event) => this.onKeyUp(event))
+    this.input.addEventListener('blur', (event) => this.onBlur(event))
   }
 
   createContainer() {
-    this.container = DomUtil.element({
-      tagName: 'ul',
-      parent: document.body,
-      className: 'umap-autocomplete',
-    })
+    this.container = DOMUtils.loadTemplate('<ul class="umap-autocomplete"></ul>')
+    document.body.appendChild(this.container)
   }
 
   resizeContainer() {
@@ -167,20 +155,17 @@ export class BaseAutocomplete {
   }
 
   createResult(item) {
-    const el = DomUtil.element({
-      tagName: 'li',
-      parent: this.container,
-      textContent: item.label,
-    })
+    const li = DOMUtils.loadTemplate(`<li>${item.label}</li>`)
+    this.container.appendChild(li)
     const result = {
       item: item,
-      el: el,
+      el: li,
     }
-    DomEvent.on(el, 'mouseover', () => {
+    li.addEventListener('mouseover', () => {
       this.current = result
       this.highlight()
     })
-    DomEvent.on(el, 'mousedown', () => this.setChoice())
+    li.addEventListener('mousedown', () => this.setChoice())
     return result
   }
 
@@ -202,8 +187,7 @@ export class BaseAutocomplete {
 
   highlight() {
     this.results.forEach((result, index) => {
-      if (index === this.current) DomUtil.addClass(result.el, 'on')
-      else DomUtil.removeClass(result.el, 'on')
+      result.el.classList.toggle('on', index === this.current)
     })
   }
 
@@ -298,19 +282,15 @@ export const SingleMixin = (Base) =>
     }
 
     displaySelected(result) {
-      const result_el = DomUtil.element({
-        tagName: 'div',
-        parent: this.selectedContainer,
-      })
-      result_el.textContent = result.item.label
-      const close = DomUtil.element({
-        tagName: 'span',
-        parent: result_el,
-        className: 'close',
-        textContent: '×',
-      })
+      const [root, { close }] = DOMUtils.loadTemplateWithRefs(`
+        <div class="with-toolbox">
+          ${result.item.label}
+          <button type="button" class="icon icon-16 icon-close" title="${translate('Close')}" data-ref="close"></button>
+        </div>
+      `)
+      this.selectedContainer.appendChild(root)
       this.input.style.display = 'none'
-      DomEvent.on(close, 'click', () => {
+      close.addEventListener('click', () => {
         this.selectedContainer.innerHTML = ''
         this.input.style.display = 'block'
         this.options.on_unselect?.(result)
@@ -328,19 +308,12 @@ export const MultipleMixin = (Base) =>
     }
 
     displaySelected(result) {
-      const result_el = DomUtil.element({
-        tagName: 'li',
-        parent: this.selectedContainer,
-      })
-      result_el.textContent = result.item.label
-      const close = DomUtil.element({
-        tagName: 'span',
-        parent: result_el,
-        className: 'close',
-        textContent: '×',
-      })
-      DomEvent.on(close, 'click', () => {
-        this.selectedContainer.removeChild(result_el)
+      const [li, { close }] = DOMUtils.loadTemplateWithRefs(`
+        <li class="with-toolbox">${result.item.label} <button class="icon icon-16 icon-close" type="button" data-ref="close"></button></li>
+      `)
+      this.selectedContainer.appendChild(li)
+      close.addEventListener('click', () => {
+        this.selectedContainer.removeChild(li)
         this.options.on_unselect?.(result)
       })
       this.hide()

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

@@ -1,4 +1,4 @@
-import { DomEvent, DomUtil, stamp } from '../../vendors/leaflet/leaflet-src.esm.js'
+import { DomEvent, stamp } from '../../vendors/leaflet/leaflet-src.esm.js'
 import { Form } from './form/builder.js'
 import { EXPORT_FORMATS } from './formatter.js'
 import { translate } from './i18n.js'
@@ -133,9 +133,9 @@ export default class Browser {
   update() {
     if (!this.isOpen()) return
     this.dataContainer.innerHTML = ''
-    this._umap.datalayers.browsable().map((datalayer) => {
+    for (const datalayer of this._umap.datalayers.browsable()) {
       this.addDataLayer(datalayer, this.dataContainer)
-    })
+    }
   }
 
   open(mode) {
@@ -260,7 +260,7 @@ export default class Browser {
       if (datalayer.isVisible()) allHidden = false
     })
     this._umap.datalayers.browsable().map((datalayer) => {
-      datalayer.autoLoaded = false
+      datalayer.autoVisibility = false
       if (allHidden) {
         datalayer.show()
       } else {

umap/static/umap/js/modules/data/features.js

@@ -1,12 +1,7 @@
-import {
-  DomEvent,
-  DomUtil,
-  GeoJSON,
-  LineUtil,
-} from '../../../vendors/leaflet/leaflet-src.esm.js'
+import { GeoJSON, LineUtil } from '../../../vendors/leaflet/leaflet-src.esm.js'
 import { uMapAlert as Alert } from '../../components/alerts/alert.js'
 import { MutatingForm } from '../form/builder.js'
-import { translate } from '../i18n.js'
+import { translate, getLocale } from '../i18n.js'
 import {
   PREFERENCES as ORS_PREFERENCES,
   PROFILES as ORS_PROFILES,
@@ -243,12 +238,11 @@ class Feature {
     if (this._umap.editedFeature === this && !event?.force) return
     // If this feature is active (popup open), let's close it.
     this.deactivate()
-    const container = DomUtil.create('div', 'umap-feature-container')
-    DomUtil.createTitle(
-      container,
-      translate('Feature properties'),
-      `icon-${this.getClassName()}`
-    )
+    const container = DOMUtils.loadTemplate(`
+      <div class="umap-feature-container">
+        <h3><i class="icon icon-16 icon-${this.getClassName()}"></i> ${translate('Feature properties')}</h3>
+      </div>
+    `)
 
     let builder = new MutatingForm(this, [
       ['datalayer', { handler: 'EditableDataLayerSwitcher' }],
@@ -260,17 +254,19 @@ class Feature {
     const properties = []
     for (const field of this.fields) {
       const options = { handler: 'Input', label: field.key }
-      if (field.key === 'description' || field.type === 'Text') {
+      if (field.key === 'description' || field.TYPE === 'Text') {
         options.handler = 'Textarea'
         options.helpEntries = ['textFormatting']
-      } else if (field.type === 'Number') {
+      } else if (field.TYPE === 'Number') {
         options.handler = 'FloatInput'
-      } else if (field.type === 'Date') {
+      } else if (field.TYPE === 'Date') {
         options.handler = 'DateInput'
-      } else if (field.type === 'Datetime') {
+      } else if (field.TYPE === 'Datetime') {
         options.handler = 'DateTimeInput'
-      } else if (field.type === 'Boolean') {
+      } else if (field.TYPE === 'Boolean') {
         options.handler = 'Switch'
+      } else if (field.TYPE === 'Enum') {
+        options.helpText = translate('Comma separated list of values')
       }
       properties.push([`properties.${field.key}`, options])
     }
@@ -331,7 +327,7 @@ class Feature {
     let builder = new MutatingForm(this, optionsFields, {
       id: 'umap-feature-shape-properties',
     })
-    const shapeProperties = DomUtil.createFieldset(
+    const shapeProperties = DOMUtils.createFieldset(
       container,
       translate('Shape properties')
     )
@@ -343,7 +339,7 @@ class Feature {
     builder = new MutatingForm(this, advancedOptions, {
       id: 'umap-feature-advanced-properties',
     })
-    const advancedProperties = DomUtil.createFieldset(
+    const advancedProperties = DOMUtils.createFieldset(
       container,
       translate('Advanced properties')
     )
@@ -351,7 +347,7 @@ class Feature {
 
     const interactionOptions = this.getInteractionOptions()
     builder = new MutatingForm(this, interactionOptions)
-    const popupFieldset = DomUtil.createFieldset(
+    const popupFieldset = DOMUtils.createFieldset(
       container,
       translate('Interaction options')
     )
@@ -442,7 +438,7 @@ class Feature {
     this.properties = Object.fromEntries(
       Object.entries(geojson.properties || {}).map(this.cleanProperty)
     )
-    this.properties._umap_options = L.extend(
+    this.properties._umap_options = Object.assign(
       {},
       this.properties._storage_options,
       this.properties._umap_options
@@ -514,8 +510,8 @@ class Feature {
   }
 
   cloneProperties() {
-    const properties = L.extend({}, this.properties)
-    properties._umap_options = L.extend({}, properties._umap_options)
+    const properties = Object.assign({}, this.properties)
+    properties._umap_options = Object.assign({}, properties._umap_options)
     if (Object.keys && Object.keys(properties._umap_options).length === 0) {
       delete properties._umap_options // It can make a difference on big data sets
     }
@@ -591,9 +587,10 @@ class Feature {
   }
 
   extendedProperties() {
+    console.trace()
     // Include context properties
     const properties = this._umap.getGeoContext()
-    const locale = L.getLocale()
+    const locale = getLocale()
     if (locale) properties.locale = locale
     if (U.lang) properties.lang = U.lang
     properties.rank = this.getRank() + 1
@@ -788,7 +785,7 @@ export class Point extends Feature {
     ]
     const builder = new MutatingForm(this, coordinatesOptions)
     builder.on('set', () => {
-      if (!this.ui._latlng.isValid()) {
+      if (!Utils.LatLngIsValid(this.ui._latlng)) {
         Alert.error(translate('Invalid latitude or longitude'))
         builder.restoreField('ui._latlng.lat')
         builder.restoreField('ui._latlng.lng')
@@ -796,7 +793,7 @@ export class Point extends Feature {
       this.pullGeometry()
       this.zoomTo({ easing: false })
     })
-    const fieldset = DomUtil.createFieldset(container, translate('Coordinates'))
+    const fieldset = DOMUtils.createFieldset(container, translate('Coordinates'))
     fieldset.appendChild(builder.build())
   }
 
@@ -964,7 +961,7 @@ class Path extends Feature {
     const builder = new MutatingForm(this, options, {
       id: 'umap-feature-line-decoration',
     })
-    const fieldset = DomUtil.createFieldset(container, translate('Line decoration'))
+    const fieldset = DOMUtils.createFieldset(container, translate('Line decoration'))
     fieldset.appendChild(builder.build())
   }
 }
@@ -1077,7 +1074,7 @@ export class LineString extends Path {
   getAdvancedEditActions(container) {
     super.getAdvancedEditActions(container)
     const button = Utils.loadTemplate(`
-      <button class="button" type="button"><i class="icon icon-24 icon-polygon"></i>${translate('Transform to polygon')}</button>
+      <button type="button"><i class="icon icon-24 icon-polygon"></i>${translate('Transform to polygon')}</button>
     `)
     container.appendChild(button)
     button.addEventListener('click', () => this.toPolygon())
@@ -1383,13 +1380,13 @@ export class Polygon extends Path {
 
   getAdvancedEditActions(container) {
     super.getAdvancedEditActions(container)
-    const toLineString = DomUtil.createButton(
-      'button umap-to-polyline',
-      container,
-      translate('Transform to lines'),
-      this.toLineString,
-      this
+    const toLineString = DOMUtils.loadTemplate(
+      `<button type="button" class="umap-to-polyline">
+        <i class="icon icon-24 icon-polyline"></i>${translate('Transform to lines')}
+      </button>`
     )
+    container.appendChild(toLineString)
+    toLineString.addEventListener('click', () => this.toLineString())
   }
 
   isMulti() {

umap/static/umap/js/modules/data/fields.js

@@ -9,6 +9,180 @@ export const getDefaultFields = () => [
   { key: 'description', type: 'Text' },
 ]
 
+export const Registry = {}
+
+class BaseField {
+  constructor(key) {
+    this.key = key
+  }
+
+  values(features) {
+    return features
+      .map((feature) => this.parse(feature.properties[this.key]))
+      .filter((val, idx, arr) => arr.indexOf(val) === idx)
+  }
+
+  equal(expected, other) {
+    return expected === other
+  }
+
+  not_equal(expected, other) {
+    return expected !== other
+  }
+
+  gt(expected, other) {
+    return other > expected
+  }
+
+  lt(expected, other) {
+    return other < expected
+  }
+
+  render(value) {
+    return Utils.escapeHTML(value).trim()
+  }
+
+  dumps() {
+    return {
+      key: this.key,
+      type: this.TYPE,
+    }
+  }
+}
+
+Registry.String = class extends BaseField {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'String'
+    this.LABEL = translate('Short text')
+  }
+
+  parse(value) {
+    return String(value ?? '')
+  }
+
+  render(value) {
+    value = super.render(value)
+    // TODO, manage links (url, mailto, wikipedia...)
+    if (value.indexOf('http') === 0) {
+      value = `<a href="${value}" target="_blank">${value}</a>`
+    }
+    return value
+  }
+}
+
+Registry.Text = class extends Registry.String {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'Text'
+    this.LABEL = translate('Text')
+  }
+
+  render(value) {
+    return Utils.toHTML(value)
+  }
+}
+
+Registry.Number = class extends BaseField {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'Number'
+    this.LABEL = translate('Number')
+  }
+
+  parse(value) {
+    return Number.parseFloat(value)
+  }
+}
+
+Registry.Datetime = class extends BaseField {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'Datetime'
+    this.LABEL = translate('Date and time')
+  }
+
+  parse(value) {
+    return new Date(value)
+  }
+}
+
+Registry.Date = class extends BaseField {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'Date'
+    this.LABEL = translate('Date')
+  }
+
+  parse(value) {
+    return Utils.parseNaiveDate(value)
+  }
+}
+
+Registry.Boolean = class extends BaseField {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'Boolean'
+    this.LABEL = translate('Yes / No')
+  }
+
+  parse(value) {
+    // 'yes' is used in OpenStreetMap data
+    return ['true', '1', 'yes'].includes(`${value}`.toLowerCase())
+  }
+}
+
+Registry.Enum = class extends BaseField {
+  constructor(key) {
+    super(key)
+    // FIXME make it dynamic from class name
+    this.TYPE = 'Enum'
+    this.LABEL = translate('List of values')
+  }
+
+  parse(value) {
+    return String(value || '')
+      .split(',')
+      .map((s) => s.trim())
+  }
+
+  values(features) {
+    return features
+      .reduce(
+        (acc, feature) => acc.concat(this.parse(feature.properties[this.key])),
+        []
+      )
+      .filter((val, idx, arr) => arr.indexOf(val) === idx)
+  }
+
+  equal(expected, other) {
+    return Boolean(new Set(other).intersection(new Set(expected)).size)
+  }
+
+  not_equal(expected, other) {
+    return !new Set(other).intersection(new Set(expected)).size
+  }
+
+  gt(expected, other) {
+    return false
+  }
+
+  lt(expected, other) {
+    return false
+  }
+}
+
+const FIELD_TYPES = Object.entries(Registry).map(([name, klass]) => [
+  name,
+  new klass().LABEL,
+])
+
 export class Fields extends Map {
   constructor(parent, dialog) {
     super()
@@ -38,7 +212,7 @@ export class Fields extends Map {
     this.parent.properties.fields = this.all().map((field) => {
       // We don't want to keep the reference, otherwise editing
       // it will also change the old value
-      return { ...field }
+      return { ...field.dumps() }
     })
   }
 
@@ -60,10 +234,8 @@ export class Fields extends Map {
       console.error('Invalid field', field)
       return
     }
-    field.type ??= 'String'
-    // Copy object, so not to affect original
-    // when edited.
-    this.set(field.key, { ...field })
+    const klass = Registry[field.type] || Registry.String
+    this.set(field.key, new klass(field.key))
     this.push()
   }
 
@@ -103,7 +275,7 @@ export class Fields extends Map {
       const [row, { edit, del, addFilter, editFilter }] = Utils.loadTemplateWithRefs(
         `<li class="orderable with-toolbox" data-key="${field.key}">
           <span>
-            <i class="icon icon-16 icon-field-${field.type}" title="${field.type}"></i>
+            <i class="icon icon-16 icon-field-${field.TYPE}" title="${field.LABEL}"></i>
             ${field.key}
           </span>
           <span>
@@ -161,16 +333,8 @@ export class Fields extends Map {
 
   async editField(name) {
     if (!name && this.parent.isRemoteLayer?.()) return
-    const FIELD_TYPES = [
-      ['String', translate('Short text')],
-      ['Text', translate('Text')],
-      ['Number', translate('Number')],
-      ['Date', translate('Date')],
-      ['Datetime', translate('Date and time')],
-      ['Enum', translate('List of values')],
-      ['Boolean', translate('Yes / No')],
-    ]
-    const field = this.get(name) || {}
+    const field = this.get(name)
+    const data = field?.dumps() || {}
     const metadatas = [
       [
         'key',
@@ -189,7 +353,7 @@ export class Fields extends Map {
         },
       ],
     ]
-    const form = new Form(field, metadatas)
+    const form = new Form(data, metadatas)
 
     const [container, { body, addFilter }] = Utils.loadTemplateWithRefs(`
       <div>
@@ -202,32 +366,34 @@ export class Fields extends Map {
     if (this.parent.filters) {
       addFilter.addEventListener('click', () => {
         this.dialog.accept().then(() => {
-          this.parent.filters.createFilterForm(field.key)
+          this.parent.filters.createFilterForm(data.key)
         })
       })
       addFilter.hidden = false
     }
 
     return this.dialog.open({ template: container }).then(() => {
-      if (!this.validateName(field.key, field.key !== name)) {
+      if (!this.validateName(data.key, data.key !== name)) {
         this.pull()
         return
       }
       this.parent.sync.startBatch()
       const oldFields = Utils.CopyJSON(this.parent.properties.fields)
       if (!name) {
-        this.add(field)
-      } else if (name !== field.key) {
+        this.add(data)
+      } else if (name !== data.key || field.TYPE !== data.type) {
         this.clear()
         // Keep order on rename
         for (const old of oldFields) {
           if (old.key === name) {
-            this.add(field)
+            this.add(data)
           } else {
             this.add(old)
           }
         }
-        this.parent.renameField(name, field.key)
+        if (name !== data.key) {
+          this.parent.renameField(name, data.key)
+        }
       } else {
         this.push()
       }