@kalisio/kdk 2.2.0 → 2.2.2

package/map/client/leaflet/TiledMeshLayer.js

@@ -281,13 +281,15 @@ const TiledMeshLayer = L.GridLayer.extend({
   },
 
   updateColorMap () {
+    const chromajs = this.conf.chromajs
+    if (_.isNil(chromajs)) return
+
     // create color map using domain or classes
     // domain and classes can be specified from options
     // if not, domain can be gathered from grid source
     this.colorMap = null
     this.colorMapShaderCode = null
 
-    const chromajs = _.get(this.conf, 'chromajs')
     const classes = chromajs.classes
     let domain
     if (!classes) {

package/map/client/leaflet/utils/utils.style.js

@@ -4,6 +4,7 @@ import chroma from 'chroma-js'
 import moment from 'moment'
 import L from 'leaflet'
 import { Time, Units, utils as kdkCoreUtils } from '../../../../core/client/index.js'
+import { getFeatureStyleType } from '../../utils/utils.features.js'
 import { convertStyle, convertSimpleStyleToPointStyle, convertSimpleStyleToLineStyle, convertSimpleStyleToPolygonStyle,
          PointStyleTemplateMappings, LineStyleTemplateMappings, PolygonStyleTemplateMappings } from '../../utils/utils.style.js'
 import { ShapeMarker } from '../ShapeMarker.js'
@@ -68,13 +69,15 @@ const LineStyleToLeafletPath = {
   cap: 'lineCap',
   join: 'lineJoin',
   dashArray: 'dashArray',
-  dashOffset: 'dashOffset'
+  dashOffset: 'dashOffset',
+  pane: 'pane'
 }
 
 const PolygonStyleToLeafletPath = {
   color: 'fillColor',
   opacity: 'fillOpacity',
   rule: 'fillRule',
+  pane: 'pane'
 }
 
 // TODO: to be removed when updating 3D style
@@ -158,8 +161,9 @@ function processStyle (style, feature, options, mappings) {
     })
   }
   // We manage panes for z-index, so we need to forward it to marker options (only if not already defined)
-  if (leafletOptions.pane && !style.pane) style.pane = leafletOptions.pane
-  if (leafletOptions.shadowPane && !style.shadowPane) style.shadowPane = leafletOptions.shadowPane
+  const type = getFeatureStyleType(feature)
+  if (leafletOptions.pane && !_.has(style, `${type}.pane`)) _.set(style, `${type}.pane`, leafletOptions.pane)
+  if (leafletOptions.shadowPane && !_.has(style, `${type}.shadowPane`)) _.set(style, `${type}.shadowPane`, leafletOptions.shadowPane)
   return style
 }
 

package/map/client/mixins/globe/mixin.base-globe.js

@@ -3,12 +3,11 @@ import sift from 'sift'
 import logger from 'loglevel'
 import Emitter from 'tiny-emitter'
 import { getCssVar } from 'quasar'
-import { kml } from '@tmcw/togeojson'
 import Cesium from 'cesium/Source/Cesium.js'
 import 'cesium/Source/Widgets/widgets.css'
 import BuildModuleUrl from 'cesium/Source/Core/buildModuleUrl.js'
 import { Geolocation } from '../../geolocation.js'
-import { convertCesiumHandlerEvent, isTerrainLayer } from '../../utils.globe.js'
+import { convertCesiumHandlerEvent, isTerrainLayer, convertEntitiesToGeoJson } from '../../utils.globe.js'
 // Cesium has its own dynamic module loader requiring to be configured
 // Cesium files need to be also added as static assets of the applciation
 BuildModuleUrl.setBaseUrl('/Cesium/')
