improve and refactor geo json property handling

src/app/map/map.component.ts

@@ -243,6 +243,10 @@ export class MapComponent implements OnInit {
     this.customLayerCollection.insertAt(event.currentIndex, tmp);
   }
 
+  /**
+   * Deletes a layer from custom layer collection
+   * @param layer
+   */
   deleteLayer(layer: VectorLayer) {
     this.customLayerCollection.remove(layer);
   }

src/app/models/RawLayer.ts

@@ -47,17 +47,15 @@ export class RawLayer {
     features.forEach(feature => {
       // TODO
       //  determine if this feature has a own color! If so, do not apply default color and use own color.
-      const featureProperties = feature.getProperties();
+      const featureCustomProperties = RawLayer.getCustomProperties(feature);
-      if (featureProperties[Config.GEO_JSON_PREFIX] && featureProperties[Config.GEO_JSON_PREFIX]['default-style-stroke']) {
+      if (featureCustomProperties && featureCustomProperties['default-style-stroke']) {
-        const strokeColor = featureProperties[Config.GEO_JSON_PREFIX]['default-style-stroke'];
-        const fillColor = featureProperties[Config.GEO_JSON_PREFIX]['default-style-fill'];
         feature.setStyle(new Style({
           stroke: new Stroke({
-            color: strokeColor,
+            color: featureCustomProperties['default-style-stroke'],
             width: 1
           }),
           fill: new Fill({
-            color: fillColor
+            color: featureCustomProperties['default-style-fill']
           })
         }));
       }
@@ -80,11 +78,11 @@ export class RawLayer {
     const features = RawLayer.geoJSONToFeatures(this.data);
     features.forEach(feature => {
       // save default color in feature properties
-      const stylesToSave = {};
+      const properties = {
-      stylesToSave[Config.GEO_JSON_PREFIX] = {};
+        'default-style-stroke': color,
-      stylesToSave[Config.GEO_JSON_PREFIX]['default-style-stroke'] = color;
+        'default-style-fill': [...color.slice(0, 3), 0.1]
-      stylesToSave[Config.GEO_JSON_PREFIX]['default-style-fill'] = [...color.slice(0, 3), 0.1];
+      };
-      feature.setProperties(stylesToSave);
+      RawLayer.saveCustomProperties(feature, properties);
     })
     this.data = RawLayer.featuresToGeoJSON(features);
   }
@@ -94,8 +92,11 @@ export class RawLayer {
    */
   public getDefaultColor(): number[] {
     const features = RawLayer.geoJSONToFeatures(this.data);
-    const featureProperties = features[0].getProperties();
+    const featureCustomProperties = RawLayer.getCustomProperties(features[0]);
-    return featureProperties[Config.GEO_JSON_PREFIX]['default-style-stroke'];
+    if (featureCustomProperties && featureCustomProperties['default-style-stroke']) {
+      return featureCustomProperties['default-style-stroke'];
+    }
+    return null;
   }
 
   /**
@@ -112,4 +113,26 @@ export class RawLayer {
   private static featuresToGeoJSON(features: Feature[]): string {
     return new GeoJSON().writeFeatures(features, {featureProjection: EPSG.openLayersDefault});
   }
+
+  /**
+   * Saves arbitrary key value pairs to geo json representation of this layer as custom properties
+   * @param feature
+   * @param properties
+   */
+  public static saveCustomProperties(feature: Feature, properties: { [key: string]: any }) {
+    const newProperties = {};
+    // consider custom properties that were saved before
+    const savedProperties = RawLayer.getCustomProperties(feature);
+    newProperties[Config.GEO_JSON_PREFIX] = {...savedProperties,...properties};
+    feature.setProperties(newProperties);
+  }
+
+  /**
+   * Returns all custom properties of this layer from its geo json representation
+   * @param feature
+   */
+  public static getCustomProperties(feature: Feature): { [key: string]: any } {
+    const featureProperties = feature.getProperties();
+    return featureProperties[Config.GEO_JSON_PREFIX];
+  }
 }