list component changes

src/app/list/list.component.html

@@ -1,21 +1,25 @@
 <div *ngIf="isNear">
-
+  <h1>
+    Posizione {{locationParams}} non trovata
+  </h1>
+  <div *ngFor="let locations of locations, let i = index">
+    <h3>
+      <a href="location/{{locations.location}}">{{locations.location}}</a>
+    </h3>
+    <h4>Distance: {{distance[i]}}</h4>
+  </div>
 </div>
 
-<div *ngIf="!isNear && location">
+<div *ngIf="!isNear && location && location.waypoints">
   <h1>
     {{location.location}}
   </h1>
-  <div *ngFor="let waypoinst of location.waypoints">
+  {{location.waypoints[0].name}}
+  <div *ngFor="let waypoinst of location.waypoints, let i = index">
     <h3>
-      {{waypoinst.name}}
+      <a class="link link-primary" href="location/{{location.location}}/{{waypoinst.id}}"> {{waypoinst.name}}</a>
     </h3>
-    <h4>Distance: {{getDistance(waypoinst.lat, location.lon)}}</h4>
+    <h4>Distance: {{distance[i]}}</h4>
   </div>
 
 </div>
-
-
-<h1></h1>
-
-<h3></h3>

src/app/list/list.component.ts

@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, SimpleChanges, OnChanges} from '@angular/core';
 import {Locations} from "../interface/data";
 import {ReadjsonService} from "../service/readjson.service";
 import {ActivatedRoute} from "@angular/router";
@@ -9,8 +9,8 @@ import {positionService} from "../service/position.service";
   templateUrl: './list.component.html',
   styleUrls: ['./list.component.css']
 })
-export class ListComponent implements OnInit {
-  private locationParams: string | undefined
+export class ListComponent implements OnInit, OnChanges {
+  locationParams: string | undefined
   locations: Partial<Locations>[] | undefined;
   location: Partial<Locations> | undefined;
 
@@ -18,7 +18,8 @@ export class ListComponent implements OnInit {
 
   isNear: boolean = true;
 
-  distance: number = 0;
+  distance: number[] = [];
+
 
   constructor(private route: ActivatedRoute, private readjsonService: ReadjsonService, private positionService: positionService) {
   }
@@ -30,15 +31,28 @@ export class ListComponent implements OnInit {
     this.readjsonService.getLocations().subscribe(locations => {
       this.locations = locations;
       if (this.locationParams != null) {
-        this.readjsonService.getLocation(this.locationParams).subscribe(location => {
+        this.readjsonService.getLocation(this.locationParams ?? "").subscribe(async location => {
           this.location = location;
-          this.checkDataPopulated();
+          this.readjsonService.getWaypoints(this.locationParams ?? "").subscribe(waypoints => {
+            if (this.location) {
+              this.location.waypoints = waypoints ?? []
+            }
+          });
+          await this.checkDataPopulated();
         });
       }
     });
-    this.setDistance();
+
   }
 
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes['positionCord'] && (changes['positionCord'])) {
+      console.log("onChanges")
+      this.setDistance();
+    }
+  }
+
+
   private checkDataPopulated(): void {
     if (this.locations && this.location) {
       console.log("Dati popolati correttamente:", this.locations, this.location);
@@ -47,6 +61,7 @@ export class ListComponent implements OnInit {
           this.location = this.locations[i];
           console.log("Location trovata:", this.location);
           this.isNear = false;
+          this.setDistance();
           break;
         }
       }
@@ -54,10 +69,20 @@ export class ListComponent implements OnInit {
   }
 
   private setDistance(): void {
-    if (this.location && this.isNear) {
-      this.distance = this.positionService.getDistanceBetweenCoordinates(this.location.lat, this.location.lon, this.positionCord.lat, this.positionCord.lon);
-      console.log("Distanza: " + this.distance + " km");
-    }
+
+    const intervalId = setInterval(() => {
+      if (this.location) {
+        if (this.location?.waypoints) {
+          console.log("setDistance"+this.location);
+          for (let i = 0; i < this.location.waypoints.length; i++) {
+            console.log("for")
+            this.distance.push(this.positionService.getDistanceBetweenCoordinates(this.location.waypoints[i].lat, this.location?.lon, this.positionCord.lat, this.positionCord.lon));
+          }
+          clearInterval(intervalId);
+        }
+        console.log("ciao" + this.distance[0])
+      }}, 1000);
+    //da aggiungere il cambiamento in tutti i punti, forse fatto ma sono stanco
   }
 
   getDistance(latLocation: number | undefined, lonLocation: number | undefined): any {
@@ -71,4 +96,5 @@ export class ListComponent implements OnInit {
     }, 1000);
   }
 
+
 }