refactor schemes

ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts

@@ -4,19 +4,23 @@ import { deepClone } from '@core/utils';
 import { openstreetMapSettingsSchema, googleMapSettingsSchema, imageMapSettingsSchema, tencentMapSettingsSchema, hereMapSettingsSchema, commonMapSettingsSchema, routeMapSettingsSchema, markerClusteringSettingsSchema, markerClusteringSettingsSchemaGoogle, markerClusteringSettingsSchemaLeaflet } from './schemes';
 import { MapWidgetStaticInterface, MapWidgetInterface } from './map-widget.interface';
 import { OpenStreetMap, TencentMap, ImageMap, GoogleMap } from './providers';
+import { string } from 'prop-types';
 
 const providerSets = {
     'openstreet-map': {
         MapClass: OpenStreetMap,
-        schema: openstreetMapSettingsSchema
+        schema: openstreetMapSettingsSchema,
+        name: "Openstreet"
     },
     'tencent-map': {
         MapClass: TencentMap,
-        schema: tencentMapSettingsSchema
+        schema: tencentMapSettingsSchema,
+        name: "Tencent"
     },
     'google-map': {
         MapClass: GoogleMap,
-        schema: googleMapSettingsSchema
+        schema: googleMapSettingsSchema,
+        name: "Openstreet"
     },
     'image-map': {
         MapClass: ImageMap,
@@ -32,13 +36,12 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface {
 
     constructor(mapProvider: MapProviders, drawRoutes, ctx, useDynamicLocations, $element, isEdit) {
         console.log(ctx.settings);
-        
+
-        // if(!$element) return
         if (!$element) {
             $element = ctx.$container[0];
         }
         this.provider = mapProvider;
-        const options: MapOptions = {
+        const baseOptions: MapOptions = {
             initCallback: () => { },
             defaultZoomLevel: 8,
             dontFitMapBounds: false,
@@ -51,11 +54,10 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface {
             markerClusteringSetting: null
         }
         let MapClass = providerSets[mapProvider]?.MapClass;
-        if(!MapClass){
+        if (!MapClass) {
-            //delete this;
             return;
         }
-        this.map = new MapClass($element, options)
+        this.map = new MapClass($element, { ...baseOptions, ...ctx.settings })
 
         this.schema = providerSets[mapProvider]?.schema;
     }
@@ -68,7 +70,7 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface {
 
     onResize() {
         this.map.onResize();//not work
-    }    
+    }
 
     getSettingsSchema(): Object {
         return this.schema;
@@ -84,74 +86,57 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface {
     }
 
     public static settingsSchema(mapProvider, drawRoutes): Object {
-        var schema;
+        const providerInfo = providerSets[mapProvider];
-        if (mapProvider === 'google-map') {
+        let schema = providerInfo.schema;
-            schema = googleMapSettingsSchema;
+        schema.groupInfoes = [];
-            schema.groupInfoes = [{
+
-                "formIndex": 0,
+        function addGroupInfo(title: string) {
-                "GroupTitle": "Google Map Settings"
+            schema.groupInfoes.push({
-            }];
+                "formIndex": schema.groupInfoes?.length || 0,
-        } else if (mapProvider === 'openstreet-map') {
+                "GroupTitle": title
-            schema = deepClone(openstreetMapSettingsSchema);
+            });
-            schema.groupInfoes = [{
-                "formIndex": 0,
-                "GroupTitle": "Openstreet Map Settings"
-            }];
-        } else if (mapProvider === 'image-map') {
-            return imageMapSettingsSchema;
-        } else if (mapProvider === 'tencent-map') {
-            schema = deepClone(tencentMapSettingsSchema);
-            schema.groupInfoes = [{
-                "formIndex": 0,
-                "GroupTitle": "Tencent Map Settings"
-            }];
-        } else if (mapProvider === 'here') {
-            schema = deepClone(hereMapSettingsSchema);
-            schema.groupInfoes = [{
-                "formIndex": 0,
-                "GroupTitle": "Here Map Settings"
-            }];
         }
-        if (!schema.groupInfoes) schema.groupInfoes = [];
+
+        function mergeSchema(newSchema) {
+            Object.assign(schema.schema.properties, newSchema.schema.properties);
+            schema.schema.required = schema.schema.required.concat(newSchema.schema.required);
+            schema.form.push(newSchema.form);//schema.form.concat(commonMapSettingsSchema.form);
+        }
+
+        if (providerInfo.name)
+            addGroupInfo(providerInfo.name + ' Map Settings');
         schema.form = [schema.form];
 
-        Object.assign(schema.schema.properties, commonMapSettingsSchema.schema.properties);
+        mergeSchema(commonMapSettingsSchema);
-        schema.schema.required = schema.schema.required.concat(commonMapSettingsSchema.schema.required);
+        addGroupInfo("Common Map Settings");
-        schema.form.push(commonMapSettingsSchema.form);//schema.form.concat(commonMapSettingsSchema.form);
+
-        schema.groupInfoes.push({
-            "formIndex": schema.groupInfoes.length,
-            "GroupTitle": "Common Map Settings"
-        });
         if (drawRoutes) {
-            Object.assign(schema.schema.properties, routeMapSettingsSchema.schema.properties);
+            mergeSchema(routeMapSettingsSchema);
-            schema.schema.required = schema.schema.required.concat(routeMapSettingsSchema.schema.required);
+            addGroupInfo("Route Map Settings");
-            schema.form.push(routeMapSettingsSchema.form);//schema.form = schema.form.concat(routeMapSettingsSchema.form);
-            schema.groupInfoes.push({
-                "formIndex": schema.groupInfoes.length,
-                "GroupTitle": "Route Map Settings"
-            });
         } else if (mapProvider !== 'image-map') {
-            Object.assign(schema.schema.properties, markerClusteringSettingsSchema.schema.properties);
+            let clusteringSchema: any = {
-            schema.schema.required = schema.schema.required.concat(markerClusteringSettingsSchema.schema.required);
+                schema: {
-            schema.form.push(markerClusteringSettingsSchema.form);
+                    properties: {
-            if (mapProvider === 'google-map' || mapProvider === 'tencent-map') {
+                        ...markerClusteringSettingsSchemaLeaflet.schema.properties,
-                Object.assign(schema.schema.properties, markerClusteringSettingsSchemaGoogle.schema.properties);
+                        ...markerClusteringSettingsSchema.schema.properties
-                schema.schema.required = schema.schema.required.concat(markerClusteringSettingsSchemaGoogle.schema.required);
+                    },
-                schema.form[schema.form.length - 1] = schema.form[schema.form.length - 1].concat(markerClusteringSettingsSchemaGoogle.form);
+                    required: {
-            }
+                        ...markerClusteringSettingsSchemaLeaflet.schema.required,
-            if (mapProvider === 'openstreet-map' || mapProvider === 'here') {
+                        ...markerClusteringSettingsSchema.schema.required
-                Object.assign(schema.schema.properties, markerClusteringSettingsSchemaLeaflet.schema.properties);
+                    }
-                schema.schema.required = schema.schema.required.concat(markerClusteringSettingsSchemaLeaflet.schema.required);
+                },
-                schema.form[schema.form.length - 1] = schema.form[schema.form.length - 1].concat(markerClusteringSettingsSchemaLeaflet.form);
+                form: [
-            }
+                    ...markerClusteringSettingsSchemaLeaflet.form,
-            schema.groupInfoes.push({
+                    ...markerClusteringSettingsSchema.form
-                "formIndex": schema.groupInfoes.length,
+                ]
-                "GroupTitle": "Markers Clustering Settings"
+            };
-            });
+            mergeSchema(clusteringSchema);
+            addGroupInfo("Markers Clustering Settings");
         }
-        return schema;
 
+        return schema;
     }
+
     public static actionSources(): Object {
         return {
             'markerClick': {
@@ -168,10 +153,9 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface {
             }
         };
     }
+
     onDestroy() {
     }
-
-
 }
 
 let defaultSettings = {

ui-ngx/src/app/modules/home/components/widget/lib/maps/schemes.ts

@@ -207,7 +207,10 @@ export const openstreetMapSettingsSchema =
             ]
         },
         "useCustomProvider",
-        "customProviderTileUrl"
+        {
+            "key": "customProviderTileUrl",
+            "condition": "model.useCustomProvider === true",
+        }
     ]
 };