umap-project 1.10.0__py3-none-any.whl → 1.11.1__py3-none-any.whl

umap/static/umap/js/umap.core.js

@@ -201,6 +201,16 @@ L.Util.greedyTemplate = (str, data, ignore) => {
   )
 }
 
+L.Util.naturalSort = (a, b) => {
+  return a
+    .toString()
+    .toLowerCase()
+    .localeCompare(b.toString().toLowerCase(), L.lang || 'en', {
+      sensitivity: 'base',
+      numeric: true,
+    })
+}
+
 L.Util.sortFeatures = (features, sortKey) => {
   const sortKeys = (sortKey || 'name').split(',')
 
@@ -214,19 +224,9 @@ L.Util.sortFeatures = (features, sortKey) => {
     let score
     const valA = a.properties[sortKey] || ''
     const valB = b.properties[sortKey] || ''
-    if (!valA) {
-      score = -1
-    } else if (!valB) {
-      score = 1
-    } else {
-      score = valA
-        .toString()
-        .toLowerCase()
-        .localeCompare(valB.toString().toLowerCase(), L.lang || 'en', {
-          sensitivity: 'base',
-          numeric: true,
-        })
-    }
+    if (!valA) score = -1
+    else if (!valB) score = 1
+    else score = L.Util.naturalSort(valA, valB)
     if (score === 0 && sortKeys[i + 1]) return sort(a, b, i + 1)
     return score * reverse
   }
@@ -287,6 +287,13 @@ L.Util.copyToClipboard = function (textToCopy) {
   }
 }
 
