Development 20231215 (#45)

* Add PR template

* Update pull_request_template.md

* Improve cursor on thumbnail in upload enhancement  issue  #245  (#246)

* edit cursor on thumbnail in upload view issue#245

* Improve cursor behavior

---------

Co-authored-by: Jacob Mendt <jacob.mendt@pikobytes.de>

* increase the amount of max features that be shown in unreferenzierte-karten to 500 (#248)

* serialize the geojson is corrected dataProjection is writed to EPSG:4326 issue #242 (#250)

* overflow issue whtin geojson view if the string long is, is corrected issue #240 (#251)

* Fix GeoJSON Layer Addition on Enter Key issue #241 (#249)

* Fix GeoJSON Layer Addition on Enter Key issue #241

* small enhancement - automatical set the focus on the input field if the add geojson dialog opens

* add comment

* Add documentation for Dikusa project (#253)

* add documentation for Dikusa

* add document for Dikusa project

* Add loading feedback to upload client enhancement issue #243 (#247)

* add loading snipper for save button in upload view issue#243

* delete unnecessary inputs

* spinner wobbling corrected close issue 243

* Improve font-size of loading animation

---------

Co-authored-by: Jacob Mendt <jacob.mendt@pikobytes.de>

* correct the metadata-container style when the text long is (#255)

* correct style of metadata-container in layermanagament-record #issue 254

* Remove maxZoom value from XYZ

---------

Co-authored-by: Jacob Mendt <jacob.mendt@pikobytes.de>

* Correct the Serialize and Deserialize Geojson  (#259)

* correct the deserilize and serialize geojson function

* complete the geojson struktur documentation and add CRS section #issue-258

* proper width and min width for original view for mosaic maps (#260)

* Upgrade the bundle files

* fetch the max zoom level form Tile map source (#262)

* Correct geojson documentation (#264)

* correct the deserilize and serialize geojson function

* complete the geojson struktur documentation and add CRS section #issue-258

* fine correction of geojsonStylingSpecification.md

* fine correction of geojsonStylingSpecification.md

* fine correction of geojsonStylingSpecification.md

* fine correction

* set the predefind propertiy keys to lower case

* set the predefind propertiy keys to lower case

* GeoJson Style Marker Value should not be case sensitive (#265)

* change the marker value to lower case close issue #263

* Fix bug

---------

Co-authored-by: Jacob Mendt <jacob.mendt@pikobytes.de>

* getting lastmodified date from file corrected close issue#257 (#266)

* Update build files

---------

Co-authored-by: Pouria Rezaei <129738734+PouriaRezz@users.noreply.github.com>

Author: jacmendt

.github/pull_request_template.md

@@ -0,0 +1,7 @@
+Please insert here a basic description of the content of the PR
+
+### Changes
+* Changes as a list of points
+
+### Issue
+* Reference the issue by ID

Build/src/apps/map/components/CustomLayers/HistoricMapLayer.js

@@ -58,14 +58,7 @@ export const HistoricMap = function (settings) {
     const source =
         settings.tms_urls !== undefined
             ? new XYZ({
-                  maxZoom:
-                      settings.scale === 0
-                          ? 15
-                          : settings.scale <= 5000
-                          ? 17
-                          : settings.scale <= 15000
-                          ? 16
-                          : 15,
+                  maxZoom: settings.maxZoom,
                   urls: settings.tms_urls.map(
                       (url) => `${url}/{z}/{x}/{-y}.png`
                   ),

Build/src/apps/map/components/Dropzone/util.js

@@ -11,7 +11,7 @@ export const parseGeoJsonFile = (file, callback, errorCallback) => {
         try {
             callback({
                 content: JSON.parse(this.result),
-                modified: file.lastModifiedDate,
+                modified: file.lastModified,
                 name: file.name.split(".")[0],
             });
         } catch (e) {

Build/src/apps/map/components/GeoJsonEditPopUp/util/geojsonParser.js

@@ -7,6 +7,10 @@
 import { styleFieldSettings } from "../../../views/GeoJsonView/settings.js";
 import { parseColorStringToHex } from "./util";
 
+function isPrimitiveString(value) {
+    return typeof value === "string" && value.constructor === String;
+}
+
 /**
  * Apply styling represented in geojson (as used by geojson.io) to a supplied feature
  * @param feature
@@ -28,6 +32,8 @@ export const parseGeojsonStyles = (feature) => {
                 feature,
                 type === "color"
                     ? parseColorStringToHex(properties[setting])
+                    : isPrimitiveString(properties[setting])
+                    ? properties[setting].toLowerCase()
                     : properties[setting]
             );
 
@@ -44,7 +50,8 @@ export const parseGeojsonStyles = (feature) => {
  */
 export const parseDate = (date) => {
     // format time based on localization
+    const formattedDate = new Date(date);
     const isEnglish = window.location.pathname.includes("/en/");
     const options = { year: "numeric", month: "long", day: "numeric" };
-    return date.toLocaleString(isEnglish ? "en-US" : "de-DE", options);
+    return formattedDate.toLocaleString(isEnglish ? "en-US" : "de-DE", options);
 };

Build/src/apps/map/components/GeoJsonEditPopUp/util/geojsonSerializer.js

@@ -14,26 +14,17 @@ import { parseGeojsonStyles } from "./geojsonParser";
 /**
  * Deserializes a geojson object to an openlayers feature object
  * @param featureObject
- * @param dataProjection
- * @param featureProjection
  * @return {*}
  */
-export const deserializeGeojson = (
-    featureObject,
-    { dataProjection, featureProjection } = {}
-) => {
+export const deserializeGeojson = (featureObject) => {
     const defaultMapView = SettingsProvider.getDefaultMapView();
 
     const features = new GeoJSON().readFeatures(featureObject, {
-        dataProjection: dataProjection ?? defaultMapView.projection,
-        featureProjection: featureProjection ?? defaultMapView.projection,
+        featureProjection: defaultMapView.projection,
     });
-
     features.forEach((f) => {
-        // set default styles for feature
         f.setStyle(defaultStyleFunction(f));
 
-        // add in styling information stored ad the feature
         parseGeojsonStyles(f);
     });
 
@@ -54,7 +45,7 @@ export const serializeGeojson = (features) => {
     });
 
     return new GeoJSON().writeFeaturesObject(features, {
-        dataProjection: defaultMapView.projection,
+        featureProjection: defaultMapView.projection,
     });
 };
 

Build/src/apps/map/components/GeoJsonPresentationPopUp/GeoJsonPresentationPopUp.scss

@@ -97,9 +97,13 @@
             font-weight: 600;
             line-height: normal;
             padding-bottom: 8px;
+            word-wrap: break-word;
+
         }
         p {
             margin: 0;
+            word-wrap: break-word;
+
         }
 
         display: flex;

Build/src/apps/map/components/LayerManagement/GeoJsonUploadHint/GeoJsonUploadHint.jsx

@@ -41,6 +41,8 @@ export const GeoJsonUploadHint = ({ onAddGeoJson }) => {
     if (refFileInput.current !== undefined && refFileInput.current !== null) {
       handleCloseMenu();
       refFileInput.current.click();
+      // Prevents the dialog from reopening when Enter is pressed by removing focus from the "Add GeoJSON" button.
+      document.activeElement.blur();
     }
   };
 
@@ -76,7 +78,9 @@ export const GeoJsonUploadHint = ({ onAddGeoJson }) => {
         </span>
       </button>
       <div className="upload-info">{translate("geojson-adddialog-body")}</div>
-      <label className="visually-hidden" htmlFor="geojson-upload-file">GeoJSON Upload</label>
+      <label className="visually-hidden" htmlFor="geojson-upload-file">
+        GeoJSON Upload
+      </label>
       <input
         id="geojson-upload-file"
         accept="application/json, application/geo+json, .geojson"

Build/src/apps/map/components/LayerManagement/LayerManagementEntry/LayerManagementEntry.scss

@@ -116,6 +116,7 @@ ul.layermanagement-body {
                 margin: 0;
                 line-height: 1.2;
                 color: $secondary-color-dark;
+                word-break: break-word;
                 hyphens: auto;
             }
         }

Build/src/apps/map/components/MapWrapper/MapWrapperWithGeojsonSupport.jsx

@@ -35,11 +35,9 @@ export const MapWrapperWithGeojsonSupport = ({ mapWrapperProps }) => {
   ///
 
   // read geojson and add in supplied information
-  const handleAddGeoJson = (title, dataProjection) => {
+  const handleAddGeoJson = (title) => {
     try {
-      const features = deserializeGeojson(refGeoJSON.current.content, {
-        dataProjection,
-      });
+      const features = deserializeGeojson(refGeoJSON.current.content);
 
       const existingFeaturesWithId = selectedFeatures.filter((selFeature) =>
         selFeature.feature.getId().startsWith(title)

Build/src/apps/map/components/MapWrapper/components/DialogAddGeoJson/DialogAddGeoJson.jsx

@@ -5,7 +5,14 @@
  * file 'LICENSE.txt', which is part of this source code package.
  */
 import React, { useRef } from "react";
-import { Modal, Button } from "react-bootstrap";
+import {
+  Modal,
+  Button,
+  ModalHeader,
+  ModalTitle,
+  ModalBody,
+  ModalFooter,
+} from "react-bootstrap";
 import PropTypes from "prop-types";
 import { ControlLabel, FormGroup, FormControl } from "react-bootstrap";
 
@@ -24,7 +31,7 @@ export const DialogAddGeoJson = ({ initialName, onClose, onSubmit }) => {
       ? refTitleInput.current.value
       : undefined;
 
-    onSubmit(title, "EPSG:4326");
+    onSubmit(title);
   };
 
   return (
@@ -34,36 +41,44 @@ export const DialogAddGeoJson = ({ initialName, onClose, onSubmit }) => {
         onHide={handleOnClose}
         show={true}
       >
-        <Modal.Header>
-          <Modal.Title>{translate("geojson-adddialog-title")}</Modal.Title>
-        </Modal.Header>
+        <ModalHeader>
+          <ModalTitle>{translate("geojson-adddialog-title")}</ModalTitle>
+        </ModalHeader>
 
-        <Modal.Body>
+        <ModalBody>
           <div className="dialog-content">
             <form>
               <FormGroup>
                 <ControlLabel>
                   {translate("geojson-adddialog-layer-title-label")}
                 </ControlLabel>
                 <FormControl
+                  autoFocus
                   defaultValue={initialName ?? "Unknown"}
-                  inputRef={refTitleInput}
+                  inputRef={(ref) => {
+                    refTitleInput.current = ref;
+                  }}
                   name="title"
                   type="text"
+                  onKeyDown={(e) => {
+                    if (e.key === "Enter") {
+                      handleOnSubmit();
+                    }
+                  }}
                 />
               </FormGroup>
             </form>
           </div>
-        </Modal.Body>
+        </ModalBody>
 
-        <Modal.Footer>
+        <ModalFooter>
           <Button onClick={handleOnClose}>
             {translate("geojson-adddialog-cancel")}
           </Button>
           <Button onClick={handleOnSubmit} bsStyle="primary">
             {translate("geojson-adddialog-confirm")}
           </Button>
-        </Modal.Footer>
+        </ModalFooter>
       </Modal>
     </div>
   );