@eodash/eodash 5.0.0 → 5.2.0

package/dist/client/{index-CIHH_3dW.js → index-B2XpdgR6.js}

@@ -1,10 +1,11 @@
-import { onMounted, onUnmounted, watch, nextTick, ref, toRaw, computed, createElementBlock, openBlock, createElementVNode, unref, normalizeStyle } from 'vue';
+import { onMounted, onUnmounted, watch, computed, useTemplateRef, ref, toRaw, createElementBlock, openBlock, createElementVNode, createCommentVNode, unref, normalizeStyle, createVNode } from 'vue';
 import '@eox/map';
 import '@eox/map/src/plugins/advancedLayersAndSources';
-import { a8 as EodashCollection, a9 as eoxLayersKey, Z as useSTAcStore, aa as setMapProjFromCol, ab as posIsSetFromUrl, ac as useOnLayersUpdate, ad as mapPosition, a3 as mapEl, a2 as mapCompareEl, Y as datetime, $ as eodashCollections, a6 as layerControlFormValue, a5 as layerControlFormValueCompare, a4 as eodashCompareCollections } from './asWebComponent-CLhcT715.js';
+import { K as setMapProjFromCol, B as mapPosition, d as mapEl, I as mapCompareEl, C as indicator, D as compareIndicator, y as datetime } from './helpers-wXK7Ywio.js';
 import { storeToRefs } from 'pinia';
+import { M as EodashCollection, E as useSTAcStore, N as useEmitLayersUpdate, O as isFirstLoad, P as useOnLayersUpdate, _ as _export_sfc, D as useDisplay, L as layerControlFormValue, K as layerControlFormValueCompare, J as eodashCompareCollections, I as eodashCollections } from './asWebComponent-ZyEzWOOf.js';
 import log from 'loglevel';
-import { useEventBus } from '@vueuse/core';
+import { i as inAndOut, E as EodashMapBtns } from './EodashMapBtns-B89_YBDw.js';
 import mustache from 'mustache';
 
 /**
@@ -59,9 +60,10 @@ const createLayersConfig = async (
   const indicatorLayers =
     //@ts-expect-error indicator is collection
     await EodashCollection.getIndicatorLayers(selectedIndicator);
-  const geodbLayer = EodashCollection.getGeoDBLayer(eodashCols);
-  if (geodbLayer) {
-    dataLayers.layers.unshift(geodbLayer);
+  const observationPointsLayer =
+    EodashCollection.getObservationPointsLayer(eodashCols);
+  if (observationPointsLayer) {
+    dataLayers.layers.unshift(observationPointsLayer);
   }
   const baseLayers = {
     type: "Group",
@@ -183,9 +185,6 @@ const useHandleMapMoveEnd = (mapElement, mapPosition) => {
       !Number.isNaN(z)
     ) {
       mapPosition.value = [lonlat[0], lonlat[1], z];
-      if (posIsSetFromUrl.value) {
-        posIsSetFromUrl.value = false;
-      }
     }
   };
 
@@ -227,7 +226,6 @@ const useInitMap = (
     eodashCols.values,
     datetime.value,
   );
-  const layersEvent = useEventBus(eoxLayersKey);
 
   const stopIndicatorWatcher = watch(
     [selectedIndicator, datetime],
@@ -280,9 +278,14 @@ const useInitMap = (
             JSON.parse(JSON.stringify(layersCollection)),
           );
           mapLayers.value = layersCollection;
-          await nextTick(() => {
-            layersEvent.emit("time:updated", mapLayers.value);
-          });
+
+          useEmitLayersUpdate(
+            mapElement.value?.id === "compare"
+              ? "compareTime:updated"
+              : "time:updated",
+            mapElement.value,
+            layersCollection,
+          );
           return;
         }
 
@@ -306,7 +309,8 @@ const useInitMap = (
         }
         if (
           endInterval !== null &&
-          endInterval.toISOString() !== datetime.value
+          endInterval.toISOString() !== datetime.value &&
+          !isFirstLoad.value
         ) {
           datetime.value = endInterval.toISOString();
         }
@@ -317,7 +321,11 @@ const useInitMap = (
           if (
             mapElement?.value?.id === "main" &&
             updatedStac.extent?.spatial.bbox &&
-            !posIsSetFromUrl.value
+            !(
+              isFirstLoad.value &&
+              mapPosition.value?.[0] &&
+              mapPosition.value?.[1]
+            )
           ) {
             // Sanitize extent,
             const b = updatedStac.extent?.spatial.bbox[0];
@@ -337,9 +345,6 @@ const useInitMap = (
             (mapElement.value).zoomExtent = reprojExtent;
           }
         }
-        if (posIsSetFromUrl.value) {
-          posIsSetFromUrl.value = false;
-        }
 
         log.debug(
           "Assigned layers",
@@ -347,11 +352,13 @@ const useInitMap = (
         );
         mapLayers.value = layersCollection;
         // Emit event to update layers
-        await nextTick(() => {
-          mapElement.value?.updateComplete.then(() => {
-            layersEvent.emit("layers:updated", mapLayers.value);
-          });
-        });
+        await useEmitLayersUpdate(
+          mapElement.value?.id === "compare"
+            ? "compareLayers:updated"
+            : "layers:updated",
+          mapElement.value,
+          mapLayers.value,
+        );
       }
     },
     { immediate: true },
@@ -366,8 +373,14 @@ const useInitMap = (
  * @param {import("@/eodashSTAC/EodashCollection").EodashCollection[]} eodashCols
  * @param {import("vue").Ref<Exclude<import("@/types").EodashStyleJson["tooltip"],undefined>>} tooltipProperties
  */
