@eodash/eodash 5.0.0-alpha.2.7 → 5.0.0-alpha.2.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/core/client/components/DashboardLayout.vue +1 -2
  2. package/core/client/components/MobileLayout.vue +1 -2
  3. package/core/client/composables/index.js +1 -0
  4. package/core/client/store/Actions.js +8 -2
  5. package/core/client/types.d.ts +1 -1
  6. package/dist/client/{DashboardLayout-Cbci3g7o.js → DashboardLayout-D0ZF6V2S.js} +4 -4
  7. package/dist/client/{DynamicWebComponent-DzmQ3Fr3.js → DynamicWebComponent-CPsMSBHi.js} +4 -4
  8. package/dist/client/{EodashDatePicker-SP5bYISd.js → EodashDatePicker-CBQP7u2X.js} +4 -4
  9. package/dist/client/{eox-itemfilter-TaBxgqq_.js → EodashItemFilter-DL2ScI-5.js} +1146 -1040
  10. package/dist/client/EodashMap-CkKoQlmR.js +86917 -0
  11. package/dist/client/{EodashMapBtns-BOKugQ88.js → EodashMapBtns-yuO2QmiR.js} +7 -8
  12. package/dist/client/{ExportState-D7m9s4T8.js → ExportState-CCzOhppU.js} +143 -143
  13. package/dist/client/{Footer-C2uV1-zu.js → Footer-BPAND0yG.js} +1 -1
  14. package/dist/client/{Header-C2ROtxo_.js → Header-DLhebNvG.js} +4 -4
  15. package/dist/client/{IframeWrapper-Wwou4pwf.js → IframeWrapper-1GEMHlsW.js} +1 -1
  16. package/dist/client/{MobileLayout-DR27Ctiz.js → MobileLayout-mGkOYRhu.js} +11 -11
  17. package/dist/client/{PopUp-bPGAY43o.js → PopUp-1d2bBFjw.js} +25 -25
  18. package/dist/client/{VImg-swqiqth2.js → VImg-DxHcztfM.js} +2 -2
  19. package/dist/client/{VMain-Bu1bPjvK.js → VMain-BLX5vRRn.js} +2 -2
  20. package/dist/client/{VOverlay-D_MKJ4vQ.js → VOverlay-CvrYEmLu.js} +3 -3
  21. package/dist/client/{WidgetsContainer-CpxYT8YI.js → WidgetsContainer-CmYjvGm7.js} +1 -1
  22. package/dist/client/{asWebComponent-DeaU3QoK.js → asWebComponent-B91uK0U7.js} +65 -65
  23. package/dist/client/{decoder-CP4lv0Kb-nokx54iM.js → decoder-CP4lv0Kb-B6yqkcfC.js} +1 -1
  24. package/dist/client/eo-dash.js +1 -1
  25. package/dist/client/{eodashSTAC-CFQuZ_cI.js → eodashSTAC-DBjqe_Ho.js} +1 -1
  26. package/dist/client/{forwardRefs-D0a135Tc.js → forwardRefs-BJJiadQP.js} +1 -1
  27. package/dist/client/{index-CoqcWt6E.js → index-Q-bHLjxx.js} +5 -5
  28. package/dist/client/{lerc-DzVumYtB-B3rx9xzz.js → lerc-DzVumYtB-P-KXC0TO.js} +1 -1
  29. package/dist/client/{ssrBoot-C-inWOiD.js → ssrBoot-yo11mybw.js} +1 -1
  30. package/dist/client/style.css +1 -1
  31. package/dist/client/{transition-C8le0YwQ.js → transition-CSJhuYGK.js} +5 -5
  32. package/dist/node/cli.js +2 -2
  33. package/package.json +1 -1
  34. package/widgets/EodashItemFilter.vue +57 -41
  35. package/widgets/EodashMap.vue +33 -29
  36. package/widgets/EodashMapBtns.vue +0 -1
  37. package/widgets/ExportState.vue +8 -8
  38. package/dist/client/EodashItemFilter-B9Tf2TBw.js +0 -63
  39. package/dist/client/EodashMap-D_znzmX7.js +0 -50707
  40. package/dist/client/eox-map-L7abwKTR.js +0 -36260
