umap-project 2.3.1__py3-none-any.whl → 2.4.0__py3-none-any.whl

umap/static/umap/js/components/alerts/alert.js

@@ -0,0 +1,169 @@
+import { translate } from '../../modules/i18n.js'
+import { uMapElement } from '../base.js'
+
+class uMapAlert extends uMapElement {
+  static get observedAttributes() {
+    return ['open']
+  }
+
+  attributeChangedCallback(name, oldValue, newValue) {
+    switch (name) {
+      case 'open':
+        newValue === 'open' ? this._show() : this._hide()
+        break
+    }
+  }
+
+  static info(message, duration = 5000) {
+    uMapAlert.emit('alert', { message, duration })
+  }
+
+  static success(message, duration = 5000) {
+    uMapAlert.emit('alert', { level: 'success', message, duration })
+  }
+
+  // biome-ignore lint/style/useNumberNamespace: Number.Infinity returns undefined by default
+  static error(message, duration = Infinity) {
+    uMapAlert.emit('alert', { level: 'error', message, duration })
+  }
+
+  constructor() {
+    super()
+    this._hide()
+    this.container = this.querySelector('[role="dialog"]')
+    this.element = this.container.querySelector('[role="alert"]')
+  }
+
+  _hide() {
+    this.setAttribute('hidden', 'hidden')
+    this.removeAttribute('open')
+  }
+
+  _show() {
+    this.removeAttribute('hidden')
+  }
+
+  _handleClose() {
+    this.addEventListener('click', (event) => {
+      if (event.target.closest('[data-close]')) {
+        this._hide()
+      }
+    })
+  }
+
+  onAlert(event) {
+    const { level = 'info', duration = 5000, message = '' } = event.detail
+    this.container.dataset.level = level
+    this.container.dataset.duration = duration
+    this.element.textContent = message
+    this.setAttribute('open', 'open')
+    if (Number.isFinite(duration)) {
+      setTimeout(() => {
+        this._hide()
+      }, duration)
+    }
+  }
+
+  connectedCallback() {
+    this._handleClose()
+    this.listen('alert')
+  }
+}
+
+class uMapAlertCreation extends uMapAlert {
+  static info(
+    message,
+    // biome-ignore lint/style/useNumberNamespace: Number.Infinity returns undefined by default
+    duration = Infinity,
+    editLink = undefined,
+    sendCallback = undefined
+  ) {
+    uMapAlertCreation.emit('alertCreation', {
+      message,
+      duration,
+      editLink,
+      sendCallback,
+    })
+  }
+
+  constructor() {
+    super()
+    this.linkWrapper = this.container.querySelector('#link-wrapper')
+    this.formWrapper = this.container.querySelector('#form-wrapper')
+  }
+
+  onAlertCreation(event) {
+    const {
+      level = 'info',
+      duration = 5000,
+      message = '',
+      editLink = undefined,
+      sendCallback = undefined,
+    } = event.detail
+    uMapAlert.prototype.onAlert.call(this, { detail: { level, duration, message } })
+    this.linkWrapper.querySelector('input[type="url"]').value = editLink
+    const button = this.linkWrapper.querySelector('input[type="button"]')
+    button.addEventListener('click', (event) => {
+      event.preventDefault()
+      L.Util.copyToClipboard(editLink)
+      event.target.value = translate('✅ Copied!')
+    })
+    if (sendCallback) {
+      this.formWrapper.removeAttribute('hidden')
+      const form = this.formWrapper.querySelector('form')
+      form.addEventListener('submit', async (event) => {
+        event.preventDefault()
+        const formData = new FormData(form)
+        sendCallback(formData)
+        this.removeAttribute('open')
+      })
+    }
+  }
+
+  connectedCallback() {
+    this._handleClose()
+    this.listen('alertCreation')
+  }
+}
+
+class uMapAlertConflict extends uMapAlert {
+  static error(message, forceCallback) {
+    uMapAlertConflict.emit('alertConflict', { level: 'error', message, forceCallback })
+  }
+
+  constructor() {
+    super()
+    this.conflictWrapper = this.container.querySelector('#conflict-wrapper')
+  }
+
+  onAlertConflict(event) {
+    // biome-ignore lint/style/useNumberNamespace: Number.Infinity returns undefined by default
+    const {
+      level = 'info',
+      duration = Infinity,
+      message = '',
+      forceCallback = undefined,
+    } = event.detail
+    uMapAlert.prototype.onAlert.call(this, { detail: { level, duration, message } })
+    const form = this.conflictWrapper.querySelector('form')
+    form.addEventListener('submit', (event) => {
+      event.preventDefault()
+      switch (event.submitter.id) {
+        case 'your-changes':
+          forceCallback()
+          break
+        case 'their-changes':
+          window.location.reload()
+          break
+      }
+      this.removeAttribute('open')
+    })
+  }
+
+  connectedCallback() {
+    this._handleClose()
+    this.listen('alertConflict')
+  }
+}
+
+export { uMapAlert, uMapAlertCreation, uMapAlertConflict }

