Merge branch 'GEOLYTIX:main' into main

lib/layer/Style.mjs

@@ -52,7 +52,7 @@ export default layer => {
     }
 
     // Assign default style as feature.style.
-    feature.style = { ...mapp.utils.clone(layer.style.default), ...layer.style.theme?.style }
+    feature.style = { ...structuredClone(layer.style.default), ...layer.style.theme?.style }
 
     // Check whether feature is in lookup.
     if (Array.isArray(layer.featureLookup)) {
@@ -75,7 +75,7 @@ export default layer => {
     if (feature.geometryType === 'Point') {
 
       // The style must be cloned as icon if not otherwise defined to prevent circular reference
-      feature.style.icon ??= mapp.utils.clone(feature.style)
+      feature.style.icon ??= structuredClone(feature.style)
 
       // Assign cluster style.
       if (feature.properties.count > 1 && layer.style.cluster) {

lib/layer/themes/graduated.mjs

@@ -19,7 +19,7 @@ export default function(theme, feature) {
       if (catValue <= parseFloat(theme.cat_arr[i].value)) break;
 
       // Set cat_style to current cat style after value check.
-      var catStyle = mapp.utils.clone(theme.cat_arr[i].style || theme.cat_arr[i])
+      var catStyle = structuredClone(theme.cat_arr[i].style || theme.cat_arr[i])
 
       delete catStyle.label
     }

lib/mapview/_mapview.mjs

@@ -1,3 +1,5 @@
+import attribution from './attribution.mjs'
+
 import addLayer from './addLayer.mjs'
 
 import fitView from './fitView.mjs'
@@ -185,36 +187,8 @@ export default (mapview) => {
     units: mapview.locale.ScaleLine === 'imperial' ? 'imperial' : 'metric',
   }))
 
-  // Attribution
-  if (mapview.attribution) {
-
-    if (typeof mapview.attribution !== 'object') {
-      mapview.attribution = {}
-    }
-
-    mapview.attribution.target = mapview.attribution.target
-      || mapview.Map.getTargetElement()
-        .appendChild(mapp.utils.html.node`
-          <div class="attribution-links">`)
-
-    mapview.attribution.check = () => {
-
-      const o = Object.assign({}, mapview.attribution.links || {})
-
-      // Iterate through layers to check whether attribution should be displayed.
-      Object.values(mapview.layers).forEach(layer => {
-        layer.display && layer.attribution && Object.assign(
-          o, layer.attribution)
-      })
-
-      // Render the layer attribution links into the placeholder.
-      mapp.utils.render(mapview.attribution.target,
-        mapp.utils.html`${Object.entries(o)
-          .map(entry => mapp.utils.html`
-              <a target="_blank" href="${entry[1]}">${entry[0]}`)}`)
-
-    }
-  }
+  // Create mapview attribution.
+  attribution(mapview)
 
   // Events
 

lib/mapview/attribution.mjs

@@ -0,0 +1,38 @@
+export default function attribution(mapview) {
+
+  if (typeof mapview.attribution !== 'object') return;
+
+  if (!mapview.attribution.target) {
+
+    mapview.attribution.node = mapview.target.appendChild(
+      mapp.utils.html.node`<div class="map-attribution">
+        ${mapview.attribution.logo}`)
+
+    mapview.attribution.target = mapview.attribution.node
+      .appendChild(mapp.utils.html.node`<div class="attribution-links">`)
+  }
+
+  mapview.attribution.links ??= {}
+
+  mapview.attribution.check = () => {
+
+    // Create clone of mapview.attribution.links which are always displayed.
+    const links = structuredClone(mapview.attribution.links)
+
+    // Assign layer.attribution for visible to layers to links.
+    Object.values(mapview.layers)
+      .filter(layer => !!layer.display)
+      .filter(layer => !!layer.attribution)
+      .forEach(layer => Object.assign(links, layer.attribution))
+
+    const elements = Object.entries(links)
+      .map(entry => mapp.utils.html`
+      <a target="_blank" href="${entry[1]}">${entry[0]}`)
+
+    // Render all links into mapview.attribution.target.
+    mapp.utils.render(
+      mapview.attribution.target,
+      mapp.utils.html.node`${elements}`)
+
+  }
+}

lib/utils/_utils.mjs

@@ -5,9 +5,6 @@ import * as stats from 'simple-statistics'
 
 const areSetsEqual = (a, b) => a.size === b.size && [...a].every(value => b.has(value))
 
-// local import
-import clone from './clone.mjs'
-
 import csvDownload from './csvDownload.mjs'
 
 const compose = (...fns) => {
@@ -69,7 +66,6 @@ export default {
   svg,
   convert,
   areSetsEqual,
-  clone,
   compose,
   copyToClipboard,
   csvDownload,

lib/utils/loadPlugins.mjs

@@ -1,26 +1,28 @@
-export default plugins => {
+export default (plugins, endsWith = ['.js','.mjs']) => {
 
   if (!Array.isArray(plugins)) return;
-
-  return new Promise(resolveAll=>{
 
-    const promises = plugins.map(
-      plugin => 
-        new Promise((resolve, reject) => 
-          import(plugin)
-          .then(mod=> {
-            resolve(mod)
-          })
-          .catch(()=> {
-            reject()
-          })))
+  return new Promise(resolveAll => {
+
+    const promises = plugins
+      .filter(plugin => endsWith.some(_this => plugin.endsWith(_this)))
+      .map(
+        plugin =>
+          new Promise((resolve, reject) =>
+            import(plugin)
+              .then(mod => {
+                resolve(mod)
+              })
+              .catch(() => {
+                reject()
+              })))
 
     Promise
       .allSettled(promises)
-      .then(()=>{
+      .then(() => {
         resolveAll()
       })
-      .catch(err=>{
+      .catch(err => {
         console.error(err)
         resolveAll()
       })

mod/workspace/_workspace.js

@@ -91,15 +91,9 @@ async function locale(req, res) {
   }
 
   if (locale instanceof Error) {
-    return res.status(400).send('Failed to access locale.')
+    return res.status(400).send(locale.message)
   }
 
-  const roles = req.params.user?.roles || []
-
-  if (!Roles.check(locale, roles)) {
-    return res.status(403).send('Role access denied.')
-  }
-
   // Subtitutes ${*} with process.env.SRC_* key values.
   locale = JSON.parse(
     JSON.stringify(locale).replace(/\$\{(.*?)\}/g,
@@ -114,11 +108,11 @@ async function locale(req, res) {
     for (const key of Object.keys(locale.layers)) {
 
       const layer = await getLayer({
-        locale: req.params.locale,
+        ...req.params,
         layer: key
       })
 
-      if (!Roles.check(layer, roles)) continue;
+      if (layer instanceof Error) continue;
 
       layers.push(layer)
     }

mod/workspace/getLocale.js

@@ -20,9 +20,7 @@ module.exports = async (params) => {
 
   let locale = workspace.locales[params.locale]
 
-  const roles = params.user?.roles || []
-
-  if (!Roles.check(locale, roles)) {
+  if (!Roles.check(locale, params.user?.roles)) {
     return new Error('Role access denied.')
   }
 

public/css/_mapp.css

@@ -142,6 +142,18 @@ a > img {
   height: 100%;
 }
 
+.map-attribution {
+  position: absolute;
+  display: flex;
+  justify-content: space-between;
+  align-items: end;
+  bottom: 0;
+  right: 0;
+  width: 100%;
+  padding: 5px;
+  pointer-events: none;
+}
+
 .attribution-links {
   z-index: 999;
   text-align: right;

public/css/mapp.css

@@ -135,6 +135,17 @@ body {
 a > img {
   height: 100%;
 }
+.map-attribution {
+  position: absolute;
+  display: flex;
+  justify-content: space-between;
+  align-items: end;
+  bottom: 0;
+  right: 0;
+  width: 100%;
+  padding: 5px;
+  pointer-events: none;
+}
 .attribution-links {
   z-index: 999;
   text-align: right;

public/views/_default.html

@@ -44,19 +44,7 @@
       position: fixed;
     }
 
-    #Attribution {
-      position: absolute;
-      display: flex;
-      justify-content: space-between;
-      align-items: end;
-      bottom: 0;
-      right: 0;
-      width: 100%;
-      padding: 5px;
-      pointer-events: none;
-    }
-
-    #Attribution > .logo {
+    .map-attribution > .logo {
       pointer-events: auto;
       height: 1em;
     }
@@ -155,7 +143,7 @@
         position: absolute;
       }
 
-      #Attribution {
+      .map-attribution {
         padding-left: 4em;
       }
 
@@ -293,14 +281,9 @@
 <body style="grid-template-rows: auto 0 0;">
 
   <div id="Map">
-    
+
     <div id="OL"></div>
-    <div id="Attribution">
-      <a class="logo" target="_blank" href="https://geolytix.co.uk">
-        <img src="https://geolytix.github.io/public/geolytix_mapp.svg">
-      </a>
-      <div class="attribution-links"></div>
-    </div>
+
   </div>
 
   <div id="mapButton" class="btn-column"></div>

public/views/_default.js

@@ -296,12 +296,14 @@ window.onload = async () => {
     hooks: true,
     scrollWheelZoom: true,
     attribution: {
-      target: document.querySelector('#Attribution > .attribution-links'),
+      logo: mapp.utils.html.node`
+        <a class="logo" target="_blank" href="https://geolytix.co.uk">
+          <img src="https://geolytix.github.io/public/geolytix_mapp.svg">`,
       links: {
         [`XYZ v${mapp.version}`]: 'https://github.com/GEOLYTIX/xyz',
         ['SHA']: `https://github.com/GEOLYTIX/xyz/commit/${mapp.hash}`,
         Openlayers: 'https://openlayers.org',
-      },
+      }
     },
 
     // mapp.Mapview must be awaited.