feat: point history list updates selection

src/app/components/map/map.component.ts

@@ -24,7 +24,7 @@ import * as mapStore from '@store/map';
 import * as uiStore from '@store/ui';
 
 import * as models from '@models';
-import { MapService, WktService, ScreenSizeService, ScenesService, SarviewsEventsService } from '@services';
+import { MapService, WktService, ScreenSizeService, ScenesService, SarviewsEventsService, PointHistoryService } from '@services';
 import * as polygonStyle from '@services/map/polygon.style';
 import { CMRProduct, SarviewsEvent } from '@models';
 import { StyleLike } from 'ol/style/Style';
@@ -97,7 +97,8 @@ export class MapComponent implements OnInit, OnDestroy  {
     private screenSize: ScreenSizeService,
     private scenesService: ScenesService,
     private eventMonitoringService: SarviewsEventsService,
-    public dialog: MatDialog
+    public dialog: MatDialog,
+    private pointHistoryService: PointHistoryService
   ) {}
 
   ngOnInit(): void {
@@ -244,8 +245,16 @@ export class MapComponent implements OnInit, OnDestroy  {
 
     this.subs.add(
       this.mapService.newSelectedDisplacement$.subscribe(point => {
-        var format = new WKT();
-        var wktRepresenation  = format.writeGeometry(point);
+        let format = new WKT();
+        let wktRepresenation  = format.writeGeometry(point);
+
+        let pointIndex = this.pointHistoryService.getHistory().findIndex((thing) => {
+          if(thing === point) {
+            return true
+          }
+        })
+        this.pointHistoryService.selectedPoint = pointIndex;
+
         this.mapService.loadPolygonFrom(wktRepresenation.toString())
       })
     )

src/app/components/results-menu/timeseries-results-menu/timeseries-results-menu.component.html

@@ -10,7 +10,7 @@
 			@if(pointHistory.length !== 0) {
 			<mat-radio-group>
 				@for (point of pointHistory; track $index) {
-					<mat-radio-button color="primary" (click)="onPointClick($index)">
+					<mat-radio-button color="primary" (click)="onPointClick($index)" [checked]="$index === pointHistoryService.selectedPoint">
 						{{point.flatCoordinates[0] | floatPrecision: 4}}, {{point.flatCoordinates[1] | floatPrecision: 4}}
 					</mat-radio-button>
 				}

src/app/components/results-menu/timeseries-results-menu/timeseries-results-menu.component.ts

@@ -12,7 +12,7 @@ import { DrawService, MapService, NetcdfService, PointHistoryService, ScreenSize
 
 import { SubSink } from 'subsink';
 
-import { Point} from 'ol/geom';
+import {  Point} from 'ol/geom';
 import { WKT } from 'ol/format';
 import moment2 from 'moment';
 import { SetScenes } from '@store/scenes';
@@ -28,6 +28,7 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
 
   @ViewChild('listCard', {read: ElementRef}) listCardView: ElementRef;
   @ViewChild('chartCard', {read: ElementRef}) chartCardView: ElementRef;
+  @ViewChild('radio-group', {read: ElementRef}) radioGroup: ElementRef;
 
   @Input() resize$: Observable<void>;
   public searchType: SearchType;
@@ -49,13 +50,14 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
   public pointHistory = [];
 
 
-  public chartData = new Subject<any>
+  public chartData = new Subject<any>;
+  public selectedPoint: number;
 
 
   constructor(
     private store$: Store<AppState>,
     private screenSize: ScreenSizeService,
-    private pointHistoryService: PointHistoryService,
+    public pointHistoryService: PointHistoryService,
     private drawService: DrawService,
     private mapService: MapService,
     private netcdfService: NetcdfService
@@ -83,6 +85,7 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
         temp.transform('EPSG:3857', 'EPSG:4326')
         if (polygon.getGeometry().getType() === 'Point') {
           this.pointHistoryService.addPoint(temp);
+          // this.selectedPoint = temp;
         }
         this.updateChart(temp);
       }
@@ -123,9 +126,10 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
     window.open(url);
   }
   public onPointClick(index: number) {
+    this.pointHistoryService.selectedPoint = index;
     this.pointHistoryService.passDraw = true;
-    var format = new WKT();
-    var wktRepresenation  = format.writeGeometry(this.pointHistory[index]);
+    let format = new WKT();
+    let wktRepresenation  = format.writeGeometry(this.pointHistory[index]);
     this.mapService.loadPolygonFrom(wktRepresenation.toString())
   }
   public updateChart(geometry): void {

src/app/services/netcdf-service.service.ts

@@ -69,8 +69,8 @@ export class NetcdfService {
 
   public getTimeSeries(geometry): Observable<any> {
 
-    var format = new WKT();
-    var wktRepresenation  = format.writeGeometry(geometry);
+    let format = new WKT();
+    let wktRepresenation  = format.writeGeometry(geometry);
     let index_id = wktRepresenation;
     console.log(`getting ${index_id}`)
     if(this.cache.hasOwnProperty(index_id)) {

src/app/services/point-history.service.ts

@@ -12,6 +12,7 @@ export class PointHistoryService {
   private history : Point[] = [];
   public history$ = new Subject<Point[]>();
   public passDraw: boolean = false;
+  public selectedPoint: number = 0;
   constructor(
   ) {
   }