@@ -1,5 +1,5 @@
1
- import { p as m, ay as b, d, b9 as l, ab as u } from "./asWebComponent-DeaU3QoK.js";
2
- const j = m({
1
+ import { p as f, ay as m, d, bb as l, ab as u } from "./asWebComponent-B91uK0U7.js";
2
+ const j = f({
3
3
  transition: {
4
4
  type: [Boolean, String, Object],
5
5
  default: "fade-transition",
@@ -18,14 +18,14 @@ const j = m({
18
18
  component: i = r ? l : u,
19
19
  ...p
20
20
  } = typeof t == "object" ? t : {};
21
- return b(i, d(typeof t == "string" ? {
21
+ return m(i, d(typeof t == "string" ? {
22
22
  name: n ? "" : t
23
23
  } : p, typeof t == "string" ? {} : Object.fromEntries(Object.entries({
24
24
  disabled: n,
25
25
  group: r
26
26
  }).filter((c) => {
27
- let [y, f] = c;
28
- return f !== void 0;
27
+ let [y, b] = c;
28
+ return b !== void 0;
29
29
  })), a), e);
30
30
  };
31
31
  export {
package/dist/node/cli.js CHANGED
@@ -1,5 +1,5 @@
1
1
  #!/usr/bin/env node
2
- import{createLogger as P,defineConfig as C,searchForWorkspaceRoot as x,createServer as k,preview as S,build as F}from"vite";import{readFileSync as U,existsSync as u}from"fs";import t from"path";import{Command as E}from"commander";import{readFile as W,writeFile as I,rm as $,cp as N}from"fs/promises";import O from"@vitejs/plugin-vue";import T,{transformAssetUrls as A}from"vite-plugin-vuetify";const s=v(process.cwd()),b=new E("eodash"),H=JSON.parse(U(t.join(s,"package.json"),"utf-8"));b.version(H.version,"-v, --version","output the current version").option("--publicDir <path>","path to statically served assets folder").option("--no-publicDir","stop serving static assets").option("--outDir <path>","minified output folder").option("-e, --entryPoint <path>","file exporting `createEodash`").option("-w, --widgets <path>","folder that contains vue components as internal widgets").option("--cacheDir <path>","cache folder").option("-r, --runtime <path>","file exporting eodash client runtime config").option("-b, --base <path>","base public path").option("-p, --port <port>","serving port").option("-o, --open","open default browser when the server starts").option("-c, --config <path>","path to eodash server and build configuration file").option("--host [IP address]","specify which IP addresses the server should listen on").option("-l, --lib","builds eodash as a web component library").option("--no-lib","builds eodash as an SPA").option("--no-host","do not expose server to the network").parse(process.argv);const i=await z(b.opts(),process.argv?.[2]),c=v(),L=i.publicDir?t.resolve(s,i.publicDir):t.join(s,"./public"),h=t.join(s,"/src"),l=i.runtime?t.resolve(s,i.runtime):t.join(h,"./runtime.js"),g=i.entryPoint?t.resolve(s,i.entryPoint):t.join(h,"/main.js"),w=i.widgets?t.resolve(s,i.widgets):t.join(h,"widgets"),j=t.join(s,"/.eodash"),f=i.outDir?t.resolve(s,i.outDir):t.join(j,"/dist"),R=i.cacheDir?t.resolve(s,i.cacheDir):t.join(j,"cache"),m=P(void 0,{prefix:"[eodash]"});async function z(e,n){let a=e.config?t.resolve(s,e.config):t.join(s,"eodash.config.js"),o={};return u(a)?o=await import(a).then(r=>r.default instanceof Function?r.default():r.default).catch(r=>{console.error(r)}):a=null,{base:e.base??o?.base,port:Number(e.port??o?.[n]?.port),host:e.host??o?.[n]?.host,open:e.open??o?.[n]?.open,cacheDir:e.cacheDir??o?.cacheDir,entryPoint:e.entryPoint??o?.entryPoint,outDir:e.outDir??o?.outDir,publicDir:e.publicDir??o?.publicDir,runtime:e.runtime??o?.runtime,widgets:e.widgets??o?.widgets,lib:e.lib??o?.lib}}function v(e=import.meta.dirname){if(e.split("/").length)return u(t.resolve(e,"package.json"))?e:v(t.resolve(e,".."));throw new Error("no package root found")}const y=`
2
+ import{createLogger as P,defineConfig as C,searchForWorkspaceRoot as x,createServer as k,preview as S,build as F}from"vite";import{readFileSync as U,existsSync as u}from"fs";import t from"path";import{Command as E}from"commander";import{readFile as W,writeFile as I,rm as $,cp as N}from"fs/promises";import O from"@vitejs/plugin-vue";import T,{transformAssetUrls as A}from"vite-plugin-vuetify";const s=b(process.cwd()),h=new E("eodash"),H=JSON.parse(U(t.join(s,"package.json"),"utf-8"));h.version(H.version,"-v, --version","output the current version"),h.option("--publicDir <path>","path to statically served assets folder").option("--no-publicDir","stop serving static assets").option("--outDir <path>","minified output folder").option("-e, --entryPoint <path>","file exporting `createEodash`").option("-w, --widgets <path>","folder that contains vue components as internal widgets").option("--cacheDir <path>","cache folder").option("-r, --runtime <path>","file exporting eodash client runtime config").option("-b, --base <path>","base public path").option("-p, --port <port>","serving port").option("-o, --open","open default browser when the server starts").option("-c, --config <path>","path to eodash server and build configuration file").option("--host [IP address]","specify which IP addresses the server should listen on").option("-l, --lib","builds eodash as a web component library").option("--no-lib","builds eodash as an SPA").option("--no-host","do not expose server to the network").parse(process.argv);const i=await z(h.opts(),process.argv?.[2]),c=b(),L=i.publicDir?t.resolve(s,i.publicDir):t.join(s,"./public"),f=t.join(s,"/src"),l=i.runtime?t.resolve(s,i.runtime):t.join(f,"./runtime.js"),g=i.entryPoint?t.resolve(s,i.entryPoint):t.join(f,"/main.js"),w=i.widgets?t.resolve(s,i.widgets):t.join(f,"widgets"),j=t.join(s,"/.eodash"),m=i.outDir?t.resolve(s,i.outDir):t.join(j,"/dist"),R=i.cacheDir?t.resolve(s,i.cacheDir):t.join(j,"cache"),v=P(void 0,{prefix:"[eodash]"});async function z(e,n){let a=e.config?t.resolve(s,e.config):t.join(s,"eodash.config.js"),o={};return u(a)?o=await import(a).then(r=>r.default instanceof Function?r.default():r.default).catch(r=>{console.error(r)}):a=null,{base:e.base??o?.base,port:Number(e.port??o?.[n]?.port),host:e.host??o?.[n]?.host,open:e.open??o?.[n]?.open,cacheDir:e.cacheDir??o?.cacheDir,entryPoint:e.entryPoint??o?.entryPoint,outDir:e.outDir??o?.outDir,publicDir:e.publicDir??o?.publicDir,runtime:e.runtime??o?.runtime,widgets:e.widgets??o?.widgets,lib:e.lib??o?.lib}}function b(e=import.meta.dirname){if(e.split("/").length>0)return u(t.resolve(e,"package.json"))?e:b(t.resolve(e,".."));throw new Error("no package root found from "+e)}const y=`
3
3
  <!DOCTYPE html>
4
4
  <html lang="en">
5
5
 
@@ -17,4 +17,4 @@ ${i.lib?`<eo-dash style="height:100dvh;"/>
17
17
  <script type="module" src="${t.resolve(`/@fs/${c}`,"core/client/render.js")}"><\/script>
18
18
  `}
19
19
  </body>
20
- </html>`,D=C(({mode:e,command:n})=>({base:i.base??"",cacheDir:R,plugins:[O({customElement:!1,template:{transformAssetUrls:A,compilerOptions:{isCustomElement:a=>!a.includes("v-")&&a.includes("-")}}}),T({autoImport:!0}),e==="development"&&{name:"inject-html",configureServer:J}],customLogger:m,define:{"process.env":{}},resolve:{alias:{"@":t.join(c,"core/client"),"^":t.join(c,"widgets"),"user:config":g,"user:widgets":w},extensions:[".js",".json",".jsx",".mjs",".ts",".tsx",".vue"]},server:{warmup:{clientFiles:[t.join(c,"core/client/**")]},port:i.port??3e3,open:i.open,fs:{allow:[x(process.cwd())]},host:i.host},root:c,optimizeDeps:e==="development"?{include:["webfontloader","vuetify","vue","pinia","stac-js","urijs"],noDiscovery:!0}:{},publicDir:i.publicDir===!1?!1:L,build:{lib:i.lib&&n==="build"&&{entry:t.join(c,"core/client/asWebComponent.js"),fileName:"eo-dash",formats:["es"],name:"@eodash/eodash"},outDir:f,emptyOutDir:!0,rollupOptions:i.lib&&n==="build"?{input:t.join(c,"core/client/asWebComponent.js")}:void 0,target:"esnext"}}));async function J(e){e.watcher.add([g,l,t.join(w,"**/*.vue")]);let n="";const a=m.info;return m.info=(o,r)=>{if(o.includes("core")){const d=o.split("/")[0].split(" ");d.pop();const p=d.join(" ")+" "+n.replace(s,"");return a(p,r)}return a(o,r)},e.watcher.on("change",async o=>{n=o,o===l&&e.hot.send({type:"full-reload",path:o})}),()=>{e.middlewares.use(async(o,r,d)=>{if(o.originalUrl==="/@fs/config.js"||o.originalUrl==="/config.js"){r.statusCode=200,r.setHeader("Content-Type","text/javascript"),u(l)&&await W(l).then(p=>{r.write(p)}),r.end();return}if(o.url?.endsWith(".html")){r.statusCode=200,r.setHeader("Content-Type","text/html");const p=await e.transformIndexHtml(o.url,y,o.originalUrl);r.end(p);return}d()})}}const M=async()=>{const e=await k(await D({mode:"development",command:"serve"}));await e.listen(),e.printUrls(),e.bindCLIShortcuts({print:!0})},Y=async()=>{const e=async()=>{const n=await D({mode:"production",command:"build"});await F(n),u(l)&&await N(l,t.join(f,"config.js"),{recursive:!0}).catch(a=>{console.error(a)})};if(i.lib)await e();else{const n=t.join(c,"/index.html");await I(n,y).then(async()=>{await e(),await $(n).catch(()=>{console.error("failed to remove index.html")})})}};async function B(){(await S({root:s,base:i.base??"",preview:{port:isNaN(i.port)?8080:i.port,open:i.open,host:i.host},build:{outDir:f}})).printUrls()}const G=process.argv?.[2];(async()=>{switch(G){case"dev":await M();break;case"build":await Y();break;case"preview":await B();break;default:console.error("command not found");break}})();
20
+ </html>`,D=C(({mode:e,command:n})=>({base:i.base??"",cacheDir:R,plugins:[O({customElement:!1,template:{transformAssetUrls:A,compilerOptions:{isCustomElement:a=>!a.includes("v-")&&a.includes("-")}}}),T({autoImport:!0}),e==="development"&&{name:"inject-html",configureServer:J}],customLogger:v,define:{"process.env":{}},resolve:{alias:{"@":t.join(c,"core/client"),"^":t.join(c,"widgets"),"user:config":g,"user:widgets":w},extensions:[".js",".json",".jsx",".mjs",".ts",".tsx",".vue"]},server:{warmup:{clientFiles:[t.join(c,"core/client/**")]},port:i.port??3e3,open:i.open,fs:{allow:[x(process.cwd())]},host:i.host},root:c,optimizeDeps:e==="development"?{include:["webfontloader","vuetify","vue","pinia","stac-js","urijs"],noDiscovery:!0}:{},publicDir:i.publicDir===!1?!1:L,build:{lib:i.lib&&n==="build"&&{entry:t.join(c,"core/client/asWebComponent.js"),fileName:"eo-dash",formats:["es"],name:"@eodash/eodash"},outDir:m,emptyOutDir:!0,rollupOptions:i.lib&&n==="build"?{input:t.join(c,"core/client/asWebComponent.js")}:void 0,target:"esnext"}}));async function J(e){e.watcher.add([g,l,t.join(w,"**/*.vue")]);let n="";const a=v.info;return v.info=(o,r)=>{if(o.includes("core")){const d=o.split("/")[0].split(" ");d.pop();const p=d.join(" ")+" "+n.replace(s,"");return a(p,r)}return a(o,r)},e.watcher.on("change",async o=>{n=o,o===l&&e.hot.send({type:"full-reload",path:o})}),()=>{e.middlewares.use(async(o,r,d)=>{if(o.originalUrl==="/@fs/config.js"||o.originalUrl==="/config.js"){r.statusCode=200,r.setHeader("Content-Type","text/javascript"),u(l)&&await W(l).then(p=>{r.write(p)}),r.end();return}if(o.url?.endsWith(".html")){r.statusCode=200,r.setHeader("Content-Type","text/html");const p=await e.transformIndexHtml(o.url,y,o.originalUrl);r.end(p);return}d()})}}const M=async()=>{const e=await k(await D({mode:"development",command:"serve"}));await e.listen(),e.printUrls(),e.bindCLIShortcuts({print:!0})},Y=async()=>{const e=async()=>{const n=await D({mode:"production",command:"build"});await F(n),u(l)&&await N(l,t.join(m,"config.js"),{recursive:!0}).catch(a=>{console.error(a)})};if(i.lib)await e();else{const n=t.join(c,"/index.html");await I(n,y).then(async()=>{await e(),await $(n).catch(()=>{console.error("failed to remove index.html")})})}};async function B(){(await S({root:s,base:i.base??"",preview:{port:isNaN(i.port)?8080:i.port,open:i.open,host:i.host},build:{outDir:m}})).printUrls()}const G=process.argv?.[2];(async()=>{switch(G){case"dev":await M();break;case"build":await Y();break;case"preview":await B();break;default:console.error("command not found");break}})();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eodash/eodash",
3
- "version": "5.0.0-alpha.2.7",
3
+ "version": "5.0.0-alpha.2.9",
4
4
  "type": "module",
5
5
  "types": "./core/client/types.d.ts",
6
6
  "files": [
@@ -1,45 +1,73 @@
1
1
  <template>
2
- <DynamicWebComponent
3
- :link="link"
4
- tag-name="eox-itemfilter"
5
- :properties="properties"
6
- :on-mounted="onMounted"
7
- />
2
+ <eox-itemfilter class="fill-height" :config="config" ref="eoxItemFilter">
3
+ <h4 slot="filterstitle" style="margin: 14px 8px">{{ filtersTitle }}</h4>
4
+
5
+ <h4 slot="resultstitle" style="margin: 14px 8px">{{ resultsTitle }}</h4>
6
+ </eox-itemfilter>
8
7
  </template>
9
8
  <script setup>
10
- import DynamicWebComponent from "@/components/DynamicWebComponent.vue";
9
+ import { useSTAcStore } from "@/store/stac";
10
+ import "@eox/itemfilter";
11
+ import { onMounted, ref } from "vue";
11
12
 
12
- const link = () => import("@eox/itemfilter");
13
+ const props = defineProps({
14
+ filtersTitle: {
15
+ type: String,
16
+ default: "Indicators",
17
+ },
18
+ resultsTitle: {
19
+ type: String,
20
+ default: "",
21
+ },
22
+ titleProperty: {
23
+ type: String,
24
+ default: "title",
25
+ },
13
26
 
14
- const properties = {
15
- config: {
16
- titleProperty: "title",
17
- filterProperties: [
27
+ aggregateResults: {
28
+ type: String,
29
+ default: "themes",
30
+ },
31
+ enableHighlighting: { type: Boolean, default: true },
32
+ expandMultipleFilters: { type: Boolean, default: false },
33
+ expandMultipleResults: { type: Boolean, default: false },
34
+ filterProperties: {
35
+ /** @type {import("vue").PropType<{
36
+ * keys:string[];
37
+ * title:string;
38
+ * type:string;
39
+ * expanded?:boolean
40
+ * }[]> }*/
41
+ type: Array,
42
+ default: () => [
18
43
  {
19
- keys: ["title", "themes"],
44
+ keys: ["title", "themes", "description"],
20
45
  title: "Search",
21
46
  type: "text",
22
- // expanded: true,
23
47
  },
24
48
  {
25
49
  key: "themes",
26
50
  title: "Theme Filter",
27
51
  type: "multiselect",
28
- // featured: true,
29
- // expanded: true
30
52
  },
31
53
  ],
32
- aggregateResults: "themes",
33
- enableHighlighting: true,
34
- expandMultipleFilters: false,
35
- expandMultipleResults: false,
36
54
  },
55
+ });
56
+
57
+ const config = {
58
+ titleProperty: props.titleProperty,
59
+ filterProperties: props.filterProperties,
60
+ aggregateResults: props.aggregateResults,
61
+ enableHighlighting: props.enableHighlighting,
62
+ expandMultipleFilters: props.expandMultipleFilters,
63
+ expandMultipleResults: props.expandMultipleResults,
37
64
  };
65
+ /** @type {import("vue").Ref<HTMLElement & Record<string,any> | null>} */
66
+ const eoxItemFilter = ref(null);
38
67
 
39
- /** @type {import("@/types").WebComponentProps["onMounted"]} */
40
- const onMounted = (el, store) => {
41
- /** @type {any} */ (el).style.height = "100%";
68
+ const store = useSTAcStore();
42
69
 
70
+ onMounted(() => {
43
71
  const style = document.createElement("style");
44
72
  style.innerHTML = `
45
73
  section {
@@ -51,29 +79,17 @@ const onMounted = (el, store) => {
51
79
  right: 8px;
52
80
  }
53
81
  `;
54
- el?.shadowRoot?.appendChild(style);
82
+ eoxItemFilter.value?.shadowRoot?.appendChild(style);
55
83
 
56
- const filterstitle = document.createElement("div");
57
- filterstitle.setAttribute("slot", "filterstitle");
58
- filterstitle.innerHTML = `<h4 style="margin: 14px 8px">Indicators</h4>`;
59
- /** @type {any} */ (el).appendChild(filterstitle);
60
- const resultstitle = document.createElement("div");
61
- resultstitle.setAttribute("slot", "resultstitle");
62
- /** @type {any} */ (el).appendChild(resultstitle);
63
-
64
- /**
65
- * @typedef {object} Item
66
- * @property {string} href
67
- */
68
- /** @type {any} */ (el).apply(
84
+ eoxItemFilter.value?.apply(
69
85
  // Only list child elements in list
70
86
  store.stac?.filter((item) => item.rel === "child"),
71
87
  );
72
- /** @type {any} */ (el).config.onSelect =
73
- /** @param {Item} item */
88
+ /** @type {any} */ (eoxItemFilter.value).config.onSelect =
89
+ /** @param {import('stac-ts').StacLink} item */
74
90
  async (item) => {
75
- console.log(item);
76
91
  await store.loadSelectedSTAC(item.href);
92
+ console.log(item, store.selectedStac);
77
93
  };
78
- };
94
+ });
79
95
  </script>
@@ -1,28 +1,32 @@
1
1
  <template>
2
- <DynamicWebComponent
3
- :link="link"
4
- tag-name="eox-map"
5
- :properties="properties"
6
- :on-mounted="onMounted"
7
- :on-unmounted="onUnmounted"
2
+ <eox-map
3
+ class="fill-height fill-width overflow-none"
4
+ ref="eoxMap"
5
+ :config="eoxMapConfig"
8
6
  />
9
7
  </template>
10
8
  <script setup>
11
- import { inject, watch } from "vue";
9
+ import { inject, onMounted, onUnmounted, reactive, ref, watch } from "vue";
12
10
  import { toAbsolute } from "stac-js/src/http.js";
13
11
  import { EodashCollection, extractCollectionUrls } from "@/utils/eodashSTAC";
14
12
  import { eodashKey } from "@/utils/keys";
15
13
  import { datetime, mapPosition } from "@/store/States";
16
- import DynamicWebComponent from "@/components/DynamicWebComponent.vue";
17
14
  import { storeToRefs } from "pinia";
15
+ import { useSTAcStore } from "@/store/stac";
16
+ import "@eox/map";
18
17
  import "@eox/map/dist/eox-map-advanced-layers-and-sources.js";
19
18
 
20
- const eodashConfig = /** @type {import("@/types").Eodash} */ inject(eodashKey);
19
+ const eodashConfig = /** @type {import("@/types").Eodash} */ (
20
+ inject(eodashKey)
21
+ );
21
22
 
22
- /** @type {Record<string, unknown>} */
23
- const properties = {
24
- class: "fill-height fill-width overflow-none",
23
+ /** @type {import("vue").Ref<(HTMLElement & Record<string,unknown>) | null>} */
24
+ const eoxMap = ref(null);
25
+
26
+ const eoxMapConfig = reactive({
27
+ /** @type {(number|undefined)[] | undefined} */
25
28
  center: [15, 48],
29
+ /** @type {number | undefined} */
26
30
  zoom: 4,
27
31
  // TODO: we should probably introduce some way of defining
28
32
  layers: [
@@ -45,17 +49,16 @@ const properties = {
45
49
  },
46
50
  },
47
51
  ],
48
- };
52
+ });
53
+
49
54
  // Check if selected indicator was already set in store
50
55
  if (mapPosition && mapPosition.value && mapPosition.value.length === 3) {
51
56
  // TODO: do further checks for invalid values?
52
57
  // TODO: can we expect the values to be in a specific projection
53
- properties.center = [mapPosition.value?.[0], mapPosition.value[1]];
54
- properties.zoom = mapPosition.value[2];
58
+ eoxMapConfig.center = [mapPosition.value?.[0], mapPosition.value[1]];
59
+ eoxMapConfig.zoom = mapPosition.value[2];
55
60
  }
56
61
 
57
- const link = () => import("@eox/map");
58
-
59
62
  /** @type {import("openlayers").EventsListenerFunctionType} */
60
63
  const handleMoveEnd = (evt) => {
61
64
  const map = /** @type {import("openlayers").Map | undefined} */ (
@@ -73,10 +76,12 @@ const handleMoveEnd = (evt) => {
73
76
  }
74
77
  };
75
78
 
76
- /** @type {import("@/types").WebComponentProps["onMounted"]} */
77
- const onMounted = (el, store) => {
78
- /** @type {any} */
79
- (el)?.map?.on("moveend", handleMoveEnd);
79
+ const store = useSTAcStore();
80
+
81
+ onMounted(() => {
82
+ /** @type {import('ol/Map').default} */
83
+ (eoxMap.value?.map)?.on("moveend", handleMoveEnd);
84
+
80
85
  const { selectedStac } = storeToRefs(store);
81
86
 
82
87
  watch(
@@ -126,7 +131,7 @@ const onMounted = (el, store) => {
126
131
  // TODO: we can check if the collection / indicator has a specific
127
132
  // projection it wants to be displayed in the map we can register
128
133
  // and set the attribute here, e.g. like following
129
- /*
134
+ /*
130
135
  (el)?.registerProjection(
131
136
  'EPSG:3031','+proj=stere +lat_0=-90 +lat_ts=-71 +lon_0=0 +x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs +type=crs'
132
137
  );
@@ -134,16 +139,15 @@ const onMounted = (el, store) => {
134
139
  */
135
140
 
136
141
  /** @type {any} */
137
- (el).layers = layersCollection;
142
+ (eoxMap.value).layers = layersCollection;
138
143
  }
139
144
  },
140
145
  { immediate: true },
141
146
  );
142
- };
147
+ });
143
148
 
144
- /** @type {import("@/types").WebComponentProps["onUnmounted"]} */
145
- const onUnmounted = (el, _store) => {
146
- /** @type {any} */
147
- (el)?.map?.un("moveend", handleMoveEnd);
148
- };
149
+ onUnmounted(() => {
150
+ /** @type {import('ol/Map').default} */
151
+ (eoxMap.value?.map)?.un("moveend", handleMoveEnd);
152
+ });
149
153
  </script>
@@ -2,7 +2,6 @@
2
2
  <div ref="rootRef" class="d-flex align-end justify-end my-3 pa-2">
3
3
  <v-btn
4
4
  class="map-btn"
5
- color="primary"
6
5
  :icon="[mdiMapPlus]"
7
6
  @click="showMapState = !showMapState"
8
7
  />
@@ -11,7 +11,7 @@
11
11
  editor:
12
12
  </p>
13
13
  <div class="pa-3 code-block">
14
- {{ getLayers(props.for) }}
14
+ {{ getLayers() }}
15
15
  </div>
16
16
 
17
17
  <div style="position: absolute; bottom: 15px">
@@ -53,15 +53,15 @@ import { mdiClipboardCheckOutline, mdiContentCopy } from "@mdi/js";
53
53
  import PopUp from "./PopUp.vue";
54
54
  import { copyToClipBoard } from "@/utils";
55
55
  import { computed, ref } from "vue";
56
- import { getLayers } from "@/store/Actions";
56
+ import { getLayers as getLayerAction } from "@/store/Actions";
57
57
  import { mapPosition } from "@/store/States";
58
58
 
59
59
  const dialog = defineModel({ type: Boolean, required: true, default: false });
60
60
 
61
61
  const props = defineProps({
62
- for: {
63
- type: String,
64
- default: "eox-map",
62
+ getLayers: {
63
+ type: Function,
64
+ default: getLayerAction,
65
65
  },
66
66
  });
67
67
 
@@ -76,7 +76,7 @@ const copyBtns = [
76
76
  {
77
77
  id: Symbol(),
78
78
  copyFn: async () =>
79
- await copyToClipBoard(JSON.stringify(getLayers(props?.for)), copySuccess),
79
+ await copyToClipBoard(JSON.stringify(props.getLayers()), copySuccess),
80
80
  copyAs: "layers configuration",
81
81
  },
82
82
  {
@@ -93,14 +93,14 @@ const mapStepCode = computed(() => {
93
93
  #### Tour step title
94
94
  Text describing the current step of the tour and why it is interesting what the map shows currently
95
95
  `;
96
- return `${preTag}'${JSON.stringify(getLayers(props?.for))}' ${endTag}`;
96
+ return `${preTag}'${JSON.stringify(props.getLayers())}' ${endTag}`;
97
97
  });
98
98
  const mapEntryCode = computed(() => {
99
99
  const [x, y, z] = mapPosition.value;
100
100
  const preTag =
101
101
  '## Map Example <!--{as="eox-map" style="width: 100%; height: 500px;" layers=';
102
102
  const endTag = `zoom="${z}" center=[${[x, y]}] }-->`;
103
- return `${preTag}'${JSON.stringify(getLayers(props?.for))}' ${endTag}`;
103
+ return `${preTag}'${JSON.stringify(props.getLayers())}' ${endTag}`;
104
104
  });
105
105
  </script>
106
106
  <style scoped>
@@ -1,63 +0,0 @@
1
- import { $ as p, a0 as c } from "./asWebComponent-DeaU3QoK.js";
2
- import m from "./DynamicWebComponent-DzmQ3Fr3.js";
3
- const f = {
4
- __name: "EodashItemFilter",
5
- setup(d) {
6
- const r = () => import("./eox-itemfilter-TaBxgqq_.js"), o = {
7
- config: {
8
- titleProperty: "title",
9
- filterProperties: [
10
- {
11
- keys: ["title", "themes"],
12
- title: "Search",
13
- type: "text"
14
- // expanded: true,
15
- },
16
- {
17
- key: "themes",
18
- title: "Theme Filter",
19
- type: "multiselect"
20
- // featured: true,
21
- // expanded: true
22
- }
23
- ],
24
- aggregateResults: "themes",
25
- enableHighlighting: !0,
26
- expandMultipleFilters: !1,
27
- expandMultipleResults: !1
28
- }
29
- }, a = (t, i) => {
30
- t.style.height = "100%";
31
- const s = document.createElement("style");
32
- s.innerHTML = `
33
- section {
34
- margin: 0 !important;
35
- }
36
- section button#filter-reset {
37
- padding: 0 8px;
38
- top: 8px;
39
- right: 8px;
40
- }
41
- `, t?.shadowRoot?.appendChild(s);
42
- const l = document.createElement("div");
43
- l.setAttribute("slot", "filterstitle"), l.innerHTML = '<h4 style="margin: 14px 8px">Indicators</h4>', t.appendChild(l);
44
- const n = document.createElement("div");
45
- n.setAttribute("slot", "resultstitle"), t.appendChild(n), t.apply(
46
- // Only list child elements in list
47
- i.stac?.filter((e) => e.rel === "child")
48
- ), t.config.onSelect = /** @param {Item} item */
49
- async (e) => {
50
- console.log(e), await i.loadSelectedSTAC(e.href);
51
- };
52
- };
53
- return (t, i) => (p(), c(m, {
54
- link: r,
55
- "tag-name": "eox-itemfilter",
56
- properties: o,
57
- "on-mounted": a
58
- }));
59
- }
60
- };
61
- export {
62
- f as default
63
- };