UI: Fix trip animation widget label calculation. Map widgets code cleanup.

ui-ngx/src/app/core/schema-utils.ts

@@ -1,87 +0,0 @@
-///
-/// Copyright © 2016-2022 The Thingsboard Authors
-///
-/// Licensed under the Apache License, Version 2.0 (the "License");
-/// you may not use this file except in compliance with the License.
-/// You may obtain a copy of the License at
-///
-///     http://www.apache.org/licenses/LICENSE-2.0
-///
-/// Unless required by applicable law or agreed to in writing, software
-/// distributed under the License is distributed on an "AS IS" BASIS,
-/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-/// See the License for the specific language governing permissions and
-/// limitations under the License.
-///
-
-import { JsonSettingsSchema } from '@shared/models/widget.models';
-
-export function initSchema(): JsonSettingsSchema {
-    return {
-        schema: {
-            type: 'object',
-            properties: {},
-            required: []
-        },
-        form: [],
-        groupInfoes: []
-    };
-}
-
-export function addGroupInfo(schema: JsonSettingsSchema, title: string) {
-    schema.groupInfoes.push({
-        formIndex: schema.groupInfoes?.length || 0,
-        GroupTitle: title
-    });
-}
-
-export function addToSchema(schema: JsonSettingsSchema, newSchema: JsonSettingsSchema) {
-    Object.assign(schema.schema.properties, newSchema.schema.properties);
-    schema.schema.required = schema.schema.required.concat(newSchema.schema.required);
-    schema.form.push(newSchema.form);
-}
-
-export function mergeSchemes(schemes: JsonSettingsSchema[]): JsonSettingsSchema {
-    return schemes.reduce((finalSchema: JsonSettingsSchema, schema: JsonSettingsSchema) => {
-        return {
-            schema: {
-                properties: {
-                    ...finalSchema.schema.properties,
-                    ...schema.schema.properties
-                },
-                required: [
-                    ...finalSchema.schema.required,
-                    ...schema.schema.required
-                ]
-            },
-            form: [
-                ...finalSchema.form,
-                ...schema.form
-            ]
-        } as JsonSettingsSchema;
-    }, initSchema());
-}
-
-export function addCondition(schema: JsonSettingsSchema, condition: string, exclude: string[] = []): JsonSettingsSchema {
-    schema.form = schema.form.map(element => {
-        if (!exclude.includes(element) && !exclude.includes(element.key)) {
-            if (typeof element === 'string') {
-                return {
-                    key: element,
-                    condition
-                };
-            }
-            if (typeof element === 'object') {
-                if (element.condition) {
-                    element.condition += ' && ' + condition;
-                }
-                else {
-                  element.condition = condition;
-                }
-            }
-        }
-        return element;
-    });
-    return schema;
-}
-

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