umap/static/umap/js/components/base.js

@@ -0,0 +1,54 @@
+const EVENT_PREFIX = 'umap'
+
+export class uMapElement extends HTMLElement {
+  static emit(type, detail = {}) {
+    const event = new CustomEvent(`${EVENT_PREFIX}:${type}`, {
+      bubbles: true,
+      cancelable: true,
+      detail: detail,
+    })
+    return document.dispatchEvent(event)
+  }
+
+  /**
+   * Retrieves a clone of the content template either using the `template`
+   * attribute or an id mathing the name of the component:
+   *
+   * `umap-alert` component => `umap-alert-template` template id lookup.
+   */
+  get template() {
+    return document
+      .getElementById(this.getAttribute('template') || `${this.localName}-template`)
+      .content.cloneNode(true)
+  }
+
+  constructor() {
+    super()
+    this.append(this.template)
+  }
+
+  /**
+   * Special method which allows to easily listen to events
+   * and have automated event to component method binding.
+   *
+   * For instance listening to `alert` will then call `onAlert`.
+   */
+  handleEvent(event) {
+    event.preventDefault()
+    // From `umap:alert` to `alert`.
+    const eventName = event.type.replace(`${EVENT_PREFIX}:`, '')
+    // From `alert` event type to `onAlert` call against that class.
+    this[`on${eventName.charAt(0).toUpperCase() + eventName.slice(1)}`](event)
+  }
+
+  listen(eventName) {
+    // Using `this` as a listener will call `handleEvent` under the hood.
+    document.addEventListener(`${EVENT_PREFIX}:${eventName}`, this)
+  }
+}
+
+export function register(klass, name) {
+  if ('customElements' in globalThis && !customElements.get(name)) {
+    customElements.define(name, klass)
+  }
+}

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