+L.Util.normalize = function (s) {
+  return (s || '')
+    .toLowerCase()
+    .normalize('NFD')
+    .replace(/[\u0300-\u036f]/g, '')
+}
+
 L.DomUtil.add = (tagName, className, container, content) => {
   const el = L.DomUtil.create(tagName, className, container)
   if (content) {
@@ -363,21 +370,21 @@ L.DomUtil.after = (target, el) => {
 }
 
 L.DomUtil.RGBRegex = /rgb *\( *([0-9]{1,3}) *, *([0-9]{1,3}) *, *([0-9]{1,3}) *\)/
-
 L.DomUtil.TextColorFromBackgroundColor = (el) => {
-  let out = '#000000'
-  if (!window.getComputedStyle) {
-    return out
-  }
+  return L.DomUtil.contrastedColor(el) ? '#ffffff' : '#000000'
+}
+const _CACHE_CONSTRAST = {}
+L.DomUtil.contrastedColor = (el, bgcolor) => {
+  // Return 0 for black and 1 for white
+  // bgcolor is a human color, it can be a any keyword (purple…)
+  if (typeof _CACHE_CONSTRAST[bgcolor] !== 'undefined') return _CACHE_CONSTRAST[bgcolor]
+  let out = 0
   let rgb = window.getComputedStyle(el).getPropertyValue('background-color')
   rgb = L.DomUtil.RGBRegex.exec(rgb)
-  if (!rgb || rgb.length !== 4) {
-    return out
-  }
+  if (!rgb || rgb.length !== 4) return out
   rgb = parseInt(rgb[1], 10) + parseInt(rgb[2], 10) + parseInt(rgb[3], 10)
-  if (rgb < (255 * 3) / 2) {
-    out = '#ffffff'
-  }
+  if (rgb < (255 * 3) / 2) out = 1
+  if (bgcolor) _CACHE_CONSTRAST[bgcolor] = out
   return out
 }
 L.DomEvent.once = (el, types, fn, context) => {
@@ -691,12 +698,14 @@ L.U.Orderable = L.Evented.extend({
   },
 
   onDragOver: function (e) {
+    L.DomEvent.stop(e)
     if (e.preventDefault) e.preventDefault() // Necessary. Allows us to drop.
     e.dataTransfer.dropEffect = 'move'
     return false
   },
 
   onDragEnter: function (e) {
+    L.DomEvent.stop(e)
     // e.target is the current hover target.
     const dst = this.findTarget(e.target)
     if (!dst || dst === this.src) return

umap/static/umap/js/umap.features.js

@@ -547,6 +547,14 @@ L.U.Marker = L.Marker.extend({
     this.setIcon(this.getIcon())
   },
 
+  highlight: function () {
+    L.DomUtil.addClass(this.options.icon.elements.main, 'umap-icon-active')
+  },
+
+  resetHighlight: function () {
+    L.DomUtil.removeClass(this.options.icon.elements.main, 'umap-icon-active')
+  },
+
   addInteractions: function () {
     L.U.FeatureMixin.addInteractions.call(this)
     this.on(
@@ -560,6 +568,8 @@ L.U.Marker = L.Marker.extend({
     if (!this.isReadOnly()) this.on('mouseover', this._enableDragging)
     this.on('mouseout', this._onMouseOut)
     this._popupHandlersAdded = true // prevent Leaflet from binding event on bindPopup
+    this.on('popupopen', this.highlight)
+    this.on('popupclose', this.resetHighlight)
   },
 
   hasGeom: function () {
@@ -608,6 +618,8 @@ L.U.Marker = L.Marker.extend({
   _initIcon: function () {
     this.options.icon = this.getIcon()
     L.Marker.prototype._initIcon.call(this)
+    // Allow to run code when icon is actually part of the DOM
+    this.options.icon.onAdd()
     this.resetTooltip()
   },
 
@@ -668,8 +680,8 @@ L.U.Marker = L.Marker.extend({
   appendEditFieldsets: function (container) {
     L.U.FeatureMixin.appendEditFieldsets.call(this, container)
     const coordinatesOptions = [
-      ['_latlng.lat', { handler: 'FloatInput', label: L._('Latitude'), step: 'any' }],
-      ['_latlng.lng', { handler: 'FloatInput', label: L._('Longitude'), step: 'any' }],
+      ['_latlng.lat', { handler: 'FloatInput', label: L._('Latitude') }],
+      ['_latlng.lng', { handler: 'FloatInput', label: L._('Longitude') }],
     ]
     const builder = new L.U.FormBuilder(this, coordinatesOptions, {
       callback: function () {
@@ -814,6 +826,14 @@ L.U.PathMixin = {
     L.U.FeatureMixin.endEdit.call(this)
   },
 
+  highlightPath: function () {
+    this.parentClass.prototype.setStyle.call(this, {
+      fillOpacity: Math.sqrt(this.getDynamicOption('fillOpacity', 1.0)),
+      opacity: 1.0,
+      weight: 1.3 * this.getDynamicOption('weight'),
+    })
+  },
+
   _onMouseOver: function () {
     if (this.map.measureTools && this.map.measureTools.enabled()) {
       this.map.ui.tooltip({ content: this.getMeasure(), anchor: this })
@@ -827,6 +847,8 @@ L.U.PathMixin = {
     this.on('mouseover', this._onMouseOver)
     this.on('edit', this.makeDirty)
     this.on('drag editable:drag', this._onDrag)
+    this.on('popupopen', this.highlightPath)
+    this.on('popupclose', this._redraw)
   },
 
   _onDrag: function () {

umap/static/umap/js/umap.forms.js

@@ -1,4 +1,10 @@
 L.FormBuilder.Element.include({
+  undefine: function () {
+    L.DomUtil.addClass(this.wrapper, 'undefined')
+    this.clear()
+    this.sync()
+  },
+
   getParentNode: function () {
     if (this.options.wrapper) {
       return L.DomUtil.create(
@@ -29,15 +35,10 @@ L.FormBuilder.Element.include({
         },
         this
       )
-      L.DomEvent.on(
+      L.DomEvent.on(undefine, 'click', L.DomEvent.stop).on(
         undefine,
         'click',
-        function (e) {
-          L.DomEvent.stop(e)
-          L.DomUtil.addClass(this.wrapper, 'undefined')
-          this.clear()
-          this.sync()
-        },
+        this.undefine,
         this
       )
     }
@@ -524,133 +525,230 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
 
   build: function () {
     L.FormBuilder.BlurInput.prototype.build.call(this)
-    // Try to guess if the icon content has been customized, and if yes
-    // directly display the field
-    this.input.type = this.value() && !this.value().startsWith('/') ? 'text' : 'hidden'
-    this.input.placeholder = L._('Symbol or url')
-    this.buttonsContainer = L.DomUtil.create('div', '')
-    this.pictogramsContainer = L.DomUtil.create('div', 'umap-pictogram-list')
-    L.DomUtil.before(this.input, this.buttonsContainer)
-    L.DomUtil.before(this.input, this.pictogramsContainer)
+    this.buttons = L.DomUtil.create('div', '', this.parentNode)
+    this.tabs = L.DomUtil.create('div', 'pictogram-tabs', this.parentNode)
+    this.body = L.DomUtil.create('div', 'umap-pictogram-body', this.parentNode)
+    this.footer = L.DomUtil.create('div', '', this.parentNode)
     this.udpatePreview()
-    this.on('define', this.fetchIconList)
+    this.on('define', this.onDefine)
   },
 
-  isUrl: function () {
-    return this.value() && this.value().indexOf('/') !== -1
+  onDefine: function () {
+    this.buttons.innerHTML = ''
+    this.footer.innerHTML = ''
+    this.buildTabs()
+    const value = this.value()
+    if (!value || value.startsWith('/')) this.showSymbolsTab()
+    else if (value.startsWith('http')) this.showURLTab()
+    else this.showCharsTab()
+    const closeButton = L.DomUtil.createButton(
+      'button action-button',
+      this.footer,
+      L._('Close'),
+      function (e) {
+        this.body.innerHTML = ''
+        this.tabs.innerHTML = ''
+        this.footer.innerHTML = ''
+        if (this.isDefault()) this.undefine(e)
+        else this.udpatePreview()
+      },
+      this
+    )
+  },
+
+  buildTabs: function () {
+    this.tabs.innerHTML = ''
+    const symbol = L.DomUtil.add(
+        'button',
+        'flat tab-symbols',
+        this.tabs,
+        L._('Symbol')
+      ),
+      char = L.DomUtil.add(
+        'button',
+        'flat tab-chars',
+        this.tabs,
+        L._('Emoji & Character')
+      )
+    url = L.DomUtil.add('button', 'flat tab-url', this.tabs, L._('URL'))
+    L.DomEvent.on(symbol, 'click', L.DomEvent.stop).on(
+      symbol,
+      'click',
+      this.showSymbolsTab,
+      this
+    )
+    L.DomEvent.on(char, 'click', L.DomEvent.stop).on(
+      char,
+      'click',
+      this.showCharsTab,
+      this
+    )
+    L.DomEvent.on(url, 'click', L.DomEvent.stop).on(url, 'click', this.showURLTab, this)
+  },
+
+  openTab: function (name) {
+    const els = this.tabs.querySelectorAll('button')
+    for (let el of els) {
+      L.DomUtil.removeClass(el, 'on')
+    }
+    let el = this.tabs.querySelector(`.tab-${name}`)
+    L.DomUtil.addClass(el, 'on')
+    this.body.innerHTML = ''
+  },
+
+  isPath: function () {
+    const value = this.value()
+    return value && value.length && value.startsWith('/')
+  },
+
+  isRemoteUrl: function () {
+    const value = this.value()
+    return value && value.length && value.startsWith('http')
+  },
+
+  isImg: function () {
+    return this.isPath() || this.isRemoteUrl()
   },
 
   udpatePreview: function () {
+    this.buttons.innerHTML = ''
+    if (this.isDefault()) return
     if (!L.Util.hasVar(this.value())) {
       // Do not try to render URL with variables
-      if (this.isUrl()) {
-        const img = L.DomUtil.create(
-          'img',
-          '',
-          L.DomUtil.create('div', 'umap-icon-choice', this.buttonsContainer)
-        )
+      const box = L.DomUtil.create('div', 'umap-pictogram-choice', this.buttons)
+      L.DomEvent.on(box, 'click', this.onDefine, this)
+      if (this.isImg()) {
+        const img = L.DomUtil.create('img', '', box)
         img.src = this.value()
-        L.DomEvent.on(img, 'click', this.fetchIconList, this)
       } else {
-        const el = L.DomUtil.create(
-          'span',
-          '',
-          L.DomUtil.create('div', 'umap-icon-choice', this.buttonsContainer)
-        )
+        const el = L.DomUtil.create('span', '', box)
         el.textContent = this.value()
-        L.DomEvent.on(el, 'click', this.fetchIconList, this)
       }
     }
     this.button = L.DomUtil.createButton(
       'button action-button',
-      this.buttonsContainer,
+      this.buttons,
       this.value() ? L._('Change') : L._('Add'),
-      this.fetchIconList,
+      this.onDefine,
       this
     )
   },
 
-  addIconPreview: function (pictogram) {
-    const baseClass = 'umap-icon-choice',
+  addIconPreview: function (pictogram, parent) {
+    const baseClass = 'umap-pictogram-choice',
       value = pictogram.src,
-      className = value === this.value() ? `${baseClass} selected` : baseClass,
-      container = L.DomUtil.create('div', className, this.pictogramsContainer),
+      search = L.Util.normalize(this.searchInput.value),
+      title = pictogram.attribution
+        ? `${pictogram.name} — © ${pictogram.attribution}`
+        : pictogram.name
+    if (search && L.Util.normalize(title).indexOf(search) === -1) return
+    const className = value === this.value() ? `${baseClass} selected` : baseClass,
+      container = L.DomUtil.create('div', className, parent),
       img = L.DomUtil.create('img', '', container)
     img.src = value
-    if (pictogram.name && pictogram.attribution) {
-      container.title = `${pictogram.name} — © ${pictogram.attribution}`
-    }
+    container.title = title
     L.DomEvent.on(
       container,
       'click',
       function (e) {
         this.input.value = value
         this.sync()
-        this.unselectAll(this.pictogramsContainer)
+        this.unselectAll(this.grid)
         L.DomUtil.addClass(container, 'selected')
       },
       this
     )
+    return true // Icon has been added (not filtered)
   },
 
   clear: function () {
     this.input.value = ''
-    this.unselectAll(this.pictogramsContainer)
+    this.unselectAll(this.body)
     this.sync()
-    this.pictogramsContainer.innerHTML = ''
+    this.body.innerHTML = ''
     this.udpatePreview()
   },
 
-  search: function (e) {
-    const icons = [...this.parentNode.querySelectorAll('.umap-icon-choice')],
-      search = this.searchInput.value.toLowerCase()
-    icons.forEach((el) => {
-      if (el.title.toLowerCase().indexOf(search) != -1) el.style.display = 'block'
-      else el.style.display = 'none'
-    })
+  addCategory: function (category, items) {
+    const parent = L.DomUtil.create('div', 'umap-pictogram-category'),
+      title = L.DomUtil.add('h6', '', parent, category),
+      grid = L.DomUtil.create('div', 'umap-pictogram-grid', parent)
+    let status = false
+    for (let item of items) {
+      status = this.addIconPreview(item, grid) || status
+    }
+    if (status) this.grid.appendChild(parent)
   },
 
-  buildIconList: function (data) {
-    this.searchInput = L.DomUtil.create('input', '', this.pictogramsContainer)
+  buildSymbolsList: function () {
+    this.grid.innerHTML = ''
+    const categories = {}
+    let category
+    for (const props of this.pictogram_list) {
+      category = props.category || L._('Generic')
+      categories[category] = categories[category] || []
+      categories[category].push(props)
+    }
+    const sorted = Object.entries(categories).toSorted(([a], [b]) =>
+      L.Util.naturalSort(a, b)
+    )
+    for (let [category, items] of sorted) {
+      this.addCategory(category, items)
+    }
+  },
+
+  isDefault: function () {
+    return !this.value() || this.value() === this.obj.getMap().options.default_iconUrl
+  },
+
+  showSymbolsTab: function () {
+    this.openTab('symbols')
+    this.searchInput = L.DomUtil.create('input', '', this.body)
     this.searchInput.type = 'search'
     this.searchInput.placeholder = L._('Search')
-    L.DomEvent.on(this.searchInput, 'input', this.search, this)
-    for (const idx in data.pictogram_list) {
-      this.addIconPreview(data.pictogram_list[idx])
+    this.grid = L.DomUtil.create('div', '', this.body)
+    L.DomEvent.on(this.searchInput, 'input', this.buildSymbolsList, this)
+    if (this.pictogram_list) {
+      this.buildSymbolsList()
+    } else {
+      this.builder.map.get(this.builder.map.options.urls.pictogram_list_json, {
+        callback: (data) => {
+          this.pictogram_list = data.pictogram_list
+          this.buildSymbolsList()
+        },
+        context: this,
+      })
     }
-    const closeButton = L.DomUtil.createButton(
-      'button action-button',
-      this.pictogramsContainer,
-      L._('Close'),
-      function (e) {
-        this.pictogramsContainer.innerHTML = ''
-        this.udpatePreview()
-      },
-      this
-    )
-    closeButton.style.display = 'block'
-    closeButton.style.clear = 'both'
+  },
 
-    const customButton = L.DomUtil.createButton(
-      'flat',
-      this.pictogramsContainer,
-      L._('Toggle direct input (advanced)'),
-      function (e) {
-        this.input.type = this.input.type === 'text' ? 'hidden' : 'text'
-      },
-      this
-    )
-    this.builder.map.help.button(customButton, 'formatIconSymbol')
+  showCharsTab: function () {
+    this.openTab('chars')
+    const value = !this.isImg() ? this.value() : null
+    const input = this.buildInput(this.body, value)
+    input.placeholder = L._('Type char or paste emoji')
+    input.type = 'text'
   },
 
-  fetchIconList: function (e) {
-    // Clean parent element before calling ajax, to prevent blinking
-    this.pictogramsContainer.innerHTML = ''
-    this.buttonsContainer.innerHTML = ''
-    this.builder.map.get(this.builder.map.options.urls.pictogram_list_json, {
-      callback: this.buildIconList,
-      context: this,
+  showURLTab: function () {
+    this.openTab('url')
+    const value = this.isRemoteUrl() ? this.value() : null
+    const input = this.buildInput(this.body, value)
+    input.placeholder = L._('Add image URL')
+    input.type = 'url'
+  },
+
+  buildInput: function (parent, value) {
+    const input = L.DomUtil.create('input', 'blur', parent)
+    const button = L.DomUtil.create('span', 'button blur-button', parent)
+    if (value) input.value = value
+    L.DomEvent.on(input, 'blur', () => {
+      // Do not clear this.input when focus-blur
+      // empty input
+      if (input.value === value) return
+      this.input.value = input.value
+      this.sync()
     })
+    return input
   },
 
   unselectAll: function (container) {

umap/static/umap/js/umap.icon.js

@@ -38,6 +38,8 @@ L.U.Icon = L.DivIcon.extend({
   formatUrl: function (url, feature) {
     return L.Util.greedyTemplate(url || '', feature ? feature.extendedProperties() : {})
   },
+
+  onAdd: function () {},
 })
 
 L.U.Icon.Default = L.U.Icon.extend({
@@ -63,6 +65,19 @@ L.U.Icon.Default = L.U.Icon.extend({
     this.elements.arrow.style.opacity = opacity
   },
 
+  onAdd: function () {
+    const src = this._getIconUrl('icon')
+    // Decide whether to switch svg to white or not, but do it
+    // only for internal SVG, as invert could do weird things
+    if (src.startsWith('/') && src.endsWith('.svg')) {
+      const bgcolor = this._getColor()
+      // Must be called after icon container is added to the DOM
+      if (L.DomUtil.contrastedColor(this.elements.container, bgcolor)) {
+        this.elements.img.style.filter = 'invert(1)'
+      }
+    }
+  },
+
   createIcon: function () {
     this.elements = {}
     this.elements.main = L.DomUtil.create('div')
@@ -76,9 +91,9 @@ L.U.Icon.Default = L.U.Icon.extend({
     if (src) {
       // An url.
       if (
-        src.indexOf('http') === 0 ||
-        src.indexOf('/') === 0 ||
-        src.indexOf('data:image') === 0
+        src.startsWith('http') ||
+        src.startsWith('/') ||
+        src.startsWith('data:image')
       ) {
         this.elements.img = L.DomUtil.create('img', null, this.elements.container)
         this.elements.img.src = src
@@ -95,7 +110,6 @@ L.U.Icon.Default = L.U.Icon.extend({
 L.U.Icon.Circle = L.U.Icon.extend({
   initialize: function (map, options) {
     const default_options = {
-      iconAnchor: new L.Point(6, 6),
       popupAnchor: new L.Point(0, -6),
       tooltipAnchor: new L.Point(6, 0),
       className: 'umap-circle-icon',
@@ -165,7 +179,6 @@ L.U.Icon.Ball = L.U.Icon.Default.extend({
   },
 })
 
-const _CACHE_COLOR = {}
 L.U.Icon.Cluster = L.DivIcon.extend({
   options: {
     iconSize: [40, 40],
@@ -192,14 +205,6 @@ L.U.Icon.Cluster = L.DivIcon.extend({
     if (this.datalayer.options.cluster && this.datalayer.options.cluster.textColor) {
       color = this.datalayer.options.cluster.textColor
     }
-    if (!color) {
-      if (typeof _CACHE_COLOR[backgroundColor] === 'undefined') {
-        color = L.DomUtil.TextColorFromBackgroundColor(el)
-        _CACHE_COLOR[backgroundColor] = color
-      } else {
-        color = _CACHE_COLOR[backgroundColor]
-      }
-    }
-    return color
+    return color || L.DomUtil.TextColorFromBackgroundColor(el, backgroundColor)
   },
 })

umap/static/umap/js/umap.js

@@ -272,7 +272,10 @@ L.U.Map.include({
         url.searchParams.delete('edit')
         history.pushState({}, '', url)
       }
-      if (L.Util.queryString('download')) this.download()
+      if (L.Util.queryString('download'))
+        window.location = L.Util.template(this.options.urls.map_download, {
+          map_id: this.options.umap_id,
+        })
     })
 
     window.onbeforeunload = () => this.isDirty || null
@@ -396,7 +399,6 @@ L.U.Map.include({
   },
 
   loadDatalayers: function (force) {
-    force = force || L.Util.queryString('download') // In case we are in download mode, let's go strait to loading all data
     const total = this.datalayers_index.length
     // toload => datalayer metadata remaining to load (synchronous)
     // dataToload => datalayer data remaining to load (asynchronous)
@@ -686,7 +688,11 @@ L.U.Map.include({
       // FIXME An invalid hash will cause the load to fail
       this._hash.update()
     } else if (this.options.defaultView === 'locate' && !this.options.noControl) {
-      this.once('locationerror', this._setDefaultCenter)
+      // When using locate as default map view AND activating easing
+      // Leaflet.locate will ask the map view to compute transition to user
+      // position, so in this case we do need a default center, so let's
+      // set it anyway
+      this._setDefaultCenter()
       this._controls.locate.start()
     } else if (this.options.defaultView === 'data') {
       this.onceDataLoaded(() => {
@@ -824,14 +830,8 @@ L.U.Map.include({
     })
   },
 
-  fullDownload: function () {
-    // Make sure all data is loaded before downloading
-    this.once('dataloaded', () => this.download())
-    this.loadDatalayers(true) // Force load
-  },
-
   format: function (mode) {
-    const type = this.EXPORT_TYPES[mode || 'umap']
+    const type = this.EXPORT_TYPES[mode]
     const content = type.formatter(this)
     let name = this.options.name || 'data'
     name = name.replace(/[^a-z0-9]/gi, '_').toLowerCase()
@@ -1074,24 +1074,6 @@ L.U.Map.include({
     return properties
   },
 
-  serialize: function () {
-    // Do not use local path during unit tests
-    const uri = window.location.protocol === 'file:' ? null : window.location.href
-    const umapfile = {
-      type: 'umap',
-      uri: uri,
-      properties: this.exportOptions(),
-      geometry: this.geometry(),
-      layers: [],
-    }
-
-    this.eachDataLayer((datalayer) => {
-      umapfile.layers.push(datalayer.umapGeoJSON())
-    })
-
-    return JSON.stringify(umapfile, null, 2)
-  },
-
   saveSelf: function () {
     const geojson = {
       type: 'Feature',
@@ -1766,16 +1748,16 @@ L.U.Map.include({
     this.permissions.addOwnerLink('span', container)
     if (this.options.captionMenus) {
       L.DomUtil.createButton(
-        'umap-about-link',
+        'umap-about-link flat',
         container,
-        ` — ${L._('About')}`,
+        L._('About'),
         this.displayCaption,
         this
       )
       L.DomUtil.createButton(
-        'umap-open-browser-link',
+        'umap-open-browser-link flat',
         container,
-        ` | ${L._('Browse data')}`,
+        L._('Browse data'),
         this.openBrowser,
         this
       )