umap-project 3.3.6__py3-none-any.whl → 3.4.0b0__py3-none-any.whl

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

@@ -111,6 +111,10 @@ const FeatureMixin = {
   onCommit: function () {
     this.feature.onCommit()
   },
+
+  isVisible() {
+    return Boolean(this._map?.hasLayer(this))
+  },
 }
 
 const PointMixin = {
@@ -377,6 +381,27 @@ const PathMixin = {
     // https://github.com/Leaflet/Leaflet/pull/9475
 
     this._path.classList.toggle('leaflet-interactive', options.interactive)
+
+    // Text decoration
+    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)
+    }
   },
 
   _redraw: function () {
@@ -423,29 +448,6 @@ 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) {
@@ -632,4 +634,8 @@ export const CircleMarker = BaseCircleMarker.extend({
   getCenter: function () {
     return this._latlng
   },
+
+  setText() {
+    // Dummy function, as it inherits from PathMixin
+  },
 })

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

@@ -207,7 +207,8 @@ class Rule {
     const [li, { colorBox }] = Utils.loadTemplateWithRefs(
       `<li><span class="color-box" data-ref=colorBox></span>${this.label}</li>`
     )
-    const bgcolor = this.properties.color || this.parent.getColor()
+    const bgcolor =
+      this.properties.fillColor || this.properties.color || this.parent.getColor()
     const symbol = this.properties.iconUrl
     colorBox.style.backgroundColor = bgcolor
     if (symbol && symbol !== SCHEMA.iconUrl.default) {
@@ -265,10 +266,10 @@ export default class Rules {
   edit(container) {
     const template = `
       <details id="rules">
-        <summary>${translate('Conditional style rules')}</summary>
+        <summary><h4>${translate('Conditional style rules')}</h4></summary>
         <fieldset>
           <ul data-ref=ul></ul>
-          <button class="umap-add" type="button" data-ref=add>${translate('Add rule')}</button>
+          <button type="button" data-ref=add>${translate('Add rule')}</button>
         </fieldset>
       </details>
     `

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

@@ -140,15 +140,12 @@ export const SCHEMA = {
     label: translate('Display the embed control'),
     default: true,
   },
-  facetKey: {
-    type: String,
+  filters: {
+    type: Array,
     impacts: ['ui'],
-    helpEntries: ['facetKey'],
-    placeholder: translate('Example: key1,key2|Label 2,key3|Label 3|checkbox'),
-    label: translate('Filters keys'),
   },
   fields: {
-    type: Object,
+    type: Array,
   },
   fill: {
     type: Boolean,

umap/static/umap/js/modules/share.js

@@ -3,6 +3,7 @@ import { MutatingForm } from './form/builder.js'
 import { EXPORT_FORMATS } from './formatter.js'
 import { translate } from './i18n.js'
 import * as Utils from './utils.js'
+import * as DOMUtils from './domutils.js'
 
 export default class Share {
   constructor(umap) {
@@ -17,14 +18,14 @@ export default class Share {
       'icon-share'
     )
 
-    DomUtil.createCopiableInput(
+    DOMUtils.copiableInput(
       this.container,
       translate('Link to view the map'),
       window.location.protocol + Utils.getBaseUrl()
     )
 
     if (this._umap.properties.shortUrl) {
-      DomUtil.createCopiableInput(
+      DOMUtils.copiableInput(
         this.container,
         translate('Short link'),
         this._umap.properties.shortUrl
@@ -79,7 +80,7 @@ export default class Share {
     const embedTitle = DomUtil.add('h4', '', this.container, translate('Embed the map'))
     const iframe = DomUtil.create('textarea', 'umap-share-iframe', this.container)
     const urlTitle = DomUtil.add('h4', '', this.container, translate('Direct link'))
-    const exportUrl = DomUtil.createCopiableInput(
+    const exportUrl = DOMUtils.copiableInput(
       this.container,
       translate('Share this link to open a customized map view'),
       ''

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

@@ -31,53 +31,73 @@ export default class TableEditor extends WithTemplate {
     this.elements.body.addEventListener('keydown', (event) => this.onKeyDown(event))
     this.elements.header.addEventListener('click', (event) => {
       const property = event.target.dataset.property
-      if (property) this.openHeaderMenu(property)
+      const parentType = event.target.dataset.fieldParent
+      if (property)
+        this.openHeaderMenu(
+          property,
+          parentType === 'map' ? this._umap : this.datalayer
+        )
     })
   }
 
-  openHeaderMenu(property) {
-    const actions = []
-    let filterItem
-    if (this._umap.facets.has(property)) {
-      filterItem = {
-        label: translate('Remove filter for this column'),
+  openHeaderMenu(name, parent) {
+    let actionLabel
+    if (parent.filters.has(name)) {
+      actionLabel = translate('Edit filter for this field')
+    } else {
+      actionLabel = translate('Add filter for this field')
+    }
+    const actions = [
+      {
+        label: actionLabel,
         action: () => {
-          this._umap.facets.remove(property)
+          parent.filters.createFilterForm(name)
           this._umap.browser.open('filters')
         },
-      }
-    } else {
-      filterItem = {
-        label: translate('Add filter for this column'),
+      },
+      {
+        label: translate('Edit this field'),
         action: () => {
-          this._umap.facets.add(property)
-          this._umap.browser.open('filters')
+          parent.fields.editField(name).then(() => this.open())
         },
-      }
-    }
-    actions.push(filterItem)
-    if (!this.datalayer.isRemoteLayer()) {
+      },
+    ]
+    // Only allow deleting fields for map and local datalayer.
+    if (!parent.isRemoteLayer?.()) {
       actions.push({
-        label: translate('Rename this column'),
-        action: () => this.renameProperty(property),
-      })
-      actions.push({
-        label: translate('Delete this column'),
-        action: () => this.deleteProperty(property),
+        label: translate('Delete this field'),
+        action: () => {
+          parent.fields.confirmDelete(name).then(() => this.open())
+        },
       })
     }
     this.contextmenu.open(event, actions)
   }
 
+  get fields() {
+    return [
+      ...this.datalayer.fields.all().map((field) => {
+        const copy = { ...field }
+        copy.parent = 'datalayer'
+        return copy
+      }),
+      ...this._umap.fields.all().map((field) => {
+        const copy = { ...field }
+        copy.parent = 'map'
+        return copy
+      }),
+    ]
+  }
+
   renderHeaders() {
     this.elements.header.innerHTML = ''
     const th = loadTemplate('<th><input type="checkbox" /></th>')
     const checkbox = th.firstChild
     this.elements.header.appendChild(th)
-    for (const field of this.datalayer.fields) {
+    for (const field of this.fields) {
       this.elements.header.appendChild(
         loadTemplate(
-          `<th>${field.key}<button data-property="${field.key}" class="flat" aria-label="${translate('Advanced actions')}">…</button></th>`
+          `<th>${field.key}<button data-property="${field.key}" data-field-parent="${field.parent}" class="flat" aria-label="${translate('Advanced actions')}">…</button></th>`
         )
       )
     }
@@ -94,7 +114,7 @@ export default class TableEditor extends WithTemplate {
     this.datalayer.features.forEach((feature) => {
       if (feature.isFiltered()) return
       if (inBbox && !feature.isOnScreen(bounds)) return
-      const tds = this.datalayer.fields.map(
+      const tds = this.fields.map(
         (field) =>
           `<td tabindex="0" data-property="${field.key}">${feature.properties[field.key] ?? ''}</td>`
       )
@@ -103,16 +123,8 @@ export default class TableEditor extends WithTemplate {
     this.elements.body.innerHTML = html
   }
 
-  renameProperty(property) {
-    this.datalayer.askForRenameProperty(property).then(() => this.open())
-  }
-
-  deleteProperty(property) {
-    this.datalayer.confirmDeleteProperty(property).then(() => this.open())
-  }
-
-  addProperty() {
-    this.datalayer.addProperty().then(() => this.open())
+  addField() {
+    this.datalayer.fields.editField().then(() => this.open())
   }
 
   open() {
@@ -127,7 +139,7 @@ export default class TableEditor extends WithTemplate {
         <button class="flat" type="button" data-ref="add">
           <i class="icon icon-16 icon-add"></i>${translate('Add a new field')}
         </button>`)
-      addButton.addEventListener('click', () => this.addProperty())
+      addButton.addEventListener('click', () => this.addField())
       actions.push(addButton)
 
       const deleteButton = loadTemplate(`

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

@@ -32,9 +32,8 @@ export default class TemplateImporter {
     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 defaultTab = this.umap.permissions.userIsAuth() ? 'mine' : 'staff'
+    mine.hidden = !this.umap.permissions.userIsAuth()
 
     const loadTemplates = async (source) => {
       const [data, response, error] = await this.umap.server.get(

umap/static/umap/js/modules/ui/bar.js

@@ -11,11 +11,16 @@ const TOP_BAR_TEMPLATE = `
     <div class="umap-left-edit-toolbox" data-ref="left">
         <div class="logo"><a class="" href="/" title="${translate('Go to the homepage')}">uMap</a></div>
         <button class="map-name flat truncate" type="button" data-ref="name"></button>
-        <button class="share-status flat truncate" type="button" data-ref="share"></button>
-        <button class="edit-undo round flat" type="button" data-ref="undo" disabled>
+        <button class="flat truncate" type="button" data-ref="share">
+          <i class="icon icon-16 icon-draft show-on-draft"></i><span class="share-status"></span>
+        </button>
+        <button class="anonymous truncate soft-round" type="button" data-ref="shareAnonymous" hidden>
+          <i class="icon icon-16 icon-anonymous"></i><span class="share-status"></span>
+        </button>
+        <button class="edit-undo flat" type="button" data-ref="undo" disabled>
             <i class="icon icon-16 icon-undo"></i>
         </button>
-        <button class="edit-redo round flat" type="button" data-ref="redo" disabled>
+        <button class="edit-redo flat" type="button" data-ref="redo" disabled>
             <i class="icon icon-16 icon-redo"></i>
         </button>
     </div>
@@ -26,7 +31,7 @@ const TOP_BAR_TEMPLATE = `
         </button>
         <button class="umap-user flat" type="button" data-ref="user">
           <i class="icon icon-16 icon-profile"></i>
-          <span class="username truncate" data-ref="username"></span>
+          <span class="username truncate" data-ref="username">${translate('Anonymous')}</span>
         </button>
         <button class="umap-help-link flat" type="button" title="${translate('Help')}" data-ref="help">${translate('Help')}</button>
         <button class="edit-disable round disabled-on-dirty" type="button" data-ref="view">
@@ -72,17 +77,31 @@ export class TopBar extends WithTemplate {
         duration: 5000,
       })
     })
+    this.elements.shareAnonymous.addEventListener('mouseover', () => {
+      this._umap.tooltip.open({
+        content: translate('Anonymous map: update who can see and edit it'),
+        anchor: this.elements.shareAnonymous,
+        position: 'bottom',
+        delay: 500,
+        duration: 5000,
+      })
+    })
     if (this._umap.properties.editMode === 'advanced') {
       this.elements.name.addEventListener('click', () => this._umap.editCaption())
       this.elements.share.addEventListener('click', () => this._umap.permissions.edit())
+      this.elements.shareAnonymous.addEventListener('click', () =>
+        this._umap.permissions.edit()
+      )
     }
     this.elements.user.addEventListener('click', () => {
-      if (this._umap.properties.user?.id) {
-        const actions = [
-          {
-            label: translate('New map'),
-            action: this._umap.urls.get('map_new'),
-          },
+      const actions = [
+        {
+          label: translate('New map'),
+          action: this._umap.urls.get('map_new'),
+        },
+      ]
+      if (this._umap.permissions.userIsAuth()) {
+        actions.push(
           {
             label: translate('My maps'),
             action: this._umap.urls.get('user_dashboard'),
@@ -90,18 +109,22 @@ export class TopBar extends WithTemplate {
           {
             label: translate('My teams'),
             action: this._umap.urls.get('user_teams'),
-          },
-        ]
+          }
+        )
         if (this._umap.urls.has('user_profile')) {
           actions.push({
             label: translate('My profile'),
             action: this._umap.urls.get('user_profile'),
           })
         }
-        this._menu.openBelow(this.elements.user, actions)
+      } else {
+        actions.push({
+          label: translate('Login'),
+          action: () => this._umap.askForLogin(),
+        })
       }
+      this._menu.openBelow(this.elements.user, actions)
     })
-
     this.elements.peers.addEventListener('mouseover', () => {
       const connectedPeers = this._umap.sync.getPeers()
       if (!Object.keys(connectedPeers).length) return
@@ -162,10 +185,10 @@ export class TopBar extends WithTemplate {
         duration: 5000,
       })
     })
-    this.redraw()
   }
 
   redraw() {
+    this.element.classList.toggle('draft', this._umap.permissions.isDraft())
     const syncEnabled = this._umap.getProperty('syncEnabled')
     this.elements.peers.hidden = !syncEnabled
     this.elements.view.disabled = this._umap.sync._undoManager.isDirty()
@@ -175,6 +198,8 @@ export class TopBar extends WithTemplate {
     this.elements.saveDraftLabel.hidden = !isDraft || isTemplate
     this.elements.saveTemplateLabel.hidden = !isTemplate
     this._umap.sync._undoManager.toggleState()
+    this.elements.share.hidden = this._umap.permissions.isAnonymousMap()
+    this.elements.shareAnonymous.hidden = !this._umap.permissions.isAnonymousMap()
   }
 }
 
@@ -218,7 +243,6 @@ export class BottomBar extends WithTemplate {
         }
       })
     })
-    this.redraw()
   }
 
   redraw() {
@@ -229,7 +253,7 @@ export class BottomBar extends WithTemplate {
     const showMenus = this._umap.getProperty('captionMenus')
     this.elements.caption.hidden = !showMenus
     this.elements.browse.hidden = !showMenus
-    this.elements.filter.hidden = !showMenus || !this._umap.properties.facetKey
+    this.elements.filter.hidden = !showMenus || !this._umap.hasFilters()
     this.buildDataLayerSwitcher()
   }
 
@@ -267,7 +291,7 @@ const EDIT_BAR_TEMPLATE = `
     </li>
     <li data-ref="route" hidden><button type="button" data-getstarted title="${translate('Draw along routes')}"><i class="icon icon-24 icon-route"></i></button></li>
     <hr>
-    <li data-ref="caption" hidden><button data-getstarted type="button" title="${translate('Edit map name and caption')}"><i class="icon icon-24 icon-caption"></i></button></li>
+    <li data-ref="caption" hidden><button data-getstarted type="button" title="${translate('Edit map name and caption')}"><i class="icon icon-24 icon-info"></i></button></li>
     <li data-ref="import" hidden><button type="button"><i class="icon icon-24 icon-upload"></i></button></li>
     <li data-ref="templates" hidden><button type="button" title="${translate('Load template')}" data-getstarted><i class="icon icon-24 icon-template"></i></button></li>
     <li data-ref="layers" hidden><button type="button" title="${translate('Manage layers')}"><i class="icon icon-24 icon-layers"></i></button></li>

umap/static/umap/js/modules/ui/dialog.js

@@ -78,8 +78,7 @@ export default class Dialog extends WithTemplate {
     if (!this.dialogSupported) {
       this.elements.form.addEventListener('submit', (event) => {
         event.preventDefault()
-        this.dialog.returnValue = 'accept'
-        this.close()
+        this.accept()
       })
     }
     this.dialog.addEventListener('keydown', (e) => {
@@ -118,7 +117,6 @@ export default class Dialog extends WithTemplate {
     this.elements.cancel.hidden = !dialog.cancel
     this.elements.message.textContent = dialog.message
     this.elements.message.hidden = !dialog.message
-    this.elements.target = dialog.target || ''
     this.elements.template.innerHTML = ''
     if (dialog.template?.nodeType === 1) {
       this.elements.template.appendChild(dialog.template)
@@ -137,12 +135,13 @@ export default class Dialog extends WithTemplate {
     if (currentZIndex) {
       this.dialog.style.zIndex = currentZIndex + 1
     }
-
-    this.toggle(true)
-
+    if (this.dialogSupported) {
+      this.dialog.show()
+    } else {
+      this.dialog.hidden = false
+    }
     if (this.hasFormData) this.focusable[0].focus()
     else this.elements.accept.focus()
-
     return this.waitForUser()
   }
 
@@ -151,37 +150,40 @@ export default class Dialog extends WithTemplate {
   }
 
   close() {
-    this.toggle(false)
-    this.dialog.returnValue = undefined
-  }
-
-  toggle(open = false) {
+    this._closing = true
     if (this.dialogSupported) {
-      if (open) this.dialog.show()
-      else this.dialog.close()
+      this.dialog.close()
     } else {
-      this.dialog.hidden = !open
-      if (this.elements.target && !open) {
-        this.elements.target.focus()
-      }
-      if (!open) {
-        this.dialog.dispatchEvent(new CustomEvent('close'))
-      }
+      this.dialog.hidden = true
+      this.dialog.dispatchEvent(new CustomEvent('close'))
     }
   }
 
+  accept() {
+    this.dialog.returnValue = 'accept'
+    this.close()
+  }
+
   waitForUser() {
     return new Promise((resolve) => {
-      this.dialog.addEventListener(
-        'close',
-        (event) => {
-          if (this.dialog.returnValue === 'accept') {
-            const value = this.hasFormData ? this.collectFormData() : true
-            resolve(value)
-          }
-        },
-        { once: true }
-      )
+      const onClose = () => {
+        this._closing = false
+        if (this.dialog.returnValue === 'accept') {
+          const value = this.hasFormData ? this.collectFormData() : true
+          resolve(value)
+        }
+      }
+      const waitForClose = () => {
+        this.dialog.returnValue = undefined
+        this.dialog.addEventListener('close', () => onClose(), { once: true })
+      }
+      if (this._closing) {
+        // We are opening a new dialog while another is not fully closed,
+        // so let's first wait for that one to be fully closed
+        this.dialog.addEventListener('close', () => waitForClose(), { once: true })
+      } else {
+        waitForClose()
+      }
     })
   }
 

umap/static/umap/js/modules/ui/panel.js

@@ -26,12 +26,12 @@ export class Panel {
   }
 
   open({ content, className, highlight, actions = [] } = {}) {
+    let isOpen = false
     if (this.isOpen()) {
+      isOpen = true
       this.onClose()
     }
-    this.container.className = `with-transition panel window ${this.className} ${
-      this.mode || ''
-    }`
+    this.container.className = `with-transition panel window ${this.className} ${this.mode || ''} ${isOpen ? 'on' : ''}`
     if (highlight) {
       this.container.dataset.highlight = highlight
     }
@@ -56,8 +56,22 @@ export class Panel {
     }
     if (className) DomUtil.addClass(body, className)
     const promise = new Promise((resolve, reject) => {
-      DomUtil.addClass(this.container, 'on')
-      resolve(this)
+      if (isOpen) {
+        resolve(this)
+      } else {
+        Promise.all(
+          this.container.getAnimations().map((animation) => animation.finished)
+        )
+          .then(() => {
+            resolve(this)
+          })
+          .catch(() => {
+            // Panel has been removed, so the DOM has changed, so the animations
+            // were cancelled, we want the new panel callabck to be called anyway.
+            resolve(this)
+          })
+        this.container.classList.add('on')
+      }
     })
     DomEvent.on(closeButton, 'click', this.close, this)
     DomEvent.on(resizeButton, 'click', this.resize, this)
@@ -83,8 +97,8 @@ export class Panel {
   }
 
   onClose() {
-    if (DomUtil.hasClass(this.container, 'on')) {
-      DomUtil.removeClass(this.container, 'on')
+    if (this.container.classList.contains('on')) {
+      this.container.classList.remove('on')
       this._leafletMap.invalidateSize({ pan: false })
     }
   }

umap/static/umap/js/modules/ui/tooltip.js

@@ -4,11 +4,10 @@ import * as Utils from '../utils.js'
 import { Positioned } from './base.js'
 
 export default class Tooltip extends Positioned {
-  constructor(parent) {
+  constructor() {
     super()
-    this.parent = parent
+    this.parent = document.body
     this.container = Utils.loadTemplate('<div class="umap-tooltip-container"></div>')
-    this.parent.appendChild(this.container)
     DomEvent.disableClickPropagation(this.container)
     this.container.addEventListener('contextmenu', (event) => event.stopPropagation()) // Do not activate our custom context menu.
     this.container.addEventListener('wheel', (event) => event.stopPropagation())
@@ -25,7 +24,7 @@ export default class Tooltip extends Positioned {
       } else {
         this.container.innerHTML = Utils.escapeHTML(opts.content)
       }
-      this.parent.classList.add('umap-tooltip')
+      this.parent.appendChild(this.container)
       this.openAt(opts)
     }
     this.TOOLTIP_ID = window.setTimeout(L.bind(showIt, this), opts.delay || 0)
@@ -49,6 +48,8 @@ export default class Tooltip extends Positioned {
     this.toggleClassPosition()
     this.container.innerHTML = ''
     this.setPosition({})
-    this.parent.classList.remove('umap-tooltip')
+    if (this.parent.contains(this.container)) {
+      this.parent.removeChild(this.container)
+    }
   }
 }