@@ -0,0 +1,347 @@
+import {
+  DomUtil,
+  DomEvent,
+  setOptions,
+  Util,
+} from '../../vendors/leaflet/leaflet-src.esm.js'
+import { translate } from './i18n.js'
+import { Request, ServerRequest } from './request.js'
+
+export class BaseAutocomplete {
+  constructor(el, options) {
+    this.el = el
+    this.options = {
+      placeholder: translate('Start typing...'),
+      emptyMessage: translate('No result'),
+      allowFree: true,
+      minChar: 2,
+      maxResults: 5,
+    }
+    this.cache = ''
+    this.results = []
+    this._current = null
+    setOptions(this, options)
+    this.createInput()
+    this.createContainer()
+    this.selectedContainer = this.initSelectedContainer()
+  }
+
+  get current() {
+    return this._current
+  }
+
+  set current(index) {
+    if (typeof index === 'object') {
+      index = this.resultToIndex(index)
+    }
+    this._current = index
+  }
+
+  createInput() {
+    this.input = DomUtil.element({
+      tagName: 'input',
+      type: 'text',
+      parent: this.el,
+      placeholder: this.options.placeholder,
+      autocomplete: 'off',
+      className: this.options.className,
+    })
+    DomEvent.on(this.input, 'keydown', this.onKeyDown, this)
+    DomEvent.on(this.input, 'keyup', this.onKeyUp, this)
+    DomEvent.on(this.input, 'blur', this.onBlur, this)
+  }
+
+  createContainer() {
+    this.container = DomUtil.element({
+      tagName: 'ul',
+      parent: document.body,
+      className: 'umap-autocomplete',
+    })
+  }
+
+  resizeContainer() {
+    const l = this.getLeft(this.input)
+    const t = this.getTop(this.input) + this.input.offsetHeight
+    this.container.style.left = `${l}px`
+    this.container.style.top = `${t}px`
+    const width = this.options.width ? this.options.width : this.input.offsetWidth - 2
+    this.container.style.width = `${width}px`
+  }
+
+  onKeyDown(e) {
+    switch (e.key) {
+      case 'Tab':
+        if (this.current !== null) this.setChoice()
+        DomEvent.stop(e)
+        break
+      case 'Enter':
+        DomEvent.stop(e)
+        this.setChoice()
+        break
+      case 'Escape':
+        DomEvent.stop(e)
+        this.hide()
+        break
+      case 'ArrowDown':
+        if (this.results.length > 0) {
+          if (this.current !== null && this.current < this.results.length - 1) {
+            // what if one result?
+            this.current++
+            this.highlight()
+          } else if (this.current === null) {
+            this.current = 0
+            this.highlight()
+          }
+        }
+        break
+      case 'ArrowUp':
+        if (this.current !== null) {
+          DomEvent.stop(e)
+        }
+        if (this.results.length > 0) {
+          if (this.current > 0) {
+            this.current--
+            this.highlight()
+          } else if (this.current === 0) {
+            this.current = null
+            this.highlight()
+          }
+        }
+        break
+    }
+  }
+
+  onKeyUp(e) {
+    const special = [
+      'Tab',
+      'Enter',
+      'ArrowLeft',
+      'ArrowRight',
+      'ArrowDown',
+      'ArrowUp',
+      'Meta',
+      'Shift',
+      'Alt',
+      'Control',
+    ]
+    if (!special.includes(e.key)) {
+      this.search()
+    }
+  }
+
+  onBlur() {
+    setTimeout(() => this.hide(), 100)
+  }
+
+  clear() {
+    this.results = []
+    this.current = null
+    this.cache = ''
+    this.container.innerHTML = ''
+  }
+
+  hide() {
+    this.clear()
+    this.container.style.display = 'none'
+    this.input.value = ''
+  }
+
+  setChoice(choice) {
+    choice = choice || this.results[this.current]
+    if (choice) {
+      this.input.value = choice.item.label
+      this.options.on_select(choice)
+      this.displaySelected(choice)
+      this.hide()
+      if (this.options.callback) {
+        this.options.callback.bind(this)(choice)
+      }
+    }
+  }
+
+  createResult(item) {
+    const el = DomUtil.element({
+      tagName: 'li',
+      parent: this.container,
+      textContent: item.label,
+    })
+    const result = {
+      item: item,
+      el: el,
+    }
+    DomEvent.on(el, 'mouseover', () => {
+      this.current = result
+      this.highlight()
+    })
+    DomEvent.on(el, 'mousedown', () => this.setChoice())
+    return result
+  }
+
+  resultToIndex(result) {
+    return this.results.findIndex((item) => item.item.value === result.item.value)
+  }
+
+  handleResults(data) {
+    this.clear()
+    this.container.style.display = 'block'
+    this.resizeContainer()
+    data.forEach((item) => {
+      this.results.push(this.createResult(item))
+    })
+    this.current = 0
+    this.highlight()
+    //TODO manage no results
+  }
+
+  highlight() {
+    this.results.forEach((result, index) => {
+      if (index === this.current) DomUtil.addClass(result.el, 'on')
+      else DomUtil.removeClass(result.el, 'on')
+    })
+  }
+
+  getLeft(el) {
+    let tmp = el.offsetLeft
+    el = el.offsetParent
+    while (el) {
+      tmp += el.offsetLeft
+      el = el.offsetParent
+    }
+    return tmp
+  }
+
+  getTop(el) {
+    let tmp = el.offsetTop
+    el = el.offsetParent
+    while (el) {
+      tmp += el.offsetTop
+      el = el.offsetParent
+    }
+    return tmp
+  }
+}
+
+export class BaseAjax extends BaseAutocomplete {
+  constructor(el, options) {
+    super(el, options)
+    this.setUrl()
+    this.initRequest()
+  }
+
+  setUrl() {
+    this.url = this.options?.url
+  }
+
+  initRequest() {
+    this.request = new Request()
+  }
+
+  optionToResult(option) {
+    return {
+      value: option.value,
+      label: option.innerHTML,
+    }
+  }
+
+  async search() {
+    let val = this.input.value
+    if (val.length < this.options.minChar) {
+      this.clear()
+      return
+    }
+    if (val === this.cache) return
+    else this.cache = val
+    val = val.toLowerCase()
+    const url = Util.template(this.url, { q: encodeURIComponent(val) })
+    this.handleResults(await this._search(url))
+  }
+
+  async _search(url) {
+    const response = await this.request.get(url)
+    if (response && response.ok) {
+      return await response.json()
+    }
+  }
+}
+
+class BaseServerAjax extends BaseAjax {
+  setUrl() {
+    this.url = '/agnocomplete/AutocompleteUser/?q={q}'
+  }
+
+  initRequest() {
+    this.server = new ServerRequest()
+  }
+  async _search(url) {
+    const [{ data }, response] = await this.server.get(url)
+    return data
+  }
+}
+
+export const SingleMixin = (Base) =>
+  class extends Base {
+    initSelectedContainer() {
+      return DomUtil.after(
+        this.input,
+        DomUtil.element({ tagName: 'div', className: 'umap-singleresult' })
+      )
+    }
+
+    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: '×',
+      })
+      this.input.style.display = 'none'
+      DomEvent.on(
+        close,
+        'click',
+        function () {
+          this.selectedContainer.innerHTML = ''
+          this.input.style.display = 'block'
+        },
+        this
+      )
+      this.hide()
+    }
+  }
+
+export const MultipleMixin = (Base) =>
+  class extends Base {
+    initSelectedContainer() {
+      return DomUtil.after(
+        this.input,
+        DomUtil.element({ tagName: 'ul', className: 'umap-multiresult' })
+      )
+    }
+
+    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)
+        this.options.on_unselect(result)
+      })
+      this.hide()
+    }
+  }
+
+export class AjaxAutocompleteMultiple extends MultipleMixin(BaseServerAjax) {}
+
+export class AjaxAutocomplete extends SingleMixin(BaseServerAjax) {}

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

