@eodash/eodash 5.1.0 → 5.2.0
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.
- package/core/client/components/DashboardLayout.vue +1 -1
- package/core/client/components/EodashOverlay.vue +4 -5
- package/core/client/components/MobileLayout.vue +42 -21
- package/core/client/composables/index.js +1 -1
- package/core/client/eodashSTAC/EodashCollection.js +4 -15
- package/core/client/eodashSTAC/createLayers.js +30 -0
- package/core/client/eodashSTAC/helpers.js +23 -1
- package/dist/client/{DashboardLayout-ByVs1DrY.js → DashboardLayout-Dq9Kfe6O.js} +5 -5
- package/dist/client/{DynamicWebComponent-C3W7HSQm.js → DynamicWebComponent-DCBMXskE.js} +1 -1
- package/dist/client/{EodashDatePicker-BIAf1sMT.js → EodashDatePicker-DtngxU6s.js} +3 -3
- package/dist/client/{EodashItemFilter-DPznh8UB.js → EodashItemFilter-ClQebJQt.js} +1 -1
- package/dist/client/{EodashLayerControl-Bhxjw4V2.js → EodashLayerControl-BLBds28C.js} +2 -2
- package/dist/client/{EodashLayoutSwitcher-C5qTEffW.js → EodashLayoutSwitcher-DQ8SfVDd.js} +3 -3
- package/dist/client/EodashMapBtns-B89_YBDw.js +326 -0
- package/dist/client/{EodashStacInfo-CSvvF2jI.js → EodashStacInfo-Dt1nF06x.js} +1 -1
- package/dist/client/{EodashTools-Cv1SXQ5y.js → EodashTools-DV5ykmWc.js} +4 -4
- package/dist/client/{ExportState-D-iuwaad.js → ExportState-B6zZQUmE.js} +4 -5
- package/dist/client/{Footer-CyF0zRAk.js → Footer-DNhXs8k6.js} +1 -1
- package/dist/client/{Header-CgD8jDKU.js → Header-BjhN5JY4.js} +2 -3
- package/dist/client/MobileLayout-JelB6w1G.js +118 -0
- package/dist/client/{PopUp-BsYLvWch.js → PopUp-CgpvNr3o.js} +2 -3
- package/dist/client/{ProcessList-C2xsLU2_.js → ProcessList-vecpxThi.js} +17 -10
- package/dist/client/{VImg-OHe8YTs2.js → VImg-CETuikH2.js} +200 -5
- package/dist/client/{VMain-PryTLU4a.js → VMain-Ci9DyaGU.js} +1 -1
- package/dist/client/{VTooltip-DZ0fjpB3.js → VTooltip-J4ac48X7.js} +2 -3
- package/dist/client/{WidgetsContainer-B9LBadcC.js → WidgetsContainer-CCML4TyV.js} +1 -1
- package/dist/client/{asWebComponent-By_7_JjS.js → asWebComponent-ZyEzWOOf.js} +59 -160
- package/dist/client/{async-DkSu_u2K.js → async-B7jIrM53.js} +69 -5
- package/dist/client/eo-dash.js +1 -1
- package/dist/client/{VOverlay-yUn7p-Uf.js → forwardRefs-BQclvjMq.js} +272 -5
- package/dist/client/{handling-CgmFXkW6.js → handling-BS24aG1q.js} +20 -5
- package/dist/client/{helpers-Dy0Q13tP.js → helpers-wXK7Ywio.js} +24 -2
- package/dist/client/{index-skjhlH8u.js → index-4UCzZi8B.js} +5 -5
- package/dist/client/{index-Dqj4tbx2.js → index-9KR-G20t.js} +2 -2
- package/dist/client/{index-Ch_HchK3.js → index-B2XpdgR6.js} +191 -57
- package/dist/client/material-symbols-outlined.woff2 +0 -0
- package/dist/client/material-symbols-rounded.woff2 +0 -0
- package/dist/client/material-symbols-sharp.woff2 +0 -0
- package/dist/client/material-symbols-subset.woff2 +0 -0
- package/dist/client/templates.js +27 -37
- package/dist/client/{transition-C98Yn4Vo.js → transition-yBii4fu6.js} +1 -1
- package/dist/node/cli.js +1 -1
- package/dist/types/core/client/eodashSTAC/helpers.d.ts +5 -0
- package/dist/types/core/client/types.d.ts +1 -1
- package/dist/types/templates/compare.d.ts +0 -25
- package/dist/types/templates/expert.d.ts +16 -20
- package/dist/types/templates/light.d.ts +9 -0
- package/dist/types/widgets/{EodashMapBtns.vue.d.ts → EodashMap/EodashMapBtns.vue.d.ts} +4 -0
- package/dist/types/widgets/EodashMap/index.vue.d.ts +8 -0
- package/dist/types/widgets/EodashProcess/methods/async.d.ts +1 -0
- package/package.json +4 -2
- package/templates/compare.js +0 -20
- package/templates/expert.js +16 -15
- package/templates/light.js +10 -1
- package/widgets/EodashMap/EodashMapBtns.vue +269 -0
- package/widgets/EodashMap/index.vue +252 -37
- package/widgets/EodashProcess/ProcessList.vue +13 -1
- package/widgets/EodashProcess/methods/async.js +22 -1
- package/widgets/EodashProcess/methods/custom-endpoints/chart/veda-endpoint.js +19 -3
- package/widgets/EodashProcess/methods/utils.js +45 -1
- package/dist/client/EodashMapBtns-WoGq8MuV.js +0 -173
- package/dist/client/MobileLayout-EKQ_kpSh.js +0 -1226
- package/dist/client/forwardRefs-BXxrv98s.js +0 -272
- package/dist/client/index-BuhOHXKv.js +0 -199
- package/widgets/EodashMapBtns.vue +0 -155
|
@@ -1,272 +0,0 @@
|
|
|
1
|
-
import { shallowRef, toRef, watch } from 'vue';
|
|
2
|
-
import { p as propsFactory, au as getCurrentInstance } from './asWebComponent-By_7_JjS.js';
|
|
3
|
-
|
|
4
|
-
class Box {
|
|
5
|
-
constructor(_ref) {
|
|
6
|
-
let {
|
|
7
|
-
x,
|
|
8
|
-
y,
|
|
9
|
-
width,
|
|
10
|
-
height
|
|
11
|
-
} = _ref;
|
|
12
|
-
this.x = x;
|
|
13
|
-
this.y = y;
|
|
14
|
-
this.width = width;
|
|
15
|
-
this.height = height;
|
|
16
|
-
}
|
|
17
|
-
get top() {
|
|
18
|
-
return this.y;
|
|
19
|
-
}
|
|
20
|
-
get bottom() {
|
|
21
|
-
return this.y + this.height;
|
|
22
|
-
}
|
|
23
|
-
get left() {
|
|
24
|
-
return this.x;
|
|
25
|
-
}
|
|
26
|
-
get right() {
|
|
27
|
-
return this.x + this.width;
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
function getOverflow(a, b) {
|
|
31
|
-
return {
|
|
32
|
-
x: {
|
|
33
|
-
before: Math.max(0, b.left - a.left),
|
|
34
|
-
after: Math.max(0, a.right - b.right)
|
|
35
|
-
},
|
|
36
|
-
y: {
|
|
37
|
-
before: Math.max(0, b.top - a.top),
|
|
38
|
-
after: Math.max(0, a.bottom - b.bottom)
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
}
|
|
42
|
-
function getTargetBox(target) {
|
|
43
|
-
if (Array.isArray(target)) {
|
|
44
|
-
return new Box({
|
|
45
|
-
x: target[0],
|
|
46
|
-
y: target[1],
|
|
47
|
-
width: 0,
|
|
48
|
-
height: 0
|
|
49
|
-
});
|
|
50
|
-
} else {
|
|
51
|
-
return target.getBoundingClientRect();
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
function getElementBox(el) {
|
|
55
|
-
if (el === document.documentElement) {
|
|
56
|
-
if (!visualViewport) {
|
|
57
|
-
return new Box({
|
|
58
|
-
x: 0,
|
|
59
|
-
y: 0,
|
|
60
|
-
width: document.documentElement.clientWidth,
|
|
61
|
-
height: document.documentElement.clientHeight
|
|
62
|
-
});
|
|
63
|
-
} else {
|
|
64
|
-
return new Box({
|
|
65
|
-
x: visualViewport.scale > 1 ? 0 : visualViewport.offsetLeft,
|
|
66
|
-
y: visualViewport.scale > 1 ? 0 : visualViewport.offsetTop,
|
|
67
|
-
width: visualViewport.width * visualViewport.scale,
|
|
68
|
-
height: visualViewport.height * visualViewport.scale
|
|
69
|
-
});
|
|
70
|
-
}
|
|
71
|
-
} else {
|
|
72
|
-
const rect = el.getBoundingClientRect();
|
|
73
|
-
return new Box({
|
|
74
|
-
x: rect.x,
|
|
75
|
-
y: rect.y,
|
|
76
|
-
width: el.clientWidth,
|
|
77
|
-
height: el.clientHeight
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
// Utilities
|
|
83
|
-
/** @see https://stackoverflow.com/a/57876601/2074736 */
|
|
84
|
-
function nullifyTransforms(el) {
|
|
85
|
-
const rect = el.getBoundingClientRect();
|
|
86
|
-
const style = getComputedStyle(el);
|
|
87
|
-
const tx = style.transform;
|
|
88
|
-
if (tx) {
|
|
89
|
-
let ta, sx, sy, dx, dy;
|
|
90
|
-
if (tx.startsWith('matrix3d(')) {
|
|
91
|
-
ta = tx.slice(9, -1).split(/, /);
|
|
92
|
-
sx = Number(ta[0]);
|
|
93
|
-
sy = Number(ta[5]);
|
|
94
|
-
dx = Number(ta[12]);
|
|
95
|
-
dy = Number(ta[13]);
|
|
96
|
-
} else if (tx.startsWith('matrix(')) {
|
|
97
|
-
ta = tx.slice(7, -1).split(/, /);
|
|
98
|
-
sx = Number(ta[0]);
|
|
99
|
-
sy = Number(ta[3]);
|
|
100
|
-
dx = Number(ta[4]);
|
|
101
|
-
dy = Number(ta[5]);
|
|
102
|
-
} else {
|
|
103
|
-
return new Box(rect);
|
|
104
|
-
}
|
|
105
|
-
const to = style.transformOrigin;
|
|
106
|
-
const x = rect.x - dx - (1 - sx) * parseFloat(to);
|
|
107
|
-
const y = rect.y - dy - (1 - sy) * parseFloat(to.slice(to.indexOf(' ') + 1));
|
|
108
|
-
const w = sx ? rect.width / sx : el.offsetWidth + 1;
|
|
109
|
-
const h = sy ? rect.height / sy : el.offsetHeight + 1;
|
|
110
|
-
return new Box({
|
|
111
|
-
x,
|
|
112
|
-
y,
|
|
113
|
-
width: w,
|
|
114
|
-
height: h
|
|
115
|
-
});
|
|
116
|
-
} else {
|
|
117
|
-
return new Box(rect);
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
function animate(el, keyframes, options) {
|
|
121
|
-
if (typeof el.animate === 'undefined') return {
|
|
122
|
-
finished: Promise.resolve()
|
|
123
|
-
};
|
|
124
|
-
let animation;
|
|
125
|
-
try {
|
|
126
|
-
animation = el.animate(keyframes, options);
|
|
127
|
-
} catch (err) {
|
|
128
|
-
return {
|
|
129
|
-
finished: Promise.resolve()
|
|
130
|
-
};
|
|
131
|
-
}
|
|
132
|
-
if (typeof animation.finished === 'undefined') {
|
|
133
|
-
animation.finished = new Promise(resolve => {
|
|
134
|
-
animation.onfinish = () => {
|
|
135
|
-
resolve(animation);
|
|
136
|
-
};
|
|
137
|
-
});
|
|
138
|
-
}
|
|
139
|
-
return animation;
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
const standardEasing = 'cubic-bezier(0.4, 0, 0.2, 1)';
|
|
143
|
-
const deceleratedEasing = 'cubic-bezier(0.0, 0, 0.2, 1)'; // Entering
|
|
144
|
-
const acceleratedEasing = 'cubic-bezier(0.4, 0, 1, 1)'; // Leaving
|
|
145
|
-
|
|
146
|
-
// Utilities
|
|
147
|
-
const makeLazyProps = propsFactory({
|
|
148
|
-
eager: Boolean
|
|
149
|
-
}, 'lazy');
|
|
150
|
-
function useLazy(props, active) {
|
|
151
|
-
const isBooted = shallowRef(false);
|
|
152
|
-
const hasContent = toRef(() => isBooted.value || props.eager || active.value);
|
|
153
|
-
watch(active, () => isBooted.value = true);
|
|
154
|
-
function onAfterLeave() {
|
|
155
|
-
if (!props.eager) isBooted.value = false;
|
|
156
|
-
}
|
|
157
|
-
return {
|
|
158
|
-
isBooted,
|
|
159
|
-
hasContent,
|
|
160
|
-
onAfterLeave
|
|
161
|
-
};
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
// Utilities
|
|
165
|
-
function useScopeId() {
|
|
166
|
-
const vm = getCurrentInstance('useScopeId');
|
|
167
|
-
const scopeId = vm.vnode.scopeId;
|
|
168
|
-
return {
|
|
169
|
-
scopeId: scopeId ? {
|
|
170
|
-
[scopeId]: ''
|
|
171
|
-
} : undefined
|
|
172
|
-
};
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
// Types
|
|
176
|
-
|
|
177
|
-
const Refs = Symbol('Forwarded refs');
|
|
178
|
-
|
|
179
|
-
/** Omit properties starting with P */
|
|
180
|
-
|
|
181
|
-
/** Omit keyof $props from T */
|
|
182
|
-
|
|
183
|
-
function getDescriptor(obj, key) {
|
|
184
|
-
let currentObj = obj;
|
|
185
|
-
while (currentObj) {
|
|
186
|
-
const descriptor = Reflect.getOwnPropertyDescriptor(currentObj, key);
|
|
187
|
-
if (descriptor) return descriptor;
|
|
188
|
-
currentObj = Object.getPrototypeOf(currentObj);
|
|
189
|
-
}
|
|
190
|
-
return undefined;
|
|
191
|
-
}
|
|
192
|
-
function forwardRefs(target) {
|
|
193
|
-
for (var _len = arguments.length, refs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
194
|
-
refs[_key - 1] = arguments[_key];
|
|
195
|
-
}
|
|
196
|
-
target[Refs] = refs;
|
|
197
|
-
return new Proxy(target, {
|
|
198
|
-
get(target, key) {
|
|
199
|
-
if (Reflect.has(target, key)) {
|
|
200
|
-
return Reflect.get(target, key);
|
|
201
|
-
}
|
|
202
|
-
|
|
203
|
-
// Skip internal properties
|
|
204
|
-
if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return;
|
|
205
|
-
for (const ref of refs) {
|
|
206
|
-
if (ref.value && Reflect.has(ref.value, key)) {
|
|
207
|
-
const val = Reflect.get(ref.value, key);
|
|
208
|
-
return typeof val === 'function' ? val.bind(ref.value) : val;
|
|
209
|
-
}
|
|
210
|
-
}
|
|
211
|
-
},
|
|
212
|
-
has(target, key) {
|
|
213
|
-
if (Reflect.has(target, key)) {
|
|
214
|
-
return true;
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
// Skip internal properties
|
|
218
|
-
if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return false;
|
|
219
|
-
for (const ref of refs) {
|
|
220
|
-
if (ref.value && Reflect.has(ref.value, key)) {
|
|
221
|
-
return true;
|
|
222
|
-
}
|
|
223
|
-
}
|
|
224
|
-
return false;
|
|
225
|
-
},
|
|
226
|
-
set(target, key, value) {
|
|
227
|
-
if (Reflect.has(target, key)) {
|
|
228
|
-
return Reflect.set(target, key, value);
|
|
229
|
-
}
|
|
230
|
-
|
|
231
|
-
// Skip internal properties
|
|
232
|
-
if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return false;
|
|
233
|
-
for (const ref of refs) {
|
|
234
|
-
if (ref.value && Reflect.has(ref.value, key)) {
|
|
235
|
-
return Reflect.set(ref.value, key, value);
|
|
236
|
-
}
|
|
237
|
-
}
|
|
238
|
-
return false;
|
|
239
|
-
},
|
|
240
|
-
getOwnPropertyDescriptor(target, key) {
|
|
241
|
-
const descriptor = Reflect.getOwnPropertyDescriptor(target, key);
|
|
242
|
-
if (descriptor) return descriptor;
|
|
243
|
-
|
|
244
|
-
// Skip internal properties
|
|
245
|
-
if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return;
|
|
246
|
-
|
|
247
|
-
// Check each ref's own properties
|
|
248
|
-
for (const ref of refs) {
|
|
249
|
-
if (!ref.value) continue;
|
|
250
|
-
const descriptor = getDescriptor(ref.value, key) ?? ('_' in ref.value ? getDescriptor(ref.value._?.setupState, key) : undefined);
|
|
251
|
-
if (descriptor) return descriptor;
|
|
252
|
-
}
|
|
253
|
-
|
|
254
|
-
// Recursive search up each ref's prototype
|
|
255
|
-
for (const ref of refs) {
|
|
256
|
-
const childRefs = ref.value && ref.value[Refs];
|
|
257
|
-
if (!childRefs) continue;
|
|
258
|
-
const queue = childRefs.slice();
|
|
259
|
-
while (queue.length) {
|
|
260
|
-
const ref = queue.shift();
|
|
261
|
-
const descriptor = getDescriptor(ref.value, key);
|
|
262
|
-
if (descriptor) return descriptor;
|
|
263
|
-
const childRefs = ref.value && ref.value[Refs];
|
|
264
|
-
if (childRefs) queue.push(...childRefs);
|
|
265
|
-
}
|
|
266
|
-
}
|
|
267
|
-
return undefined;
|
|
268
|
-
}
|
|
269
|
-
});
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
export { Box as B, animate as a, useScopeId as b, acceleratedEasing as c, deceleratedEasing as d, getElementBox as e, forwardRefs as f, getTargetBox as g, getOverflow as h, makeLazyProps as m, nullifyTransforms as n, standardEasing as s, useLazy as u };
|
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
import { h, TransitionGroup, Transition, camelize } from 'vue';
|
|
2
|
-
import { g as genericComponent, p as propsFactory } from './asWebComponent-By_7_JjS.js';
|
|
3
|
-
|
|
4
|
-
// Utilities
|
|
5
|
-
const makeTransitionProps = propsFactory({
|
|
6
|
-
disabled: Boolean,
|
|
7
|
-
group: Boolean,
|
|
8
|
-
hideOnLeave: Boolean,
|
|
9
|
-
leaveAbsolute: Boolean,
|
|
10
|
-
mode: String,
|
|
11
|
-
origin: String
|
|
12
|
-
}, 'transition');
|
|
13
|
-
function createCssTransition(name, origin, mode) {
|
|
14
|
-
return genericComponent()({
|
|
15
|
-
name,
|
|
16
|
-
props: makeTransitionProps({
|
|
17
|
-
mode,
|
|
18
|
-
origin
|
|
19
|
-
}),
|
|
20
|
-
setup(props, _ref) {
|
|
21
|
-
let {
|
|
22
|
-
slots
|
|
23
|
-
} = _ref;
|
|
24
|
-
const functions = {
|
|
25
|
-
onBeforeEnter(el) {
|
|
26
|
-
if (props.origin) {
|
|
27
|
-
el.style.transformOrigin = props.origin;
|
|
28
|
-
}
|
|
29
|
-
},
|
|
30
|
-
onLeave(el) {
|
|
31
|
-
if (props.leaveAbsolute) {
|
|
32
|
-
const {
|
|
33
|
-
offsetTop,
|
|
34
|
-
offsetLeft,
|
|
35
|
-
offsetWidth,
|
|
36
|
-
offsetHeight
|
|
37
|
-
} = el;
|
|
38
|
-
el._transitionInitialStyles = {
|
|
39
|
-
position: el.style.position,
|
|
40
|
-
top: el.style.top,
|
|
41
|
-
left: el.style.left,
|
|
42
|
-
width: el.style.width,
|
|
43
|
-
height: el.style.height
|
|
44
|
-
};
|
|
45
|
-
el.style.position = 'absolute';
|
|
46
|
-
el.style.top = `${offsetTop}px`;
|
|
47
|
-
el.style.left = `${offsetLeft}px`;
|
|
48
|
-
el.style.width = `${offsetWidth}px`;
|
|
49
|
-
el.style.height = `${offsetHeight}px`;
|
|
50
|
-
}
|
|
51
|
-
if (props.hideOnLeave) {
|
|
52
|
-
el.style.setProperty('display', 'none', 'important');
|
|
53
|
-
}
|
|
54
|
-
},
|
|
55
|
-
onAfterLeave(el) {
|
|
56
|
-
if (props.leaveAbsolute && el?._transitionInitialStyles) {
|
|
57
|
-
const {
|
|
58
|
-
position,
|
|
59
|
-
top,
|
|
60
|
-
left,
|
|
61
|
-
width,
|
|
62
|
-
height
|
|
63
|
-
} = el._transitionInitialStyles;
|
|
64
|
-
delete el._transitionInitialStyles;
|
|
65
|
-
el.style.position = position || '';
|
|
66
|
-
el.style.top = top || '';
|
|
67
|
-
el.style.left = left || '';
|
|
68
|
-
el.style.width = width || '';
|
|
69
|
-
el.style.height = height || '';
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
};
|
|
73
|
-
return () => {
|
|
74
|
-
const tag = props.group ? TransitionGroup : Transition;
|
|
75
|
-
return h(tag, {
|
|
76
|
-
name: props.disabled ? '' : name,
|
|
77
|
-
css: !props.disabled,
|
|
78
|
-
...(props.group ? undefined : {
|
|
79
|
-
mode: props.mode
|
|
80
|
-
}),
|
|
81
|
-
...(props.disabled ? {} : functions)
|
|
82
|
-
}, slots.default);
|
|
83
|
-
};
|
|
84
|
-
}
|
|
85
|
-
});
|
|
86
|
-
}
|
|
87
|
-
function createJavascriptTransition(name, functions) {
|
|
88
|
-
let mode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'in-out';
|
|
89
|
-
return genericComponent()({
|
|
90
|
-
name,
|
|
91
|
-
props: {
|
|
92
|
-
mode: {
|
|
93
|
-
type: String,
|
|
94
|
-
default: mode
|
|
95
|
-
},
|
|
96
|
-
disabled: Boolean,
|
|
97
|
-
group: Boolean
|
|
98
|
-
},
|
|
99
|
-
setup(props, _ref2) {
|
|
100
|
-
let {
|
|
101
|
-
slots
|
|
102
|
-
} = _ref2;
|
|
103
|
-
const tag = props.group ? TransitionGroup : Transition;
|
|
104
|
-
return () => {
|
|
105
|
-
return h(tag, {
|
|
106
|
-
name: props.disabled ? '' : name,
|
|
107
|
-
css: !props.disabled,
|
|
108
|
-
// mode: props.mode, // TODO: vuejs/vue-next#3104
|
|
109
|
-
...(props.disabled ? {} : functions)
|
|
110
|
-
}, slots.default);
|
|
111
|
-
};
|
|
112
|
-
}
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
// Utilities
|
|
117
|
-
function ExpandTransitionGenerator () {
|
|
118
|
-
let expandedParentClass = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
119
|
-
let x = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
120
|
-
const sizeProperty = x ? 'width' : 'height';
|
|
121
|
-
const offsetProperty = camelize(`offset-${sizeProperty}`);
|
|
122
|
-
return {
|
|
123
|
-
onBeforeEnter(el) {
|
|
124
|
-
el._parent = el.parentNode;
|
|
125
|
-
el._initialStyle = {
|
|
126
|
-
transition: el.style.transition,
|
|
127
|
-
overflow: el.style.overflow,
|
|
128
|
-
[sizeProperty]: el.style[sizeProperty]
|
|
129
|
-
};
|
|
130
|
-
},
|
|
131
|
-
onEnter(el) {
|
|
132
|
-
const initialStyle = el._initialStyle;
|
|
133
|
-
if (!initialStyle) return;
|
|
134
|
-
el.style.setProperty('transition', 'none', 'important');
|
|
135
|
-
// Hide overflow to account for collapsed margins in the calculated height
|
|
136
|
-
el.style.overflow = 'hidden';
|
|
137
|
-
const offset = `${el[offsetProperty]}px`;
|
|
138
|
-
el.style[sizeProperty] = '0';
|
|
139
|
-
|
|
140
|
-
el.style.transition = initialStyle.transition;
|
|
141
|
-
if (expandedParentClass && el._parent) {
|
|
142
|
-
el._parent.classList.add(expandedParentClass);
|
|
143
|
-
}
|
|
144
|
-
requestAnimationFrame(() => {
|
|
145
|
-
el.style[sizeProperty] = offset;
|
|
146
|
-
});
|
|
147
|
-
},
|
|
148
|
-
onAfterEnter: resetStyles,
|
|
149
|
-
onEnterCancelled: resetStyles,
|
|
150
|
-
onLeave(el) {
|
|
151
|
-
el._initialStyle = {
|
|
152
|
-
transition: '',
|
|
153
|
-
overflow: el.style.overflow,
|
|
154
|
-
[sizeProperty]: el.style[sizeProperty]
|
|
155
|
-
};
|
|
156
|
-
el.style.overflow = 'hidden';
|
|
157
|
-
el.style[sizeProperty] = `${el[offsetProperty]}px`;
|
|
158
|
-
|
|
159
|
-
requestAnimationFrame(() => el.style[sizeProperty] = '0');
|
|
160
|
-
},
|
|
161
|
-
onAfterLeave,
|
|
162
|
-
onLeaveCancelled: onAfterLeave
|
|
163
|
-
};
|
|
164
|
-
function onAfterLeave(el) {
|
|
165
|
-
if (expandedParentClass && el._parent) {
|
|
166
|
-
el._parent.classList.remove(expandedParentClass);
|
|
167
|
-
}
|
|
168
|
-
resetStyles(el);
|
|
169
|
-
}
|
|
170
|
-
function resetStyles(el) {
|
|
171
|
-
if (!el._initialStyle) return;
|
|
172
|
-
const size = el._initialStyle[sizeProperty];
|
|
173
|
-
el.style.overflow = el._initialStyle.overflow;
|
|
174
|
-
if (size != null) el.style[sizeProperty] = size;
|
|
175
|
-
delete el._initialStyle;
|
|
176
|
-
}
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
createCssTransition('fab-transition', 'center center', 'out-in');
|
|
180
|
-
|
|
181
|
-
// Generic transitions
|
|
182
|
-
createCssTransition('dialog-bottom-transition');
|
|
183
|
-
createCssTransition('dialog-top-transition');
|
|
184
|
-
const VFadeTransition = createCssTransition('fade-transition');
|
|
185
|
-
createCssTransition('scale-transition');
|
|
186
|
-
createCssTransition('scroll-x-transition');
|
|
187
|
-
createCssTransition('scroll-x-reverse-transition');
|
|
188
|
-
createCssTransition('scroll-y-transition');
|
|
189
|
-
createCssTransition('scroll-y-reverse-transition');
|
|
190
|
-
createCssTransition('slide-x-transition');
|
|
191
|
-
createCssTransition('slide-x-reverse-transition');
|
|
192
|
-
createCssTransition('slide-y-transition');
|
|
193
|
-
createCssTransition('slide-y-reverse-transition');
|
|
194
|
-
|
|
195
|
-
// Javascript transitions
|
|
196
|
-
const VExpandTransition = createJavascriptTransition('expand-transition', ExpandTransitionGenerator());
|
|
197
|
-
createJavascriptTransition('expand-x-transition', ExpandTransitionGenerator('', true));
|
|
198
|
-
|
|
199
|
-
export { VFadeTransition as V, VExpandTransition as a };
|
|
@@ -1,155 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div ref="rootRef" class="d-flex flex-column align-end">
|
|
3
|
-
<v-btn
|
|
4
|
-
v-if="exportMap"
|
|
5
|
-
class="map-btn"
|
|
6
|
-
:icon="[mdiMapPlus]"
|
|
7
|
-
size="small"
|
|
8
|
-
v-tooltip:bottom="'Extract Storytelling configuration'"
|
|
9
|
-
@click="showMapState = !showMapState"
|
|
10
|
-
/>
|
|
11
|
-
<ExportState v-if="exportMap" v-model="showMapState" />
|
|
12
|
-
|
|
13
|
-
<v-btn
|
|
14
|
-
class="map-btn"
|
|
15
|
-
:icon="[mdiEarthBox]"
|
|
16
|
-
size="small"
|
|
17
|
-
v-tooltip:bottom="'Change map projection'"
|
|
18
|
-
v-if="changeProjection && !!availableMapProjection"
|
|
19
|
-
@click="changeMapProjection(availableMapProjection)"
|
|
20
|
-
/>
|
|
21
|
-
<v-btn
|
|
22
|
-
class="map-btn"
|
|
23
|
-
:icon="[compareIcon]"
|
|
24
|
-
size="small"
|
|
25
|
-
v-tooltip:bottom="'Compare mode'"
|
|
26
|
-
v-if="compareIndicators"
|
|
27
|
-
@click="onCompareClick"
|
|
28
|
-
/>
|
|
29
|
-
<v-btn
|
|
30
|
-
class="map-btn"
|
|
31
|
-
:icon="[mdiStarFourPointsCircleOutline]"
|
|
32
|
-
size="small"
|
|
33
|
-
v-tooltip:bottom="'back to POIs'"
|
|
34
|
-
v-if="backToPOIs && (poi || comparePoi)"
|
|
35
|
-
@click="loadPOiIndicator()"
|
|
36
|
-
/>
|
|
37
|
-
<PopUp
|
|
38
|
-
v-model="showCompareIndicators"
|
|
39
|
-
:maxWidth="popupWidth"
|
|
40
|
-
:width="popupWidth"
|
|
41
|
-
:max-height="popupHeight"
|
|
42
|
-
:height="popupHeight"
|
|
43
|
-
>
|
|
44
|
-
<EodashItemFilter
|
|
45
|
-
:enableCompare="true"
|
|
46
|
-
:enableHighlighting="false"
|
|
47
|
-
resultType="cards"
|
|
48
|
-
style="--select-filter-max-items: 8"
|
|
49
|
-
filters-title="Select an indicator to compare"
|
|
50
|
-
subTitleProperty="subtitle"
|
|
51
|
-
imageProperty="thumbnail"
|
|
52
|
-
aggregateResults="collection_group"
|
|
53
|
-
results-title=""
|
|
54
|
-
@select="onSelectCompareIndicator"
|
|
55
|
-
/>
|
|
56
|
-
</PopUp>
|
|
57
|
-
</div>
|
|
58
|
-
</template>
|
|
59
|
-
<script setup>
|
|
60
|
-
import { useTransparentPanel } from "@/composables";
|
|
61
|
-
import { changeMapProjection, setActiveTemplate } from "@/store/actions";
|
|
62
|
-
import {
|
|
63
|
-
activeTemplate,
|
|
64
|
-
availableMapProjection,
|
|
65
|
-
comparePoi,
|
|
66
|
-
poi,
|
|
67
|
-
} from "@/store/states";
|
|
68
|
-
import {
|
|
69
|
-
mdiCompare,
|
|
70
|
-
mdiCompareRemove,
|
|
71
|
-
mdiEarthBox,
|
|
72
|
-
mdiMapPlus,
|
|
73
|
-
mdiStarFourPointsCircleOutline,
|
|
74
|
-
} from "@mdi/js";
|
|
75
|
-
import ExportState from "^/ExportState.vue";
|
|
76
|
-
import { computed, ref, triggerRef } from "vue";
|
|
77
|
-
import PopUp from "./PopUp.vue";
|
|
78
|
-
import EodashItemFilter from "./EodashItemFilter.vue";
|
|
79
|
-
import { useDisplay } from "vuetify";
|
|
80
|
-
import { useSTAcStore } from "@/store/stac";
|
|
81
|
-
import { storeToRefs } from "pinia";
|
|
82
|
-
import { loadPOiIndicator } from "./EodashProcess/methods/handling";
|
|
83
|
-
|
|
84
|
-
const { compareIndicators, changeProjection, exportMap, backToPOIs } =
|
|
85
|
-
defineProps({
|
|
86
|
-
exportMap: {
|
|
87
|
-
type: Boolean,
|
|
88
|
-
default: true,
|
|
89
|
-
},
|
|
90
|
-
changeProjection: {
|
|
91
|
-
type: Boolean,
|
|
92
|
-
default: true,
|
|
93
|
-
},
|
|
94
|
-
compareIndicators: {
|
|
95
|
-
/** @type {import("vue").PropType<boolean | {compareTemplate?:string;fallbackTemplate?:string}> }*/
|
|
96
|
-
type: [Boolean, Object],
|
|
97
|
-
default: true,
|
|
98
|
-
},
|
|
99
|
-
backToPOIs: {
|
|
100
|
-
type: Boolean,
|
|
101
|
-
default: true,
|
|
102
|
-
},
|
|
103
|
-
});
|
|
104
|
-
const { selectedStac, selectedCompareStac } = storeToRefs(useSTAcStore());
|
|
105
|
-
const { resetSelectedCompareSTAC } = useSTAcStore();
|
|
106
|
-
const { smAndDown } = useDisplay();
|
|
107
|
-
const popupWidth = computed(() => (smAndDown.value ? "80%" : "70%"));
|
|
108
|
-
const popupHeight = computed(() => (smAndDown.value ? "90%" : "70%"));
|
|
109
|
-
|
|
110
|
-
const showMapState = ref(false);
|
|
111
|
-
const showCompareIndicators = ref(false);
|
|
112
|
-
const compareIcon = computed(() =>
|
|
113
|
-
activeTemplate.value ===
|
|
114
|
-
((typeof compareIndicators === "object" &&
|
|
115
|
-
compareIndicators?.compareTemplate) ||
|
|
116
|
-
"compare")
|
|
117
|
-
? mdiCompareRemove
|
|
118
|
-
: mdiCompare,
|
|
119
|
-
);
|
|
120
|
-
|
|
121
|
-
const onCompareClick = () => {
|
|
122
|
-
showCompareIndicators.value = !showCompareIndicators.value;
|
|
123
|
-
|
|
124
|
-
const fallbackTemplate =
|
|
125
|
-
(typeof compareIndicators === "object" &&
|
|
126
|
-
compareIndicators.fallbackTemplate) ||
|
|
127
|
-
"expert";
|
|
128
|
-
selectedCompareStac.value = null;
|
|
129
|
-
resetSelectedCompareSTAC();
|
|
130
|
-
setActiveTemplate(fallbackTemplate);
|
|
131
|
-
triggerRef(selectedStac);
|
|
132
|
-
};
|
|
133
|
-
|
|
134
|
-
/** @type {import("vue").Ref<HTMLDivElement|null>} */
|
|
135
|
-
const rootRef = ref(null);
|
|
136
|
-
|
|
137
|
-
const onSelectCompareIndicator = () => {
|
|
138
|
-
const compareTemplate =
|
|
139
|
-
(typeof compareIndicators === "object" &&
|
|
140
|
-
compareIndicators.compareTemplate) ||
|
|
141
|
-
"compare";
|
|
142
|
-
setActiveTemplate(compareTemplate);
|
|
143
|
-
showCompareIndicators.value = !showCompareIndicators.value;
|
|
144
|
-
};
|
|
145
|
-
|
|
146
|
-
useTransparentPanel(rootRef);
|
|
147
|
-
</script>
|
|
148
|
-
<style scoped>
|
|
149
|
-
.map-btn {
|
|
150
|
-
width: 36px;
|
|
151
|
-
height: 36px;
|
|
152
|
-
border-radius: 25%;
|
|
153
|
-
margin: 4px;
|
|
154
|
-
}
|
|
155
|
-
</style>
|