@@ -28,27 +28,8 @@ import {
 import { Observable, Observer, of } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { FormattedData } from '@shared/models/widget.models';
-import _ from 'lodash';
-import { mapProviderSchema, providerSets } from '@home/components/widget/lib/maps/schemes';
-import { addCondition, mergeSchemes } from '@core/schema-utils';
 import L from 'leaflet';
 
-export function getProviderSchema(mapProvider: MapProviders, ignoreImageMap = false) {
-  const providerSchema = _.cloneDeep(mapProviderSchema);
-  if (mapProvider) {
-    providerSchema.schema.properties.provider.default = mapProvider;
-  }
-  if (ignoreImageMap) {
-    providerSchema.form[0].items = providerSchema.form[0]?.items.filter(item => item.value !== 'image-map');
-  }
-  return mergeSchemes([providerSchema,
-    ...Object.keys(providerSets)?.map(
-      (key: string) => {
-        const setting = providerSets[key];
-        return addCondition(setting?.schema, `model.provider === '${setting.name}'`);
-      })]);
-}
-
 export function getRatio(firsMoment: number, secondMoment: number, intermediateMoment: number): number {
   return (intermediateMoment - firsMoment) / (secondMoment - firsMoment);
 }

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

@@ -14,8 +14,6 @@
 /// limitations under the License.
 ///
 
-import { JsonSettingsSchema } from '@shared/models/widget.models';
-import { MapProviders } from '@home/components/widget/lib/maps/map-models';
 import LeafletMap from '@home/components/widget/lib/maps/leaflet-map';
 
 export interface MapWidgetInterface {
@@ -26,8 +24,5 @@ export interface MapWidgetInterface {
 }
 
 export interface MapWidgetStaticInterface {
-    settingsSchema(mapProvider?: MapProviders, drawRoutes?: boolean): JsonSettingsSchema;
-    getProvidersSchema(mapProvider?: MapProviders, ignoreImageMap?: boolean): JsonSettingsSchema;
-    dataKeySettingsSchema(): object;
     actionSources(): object;
 }

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

@@ -14,26 +14,11 @@
 /// limitations under the License.
 ///
 
-import {
+import { defaultMapSettings, MapProviders, UnitedMapSettings, WidgetUnitedMapSettings } from './map-models';
-  defaultMapSettings,
-  MapProviders,
-  UnitedMapSettings,
-  WidgetUnitedMapSettings
-} from './map-models';
 import LeafletMap from './leaflet-map';
-import {
-  commonMapSettingsSchema,
-  editorSettingSchema,
-  mapCircleSchema,
-  mapPolygonSchema,
-  markerClusteringSettingsSchema,
-  markerClusteringSettingsSchemaLeaflet,
-  routeMapSettingsSchema
-} from './schemes';
 import { MapWidgetInterface, MapWidgetStaticInterface } from './map-widget.interface';
-import { addCondition, addGroupInfo, addToSchema, initSchema, mergeSchemes } from '@core/schema-utils';
 import { WidgetContext } from '@app/modules/home/models/widget-component.models';
-import { getDefCenterPosition, getProviderSchema, parseWithTranslation } from './common-maps-utils';
+import { getDefCenterPosition, parseWithTranslation } from './common-maps-utils';
 import {
   Datasource,
   DatasourceData,
@@ -108,39 +93,6 @@ export class MapWidgetController implements MapWidgetInterface {
     settings: WidgetUnitedMapSettings;
     pageLink: EntityDataPageLink;
 
-    public static dataKeySettingsSchema(): object {
-        return {};
-    }
-
-    public static getProvidersSchema(mapProvider: MapProviders, ignoreImageMap = false) {
-       return getProviderSchema(mapProvider, ignoreImageMap);
-    }
-
-    public static settingsSchema(mapProvider: MapProviders, drawRoutes: boolean): JsonSettingsSchema {
-        const schema = initSchema();
-        addToSchema(schema, this.getProvidersSchema(mapProvider));
-        addGroupInfo(schema, 'Map Provider Settings');
-        addToSchema(schema, commonMapSettingsSchema);
-        addGroupInfo(schema, 'Common Map Settings');
-        addToSchema(schema, addCondition(mapPolygonSchema, 'model.showPolygon === true', ['showPolygon']));
-        addGroupInfo(schema, 'Polygon Settings');
-        addToSchema(schema, addCondition(mapCircleSchema, 'model.showCircle === true', ['showCircle']));
-        addGroupInfo(schema, 'Circle Settings');
-        if (drawRoutes) {
-            addToSchema(schema, routeMapSettingsSchema);
-            addGroupInfo(schema, 'Route Map Settings');
-        } else {
-            const clusteringSchema = mergeSchemes([markerClusteringSettingsSchema,
-                addCondition(markerClusteringSettingsSchemaLeaflet,
-                    `model.useClusterMarkers === true && model.provider !== "image-map"`)]);
-            addToSchema(schema, clusteringSchema);
-            addGroupInfo(schema, 'Markers Clustering Settings');
-            addToSchema(schema, addCondition(editorSettingSchema, '(model.editablePolygon === true || model.draggableMarker === true)'));
-            addGroupInfo(schema, 'Editor settings');
-        }
-        return schema;
-    }
-
     public static actionSources(): object {
         return {
             markerClick: {

ui-ngx/src/app/modules/home/components/widget/trip-animation/trip-animation.component.ts

@@ -32,30 +32,22 @@ import {
   MapProviders,
   WidgetUnitedTripAnimationSettings
 } from '@home/components/widget/lib/maps/map-models';
-import { addCondition, addGroupInfo, addToSchema, initSchema } from '@app/core/schema-utils';
-import {
-  mapCircleSchema,
-  mapPolygonSchema,
-  pathSchema,
-  pointSchema,
-  tripAnimationSchema
-} from '@home/components/widget/lib/maps/schemes';
 import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { WidgetContext } from '@app/modules/home/models/widget-component.models';
 import {
   findAngle,
-  getProviderSchema,
   getRatio,
   interpolateOnLineSegment,
   parseWithTranslation
 } from '@home/components/widget/lib/maps/common-maps-utils';
-import { FormattedData, JsonSettingsSchema, WidgetConfig } from '@shared/models/widget.models';
+import { FormattedData, WidgetConfig } from '@shared/models/widget.models';
 import moment from 'moment';
 import {
-  deepClone,
+  formattedDataArrayFromDatasourceData,
-  formattedDataArrayFromDatasourceData, formattedDataFormDatasourceData,
+  formattedDataFormDatasourceData,
   isDefined,
-  isUndefined, mergeFormattedData,
+  isUndefined,
+  mergeFormattedData,
   parseFunction,
   safeExecute
 } from '@core/utils';
@@ -101,23 +93,6 @@ export class TripAnimationComponent implements OnInit, AfterViewInit, OnDestroy
   useAnchors: boolean;
   currentTime: number;
 
-  static getSettingsSchema(): JsonSettingsSchema {
-    const schema = initSchema();
-    addToSchema(schema, getProviderSchema(null, true));
-    addGroupInfo(schema, 'Map Provider Settings');
-    addToSchema(schema, tripAnimationSchema);
-    addGroupInfo(schema, 'Trip Animation Settings');
-    addToSchema(schema, pathSchema);
-    addGroupInfo(schema, 'Path Settings');
-    addToSchema(schema, addCondition(pointSchema, 'model.showPoints === true', ['showPoints']));
-    addGroupInfo(schema, 'Path Points Settings');
-    addToSchema(schema, addCondition(mapPolygonSchema, 'model.showPolygon === true', ['showPolygon']));
-    addGroupInfo(schema, 'Polygon Settings');
-    addToSchema(schema, addCondition(mapCircleSchema, 'model.showCircle === true', ['showCircle']));
-    addGroupInfo(schema, 'Circle Settings');
-    return schema;
-  }
-
   ngOnInit(): void {
     this.widgetConfig = this.ctx.widgetConfig;
     this.settings = {
@@ -286,10 +261,12 @@ export class TripAnimationComponent implements OnInit, AfterViewInit, OnDestroy
   }
 
   calcLabel(points: FormattedData[]) {
-    const data = points[this.activeTrip.dsIndex];
+    if (this.activeTrip) {
-    const labelText: string = this.settings.useLabelFunction ?
+      const data = points[this.activeTrip.dsIndex];
-      safeExecute(this.settings.parsedLabelFunction, [data, points, data.dsIndex]) : this.settings.label;
+      const labelText: string = this.settings.useLabelFunction ?
-    this.label = this.sanitizer.bypassSecurityTrustHtml(parseWithTranslation.parseTemplate(labelText, data, true));
+        safeExecute(this.settings.parsedLabelFunction, [data, points, data.dsIndex]) : this.settings.label;
+      this.label = this.sanitizer.bypassSecurityTrustHtml(parseWithTranslation.parseTemplate(labelText, data, true));
+    }
   }
 
   private interpolateArray(originData: FormattedData[]): {[time: number]: FormattedData} {