umap-project 3.0.6__py3-none-any.whl → 3.1.1__py3-none-any.whl

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

@@ -27,8 +27,8 @@ export const Cluster = L.MarkerClusterGroup.extend({
 
   initialize: function (datalayer) {
     this.datalayer = datalayer
-    if (!Utils.isObject(this.datalayer.options.cluster)) {
-      this.datalayer.options.cluster = {}
+    if (!Utils.isObject(this.datalayer.properties.cluster)) {
+      this.datalayer.properties.cluster = {}
     }
     const options = {
       polygonOptions: {
@@ -36,8 +36,8 @@ export const Cluster = L.MarkerClusterGroup.extend({
       },
       iconCreateFunction: (cluster) => new ClusterIcon(datalayer, cluster),
     }
-    if (this.datalayer.options.cluster?.radius) {
-      options.maxClusterRadius = this.datalayer.options.cluster.radius
+    if (this.datalayer.properties.cluster?.radius) {
+      options.maxClusterRadius = this.datalayer.properties.cluster.radius
     }
     L.MarkerClusterGroup.prototype.initialize.call(this, options)
     LayerMixin.onInit.call(this, this.datalayer._leafletMap)
@@ -81,9 +81,9 @@ export const Cluster = L.MarkerClusterGroup.extend({
     return L.MarkerClusterGroup.prototype.removeLayer.call(this, layer)
   },
 
-  getEditableOptions: () => [
+  getEditableProperties: () => [
     [
-      'options.cluster.radius',
+      'properties.cluster.radius',
       {
         handler: 'BlurIntInput',
         placeholder: translate('Clustering radius'),
@@ -91,7 +91,7 @@ export const Cluster = L.MarkerClusterGroup.extend({
       },
     ],
     [
-      'options.cluster.textColor',
+      'properties.cluster.textColor',
       {
         handler: 'TextColorPicker',
         placeholder: translate('Auto'),
@@ -101,13 +101,20 @@ export const Cluster = L.MarkerClusterGroup.extend({
   ],
 
   onEdit: function (field, builder) {
-    if (field === 'options.cluster.radius') {
+    if (field === 'properties.cluster.radius') {
       // No way to reset radius of an already instanciated MarkerClusterGroup...
       this.datalayer.resetLayer(true)
       return
     }
-    if (field === 'options.color') {
+    if (field === 'properties.color') {
       this.options.polygonOptions.color = this.datalayer.getColor()
     }
   },
+
+  _moveChild: (layer, from, to) => {
+    // Extend parent method, so to remove remove/addLayer,
+    // to let our own dragend event listener be called
+    // cf https://github.com/umap-project/umap/issues/2749
+    layer._latlng = to
+  },
 })

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

@@ -20,10 +20,10 @@ export const Heat = L.HeatLayer.extend({
 
   initialize: function (datalayer) {
     this.datalayer = datalayer
-    L.HeatLayer.prototype.initialize.call(this, [], this.datalayer.options.heat)
+    L.HeatLayer.prototype.initialize.call(this, [], this.datalayer.properties.heat)
     LayerMixin.onInit.call(this, this.datalayer._leafletMap)
-    if (!Utils.isObject(this.datalayer.options.heat)) {
-      this.datalayer.options.heat = {}
+    if (!Utils.isObject(this.datalayer.properties.heat)) {
+      this.datalayer.properties.heat = {}
     }
   },
 
@@ -31,9 +31,11 @@ export const Heat = L.HeatLayer.extend({
     if (layer instanceof Marker) {
       let latlng = layer.getLatLng()
       let alt
-      if (this.datalayer.options.heat?.intensityProperty) {
+      if (this.datalayer.properties.heat?.intensityProperty) {
         alt = Number.parseFloat(
-          layer.feature.properties[this.datalayer.options.heat.intensityProperty || 0]
+          layer.feature.properties[
+            this.datalayer.properties.heat.intensityProperty || 0
+          ]
         )
         latlng = new LatLng(latlng.lat, latlng.lng, alt)
       }
@@ -66,9 +68,9 @@ export const Heat = L.HeatLayer.extend({
     return latLngBounds(this._latlngs)
   },
 
-  getEditableOptions: () => [
+  getEditableProperties: () => [
     [
-      'options.heat.radius',
+      'properties.heat.radius',
       {
         handler: 'Range',
         min: 10,
@@ -79,7 +81,7 @@ export const Heat = L.HeatLayer.extend({
       },
     ],
     [
-      'options.heat.intensityProperty',
+      'properties.heat.intensityProperty',
       {
         handler: 'BlurInput',
         placeholder: translate('Heatmap intensity property'),
@@ -89,12 +91,12 @@ export const Heat = L.HeatLayer.extend({
   ],
 
   onEdit: function (field, builder) {
-    if (field === 'options.heat.intensityProperty') {
+    if (field === 'properties.heat.intensityProperty') {
       this.datalayer.resetLayer(true) // We need to repopulate the latlngs
       return
     }
-    if (field === 'options.heat.radius') {
-      this.options.radius = this.datalayer.options.heat.radius
+    if (field === 'properties.heat.radius') {
+      this.options.radius = this.datalayer.properties.heat.radius
     }
     this._updateOptions()
   },

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

@@ -21,6 +21,7 @@ import {
   MoreControl,
   PermanentCreditsControl,
   TileLayerChooser,
+  LoadTemplateControl,
 } from './controls.js'
 import * as Utils from '../utils.js'
 import * as Icon from './icon.js'
@@ -50,6 +51,10 @@ const ControlsMixin = {
   initControls: function () {
     this._controls = {}
 
+    if (this._umap.properties.is_template && !this.options.noControl) {
+      new LoadTemplateControl(this).addTo(this)
+    }
+
     if (this._umap.hasEditMode() && !this.options.noControl) {
       new EditControl(this).addTo(this)
     }

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

@@ -372,6 +372,29 @@ export const LeafletPolyline = Polyline.extend({
   parentClass: Polyline,
   includes: [FeatureMixin, PathMixin],
 
+  setStyle: function (options) {
+    PathMixin.setStyle.call(this, options)
+    this.setText(null) // Reset.
+    const textPath = this.feature.getDynamicOption('textPath')
+    if (textPath) {
+      const color =
+        this.feature.getOption('textPathColor') ||
+        this.feature.getDynamicOption('color')
+      const textPathOptions = {
+        repeat: this.feature.getOption('textPathRepeat'),
+        offset: this.feature.getOption('textPathOffset') || undefined,
+        position: this.feature.getOption('textPathPosition'),
+        attributes: {
+          fill: color,
+          opacity: this.feature.getDynamicOption('opacity'),
+          rotate: this.feature.getOption('textPathRotate'),
+          'font-size': this.feature.getOption('textPathSize'),
+        },
+      }
+      this.setText(textPath, textPathOptions)
+    }
+  },
+
   getClass: () => LeafletPolyline,
 
   getMeasure: function (shape) {

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

@@ -17,7 +17,7 @@ class Rule {
     this.parse()
   }
 
-  constructor(umap, condition = '', options = {}) {
+  constructor(umap, parent, condition = '', options = {}) {
     // TODO make this public properties when browser coverage is ok
     // cf https://caniuse.com/?search=public%20class%20field
     this._condition = null
@@ -29,6 +29,7 @@ class Rule {
       ['!=', this.not_equal],
       ['=', this.equal],
     ]
+    this.parent = parent
     this._umap = umap
     this.active = true
     this.options = options
@@ -36,7 +37,7 @@ class Rule {
   }
 
   render(fields) {
-    this._umap.render(fields)
+    this.parent.render(fields)
   }
 
   equal(other) {
@@ -123,7 +124,7 @@ class Rule {
     const container = document.createElement('div')
     container.appendChild(builder.build())
     const autocomplete = new AutocompleteDatalist(builder.helpers.condition.input)
-    const properties = this._umap.allProperties()
+    const properties = this.parent.allProperties()
     autocomplete.suggestions = properties
     autocomplete.input.addEventListener('input', (event) => {
       const value = event.target.value
@@ -131,9 +132,9 @@ class Rule {
         autocomplete.suggestions = [`${value}=`, `${value}!=`, `${value}>`, `${value}<`]
       } else if (value.endsWith('=')) {
         const key = value.split('!')[0].split('=')[0]
-        autocomplete.suggestions = this._umap
+        autocomplete.suggestions = this.parent
           .sortedValues(key)
-          .map((str) => `${value}${str || ''}`)
+          .map((str) => `${value}${str ?? ''}`)
       }
     })
     const backButton = Utils.loadTemplate(`
@@ -141,8 +142,8 @@ class Rule {
         <i class="icon icon-16 icon-back" title="${translate('Back to list')}"></i>
       </button>`)
     backButton.addEventListener('click', () =>
-      this._umap.edit().then(() => {
-        this._umap.editPanel.container.querySelector('details#rules').open = true
+      this.parent.edit().then((panel) => {
+        panel.container.querySelector('details#rules').open = true
       })
     )
 
@@ -175,40 +176,41 @@ class Rule {
     toggle.addEventListener('click', () => {
       this.active = !this.active
       li.classList.toggle('off', !this.active)
-      this._umap.render(['rules'])
+      this.parent.render(['rules'])
     })
   }
 
   _delete() {
-    this._umap.rules.rules = this._umap.rules.rules.filter((rule) => rule !== this)
-    this._umap.rules.commit()
+    this.parent.rules.rules = this.parent.rules.rules.filter((rule) => rule !== this)
+    this.parent.rules.commit()
   }
 
   setter(key, value) {
-    const oldRules = Utils.CopyJSON(this._umap.properties.rules || {})
+    const oldRules = Utils.CopyJSON(this.parent.properties.rules || {})
     Utils.setObjectValue(this, key, value)
-    this._umap.rules.commit()
-    this._umap.sync.update('properties.rules', this._umap.properties.rules, oldRules)
+    this.parent.rules.commit()
+    this.parent.sync.update('properties.rules', this.parent.properties.rules, oldRules)
   }
 }
 
 export default class Rules {
-  constructor(umap) {
+  constructor(umap, parent) {
     this._umap = umap
+    this.parent = parent
     this.load()
   }
 
   load() {
     this.rules = []
-    if (!this._umap.properties.rules?.length) return
-    for (const { condition, options } of this._umap.properties.rules) {
+    if (!this.parent.properties.rules?.length) return
+    for (const { condition, options } of this.parent.properties.rules) {
       if (!condition) continue
-      this.rules.push(new Rule(this._umap, condition, options))
+      this.rules.push(new Rule(this._umap, this.parent, condition, options))
     }
   }
 
   onReorder(src, dst, initialIndex, finalIndex) {
-    const oldRules = Utils.CopyJSON(this._umap.properties.rules || {})
+    const oldRules = Utils.CopyJSON(this.parent.properties.rules || {})
     const moved = this.rules.find((rule) => stamp(rule) === +src.dataset.id)
     const reference = this.rules.find((rule) => stamp(rule) === +dst.dataset.id)
     const movedIdx = this.rules.indexOf(moved)
@@ -222,9 +224,9 @@ export default class Rules {
     else if (finalIndex > initialIndex) newIdx = referenceIdx
     else newIdx = referenceIdx + 1
     this.rules.splice(newIdx, 0, moved)
-    this._umap.render(['rules'])
+    this.parent.render(['rules'])
     this.commit()
-    this._umap.sync.update('properties.rules', this._umap.properties.rules, oldRules)
+    this.parent.sync.update('properties.rules', this.parent.properties.rules, oldRules)
   }
 
   edit(container) {
@@ -249,13 +251,13 @@ export default class Rules {
   }
 
   addRule() {
-    const rule = new Rule(this._umap)
+    const rule = new Rule(this._umap, this.parent)
     this.rules.push(rule)
     rule.edit(map)
   }
 
   commit() {
-    this._umap.properties.rules = this.rules.map((rule) => {
+    this.parent.properties.rules = this.rules.map((rule) => {
       return {
         condition: rule.condition,
         options: rule.options,
@@ -267,7 +269,6 @@ export default class Rules {
     for (const rule of this.rules) {
       if (rule.match(feature.properties)) {
         if (Utils.usableOption(rule.options, option)) return rule.options[option]
-        break
       }
     }
   }

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

@@ -51,7 +51,6 @@ export const SCHEMA = {
   color: {
     type: String,
     impacts: ['data'],
-    handler: 'ColorPicker',
     label: translate('color'),
     helpEntries: ['colorValue'],
     inheritable: true,
@@ -84,7 +83,6 @@ export const SCHEMA = {
     type: Boolean,
     impacts: ['ui'],
     nullable: true,
-    handler: 'DataLayersControl',
     label: translate('Display the open browser control'),
     default: true,
   },
@@ -160,7 +158,6 @@ export const SCHEMA = {
   fillColor: {
     type: String,
     impacts: ['data'],
-    handler: 'ColorPicker',
     label: translate('fill color'),
     helpEntries: ['fillColor'],
     inheritable: true,
@@ -237,7 +234,6 @@ export const SCHEMA = {
   iconUrl: {
     type: String,
     impacts: ['data'],
-    handler: 'IconUrl',
     label: translate('Icon symbol'),
     inheritable: true,
   },
@@ -253,6 +249,12 @@ export const SCHEMA = {
     inheritable: true,
     default: true,
   },
+  is_template: {
+    type: Boolean,
+    impacts: ['ui'],
+    label: translate('This map is a template'),
+    default: false,
+  },
   labelDirection: {
     type: String,
     impacts: ['data'],
@@ -539,6 +541,60 @@ export const SCHEMA = {
   team: {
     type: Object,
   },
+  textPath: {
+    type: String,
+    impacts: ['data'],
+    label: translate('Add text along path'),
+  },
+  textPathColor: {
+    type: String,
+    impacts: ['data'],
+    label: translate('Text color'),
+  },
+  textPathOffset: {
+    type: Number,
+    label: translate('Text offset'),
+    impacts: ['data'],
+    default: 1,
+    min: -20,
+    max: 20,
+    step: 1,
+  },
+  textPathPosition: {
+    type: String,
+    impacts: ['data'],
+    label: translate('Text position'),
+    default: 'center',
+    choices: [
+      ['start', translate('start')],
+      ['center', translate('center')],
+      ['end', translate('end')],
+    ],
+  },
+  textPathRepeat: {
+    type: Boolean,
+    label: translate('Text repeat'),
+    impacts: ['data'],
+    default: true,
+  },
+  textPathRotate: {
+    type: Number,
+    label: translate('Text rotate'),
+    impacts: ['data'],
+    default: 0,
+    min: 0,
+    max: 360,
+    step: 1,
+  },
+  textPathSize: {
+    type: Number,
+    label: translate('Text size'),
+    impacts: ['data'],
+    default: 20,
+    min: 10,
+    max: 30,
+    step: 1,
+  },
   tilelayer: {
     type: Object,
     impacts: ['background'],

umap/static/umap/js/modules/sync/updaters.js

@@ -52,8 +52,8 @@ export class DataLayerUpdater extends BaseUpdater {
 
   update({ key, metadata, value }) {
     const datalayer = this.getDataLayerFromID(metadata.id)
-    if (key === 'options') {
-      datalayer.setOptions(value)
+    if (key === 'properties') {
+      datalayer.setProperties(value)
     } else if (Utils.fieldInSchema(key)) {
       Utils.setObjectValue(datalayer, key, value)
     } else {
@@ -109,7 +109,11 @@ export class FeatureUpdater extends BaseUpdater {
       feature.geometry = value
     } else {
       Utils.setObjectValue(feature, key, value)
-      feature.datalayer.indexProperties(feature)
+      if (key.startsWith('properties')) {
+        feature.datalayer.indexProperties(feature)
+        const name = key.replace('properties.', '')
+        feature.datalayer.checkIndexForProperty(name)
+      }
     }
 
     feature.render([key])

umap/static/umap/js/modules/tableeditor.js

@@ -96,7 +96,7 @@ export default class TableEditor extends WithTemplate {
       if (inBbox && !feature.isOnScreen(bounds)) return
       const tds = this.properties.map(
         (prop) =>
-          `<td tabindex="0" data-property="${prop}">${feature.properties[prop] || ''}</td>`
+          `<td tabindex="0" data-property="${prop}">${feature.properties[prop] ?? ''}</td>`
       )
       html += `<tr data-feature="${feature.id}"><th><input type="checkbox" /></th>${tds.join('')}</tr>`
     })
@@ -110,28 +110,12 @@ export default class TableEditor extends WithTemplate {
     }
   }
 
-  validateName(name) {
-    if (name.includes('.')) {
-      U.Alert.error(translate('Name “{name}” should not contain a dot.', { name }))
-      return false
-    }
-    if (this.properties.includes(name)) {
-      U.Alert.error(translate('This name already exists: “{name}”', { name }))
-      return false
-    }
-    return true
-  }
-
   renameProperty(property) {
     this._umap.dialog
       .prompt(translate('Please enter the new name of this property'))
       .then(({ prompt }) => {
-        if (!prompt || !this.validateName(prompt)) return
-        this.datalayer.eachFeature((feature) => {
-          feature.renameProperty(property, prompt)
-        })
-        this.datalayer.deindexProperty(property)
-        this.datalayer.indexProperty(prompt)
+        if (!prompt || !this.datalayer.validateName(prompt)) return
+        this.datalayer.renameProperty(property, prompt)
         this.open()
       })
   }
@@ -142,23 +126,16 @@ export default class TableEditor extends WithTemplate {
         translate('Are you sure you want to delete this property on all the features?')
       )
       .then(() => {
-        this.datalayer.eachFeature((feature) => {
-          feature.deleteProperty(property)
-        })
-        this.datalayer.deindexProperty(property)
+        this.datalayer.deleteProperty(property)
         this.resetProperties()
         this.open()
       })
   }
 
   addProperty() {
-    this._umap.dialog
-      .prompt(translate('Please enter the name of the property'))
-      .then(({ prompt }) => {
-        if (!prompt || !this.validateName(prompt)) return
-        this.datalayer.indexProperty(prompt)
-        this.open()
-      })
+    this.datalayer.addProperty().then(() => {
+      this.open()
+    })
   }
 
   open() {

umap/static/umap/js/modules/templates.js

@@ -0,0 +1,122 @@
+import { uMapAlert as Alert } from '../components/alerts/alert.js'
+import { translate } from './i18n.js'
+import * as Utils from './utils.js'
+
+const TEMPLATE = `
+  <div>
+    <form data-ref="form">
+      <h3><i class="icon icon-24 icon-template"></i>${translate('Load map template')}</h3>
+      <p>${translate('Loading a template will apply predefined styles and settings to your map')}.</p>
+      <div class="formbox">
+        <div class="flat-tabs" data-ref="tabs">
+          <button type="button" class="flat" data-value="mine" data-ref="mine">${translate('My templates')}</button>
+          <button type="button" class="flat" data-value="staff">${translate('From staff')}</button>
+          <button type="button" class="flat" data-value="community">${translate('From community')}</button>
+        </div>
+        <div data-ref="body" class="body"></div>
+        <div class="button-bar half">
+          <button type="button" class="primary" data-ref="confirm" disabled>${translate('Load template')}</button>
+          <button type="button" data-ref="confirmData" disabled>${translate('Load template with data')}</button>
+        </div>
+      </div>
+    </form>
+  </div>
+`
+
+export default class TemplateImporter {
+  constructor(umap) {
+    this.umap = umap
+  }
+
+  async open() {
+    const [root, { tabs, form, body, mine, confirm, confirmData }] =
+      Utils.loadTemplateWithRefs(TEMPLATE)
+    const uri = this.umap.urls.get('template_list')
+    const userIsAuth = Boolean(this.umap.properties.user?.id)
+    const defaultTab = userIsAuth ? 'mine' : 'staff'
+    mine.hidden = !userIsAuth
+
+    const loadTemplates = async (source) => {
+      const [data, response, error] = await this.umap.server.get(
+        `${uri}?source=${source}`
+      )
+      if (!error) {
+        body.innerHTML = ''
+        if (!data.templates.length) {
+          let message
+          switch (source) {
+            case 'mine':
+              message = translate(
+                'You have no registered template yet. You can add one by creating a new map and flagging it as "template".'
+              )
+              break
+            case 'staff':
+              message = translate(
+                'There is no recommended template yet. Recommended templates are the ones starred by uMap administrators.'
+              )
+              break
+            case 'community':
+              message = translate('There is no public template yet.')
+              break
+          }
+          body.textContent = message
+        }
+        for (const template of data.templates) {
+          const item = Utils.loadTemplate(
+            `<dl>
+              <dt>
+                <label>
+                  <input type="radio" value="${template.id}" name="template" />${template.name}
+                  <a href="${template.url}" target="_blank"><nobr>${translate('Explore')}<i class="icon icon-16 icon-external-link"></i></nobr></a>
+                </label>
+              </dt>
+              <dd class="text">${Utils.toHTML(template.description)}</dd>
+            </dl>`
+          )
+          body.appendChild(item)
+        }
+        tabs.querySelectorAll('button').forEach((el) => el.classList.remove('on'))
+        tabs.querySelector(`[data-value="${source}"]`).classList.add('on')
+      } else {
+        console.error(response)
+      }
+    }
+    loadTemplates(defaultTab)
+    tabs
+      .querySelectorAll('button')
+      .forEach((el) =>
+        el.addEventListener('click', () => loadTemplates(el.dataset.value))
+      )
+    form.addEventListener('change', () => {
+      if (form.template.value) {
+        confirm.disabled = false
+        confirmData.disabled = false
+      }
+    })
+    const onConfirm = (includeData) => {
+      const templateId = form.template.value
+      if (!templateId) {
+        Alert.error(translate('You must select a template.'))
+        return false
+      }
+      let url = this.umap.urls.get('map_download', {
+        map_id: templateId,
+      })
+      if (!includeData) {
+        url = `${url}?include_data=0`
+      }
+      this.umap.importer.build()
+      this.umap.importer.url = url
+      this.umap.importer.format = 'umap'
+      this.umap.importer.submit()
+      this.umap.editPanel.close()
+    }
+    confirm.addEventListener('click', () => onConfirm(false))
+    confirmData.addEventListener('click', () => onConfirm(true))
+
+    this.umap.editPanel.open({
+      content: root,
+      highlight: 'templates',
+    })
+  }
+}