+
 const useUpdateTooltipProperties = (eodashCols, tooltipProperties) => {
-  useOnLayersUpdate(async () => {
+  useOnLayersUpdate(async (evt, _payload) => {
+    if (evt.includes("compare")) {
+      // TODO: support compare map tooltips
+      // Do not update tooltip properties on compare map
+      return;
+    }
     const tooltips = [];
     for (const ec of eodashCols) {
       tooltips.push(...(await ec.getToolTipProperties()));
@@ -377,26 +390,23 @@ const useUpdateTooltipProperties = (eodashCols, tooltipProperties) => {
   });
 };
 
-/**
- * @module ol/easing
- */
-
-
-/**
- * Start slow, speed up, and then slow down again.
- * @param {number} t Input between 0 and 1.
- * @return {number} Output between 0 and 1.
- * @api
- */
-function inAndOut(t) {
-  return 3 * t * t - 2 * t * t * t;
-}
+const _style_0 = "#cursor-coordinates[data-v-8d648956]{position:fixed;left:24px;bottom:54px;color:#000000e6;font-size:11px;font-family:var(--eox-body-font-family);background:#fffe;border-radius:4px;border:none;padding:0 3px;max-height:24px}@media (max-width: 959px){#cursor-coordinates[data-v-8d648956]{display:none}}#scale-line[data-v-8d648956]{position:fixed;left:24px;bottom:28px;color:#fff}@media (max-width: 959px){#scale-line[data-v-8d648956]{bottom:102px}}[data-v-8d648956] .ol-scale-line{background:#fffe!important;border-radius:4px!important;border:none!important;padding:0 3px 3px!important;font-size:10px!important;font-family:var(--eox-body-font-family);max-height:20px}[data-v-8d648956] .ol-scale-line-inner{display:flex;justify-content:center;border:1px solid rgba(0,0,0,.5)!important;border-top:none!important;color:#333!important;font-weight:500!important;transform:translateY(1px)}.map-buttons-container[data-v-8d648956]{position:fixed;top:0;left:0;width:100%;height:100%;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(12,1fr);pointer-events:none;z-index:1}.map-buttons-container[data-v-8d648956]>*{pointer-events:auto}";
 
 const _hoisted_1 = [".enabled"];
-const _hoisted_2 = [".center", ".zoom", ".layers"];
+const _hoisted_2 = [".center", ".zoom", ".layers", ".controls"];
 const _hoisted_3 = [".propertyTransform"];
 const _hoisted_4 = [".layers"];
 const _hoisted_5 = [".propertyTransform"];
+const _hoisted_6 = {
+  key: 0,
+  id: "cursor-coordinates",
+  ref: "cursor-coords"
+};
+const _hoisted_7 = {
+  key: 1,
+  id: "scale-line",
+  ref: "scale-line"
+};
 
 
 const _sfc_main = {
@@ -410,35 +420,132 @@ const _sfc_main = {
   center: {
     //@ts-expect-error todo
     type: Array,
-    default: () => [15, 48],
+    default: () => [mapPosition.value?.[0] ?? 15, mapPosition.value?.[1] ?? 48],
   },
   zoom: {
     type: Number,
-    default: 4,
+    default: mapPosition.value?.[2] ?? 4,
   },
   zoomToExtent: {
     type: Boolean,
     default: true,
   },
+  enableCursorCoordinates: {
+    type: Boolean,
+    default: true,
+  },
+  enableScaleLine: {
+    type: Boolean,
+    default: true,
+  },
+  btnsPosition: {
+    type: Object,
+    default: () => ({
+      x: "12/9/10",
+      y: 1,
+      gap: 16,
+    }),
+  },
+  btns: {
+    type: Object,
+    default: () => ({
+      enableExportMap: true,
+      enableChangeProjection: true,
+      enableCompareIndicators: true,
+      enableBackToPOIs: true,
+      enableSearch: true,
+      enableZoom: true,
+    }),
+  },
 },
   setup(__props) {
 
 const props = __props;
 
+// Responsive positioning logic
+const { width } = useDisplay();
+
+/**
+ * Parse responsive string values (e.g., "1/5/10") into values for different screen sizes
+ * Breakpoints: [0, 960, 1920] based on properties passed to eox-layout in DashboardLayout.vue
+ * @param {string | number} value
+ * @returns {number}
+ */
+const parseResponsiveValue = (value) => {
+  if (typeof value === "number") {
+    return value;
+  }
+  if (typeof value === "string") {
+    const parts = value.split("/");
+    const currentWidth = width.value;
+
+    if (currentWidth < 960) {
+      return parseInt(parts[0]) || 1;
+    } else if (currentWidth < 1920) {
+      return parseInt(parts[1] || parts[0]) || 1;
+    } else {
+      return parseInt(parts[2] || parts[1] || parts[0]) || 1;
+    }
+  }
+  return 1;
+};
+
+const responsiveX = computed(() => parseResponsiveValue(props.btnsPosition.x));
+const responsiveY = computed(() => parseResponsiveValue(props.btnsPosition.y));
+const btnsProps = computed(() => ({
+  exportMap: props.btns.enableExportMap ?? true,
+  changeProjection: props.btns.enableChangeProjection ?? true,
+  compareIndicators: props.btns.enableCompareIndicators ?? true,
+  backToPOIs: props.btns.enableBackToPOIs ?? true,
+  enableSearch: props.btns.enableSearch ?? true,
+  enableZoom: props.btns.enableZoom ?? true,
+}));
+
+// Prepare containers for scale line and cursor coordinates
+const scaleLineRef = useTemplateRef("scale-line");
+const cursorCoordsRef = useTemplateRef("cursor-coords");
+
 /** @type {import("vue").Ref<Exclude<import("@/types").EodashStyleJson["tooltip"], undefined>>} */
 const tooltipProperties = ref([]);
 /** @type {import("vue").Ref<Exclude<import("@/types").EodashStyleJson["tooltip"], undefined>>} */
 const compareTooltipProperties = ref([]);
-/** @type {import("@eox/map").EOxMap["controls"]} */
-const controls = {
-  Attribution: {
-    collapsible: true,
-  },
-};
-const initialCenter = toRaw([
-  mapPosition.value?.[0] ?? props.center?.[0],
-  mapPosition.value?.[1] ?? props.center?.[1],
-]);
+/** @type {import("vue").ComputedRef<{
+  Attribution: { collapsible: boolean };
+  ScaleLine?: { target: HTMLElement };
+  MousePosition?: { projection: string; coordinateFormat: (c: [number, number]) => string; target: HTMLElement };
+}>} */
+const controls = computed(() => {
+  /** @type {{
+    Attribution: { collapsible: boolean };
+    ScaleLine?: { target: HTMLElement };
+    MousePosition?: { projection: string; coordinateFormat: (c: [number, number]) => string; target: HTMLElement };
+  }} */
+  const controlsObj = {
+    Attribution: {
+      collapsible: true,
+    },
+  };
+
+  if (props.enableScaleLine && scaleLineRef.value) {
+    controlsObj.ScaleLine = {
+      target: scaleLineRef.value,
+    };
+  }
+
+  if (props.enableCursorCoordinates && cursorCoordsRef.value) {
+    controlsObj.MousePosition = {
+      projection: "EPSG:4326",
+      coordinateFormat: (/** @type {[number, number]} */ c) => {
+        return `${c[1].toFixed(3)} °N, ${c[0].toFixed(3)} °E`;
+      },
+      target: cursorCoordsRef.value,
+    };
+  }
+
+  return controlsObj;
+});
+
+const initialCenter = toRaw(props.center);
 const initialZoom = toRaw(mapPosition.value?.[2] ?? props.zoom);
 /** @type {import("vue").Ref<Record<string,any>[]>} */
 const eoxMapLayers = ref([
@@ -492,7 +599,6 @@ onMounted(() => {
   if (props.enableCompare) {
     useInitMap(
       compareMap,
-      //@ts-expect-error todo selectedStac as collection
       selectedCompareStac,
       eodashCompareCollections,
       datetime,
@@ -506,7 +612,6 @@ onMounted(() => {
 
   useInitMap(
     eoxMap,
-    //@ts-expect-error todo selectedStac as collection
     selectedStac,
     eodashCollections,
     datetime,
@@ -566,44 +671,80 @@ const tooltipPropertyTransform = (map) => {
 };
 
 return (_ctx, _cache) => {
-  return (openBlock(), createElementBlock("eox-map-compare", {
-    class: "fill-height fill-width overflow-none",
-    ".enabled": showCompare.value
-  }, [
-    createElementVNode("eox-map", {
+  return (openBlock(), createElementBlock("span", null, [
+    createElementVNode("eox-map-compare", {
       class: "fill-height fill-width overflow-none",
-      slot: "first",
-      ref_key: "eoxMap",
-      ref: eoxMap,
-      id: "main",
-      ".animationOptions": animationOptions,
-      ".center": unref(initialCenter),
-      ".zoom": unref(initialZoom),
-      ".layers": eoxMapLayers.value,
-      ".controls": controls
+      ".enabled": showCompare.value
     }, [
-      createElementVNode("eox-map-tooltip", {
-        style: normalizeStyle(mainTooltipStyles.value),
-        ".propertyTransform": tooltipPropertyTransform('main')
-      }, null, 44 /* STYLE, PROPS, NEED_HYDRATION */, _hoisted_3)
-    ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_2),
-    createElementVNode("eox-map", {
-      class: "fill-height fill-width overflow-none",
-      id: "compare",
-      slot: "second",
-      ref_key: "compareMap",
-      ref: compareMap,
-      ".layers": eoxMapCompareLayers.value
+      createElementVNode("eox-map", {
+        class: "fill-height fill-width overflow-none",
+        slot: "first",
+        ref_key: "eoxMap",
+        ref: eoxMap,
+        id: "main",
+        ".animationOptions": animationOptions,
+        ".center": unref(initialCenter),
+        ".zoom": unref(initialZoom),
+        ".layers": eoxMapLayers.value,
+        ".controls": controls.value
+      }, [
+        createElementVNode("eox-map-tooltip", {
+          style: normalizeStyle(mainTooltipStyles.value),
+          ".propertyTransform": tooltipPropertyTransform('main')
+        }, null, 44 /* STYLE, PROPS, NEED_HYDRATION */, _hoisted_3)
+      ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_2),
+      createElementVNode("eox-map", {
+        class: "fill-height fill-width overflow-none",
+        id: "compare",
+        slot: "second",
+        ref_key: "compareMap",
+        ref: compareMap,
+        ".layers": eoxMapCompareLayers.value
+      }, [
+        createElementVNode("eox-map-tooltip", {
+          style: normalizeStyle(compareTooltipStyles.value),
+          ".propertyTransform": tooltipPropertyTransform('compare')
+        }, null, 44 /* STYLE, PROPS, NEED_HYDRATION */, _hoisted_5)
+      ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_4)
+    ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_1),
+    (__props.enableCursorCoordinates)
+      ? (openBlock(), createElementBlock("div", _hoisted_6, null, 512 /* NEED_PATCH */))
+      : createCommentVNode("v-if", true),
+    (__props.enableScaleLine)
+      ? (openBlock(), createElementBlock("span", _hoisted_7, null, 512 /* NEED_PATCH */))
+      : createCommentVNode("v-if", true),
+    createElementVNode("div", {
+      class: "map-buttons-container",
+      style: normalizeStyle(`margin: ${__props.btnsPosition.gap}px 0 ${__props.btnsPosition.gap}px 0`)
     }, [
-      createElementVNode("eox-map-tooltip", {
-        style: normalizeStyle(compareTooltipStyles.value),
-        ".propertyTransform": tooltipPropertyTransform('compare')
-      }, null, 44 /* STYLE, PROPS, NEED_HYDRATION */, _hoisted_5)
-    ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_4)
-  ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_1))
+      createVNode(EodashMapBtns, {
+        style: normalizeStyle({
+          gridColumn: unref(indicator) || unref(compareIndicator) ? responsiveX.value : '12',
+          gridRow: responsiveY.value,
+        }),
+        exportMap: (unref(indicator) || unref(compareIndicator)) ? btnsProps.value.exportMap : false,
+        changeProjection: 
+          (unref(indicator) || unref(compareIndicator)) ? btnsProps.value.changeProjection : false
+        ,
+        compareIndicators: 
+          (unref(indicator) || unref(compareIndicator)) ? btnsProps.value.compareIndicators : false
+        ,
+        backToPOIs: 
+          (unref(indicator) || unref(compareIndicator)) ? btnsProps.value.backToPOIs : false
+        ,
+        enableSearch: 
+          (unref(indicator) || unref(compareIndicator)) ? btnsProps.value.enableSearch : false
+        ,
+        enableZoom: 
+          (unref(indicator) || unref(compareIndicator)) ? btnsProps.value.enableZoom : false
+        
+      }, null, 8 /* PROPS */, ["style", "exportMap", "changeProjection", "compareIndicators", "backToPOIs", "enableSearch", "enableZoom"])
+    ], 4 /* STYLE */)
+  ]))
 }
 }
 
 };
+const index = /*#__PURE__*/_export_sfc(_sfc_main, [['styles',[_style_0]],['__scopeId',"data-v-8d648956"]]);
 
-export { _sfc_main as default };
+export { index as default };

package/dist/client/{ssrBoot-BP7SYRyC.js → ssrBoot-Zgc_Ttvi.js}

@@ -1,4 +1,4 @@
-import { shallowRef, onMounted, computed, readonly } from 'vue';
+import { shallowRef, onMounted, toRef, readonly } from 'vue';
 
 // Utilities
 
@@ -10,7 +10,7 @@ function useSsrBoot() {
       isBooted.value = true;
     });
   });
-  const ssrBootStyles = computed(() => !isBooted.value ? {
+  const ssrBootStyles = toRef(() => !isBooted.value ? {
     transition: 'none !important'
   } : undefined);
   return {