@eeacms/volto-arcgis-block 0.1.240 → 0.1.242

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 (14) hide show
  1. package/CHANGELOG.md +13 -1
  2. package/package.json +1 -1
  3. package/src/components/MapViewer/AreaWidget.jsx +10 -2
  4. package/src/components/MapViewer/BasemapWidget.jsx +6 -2
  5. package/src/components/MapViewer/BookmarkWidget.jsx +6 -2
  6. package/src/components/MapViewer/HotspotWidget.jsx +7 -3
  7. package/src/components/MapViewer/InfoWidget.jsx +6 -2
  8. package/src/components/MapViewer/LegendWidget.jsx +6 -2
  9. package/src/components/MapViewer/MeasurementWidget.jsx +6 -2
  10. package/src/components/MapViewer/MenuWidget.jsx +1 -1
  11. package/src/components/MapViewer/PrintWidget.jsx +6 -2
  12. package/src/components/MapViewer/SwipeWidget.jsx +6 -2
  13. package/src/components/MapViewer/TimesliderWidget.jsx +48 -0
  14. package/src/components/MapViewer/css/ArcgisMap.css +13 -0
package/CHANGELOG.md CHANGED
@@ -4,7 +4,19 @@ All notable changes to this project will be documented in this file. Dates are d
4
4
 
5
5
  Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
6
6
 