@@ -279,6 +278,12 @@ export const baseGlobe = {
     clearLayers () {
       Object.keys(this.layers).forEach((layer) => this.removeLayer(layer))
     },
+    async toGeoJson (name) {
+      const layer = this.getCesiumLayerByName(name)
+      if (!layer.entities) return
+      const geoJson = await convertEntitiesToGeoJson(layer.entities)
+      return geoJson
+    },
     zoomToBounds (bounds) {
       this.viewer.camera.flyTo({
         duration: 0,
@@ -402,7 +407,7 @@ export const baseGlobe = {
       }
       return position
     },
-    getDefaultPickHandler (event) {
+    async getDefaultPickHandler (event) {
       const emittedEvent = {}
       let options
       let pickedPosition = this.viewer.camera.pickEllipsoid(event.endPosition || event.position, this.viewer.scene.globe.ellipsoid)
@@ -422,24 +427,32 @@ export const baseGlobe = {
         emittedEvent.target = pickedObject.id || pickedObject.primitive.id
         if (emittedEvent.target instanceof Cesium.Entity) {
           // If feature have been lost at import try to recreate it in order to be compatible with 2D
+          // We attach it to the target entity so that we won't compute it each time the mouse move
+          // FIXME: should it be a problem with real-time updates ?
           if (!emittedEvent.target.feature) {
-            let feature = { type: 'Feature' }
-            /* FIXME: Generate GeoJson feature if possible (requires Cesium 1.59)
-               However this does not work yet and could be too much slow
+            // Cesium expect id to be in a 'id' property but internally we use _id
+            // Get it back as otherwise it might break code relying on feature ID
+            let feature = {
+              _id: emittedEvent.target.id,
+              type: 'Feature'
+            }
+            // Generate GeoJson feature if possible (requires Cesium 1.59)
             if (typeof Cesium.exportKml === 'function') {
               const selection = new Cesium.EntityCollection()
               selection.add(emittedEvent.target)
-              const kmlEntities = await Cesium.exportKml({ entities: selection, modelCallback: () => '' })
-              const geoJson = kml(kmlEntities.kml)
-              if (geoJson.features.length > 0) feature = geoJson.features[0]
+              const geoJson = await convertEntitiesToGeoJson(selection)
+              if (geoJson.features.length > 0) {
+                Object.assign(feature, geoJson.features[0])
+              }
             }
-            */
-            const position = Cesium.Cartographic.fromCartesian(emittedEvent.target.position
-              ? emittedEvent.target.position.getValue(0)
-              : emittedEvent.pickedPosition)
-            feature.geometry = {
-              type: 'Point',
-              coordinates: [Cesium.Math.toDegrees(position.longitude), Cesium.Math.toDegrees(position.latitude)]
+            if (!feature.geometry) {
+              const position = Cesium.Cartographic.fromCartesian(emittedEvent.target.position
+                ? emittedEvent.target.position.getValue(0)
+                : emittedEvent.pickedPosition)
+              feature.geometry = {
+                type: 'Point',
+                coordinates: [Cesium.Math.toDegrees(position.longitude), Cesium.Math.toDegrees(position.latitude)]
+              }
             }
             feature.properties = (emittedEvent.target.properties ? emittedEvent.target.properties.getValue(0) : {})
             emittedEvent.target.feature = feature

package/map/client/mixins/globe/mixin.geojson-layers.js

@@ -2,6 +2,7 @@ import Cesium from 'cesium/Source/Cesium.js'
 import _ from 'lodash'
 import logger from 'loglevel'
 import sift from 'sift'
+import { uid } from 'quasar'
 import { Time } from '../../../../core/client/time.js'
 import { fetchGeoJson, getFeatureId, processFeatures, getFeatureStyleType, isInMemoryLayer } from '../../utils.js'
 import { convertSimpleStyleToPointStyle, convertSimpleStyleToLineStyle, convertSimpleStyleToPolygonStyle } from '../../utils/utils.style.js'
@@ -120,6 +121,10 @@ export const geojsonLayers = {
             }
           })
         }
+        // Billboard with 'none' shape should be removed as Cesium creates it even if the maki icon id is unknown
+        if (entity.billboard && (_.get(properties, 'marker-symbol') === 'none')) {
+          entitiesToRemove.push(entity)
+        }
         // Labels
         const text = _.get(properties, 'icon-text')
         if (text) {
@@ -197,6 +202,8 @@ export const geojsonLayers = {
       if (cesiumOptions.type !== 'geoJson') return
       const engine = _.get(this, 'activityOptions.engine')
       options.processor = (feature) => {
+        // File import
+        if (!options.featureId && !feature._id) feature._id = uid().toString()
         // Cesium expect id to be in a 'id' property
         feature.id = getFeatureId(feature, options)
         // We cannot access data outside the properties object of a feature in Cesium

package/map/client/mixins/map/mixin.base-map.js

@@ -1,6 +1,7 @@
 import _ from 'lodash'
 import sift from 'sift'
 import logger from 'loglevel'
+import moment from 'moment'
 import L from 'leaflet'
 import Emitter from 'tiny-emitter'
 import 'leaflet/dist/leaflet.css'
@@ -146,14 +147,20 @@ export const baseMap = {
       leafletOptions.attribution = processedOptions.attribution
       return processedOptions
     },
+    getLeafletPaneName (paneOrZIndex) {
+      return (typeof paneOrZIndex === 'object' ? paneOrZIndex.name || paneOrZIndex.zIndex.toString() : paneOrZIndex.toString())
+    },
     createLeafletPane (paneOrZIndex) {
-      // Create pane if required
-      const paneName = paneOrZIndex.toString()
+      // Input can be a name, a z-index, an object with both options
+      const paneName = this.getLeafletPaneName(paneOrZIndex)
       let pane = this.map.getPane(paneName)
+      // Create pane if required
       if (!pane) {
+        let zIndex
+        if (typeof paneOrZIndex === 'object') zIndex = paneOrZIndex.zIndex || 400
+        else if (typeof paneOrZIndex === 'number') zIndex = paneOrZIndex
         pane = this.map.createPane(paneName)
-        if (typeof paneOrZIndex === 'number') _.set(pane, 'style.zIndex', paneOrZIndex)
-        else _.set(pane, 'style.zIndex', 400) // Defaults for overlay in Leaflet
+        _.set(pane, 'style.zIndex', zIndex || 400) // Defaults for overlay in Leaflet
       }
       this.leafletPanes[paneName] = pane
       return pane
@@ -168,12 +175,10 @@ export const baseMap = {
       if (!pane) return
       delete this.leafletPanes[paneName]
     },
-    updateLeafletPanesVisibility (panes) {
+    updateLeafletPanesVisibility () {
       const zoom = this.map.getZoom()
       // Check if we need to hide/show some panes based on current zoom level
       _.forOwn(this.leafletPanes, (pane, paneName) => {
-        // Filter only some panes ?
-        if (panes && panes.includes(paneName)) return
         const hasMinZoom = !!_.get(pane, 'minZoom')
         const hasMaxZoom = !!_.get(pane, 'maxZoom')
         if (!hasMinZoom && !hasMaxZoom) return
@@ -207,10 +212,10 @@ export const baseMap = {
       const panes = _.get(leafletOptions, 'panes')
       if (panes) {
         panes.forEach(paneOptions => {
-          const pane = this.createLeafletPane(paneOptions.name || paneOptions.zIndex)
+          const pane = this.createLeafletPane(paneOptions)
           Object.assign(pane, paneOptions)
         })
-        this.updateLeafletPanesVisibility(panes.map(paneOptions => paneOptions.name || paneOptions.zIndex.toString()))
+        this.updateLeafletPanesVisibility()
       }
 
       // Some Leaflet constructors can have additional arguments given as options
@@ -256,19 +261,36 @@ export const baseMap = {
       if (timeDimension) {
         // It appears that sometimes the time resolution is missing, default as 1 day
         // Please refer to https://www.mapserver.org/ogc/wms_time.html#specifying-time-extents
+        _.set(timeDimension, 'period', 'P1D')
         const timeRange = _.get(timeDimension, 'times')
-        if ((typeof timeRange === 'string') && (timeRange.split('/').length === 2)) {
+        const timeRangeComponents = (typeof timeRange === 'string' ? timeRange.split('/') : [])
+        if (timeRangeComponents.length === 2) {
           _.set(timeDimension, 'times', `${timeRange}/P1D`)
+        } else if (timeRangeComponents.length === 3) {
+          _.set(timeDimension, 'period', timeRangeComponents[2])
         }
+        // Used to format time accordingly
+        const periodAsDuration = moment.duration(_.get(timeDimension, 'period'))
         // As we'd like to control time on a per-layer basis create a specific time dimension object
         layer = this.createLeafletLayer({
           type: 'timeDimension.layer.wms',
           source: layer,
           timeDimension: L.timeDimension(timeDimension),
-          currentTime: Time.getCurrentTime()
+          currentTime: Time.getCurrentTime().toDate().getTime()
         })
         // This allow the layer to conform our internal time interface
-        layer.setCurrentTime = (datetime) => { layer._timeDimension.setCurrentTime(datetime) }
+        layer.setCurrentTime = (datetime) => { layer._timeDimension.setCurrentTime(datetime.toDate().getTime()) }
+        // Default implementation always generate ISO datetime that might break some servers with eg day period only
+        layer._createLayerForTime = (time) => {
+          // Remove some internals to avoid polluting request
+          const wmsParams = _.omit(layer._baseLayer.options, ['timeDimension', 'isVisible', 'type'])
+          // Format time according to period
+          if (periodAsDuration.years() > 0) wmsParams.time = moment.utc(time).format('YYYY').toISOString()
+          else if (periodAsDuration.months() > 0) wmsParams.time = moment.utc(time).format('YYYY-MM')
+          else if (periodAsDuration.days() > 0) wmsParams.time = moment.utc(time).format('YYYY-MM-DD')
+          else wmsParams.time = moment.utc(time).toISOString()
+          return new layer._baseLayer.constructor(layer._baseLayer.getURL(), wmsParams)
+        }
       }
       return layer
     },
@@ -289,11 +311,12 @@ export const baseMap = {
     },
     updateLayerDisabled (layer) {
       const wasDisabled = layer.isDisabled
-      layer.isDisabled = this.isLayerDisabled(layer)
-      if (layer.isDisabled !== wasDisabled) {
-        if (wasDisabled) this.onLayerEnabled(layer)
-        else this.onLayerDisabled(layer)
-      }
+      const isDisabled = this.isLayerDisabled(layer)
+      // Test if state changed
+      if (wasDisabled === isDisabled) return
+      layer.isDisabled = isDisabled
+      if (wasDisabled) this.onLayerEnabled(layer)
+      else this.onLayerDisabled(layer)
     },
     onLayerEnabled (layer) {
       this.$emit('layer-enabled', layer)

package/map/client/mixins/map/mixin.geojson-layers.js

@@ -267,9 +267,13 @@ export const geojsonLayers = {
           leafletOptions.panes = [pane]
           leafletOptions.pane = options.name
           leafletOptions.shadowPane = options.name
-          // Make pane available to point style as well as shape markers are created from here
-          _.set(leafletOptions, 'style.point.options.pane', options.name)
-          _.set(leafletOptions, 'style.point.options.shadowPane', options.name)
+          // Make pane available to styles as well as eg shape markers are created from here
+          for (const type in ['point', 'line', 'polygon']) {
+            if (_.has(leafletOptions, `style.${type}`)) {
+              _.set(leafletOptions, `style.${type}.pane`, options.name)
+              _.set(leafletOptions, `style.${type}.shadowPane`, options.name)
+            }
+          }
         }
         // If not explicitely disable use defaults for clustering
         if (!_.has(leafletOptions, 'cluster') && _.get(this, 'activityOptions.engine.cluster')) {

package/map/client/mixins/mixin.activity.js

@@ -239,12 +239,16 @@ export const activity = {
       // Check if the activity is using context restoration
       const hasContext = (typeof this.restoreContext === 'function')
       // Retrieve the forecast models
-      if (this.setupWeacast) {
+      const weacastEnabled = _.get(config, 'weacast.enabled', true)
+      if (weacastEnabled && this.setupWeacast) {
         try {
           await this.setupWeacast()
         } catch (error) {
           logger.error(`[KDK] ${error}`)
         }
+      } else {
+        if (weacastEnabled) logger.warn('[KDK] Weacast setup function is missing')
+        else logger.debug('[KDK] disabling Weacast')
       }
       // Retrieve the layers
       try {

package/map/client/planets.js

@@ -33,6 +33,10 @@ export const Planets = {
       client.get('storage').removeItem(options.gatewayJwt)
     })
     const accessToken = await client.get('storage').getItem(options.apiJwt)
+    if (!accessToken) {
+      logger.error(new Error(`You must set planet ${name} token first`))
+      return
+    }
     await client.authenticate({
       strategy: 'jwt',
       accessToken
@@ -46,6 +50,10 @@ export const Planets = {
     delete this.planets[name]
   },
 
+  isConnected (name) {
+    return !_.isNil(this.planets[name])
+  },
+
   get (name) {
     if (!this.planets[name]) logger.error(new Error(`You must connect to planet ${name} first`))
     else return this.planets[name]

package/map/client/utils/utils.catalog.js

@@ -131,6 +131,23 @@ export async function getCategories (options = {}) {
   return categories
 }
 
+export async function getSublegends (options = {}) {
+  _.defaults(options, {
+    query: {},
+    context: '',
+    planetApi: api
+  })
+
+  let sublegends = []
+  const catalogService = options.planetApi.getService('catalog', options.context)
+  if (catalogService) {
+    const response = await catalogService.find({ query: Object.assign({ type: 'Sublegend' }, options.query) })
+    _.forEach(response.data, processTranslations)
+    sublegends = sublegends.concat(response.data)
+  }
+  return sublegends
+}
+
 export async function getViews (options = {}) {
   _.defaults(options, {
     query: {},

package/map/client/utils/utils.layers.js

@@ -138,7 +138,8 @@ export async function saveGeoJsonLayer (layer, geoJson, chunkSize = 5000) {
 }
 
 export async function saveLayer (layer) {
-  await api.getService('catalog').create(_.omit(layer, InternalLayerProperties))
+  layer = await api.getService('catalog').create(_.omit(layer, InternalLayerProperties))
+  return layer
 }
 
 export async function removeLayer (layer) {

package/map/client/utils/utils.schema.js

@@ -44,31 +44,3 @@ export function generatePropertiesSchema (geoJson, name) {
   })
   return schema
 }
-
-export function updatePropertiesSchema (schema) {
-  const props = schema.properties
-  if (!props) return
-
-  const bestGuesses = {
-    undefined: 'form/KTextField',
-    object: 'form/KTextField',
-    string: 'form/KTextField',
-    number: 'form/KNumberField',
-    boolean: 'form/KToggleField'
-  }
-
-  // Loop over declared props and add best guesses to field components based on property type
-  for (const prop in props) {
-    const propEntry = props[prop]
-    // Field already here, skip entry
-    if (propEntry.field && propEntry.field.component) continue
-
-    propEntry.field = {
-      component: bestGuesses[propEntry.type],
-      label: prop,
-      helper: propEntry.description
-    }
-  }
-
-  return schema
-}

package/map/client/utils/utils.style.js

@@ -1,4 +1,5 @@
 import _ from 'lodash'
+import { getCssVar } from 'quasar'
 import { utils as kdkCoreUtils } from '../../../core/client/index.js'
 
 export const IconStyleToSimpleStyle = {
@@ -149,6 +150,17 @@ export function convertStyle (style, mapping, asNumber = []) {
   return convertedStyle
 }
 
+export function convertSimpleStyleColors (style) {
+  // Convert from quasar color palette to actual color
+  _.forOwn(style, (value, key) => {
+    if (['stroke', 'fill', 'marker-color'].includes(key)) {
+      const color = getCssVar(value)
+      if (color) _.set(style, key, color)
+    }
+  })
+  return style
+}
+
 export function convertPointStyleToSimpleStyle (style) {
   return style ? Object.assign(convertStyle(style.icon, IconStyleToSimpleStyle, SimpleStyleNumbers), convertStyle(style, PointStyleToSimpleStyle, SimpleStyleNumbers)) : {}
 }

package/map/common/wms-utils.js

@@ -96,15 +96,20 @@ export async function discover (url, searchParams = {}, caps = null) {
         // check for time dimension
         for (const dimension of _.get(layer, 'Dimension', [])) {
           if (_.get(dimension, '$.name', '').toLowerCase() === 'time') {
-            _.set(obj, 'timeDimension', {})
+            const timeRange = _.get(dimension, '_')
+            // If time range is not given in dimension it should be in extent
+            if (timeRange) _.set(obj, 'timeDimension.times', timeRange.trim())
+            else if (!_.has(obj, 'timeDimension')) _.set(obj, 'timeDimension', {})
           }
         }
         // check for time range
         if (obj.timeDimension) {
           for (const extent of _.get(layer, 'Extent', [])) {
             if (_.get(extent, '$.name', '').toLowerCase() === 'time') {
-              const timeRange = _.get(extent, '_', '').trim()
-              _.set(obj, 'timeDimension.times', timeRange)
+              const timeRange = _.get(extent, '_')
+              // If time range is not given in extent it should be in dimension
+              if (timeRange) _.set(obj, 'timeDimension.times', timeRange.trim())
+              else if (!_.has(obj, 'timeDimension')) _.set(obj, 'timeDimension', {})
             }
           }
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kalisio/kdk",
   "description": "Kalisio Development Kit",
-  "version": "2.2.0",
+  "version": "2.2.2",
   "homepage": "https://github.com/kalisio/kdk",
   "type": "module",
   "keywords": [

package/test/client/core/layout.js

@@ -118,7 +118,6 @@ export async function countFabActions (page) {
   return countElements(page, '//a[contains(@class, "k-action-fab-action")]')
 }
 
-
 export async function closeWelcomeDialog (page) {
   await click(page, '.q-dialog #close-button')
 }

package/test/client/map/catalog.js

@@ -119,7 +119,7 @@ export async function dropFile (page, filePath, wait = 2000) {
   const loaderSelector = '#dropFileInput'
   const loader = await page.$(loaderSelector)
   await loader.uploadFile(filePath)
-  await page.waitForNetworkIdle()  
+  await page.waitForNetworkIdle()
   await page.waitForTimeout(wait)
 }
 

package/test/api/core/test-log-2023-12-19.log

@@ -1,7 +0,0 @@
-{"level":"info","message":"This is a log test"}
-{"level":"error","message":"error: api/tags - Method: create: You are not allowed to access service tags"}
-{"level":"error","message":"error: api/users - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/users - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/authorisations - Method: create: You are not allowed to change authorisation on resource"}
-{"level":"error","message":"error: api/authorisations - Method: remove: You are not allowed to change authorisation on subject(s)"}
-{"level":"info","message":"This is a log test"}

package/test/api/core/test-log-2024-01-04.log

@@ -1,14 +0,0 @@
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}
-{"level":"error","message":"error: api/account - Method: create: The provided password does not comply to the password policy"}