@@ -143,14 +143,12 @@ export default class Browser {
   open(mode) {
     // Force only if mode is known, otherwise keep current mode.
     if (mode) this.mode = mode
-    // Get once but use it for each feature later
-    this.filterKeys = this.map.getFilterKeys()
     const container = DomUtil.create('div')
     // HOTFIX. Remove when this is released:
     // https://github.com/Leaflet/Leaflet/pull/9052
     DomEvent.disableClickPropagation(container)
 
-    DomUtil.createTitle(container, translate('Browse data'), 'icon-layers')
+    DomUtil.createTitle(container, translate('Data browser'), 'icon-layers')
     const formContainer = DomUtil.createFieldset(container, L._('Filters'), {
       on: this.mode === 'filters',
       className: 'filters',
@@ -205,9 +203,11 @@ export default class Browser {
   }
 
   static backButton(map) {
-    const button = DomUtil.create('li', '')
-    DomUtil.create('i', 'icon icon-16 icon-back', button)
-    button.title = translate('Back to browser')
+    const button = DomUtil.createButtonIcon(
+      DomUtil.create('li', '', undefined),
+      'icon-back',
+      translate('Back to browser')
+    )
     // Fixme: remove me when this is merged and released
     // https://github.com/Leaflet/Leaflet/pull/9052
     DomEvent.disableClickPropagation(button)

umap/static/umap/js/modules/caption.js

@@ -18,18 +18,19 @@ export default class Caption {
 
   open() {
     const container = DomUtil.create('div', 'umap-caption')
-    DomUtil.createTitle(container, this.map.options.name, 'icon-caption')
-    this.map.permissions.addOwnerLink('h5', container)
+    const hgroup = DomUtil.element({tagName: 'hgroup', parent: container})
+    DomUtil.createTitle(hgroup, this.map.options.name, 'icon-caption icon-block')
+    this.map.permissions.addOwnerLink('h4', hgroup)
     if (this.map.options.description) {
       const description = DomUtil.element({
         tagName: 'div',
-        className: 'umap-map-description',
+        className: 'umap-map-description text',
         safeHTML: Utils.toHTML(this.map.options.description),
         parent: container,
       })
     }
     const datalayerContainer = DomUtil.create('div', 'datalayer-container', container)
-    this.map.eachDataLayer((datalayer) =>
+    this.map.eachDataLayerReverse((datalayer) =>
       this.addDataLayer(datalayer, datalayerContainer)
     )
     const creditsContainer = DomUtil.create('div', 'credits-container', container)

umap/static/umap/js/modules/global.js

@@ -2,29 +2,53 @@ import URLs from './urls.js'
 import Browser from './browser.js'
 import Facets from './facets.js'
 import Caption from './caption.js'
-import { Panel, EditPanel, FullPanel } from './panel.js'
+import { Panel, EditPanel, FullPanel } from './ui/panel.js'
+import Dialog from './ui/dialog.js'
+import Tooltip from './ui/tooltip.js'
+import Rules from './rules.js'
 import * as Utils from './utils.js'
 import { SCHEMA } from './schema.js'
 import { Request, ServerRequest, RequestError, HTTPError, NOKError } from './request.js'
+import { AjaxAutocomplete, AjaxAutocompleteMultiple } from './autocomplete.js'
 import Orderable from './orderable.js'
+import Importer from './importer.js'
+import Help from './help.js'
+import { SyncEngine } from './sync/engine.js'
+import {
+  uMapAlert as Alert,
+  uMapAlertCreation as AlertCreation,
+  uMapAlertConflict as AlertConflict,
+} from '../components/alerts/alert.js'
 
 // Import modules and export them to the global scope.
 // For the not yet module-compatible JS out there.
 
+// By alphabetic order
 window.U = {
-  URLs,
-  Request,
-  ServerRequest,
-  RequestError,
-  HTTPError,
-  NOKError,
+  Alert,
+  AlertCreation,
+  AlertConflict,
+  AjaxAutocomplete,
+  AjaxAutocompleteMultiple,
   Browser,
-  Facets,
-  Panel,
+  Caption,
+  Dialog,
   EditPanel,
+  Facets,
   FullPanel,
-  Utils,
-  SCHEMA,
+  Help,
+  HTTPError,
+  Importer,
+  NOKError,
   Orderable,
-  Caption,
+  Panel,
+  Request,
+  RequestError,
+  Rules,
+  SCHEMA,
+  ServerRequest,
+  SyncEngine,
+  Tooltip,
+  URLs,
+  Utils,
 }