7
- ### [0.1.240](https://github.com/eea/volto-arcgis-block/compare/0.1.239...0.1.240) - 28 November 2023
7
+ ### [0.1.242](https://github.com/eea/volto-arcgis-block/compare/0.1.241...0.1.242) - 12 December 2023
8
+
9
+ #### :hammer_and_wrench: Others
10
+
11
+ - CLMS-2590-CLMS-2871 (Bug): Hotfix [Urkorue - [`54a1eaa`](https://github.com/eea/volto-arcgis-block/commit/54a1eaafc752542bd04a0b891a38e5ddcdd3458a)]
12
+ - CLMS-2590-CLMS-2871 (Bug): Lint [Urkorue - [`7058edf`](https://github.com/eea/volto-arcgis-block/commit/7058edf7116d1bea7fbf0c3f068dbf73da01380d)]
13
+ - CLMS-2590-CLMS-2871 (Bug): Menu reopening whith function keys solved and calendar added to timeslider [Urkorue - [`55167a4`](https://github.com/eea/volto-arcgis-block/commit/55167a41366eab3797c5525baff99d6c4f070dc6)]
14
+ ### [0.1.241](https://github.com/eea/volto-arcgis-block/compare/0.1.240...0.1.241) - 29 November 2023
15
+
16
+ #### :hammer_and_wrench: Others
17
+
18
+ - Merge pull request #667 from eea/develop [Unai Bolivar - [`24cff87`](https://github.com/eea/volto-arcgis-block/commit/24cff8748366f325c452e3059438253b3eb92cac)]
19
+ ### [0.1.240](https://github.com/eea/volto-arcgis-block/compare/0.1.239...0.1.240) - 29 November 2023
8
20
 
9
21
  ### [0.1.239](https://github.com/eea/volto-arcgis-block/compare/0.1.238...0.1.239) - 23 November 2023
10
22
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eeacms/volto-arcgis-block",
3
- "version": "0.1.240",
3
+ "version": "0.1.242",
4
4
  "description": "volto-arcgis-block: Volto add-on",
5
5
  "main": "src/index.js",
6
6
  "author": "European Environment Agency: CodeSyntax",
package/src/components/MapViewer/AreaWidget.jsx CHANGED
@@ -454,7 +454,11 @@ class AreaWidget extends React.Component {
454
454
  aria-label="Area selection"
455
455
  onClick={this.openMenu.bind(this)}
456
456
  onKeyDown={(e) => {
457
- if (!e.altKey && e.code !== 'Tab') {
457
+ if (
458
+ !e.altKey &&
459
+ e.code !== 'Tab' &&
460
+ !e.code.startsWith('F')
461
+ ) {
458
462
  this.openMenu(this);
459
463
  }
460
464
  }}
@@ -471,7 +475,11 @@ class AreaWidget extends React.Component {
471
475
  className="map-menu-icon esri-icon-close"
472
476
  onClick={this.openMenu.bind(this)}
473
477
  onKeyDown={(e) => {
474
- if (!e.altKey && e.code !== 'Tab') {
478
+ if (
479
+ !e.altKey &&
480
+ e.code !== 'Tab' &&
481
+ !e.code.startsWith('F')
482
+ ) {
475
483
  this.openMenu(this);
476
484
  }
477
485
  }}
package/src/components/MapViewer/BasemapWidget.jsx CHANGED
@@ -261,7 +261,7 @@ class BasemapWidget extends React.Component {
261
261
  aria-label="Basemap gallery"
262
262
  onClick={this.openMenu.bind(this)}
263
263
  onKeyDown={(e) => {
264
- if (!e.altKey && e.code !== 'Tab') {
264
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
265
265
  this.openMenu(this);
266
266
  }
267
267
  }}
@@ -276,7 +276,11 @@ class BasemapWidget extends React.Component {
276
276
  className="map-menu-icon esri-icon-close"
277
277
  onClick={this.openMenu.bind(this)}
278
278
  onKeyDown={(e) => {
279
- if (!e.altKey && e.code !== 'Tab') {
279
+ if (
280
+ !e.altKey &&
281
+ e.code !== 'Tab' &&
282
+ !e.code.startsWith('F')
283
+ ) {
280
284
  this.openMenu(this);
281
285
  }
282
286
  }}
package/src/components/MapViewer/BookmarkWidget.jsx CHANGED
@@ -141,7 +141,7 @@ class BookmarkWidget extends React.Component {
141
141
  aria-label="Bookmark"
142
142
  onClick={this.openMenu.bind(this)}
143
143
  onKeyDown={(e) => {
144
- if (!e.altKey && e.code !== 'Tab') {
144
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
145
145
  this.openMenu(this);
146
146
  }
147
147
  }}
@@ -156,7 +156,11 @@ class BookmarkWidget extends React.Component {
156
156
  className="map-menu-icon esri-icon-close"
157
157
  onClick={this.openMenu.bind(this)}
158
158
  onKeyDown={(e) => {
159
- if (!e.altKey && e.code !== 'Tab') {
159
+ if (
160
+ !e.altKey &&
161
+ e.code !== 'Tab' &&
162
+ !e.code.startsWith('F')
163
+ ) {
160
164
  this.openMenu(this);
161
165
  }
162
166
  }}
package/src/components/MapViewer/HotspotWidget.jsx CHANGED
@@ -391,7 +391,7 @@ class HotspotWidget extends React.Component {
391
391
  getLayerParameters() {
392
392
  const url =
393
393
  window.location.href.replace(window.location.pathname.substring(3), '') +
394
- this.props.urls.klc_names;
394
+ this.props.urls.all_geo_klc;
395
395
  fetch(url)
396
396
  .then((data) => {
397
397
  if (data.status === 200) {
@@ -741,7 +741,7 @@ class HotspotWidget extends React.Component {
741
741
  aria-label="Hotspot"
742
742
  onClick={this.openMenu.bind(this)}
743
743
  onKeyDown={(e) => {
744
- if (!e.altKey && e.code !== 'Tab') {
744
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
745
745
  this.openMenu(this);
746
746
  }
747
747
  }}
@@ -756,7 +756,11 @@ class HotspotWidget extends React.Component {
756
756
  className="map-menu-icon esri-icon-close"
757
757
  onClick={this.openMenu.bind(this)}
758
758
  onKeyDown={(e) => {
759
- if (!e.altKey && e.code !== 'Tab') {
759
+ if (
760
+ !e.altKey &&
761
+ e.code !== 'Tab' &&
762
+ !e.code.startsWith('F')
763
+ ) {
760
764
  this.openMenu(this);
761
765
  }
762
766
  }}
package/src/components/MapViewer/InfoWidget.jsx CHANGED
@@ -941,7 +941,7 @@ class InfoWidget extends React.Component {
941
941
  aria-label="Layer info"
942
942
  onClick={this.openMenu.bind(this)}
943
943
  onKeyDown={(e) => {
944
- if (!e.altKey && e.code !== 'Tab') {
944
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
945
945
  this.openMenu(this);
946
946
  }
947
947
  }}
@@ -956,7 +956,11 @@ class InfoWidget extends React.Component {
956
956
  className="map-menu-icon esri-icon-close"
957
957
  onClick={this.openMenu.bind(this)}
958
958
  onKeyDown={(e) => {
959
- if (!e.altKey && e.code !== 'Tab') {
959
+ if (
960
+ !e.altKey &&
961
+ e.code !== 'Tab' &&
962
+ !e.code.startsWith('F')
963
+ ) {
960
964
  this.openMenu(this);
961
965
  }
962
966
  }}
package/src/components/MapViewer/LegendWidget.jsx CHANGED
@@ -302,7 +302,7 @@ class LegendWidget extends React.Component {
302
302
  aria-label="Legend"
303
303
  onClick={this.openMenu.bind(this)}
304
304
  onKeyDown={(e) => {
305
- if (!e.altKey && e.code !== 'Tab') {
305
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
306
306
  this.openMenu(this);
307
307
  }
308
308
  }}
@@ -317,7 +317,11 @@ class LegendWidget extends React.Component {
317
317
  className="map-menu-icon esri-icon-close"
318
318
  onClick={this.openMenu.bind(this)}
319
319
  onKeyDown={(e) => {
320
- if (!e.altKey && e.code !== 'Tab') {
320
+ if (
321
+ !e.altKey &&
322
+ e.code !== 'Tab' &&
323
+ !e.code.startsWith('F')
324
+ ) {
321
325
  this.openMenu(this);
322
326
  }
323
327
  }}
package/src/components/MapViewer/MeasurementWidget.jsx CHANGED
@@ -201,7 +201,7 @@ class MeasurementWidget extends React.Component {
201
201
  aria-label="Measurement"
202
202
  onClick={this.openMenu.bind(this)}
203
203
  onKeyDown={(e) => {
204
- if (!e.altKey && e.code !== 'Tab') {
204
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
205
205
  this.openMenu(this);
206
206
  }
207
207
  }}
@@ -216,7 +216,11 @@ class MeasurementWidget extends React.Component {
216
216
  className="map-menu-icon esri-icon-close"
217
217
  onClick={this.openMenu.bind(this)}
218
218
  onKeyDown={(e) => {
219
- if (!e.altKey && e.code !== 'Tab') {
219
+ if (
220
+ !e.altKey &&
221
+ e.code !== 'Tab' &&
222
+ !e.code.startsWith('F')
223
+ ) {
220
224
  this.openMenu(this);
221
225
  }
222
226
  }}
package/src/components/MapViewer/MenuWidget.jsx CHANGED
@@ -3838,7 +3838,7 @@ class MenuWidget extends React.Component {
3838
3838
  aria-label="Menu of products"
3839
3839
  onClick={this.openMenu.bind(this)}
3840
3840
  onKeyDown={(e) => {
3841
- if (!e.altKey && e.code !== 'Tab') {
3841
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
3842
3842
  this.openMenu(this);
3843
3843
  }
3844
3844
  }}
package/src/components/MapViewer/PrintWidget.jsx CHANGED
@@ -223,7 +223,7 @@ class PrintWidget extends React.Component {
223
223
  aria-label="Print"
224
224
  onClick={this.openMenu.bind(this)}
225
225
  onKeyDown={(e) => {
226
- if (!e.altKey && e.code !== 'Tab') {
226
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
227
227
  this.openMenu(this);
228
228
  }
229
229
  }}
@@ -238,7 +238,11 @@ class PrintWidget extends React.Component {
238
238
  className="map-menu-icon esri-icon-close"
239
239
  onClick={this.openMenu.bind(this)}
240
240
  onKeyDown={(e) => {
241
- if (!e.altKey && e.code !== 'Tab') {
241
+ if (
242
+ !e.altKey &&
243
+ e.code !== 'Tab' &&
244
+ !e.code.startsWith('F')
245
+ ) {
242
246
  this.openMenu(this);
243
247
  }
244
248
  }}
package/src/components/MapViewer/SwipeWidget.jsx CHANGED
@@ -324,7 +324,7 @@ class SwipeWidget extends React.Component {
324
324
  aria-label="Swipe"
325
325
  onClick={this.openMenu.bind(this)} //aqui deberían ir ocultar panel y mas abajo cerrar (pasar a 3d)
326
326
  onKeyDown={(e) => {
327
- if (!e.altKey && e.code !== 'Tab') {
327
+ if (!e.altKey && e.code !== 'Tab' && !e.code.startsWith('F')) {
328
328
  this.openMenu(this);
329
329
  }
330
330
  }}
@@ -340,7 +340,11 @@ class SwipeWidget extends React.Component {
340
340
  className="map-menu-icon esri-icon-close"
341
341
  onClick={this.openMenu.bind(this)}
342
342
  onKeyDown={(e) => {
343
- if (!e.altKey && e.code !== 'Tab') {
343
+ if (
344
+ !e.altKey &&
345
+ e.code !== 'Tab' &&
346
+ !e.code.startsWith('F')
347
+ ) {
344
348
  this.openMenu(this);
345
349
  }
346
350
  }}
package/src/components/MapViewer/TimesliderWidget.jsx CHANGED
@@ -1,5 +1,8 @@
1
1
  import React, { createRef } from 'react';
2
+ import DatePicker from 'react-datepicker';
2
3
  import { loadModules } from 'esri-loader';
4
+ import calendarSVG from '@plone/volto/icons/calendar.svg';
5
+ import { Icon } from '@plone/volto/components';
3
6
  import 'react-datepicker/dist/react-datepicker.css';
4
7
  var TimeSlider;
5
8
  var TimeExtent;
@@ -552,6 +555,30 @@ class TimesliderWidget extends React.Component {
552
555
  return new Date(date).toISOString().split('T')[0].toString();
553
556
  }
554
557
 
558
+ setDatepick(date) {
559
+ if (this.TimesliderWidget.fullTimeExtent.end < date) {
560
+ date = this.TimesliderWidget.fullTimeExtent.end;
561
+ }
562
+ if (this.TimesliderWidget.fullTimeExtent.start > date) {
563
+ date = this.TimesliderWidget.fullTimeExtent.start;
564
+ }
565
+ while (this.TimesliderWidget.timeExtent.end > date) {
566
+ this.TimesliderWidget.previous();
567
+ }
568
+ while (this.TimesliderWidget.timeExtent.end < date) {
569
+ this.TimesliderWidget.next();
570
+ }
571
+ }
572
+ openCalendar() {
573
+ if (
574
+ document.querySelector('.datepicker').style.display === 'inline-block'
575
+ ) {
576
+ document.querySelector('.datepicker').style.display = 'none';
577
+ } else {
578
+ document.querySelector('.datepicker').style.display = 'inline-block';
579
+ }
580
+ }
581
+
555
582
  /**
556
583
  * This method renders the component
557
584
  * @returns jsx
@@ -591,6 +618,27 @@ class TimesliderWidget extends React.Component {
591
618
  onDragStart={(e) => this.onDragStart(e)}
592
619
  style={this.state.styles}
593
620
  >
621
+ <div className="datetime-picker">
622
+ <button
623
+ className="calendar-button"
624
+ onClick={() => this.openCalendar()}
625
+ onKeyDown={() => this.openCalendar()}
626
+ >
627
+ <Icon name={calendarSVG} size={25} />
628
+ </button>
629
+ <div className="datepicker">
630
+ <DatePicker
631
+ id="start_date"
632
+ showIcon
633
+ inline
634
+ onChange={(date) => this.setDatepick(date)}
635
+ dateFormat="dd.MM.yyyy"
636
+ dropdownMode="select"
637
+ showMonthDropdown
638
+ showYearDropdown
639
+ ></DatePicker>
640
+ </div>
641
+ </div>
594
642
  <div className="timeslider-panel"></div>
595
643
  </div>
596
644
  </>
package/src/components/MapViewer/css/ArcgisMap.css CHANGED
@@ -1027,6 +1027,19 @@ div.esri-popover
1027
1027
  color: white !important;
1028
1028
  }
1029
1029
 
1030
+ .datetime-picker {
1031
+ background-color: white;
1032
+ }
1033
+
1034
+ .calendar-button {
1035
+ color: #a0b128;
1036
+ }
1037
+
1038
+ .datepicker {
1039
+ display: none;
1040
+ margin-left: 2.5em;
1041
+ }
1042
+
1030
1043
  /* Scale */
1031
1044
  .esri-scale-bar {
1032
1045
  z-index: 0;