feat: add create point button to top of results

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

@@ -6,7 +6,17 @@
 			<app-scenes-list-header></app-scenes-list-header>
 		</mat-card-subtitle>
 
+      <div>
+        @if(!isAddingPoints) {
+        <button (click)="onAddPointsMode()" mat-button>{{ 'ADD_POINTS' | translate }}</button>
+        }
+        @else {
+          <button (click)="onStopAddPoints()" mat-button>{{ 'STOP_ADDING_POINTS' | translate }}</button>
+        }
+      </div>
+
 		<div class="ts-left-column-results">
+
 			@if(pointHistory.length !== 0) {
 			<mat-radio-group>
 				@for (point of pointHistory; track $index) {

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

@@ -6,8 +6,9 @@ import { Store } from '@ngrx/store';
 import { AppState } from '@store';
 import * as uiStore from '@store/ui';
 import * as searchStore from '@store/search';
+import * as mapStore from '@store/map';
 
-import { Breakpoints,   SearchType } from '@models';
+import { Breakpoints,   SearchType, MapInteractionModeType, MapDrawModeType } from '@models';
 import { DrawService, MapService, NetcdfService, PointHistoryService, ScreenSizeService } from '@services';
 
 import { SubSink } from 'subsink';
@@ -33,6 +34,7 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
 
   @Input() resize$: Observable<void>;
   public searchType: SearchType;
+  public isAddingPoints = false;
 
   public wktListMaxWidth = '225px';
   public listCardMaxWidth = '300px';
@@ -51,7 +53,6 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
 
   public pointHistory = [];
 
-
   public chartData = new Subject<any>;
   public selectedPoint: number;
 
@@ -72,6 +73,12 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
       )
     );
 
+    this.subs.add(
+      this.store$.select(mapStore.getMapInteractionMode).subscribe(
+        mode => this.isAddingPoints = mode === MapInteractionModeType.DRAW
+      )
+    );
+
     this.subs.add(
       this.store$.select(searchStore.getSearchType).subscribe(
         searchType => this.searchType = searchType
@@ -135,6 +142,15 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
     window.open(url);
   }
 
+  public onAddPointsMode(): void {
+    this.store$.dispatch(new mapStore.SetMapInteractionMode(MapInteractionModeType.DRAW));
+    this.store$.dispatch(new mapStore.SetMapDrawMode(MapDrawModeType.POINT));
+  }
+
+  public onStopAddPoints(): void {
+    this.store$.dispatch(new mapStore.SetMapInteractionMode(MapInteractionModeType.NONE));
+  }
+
   public onPointClick(index: number) {
     this.pointHistoryService.selectedPoint = index;
     this.pointHistoryService.passDraw = true;
@@ -146,8 +162,8 @@ export class TimeseriesResultsMenuComponent implements OnInit, OnDestroy {
   public updateChart(geometry): void {
     this.netcdfService.getTimeSeries(geometry).pipe(first()).subscribe(data => {
       this.chartData.next(data);
-      // just going to use the data here to have some test 
-      
+      // just going to use the data here to have some test
+
       let test_products = []
       for(let a of Object.keys(data)) {
         if(a === 'mean') {

src/assets/i18n/en.json

@@ -920,5 +920,7 @@
   "ZOOM_TO_EVENT": "Zoom to event",
   "ZOOM_TO_FIT": "Zoom To Fit",
   "ZOOM_TO_RESULTS": "Zoom to results",
-  "ZOOM_TO_SCENE": "Zoom to scene"
-}
+  "ZOOM_TO_SCENE": "Zoom to scene",
+  "ADD_POINTS":"Add Points",
+  "STOP_ADDING_POINTS":"Stop Adding Points"
+}

src/assets/i18n/es.json

@@ -920,5 +920,7 @@
   "ZOOM_TO_EVENT": "Acercar al evento",
   "ZOOM_TO_FIT": "Acercar para ajustar",
   "ZOOM_TO_RESULTS": "Acercar a los resultados",
-  "ZOOM_TO_SCENE": "Acercar a la escena"
-}
+  "ZOOM_TO_SCENE": "Acercar a la escena",
+  "ADD_POINTS":"",
+  "STOP_ADDING_POINTS":""
+}