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

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

@@ -0,0 +1,241 @@
+import { DomUtil, DomEvent, stamp } from '../../vendors/leaflet/leaflet-src.esm.js'
+import * as Utils from './utils.js'
+import { translate } from './i18n.js'
+
+class Rule {
+
+  get condition() {
+    return this._condition
+  }
+
+  set condition(value) {
+    this._condition = value
+    this.parse()
+  }
+
+
+  get isDirty() {
+    return this._isDirty
+  }
+
+  set isDirty(status) {
+    this._isDirty = status
+    if (status) this.map.isDirty = status
+  }
+
+  constructor(map, condition = '', options = {}) {
+    // TODO make this public properties when browser coverage is ok
+    // cf https://caniuse.com/?search=public%20class%20field
+    this._condition = null
+    this._isDirty = false
+    this.OPERATORS = [
+      ['>', this.gt],
+      ['<', this.lt],
+      // When sent by Django
+      ['&lt;', this.lt],
+      ['!=', this.not_equal],
+      ['=', this.equal],
+    ]
+    this.map = map
+    this.active = true
+    this.options = options
+    this.condition = condition
+  }
+
+  render(fields) {
+    this.map.render(fields)
+  }
+
+  equal(other) {
+    return this.expected === other
+  }
+
+  not_equal(other) {
+    return this.expected != other
+  }
+
+  gt(other) {
+    return other > this.expected
+  }
+
+  lt(other) {
+    return other < this.expected
+  }
+
+  parse() {
+    let vars = []
+    this.cast = (v) => v
+    this.operator = undefined
+    for (const [sign, func] of this.OPERATORS) {
+      if (this.condition.includes(sign)) {
+        this.operator = func
+        vars = this.condition.split(sign)
+        break
+      }
+    }
+    if (vars.length != 2) return
+    this.key = vars[0]
+    this.expected = vars[1]
+    if (!isNaN(this.expected)) this.cast = parseFloat
+    else if (['true', 'false'].includes(this.expected)) this.cast = (v) => !!v
+    this.expected = this.cast(this.expected)
+  }
+
+  match(props) {
+    if (!this.operator || !this.active) return false
+    return this.operator(this.cast(props[this.key]))
+  }
+
+  getMap() {
+    return this.map
+  }
+
+  getOption(option) {
+    return this.options[option]
+  }
+
+  edit() {
+    const options = [
+      [
+        'condition',
+        {
+          handler: 'BlurInput',
+          label: translate('Condition'),
+          placeholder: translate('key=value or key!=value'),
+        },
+      ],
+      'options.color',
+      'options.iconClass',
+      'options.iconUrl',
+      'options.iconOpacity',
+      'options.opacity',
+      'options.weight',
+      'options.fill',
+      'options.fillColor',
+      'options.fillOpacity',
+      'options.smoothFactor',
+      'options.dashArray',
+    ]
+    const container = DomUtil.create('div')
+    const builder = new U.FormBuilder(this, options)
+    const defaultShapeProperties = DomUtil.add('div', '', container)
+    defaultShapeProperties.appendChild(builder.build())
+
+    this.map.editPanel.open({ content: container })
+  }
+
+  renderToolbox(row) {
+    row.classList.toggle('off', !this.active)
+    const toggle = DomUtil.createButtonIcon(
+      row,
+      'icon-eye',
+      translate('Show/hide layer')
+    )
+    const edit = DomUtil.createButtonIcon(
+      row,
+      'icon-edit show-on-edit',
+      translate('Edit')
+    )
+    const remove = DomUtil.createButtonIcon(
+      row,
+      'icon-delete show-on-edit',
+      translate('Delete layer')
+    )
+    DomEvent.on(edit, 'click', this.edit, this)
+    DomEvent.on(
+      remove,
+      'click',
+      function () {
+        if (!confirm(translate('Are you sure you want to delete this rule?'))) return
+        this._delete()
+        this.map.editPanel.close()
+      },
+      this
+    )
+    DomUtil.add('span', '', row, this.condition || translate('empty rule'))
+    DomUtil.createIcon(row, 'icon-drag', translate('Drag to reorder'))
+    row.dataset.id = stamp(this)
+    DomEvent.on(toggle, 'click', () => {
+      this.active = !this.active
+      row.classList.toggle('off', !this.active)
+      this.map.render(['rules'])
+    })
+  }
+
+  _delete() {
+    this.map.rules.rules = this.map.rules.rules.filter((rule) => rule != this)
+  }
+}
+
+export default class Rules {
+  constructor(map) {
+    this.map = map
+    this.rules = []
+    this.loadRules()
+  }
+
+  loadRules() {
+    if (!this.map.options.rules?.length) return
+    for (const { condition, options } of this.map.options.rules) {
+      if (!condition) continue
+      this.rules.push(new Rule(this.map, condition, options))
+    }
+  }
+
+  onReorder(src, dst, initialIndex, finalIndex) {
+    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)
+    let referenceIdx = this.rules.indexOf(reference)
+    const minIndex = Math.min(movedIdx, referenceIdx)
+    const maxIndex = Math.max(movedIdx, referenceIdx)
+    moved._delete() // Remove from array
+    referenceIdx = this.rules.indexOf(reference)
+    let newIdx
+    if (finalIndex === 0) newIdx = 0
+    else if (finalIndex > initialIndex) newIdx = referenceIdx
+    else newIdx = referenceIdx + 1
+    this.rules.splice(newIdx, 0, moved)
+    moved.isDirty = true
+    this.map.render(['rules'])
+  }
+
+  edit(container) {
+    const body = DomUtil.createFieldset(container, translate('Conditional style rules'))
+    if (this.rules.length) {
+      const ul = DomUtil.create('ul', '', body)
+      for (const rule of this.rules) {
+        rule.renderToolbox(DomUtil.create('li', 'orderable', ul))
+      }
+
+      const orderable = new U.Orderable(ul, this.onReorder.bind(this))
+    }
+
+    DomUtil.createButton('umap-add', body, translate('Add rule'), this.addRule, this)
+  }
+
+  addRule() {
+    const rule = new Rule(this.map)
+    rule.isDirty = true
+    this.rules.push(rule)
+    rule.edit(map)
+  }
+
+  commit() {
+    this.map.options.rules = this.rules.map((rule) => {
+      return {
+        condition: rule.condition,
+        options: rule.options,
+      }
+    })
+  }
+
+  getOption(option, feature) {
+    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

@@ -1,12 +1,25 @@
 import { translate } from './i18n.js'
 
-// Possible impacts
-// ['ui', 'data', 'limit-bounds', 'datalayer-index', 'remote-data', 'background']
+/**
+ * This SCHEMA defines metadata about properties.
+ *
+ * This is here in order to have a centered place where all properties are specified.
+ *
+ * Each property defines:
+ *
+ * - `type`:        The type of the data
+ * - `impacts`:     A list of impacts than happen when this property is updated, among
+ *                  'ui', 'data', 'limit-bounds', 'datalayer-index', 'remote-data',
+ *                  'background' 'sync'.
+ *
+ * - Extra keys are being passed to the FormBuilder automatically.
+ */
 
+// This is sorted alphabetically
 export const SCHEMA = {
   browsable: {
-    impacts: ['ui'],
     type: Boolean,
+    impacts: ['ui'],
   },
   captionBar: {
     type: Boolean,
@@ -14,6 +27,13 @@ export const SCHEMA = {
     label: translate('Do you want to display a caption bar?'),
     default: false,
   },
+  captionControl: {
+    type: Boolean,
+    impacts: ['ui'],
+    nullable: true,
+    label: translate('Display the caption control'),
+    default: true,
+  },
   captionMenus: {
     type: Boolean,
     impacts: ['ui'],
@@ -37,6 +57,10 @@ export const SCHEMA = {
     type: Object,
     impacts: ['data'],
   },
+  condition: {
+    type: String,
+    impacts: ['data'],
+  },
   dashArray: {
     type: String,
     impacts: ['data'],
@@ -146,6 +170,10 @@ export const SCHEMA = {
     label: translate('Display the fullscreen control'),
     default: true,
   },
+  geometry: {
+    type: Object,
+    impacts: ['data'],
+  },
   heat: {
     type: Object,
     impacts: ['data'],
@@ -184,7 +212,6 @@ export const SCHEMA = {
     type: Boolean,
     impacts: ['ui'],
   },
-
   interactive: {
     type: Boolean,
     impacts: ['data'],
@@ -272,9 +299,9 @@ export const SCHEMA = {
     choices: [
       ['none', translate('None')],
       ['caption', translate('Caption')],
-      ['databrowser', translate('Browser in data mode')],
-      ['datalayers', translate('Browser in layers mode')],
-      ['datafilters', translate('Browser in filters mode')],
+      ['databrowser', translate('Browser: data')],
+      ['datalayers', translate('Browser: layers')],
+      ['datafilters', translate('Browser: filters')],
     ],
     default: 'none',
   },
@@ -290,6 +317,7 @@ export const SCHEMA = {
   },
   outlink: {
     type: String,
+    impacts: [],
     label: translate('Link to…'),
     helpEntries: 'outlink',
     placeholder: 'http://...',
@@ -362,6 +390,10 @@ export const SCHEMA = {
     type: Object,
     impacts: ['remote-data'],
   },
+  rules: {
+    type: Object,
+    impacts: ['data'],
+  },
   scaleControl: {
     type: Boolean,
     impacts: ['ui'],
@@ -373,12 +405,6 @@ export const SCHEMA = {
     impacts: ['ui'],
     label: translate('Allow scroll wheel zoom?'),
   },
-  captionControl: {
-    type: Boolean,
-    nullable: true,
-    label: translate('Display the caption control'),
-    default: true,
-  },
   searchControl: {
     type: Boolean,
     impacts: ['ui'],
@@ -437,6 +463,13 @@ export const SCHEMA = {
     inheritable: true,
     default: true,
   },
+  syncEnabled: {
+    type: Boolean,
+    impacts: ['sync', 'ui'],
+    label: translate('Enable real-time collaboration'),
+    helpEntries: 'sync',
+    default: false,
+  },
   tilelayer: {
     type: Object,
     impacts: ['background'],
@@ -453,8 +486,19 @@ export const SCHEMA = {
     label: translate('To zoom'),
     helpText: translate('Optional.'),
   },
+  ttl: {
+    type: Number,
+    label: translate('Cache proxied request'),
+    choices: [
+      ['', translate('No cache')],
+      ['300', translate('5 min')],
+      ['3600', translate('1 hour')],
+      ['86400', translate('1 day')],
+    ],
+    default: '300',
+  },
   type: {
-    type: 'String',
+    type: String,
     impacts: ['data'],
   },
   weight: {
@@ -486,4 +530,9 @@ export const SCHEMA = {
     label: translate('Default zoom level'),
     inheritable: true,
   },
+  // FIXME This is an internal Leaflet property, we might want to do this differently.
+  _latlng: {
+    type: Object,
+    impacts: ['data'],
+  },
 }

umap/static/umap/js/modules/sync/engine.js

@@ -0,0 +1,93 @@
+import { WebSocketTransport } from './websocket.js'
+import { MapUpdater, DataLayerUpdater, FeatureUpdater } from './updaters.js'
+
+export class SyncEngine {
+  constructor(map) {
+    this.updaters = {
+      map: new MapUpdater(map),
+      feature: new FeatureUpdater(map),
+      datalayer: new DataLayerUpdater(map),
+    }
+    this.transport = undefined
+  }
+
+  async authenticate(tokenURI, webSocketURI, server) {
+    const [response, _, error] = await server.get(tokenURI)
+    if (!error) {
+      this.start(webSocketURI, response.token)
+    }
+  }
+
+  start(webSocketURI, authToken) {
+    this.transport = new WebSocketTransport(webSocketURI, authToken, this)
+  }
+
+  stop() {
+    if (this.transport) this.transport.close()
+    this.transport = undefined
+  }
+
+  _getUpdater(subject, metadata) {
+    if (Object.keys(this.updaters).includes(subject)) {
+      return this.updaters[subject]
+    }
+    throw new Error(`Unknown updater ${subject}, ${metadata}`)
+  }
+
+  // This method is called by the transport layer on new messages
+  receive({ kind, ...payload }) {
+    if (kind == 'operation') {
+      let updater = this._getUpdater(payload.subject, payload.metadata)
+      updater.applyMessage(payload)
+    } else {
+      throw new Error(`Unknown dispatch kind: ${kind}`)
+    }
+  }
+
+  _send(message) {
+    if (this.transport) {
+      this.transport.send('operation', message)
+    }
+  }
+
+  upsert(subject, metadata, value) {
+    this._send({ verb: 'upsert', subject, metadata, value })
+  }
+
+  update(subject, metadata, key, value) {
+    this._send({ verb: 'update', subject, metadata, key, value })
+  }
+
+  delete(subject, metadata, key) {
+    this._send({ verb: 'delete', subject, metadata, key })
+  }
+
+  /**
+   * Create a proxy for this sync engine.
+   *
+   * The proxy will automatically call `object.getSyncMetadata` and inject the returned
+   * `subject` and `metadata`` to the `upsert`, `update` and `delete` calls.
+   *
+   * The proxy can be used as follows:
+   *
+   * ```
+   * const proxy = sync.proxy(object)
+   * proxy.update('key', 'value')
+   *```
+   */
+  proxy(object) {
+    const handler = {
+      get(target, prop) {
+        // Only proxy these methods
+        if (['upsert', 'update', 'delete'].includes(prop)) {
+          const { subject, metadata } = object.getSyncMetadata()
+          // Reflect.get is calling the original method.
+          // .bind is adding the parameters automatically
+          return Reflect.get(...arguments).bind(target, subject, metadata)
+        }
+        return Reflect.get(...arguments)
+      },
+    }
+    return new Proxy(this, handler)
+  }
+}

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

@@ -0,0 +1,109 @@
+/**
+ * This file contains the updaters: classes that are able to convert messages
+ * received from another party (or the server) to changes on the map.
+ */
+
+class BaseUpdater {
+  constructor(map) {
+    this.map = map
+  }
+
+  updateObjectValue(obj, key, value) {
+    const parts = key.split('.')
+    const lastKey = parts.pop()
+
+    // Reduce the current list of attributes,
+    // to find the object to set the property onto
+    const objectToSet = parts.reduce((currentObj, part) => {
+      if (currentObj !== undefined && part in currentObj) return currentObj[part]
+    }, obj)
+
+    // In case the given path doesn't exist, stop here
+    if (objectToSet === undefined) return
+
+    // Set the value (or delete it)
+    if (typeof value === 'undefined') {
+      delete objectToSet[lastKey]
+    } else {
+      objectToSet[lastKey] = value
+    }
+  }
+
+  getDataLayerFromID(layerId) {
+    if (layerId) return this.map.getDataLayerByUmapId(layerId)
+    return this.map.defaultEditDataLayer()
+  }
+
+  applyMessage(payload) {
+    let { verb } = payload
+    return this[verb](payload)
+  }
+}
+
+export class MapUpdater extends BaseUpdater {
+  update({ key, value }) {
+    this.updateObjectValue(this.map, key, value)
+    this.map.render([key])
+  }
+}
+
+export class DataLayerUpdater extends BaseUpdater {
+  upsert({ value }) {
+    // Inserts does not happen (we use multiple updates instead).
+    this.map.createDataLayer(value, false)
+    this.map.render([])
+  }
+
+  update({ key, metadata, value }) {
+    const datalayer = this.getDataLayerFromID(metadata.id)
+    this.updateObjectValue(datalayer, key, value)
+    datalayer.render([key])
+  }
+}
+
+export class FeatureUpdater extends BaseUpdater {
+  getFeatureFromMetadata({ id, layerId }) {
+    const datalayer = this.getDataLayerFromID(layerId)
+    return datalayer.getFeatureById(id)
+  }
+
+  // Create or update an object at a specific position
+  upsert({ metadata, value }) {
+    let { id, layerId } = metadata
+    const datalayer = this.getDataLayerFromID(layerId)
+    let feature = this.getFeatureFromMetadata(metadata, value)
+
+    feature = datalayer.geoJSONToLeaflet({
+      geometry: value.geometry,
+      geojson: value,
+      id,
+      feature,
+    })
+    datalayer.addLayer(feature)
+  }
+
+  // Update a property of an object
+  update({ key, metadata, value }) {
+    let feature = this.getFeatureFromMetadata(metadata)
+    if (feature === undefined) {
+      console.error(`Unable to find feature with id = ${metadata.id}.`)
+    }
+    switch (key) {
+      case 'geometry':
+        const datalayer = this.getDataLayerFromID(metadata.layerId)
+        datalayer.geoJSONToLeaflet({ geometry: value, id: metadata.id, feature })
+      default:
+        this.updateObjectValue(feature, key, value)
+        feature.datalayer.indexProperties(feature)
+    }
+
+    feature.render([key])
+  }
+
+  delete({ metadata }) {
+    // XXX Distinguish between properties getting deleted
+    // and the wole feature getting deleted
+    let feature = this.getFeatureFromMetadata(metadata)
+    if (feature) feature.del(false)
+  }
+}

umap/static/umap/js/modules/sync/websocket.js

@@ -0,0 +1,25 @@
+export class WebSocketTransport {
+  constructor(webSocketURI, authToken, messagesReceiver) {
+    this.websocket = new WebSocket(webSocketURI)
+    this.websocket.onopen = () => {
+      this.send('join', { token: authToken })
+    }
+    this.websocket.addEventListener('message', this.onMessage.bind(this))
+    this.receiver = messagesReceiver
+  }
+
+  onMessage(wsMessage) {
+    this.receiver.receive(JSON.parse(wsMessage.data))
+  }
+
+  send(kind, payload) {
+    const message = { ...payload }
+    message.kind = kind
+    let encoded = JSON.stringify(message)
+    this.websocket.send(encoded)
+  }
+
+  close() {
+    this.websocket.close()
+  }
+}

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

@@ -0,0 +1,52 @@
+import { DomUtil, DomEvent } from '../../../vendors/leaflet/leaflet-src.esm.js'
+import { translate } from '../i18n.js'
+
+export default class Dialog {
+  constructor(parent) {
+    this.parent = parent
+    this.className = 'umap-dialog window'
+    this.container = DomUtil.create('dialog', this.className, this.parent)
+    DomEvent.disableClickPropagation(this.container)
+    DomEvent.on(this.container, 'contextmenu', DomEvent.stopPropagation) // Do not activate our custom context menu.
+    DomEvent.on(this.container, 'wheel', DomEvent.stopPropagation)
+    DomEvent.on(this.container, 'MozMousePixelScroll', DomEvent.stopPropagation)
+  }
+
+  get visible() {
+    return this.container.open
+  }
+
+  close() {
+    this.container.close()
+  }
+
+  currentZIndex() {
+    return Math.max(
+      ...Array.from(document.querySelectorAll('dialog')).map(
+        (el) => window.getComputedStyle(el).getPropertyValue('z-index') || 0
+      )
+    )
+  }
+
+  open({ className, content, modal } = {}) {
+    this.container.innerHTML = ''
+    const currentZIndex = this.currentZIndex()
+    if (currentZIndex) this.container.style.zIndex = currentZIndex + 1
+    if (modal) this.container.showModal()
+    else this.container.show()
+    if (className) {
+      // Reset
+      this.container.className = this.className
+      this.container.classList.add(...className.split(' '))
+    }
+    const buttonsContainer = DomUtil.create('ul', 'buttons', this.container)
+    const closeButton = DomUtil.createButtonIcon(
+      DomUtil.create('li', '', buttonsContainer),
+      'icon-close',
+      translate('Close')
+    )
+    DomEvent.on(closeButton, 'click', this.close, this)
+    this.container.appendChild(buttonsContainer)
+    this.container.appendChild(content)
+  }
+}