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

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

@@ -9,18 +9,7 @@ export default class Browser {
       filter: '',
       inBbox: false,
     }
-    this._mode = 'layers'
-  }
-
-  set mode(value) {
-    // Store the mode so we can respect it when we redraw
-    if (['data', 'filters'].includes(value)) this.map.panel.mode = 'expanded'
-    else if (value === 'layers') this.map.panel.mode = 'condensed'
-    this._mode = value
-  }
-
-  get mode() {
-    return this._mode
+    this.mode = 'layers'
   }
 
   addFeature(feature, parent) {
@@ -73,7 +62,7 @@ export default class Browser {
 
   addDataLayer(datalayer, parent) {
     let className = `datalayer ${datalayer.getHidableClass()}`
-    if (this.map.panel.mode !== 'condensed') className += ' show-list'
+    if (this.mode !== 'layers') className += ' show-list'
     const container = DomUtil.create('div', className, parent),
       headline = DomUtil.create('h5', '', container)
     container.id = this.datalayerId(datalayer)
@@ -87,7 +76,7 @@ export default class Browser {
     const parent = DomUtil.get(this.datalayerId(datalayer))
     // Panel is not open
     if (!parent) return
-    DomUtil.classIf(parent, 'off', !datalayer.isVisible())
+    parent.classList.toggle('off', !datalayer.isVisible())
     const container = parent.querySelector('ul')
     const headline = parent.querySelector('h5')
     const toggleList = () => parent.classList.toggle('show-list')
@@ -154,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',
@@ -201,7 +188,11 @@ export default class Browser {
       if (filtersBuilder) filtersBuilder.form.reset()
     })
     DomUtil.createIcon(reset, 'icon-restore')
-    DomUtil.element({ tagName: 'span', parent: reset, textContent: translate('Reset all') })
+    DomUtil.element({
+      tagName: 'span',
+      parent: reset,
+      textContent: translate('Reset all'),
+    })
 
     this.map.panel.open({
       content: container,
@@ -212,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

@@ -0,0 +1,119 @@
+import { DomUtil } from '../../vendors/leaflet/leaflet-src.esm.js'
+import { translate } from './i18n.js'
+import * as Utils from './utils.js'
+
+export default class Caption {
+  constructor(map) {
+    this.map = map
+  }
+
+  isOpen() {
+    return Boolean(document.querySelector('.on .umap-caption'))
+  }
+
+  refresh() {
+    if (!this.isOpen()) return
+    this.open()
+  }
+
+  open() {
+    const container = DomUtil.create('div', 'umap-caption')
+    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 text',
+        safeHTML: Utils.toHTML(this.map.options.description),
+        parent: container,
+      })
+    }
+    const datalayerContainer = DomUtil.create('div', 'datalayer-container', container)
+    this.map.eachDataLayerReverse((datalayer) =>
+      this.addDataLayer(datalayer, datalayerContainer)
+    )
+    const creditsContainer = DomUtil.create('div', 'credits-container', container)
+    this.addCredits(creditsContainer)
+    this.map.panel.open({ content: container })
+  }
+
+  addDataLayer(datalayer, container) {
+    if (!datalayer.options.inCaption) return
+    const p = DomUtil.create('p', 'datalayer-legend', container),
+      legend = DomUtil.create('span', '', p),
+      headline = DomUtil.create('strong', '', p)
+    datalayer.onceLoaded(() => {
+      datalayer.renderLegend(legend)
+      if (datalayer.options.description) {
+        DomUtil.element({
+          tagName: 'span',
+          parent: p,
+          safeHTML: Utils.toHTML(datalayer.options.description),
+        })
+      }
+    })
+    datalayer.renderToolbox(headline)
+    DomUtil.add('span', '', headline, `${datalayer.options.name} `)
+  }
+
+  addCredits(container) {
+    const credits = DomUtil.createFieldset(container, translate('Credits'))
+    let title = DomUtil.add('h5', '', credits, translate('User content credits'))
+    if (this.map.options.shortCredit || this.map.options.longCredit) {
+      DomUtil.element({
+        tagName: 'p',
+        parent: credits,
+        safeHTML: Utils.toHTML(
+          this.map.options.longCredit || this.map.options.shortCredit
+        ),
+      })
+    }
+    if (this.map.options.licence) {
+      const licence = DomUtil.add(
+        'p',
+        '',
+        credits,
+        `${translate('Map user content has been published under licence')} `
+      )
+      DomUtil.createLink(
+        '',
+        licence,
+        this.map.options.licence.name,
+        this.map.options.licence.url
+      )
+    } else {
+      DomUtil.add('p', '', credits, translate('No licence has been set'))
+    }
+    title = DomUtil.create('h5', '', credits)
+    title.textContent = translate('Map background credits')
+    const tilelayerCredit = DomUtil.create('p', '', credits)
+    DomUtil.element({
+      tagName: 'strong',
+      parent: tilelayerCredit,
+      textContent: `${this.map.selected_tilelayer.options.name} `,
+    })
+    DomUtil.element({
+      tagName: 'span',
+      parent: tilelayerCredit,
+      safeHTML: this.map.selected_tilelayer.getAttribution(),
+    })
+    const urls = {
+      leaflet: 'http://leafletjs.com',
+      django: 'https://www.djangoproject.com',
+      umap: 'https://umap-project.org/',
+      changelog: 'https://docs.umap-project.org/en/master/changelog/',
+      version: this.map.options.umap_version,
+    }
+    const creditHTML = translate(
+      `
+      Powered by <a href="{leaflet}">Leaflet</a> and
+      <a href="{django}">Django</a>,
+      glued by <a href="{umap}">uMap project</a>
+      (version <a href="{changelog}">{version}</a>).
+      `,
+      urls
+    )
+    DomUtil.element({ tagName: 'p', innerHTML: creditHTML, parent: credits })
+  }
+}

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

@@ -1,28 +1,54 @@
 import URLs from './urls.js'
 import Browser from './browser.js'
 import Facets from './facets.js'
-import { Panel, EditPanel, FullPanel } from './panel.js'
+import Caption from './caption.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,
+  Panel,
+  Request,
+  RequestError,
+  Rules,
+  SCHEMA,
+  ServerRequest,
+  SyncEngine,
+  Tooltip,
+  URLs,
+  Utils,
 }