Merge remote-tracking branch 'origin/dev' into dev

2023-05-08 15:13:29 +02:00
parent 59870a07ad a0a2ffb6c1
commit 30d805ff28
7 changed files with 74 additions and 128 deletions
--- a/src/app/component/detail/detail.component.ts
+++ b/src/app/component/detail/detail.component.ts
@@ -1,5 +1,5 @@
 import {Component, OnInit, ViewChild, ElementRef} from '@angular/core';
-import { Router } from '@angular/router';
+import {Router} from '@angular/router';
 import {ActivatedRoute} from "@angular/router";
 import {positionService} from "../../service/position.service";
 import {WaypointService} from "../../service/http/waypoint.service"
@@ -10,9 +10,6 @@ import {WaypointsVisitedEntity} from "../../interface/WaypointsVisitedEntity";
 import {ReadTranslateJsonService} from "../../service/language/readTranslateJson.service";
 import {cookieService} from "../../service/cookie.service";
 import {UserService} from "../../service/http/user.service";
-import {UserEntity} from "../../interface/UserEntity";
-import { trigger, state, transition, animate } from '@angular/animations';
-

@Component({
  selector: 'app-detail',
@@ -21,32 +18,30 @@ import { trigger, state, transition, animate } from '@angular/animations';
 })

 export class DetailComponent implements OnInit {
+
  @ViewChild('myModal', {static: true}) myModal!: ElementRef<HTMLInputElement>;
+
  private location: string | undefined;
  private id: number | undefined;
-
  private URLParams: any;
+
  waypointInfo: any;
  embed: any;
  cord: any;
-
  detailTranslations: detailTranslations = {} as detailTranslations;
-
-  /*
-    showNav = true;
-  */
  distance: number | undefined;
-  displayedDistance = 0;
-
  img: any;
-
-  iframeLoded: boolean = false;
-
  intervalID: any;

-  constructor(private route: ActivatedRoute, private positionService: positionService, private waypointService: WaypointService, private waypointVisitedService: WaypointVisitedService, private readTranslationJsonService: ReadTranslateJsonService,
-  private userService: UserService, private cookieService: cookieService, private router: Router) {
-
+  constructor(
+    private route: ActivatedRoute,
+    private positionService: positionService,
+    private waypointService: WaypointService,
+    private waypointVisitedService: WaypointVisitedService,
+    private readTranslationJsonService: ReadTranslateJsonService,
+    private userService: UserService,
+    private cookieService: cookieService,
+    private router: Router) {
  }

  async ngOnInit() {
@@ -55,16 +50,12 @@ export class DetailComponent implements OnInit {
      this.URLParams = params;
      console.log("params", params);
    });
-
-
    console.log("params", this.URLParams.location); // {location: "lugano", id: "1"}
-
    this.waypointService.getWaypoint(this.URLParams.location, this.URLParams.id).subscribe(waypoint => {
      console.log("waypoint", waypoint)
      this.waypointInfo = waypoint;
      console.log("waypointInfo", this.waypointInfo.locationName)
    });
-
    //this.URLParams = this.route.snapshot.url.slice(-2).map(segment => segment.path);
    console.log("getting your location: wait...");
    this.cord = await this.positionService.getLocation();
@@ -84,7 +75,6 @@ export class DetailComponent implements OnInit {
    }
  }

-
  async checkDistanceTimer() {
    //set interval
    this.intervalID = setInterval(() => {
@@ -99,7 +89,7 @@ export class DetailComponent implements OnInit {
          this.myModal.nativeElement.checked = true;
          this.userService.getUser(this.cookieService.getUsername()).subscribe(user => {
            if (user?.id !== undefined) {
-              let waypointVisited: WaypointsVisitedEntity = {userId: user.id , waypointId: this.waypointInfo.id}
+              let waypointVisited: WaypointsVisitedEntity = {userId: user.id, waypointId: this.waypointInfo.id}
              console.log("waypointVisited", waypointVisited)
              this.waypointVisitedService.createWaypoint(waypointVisited).subscribe(waypointVisited => {
                console.log("waypointVisited request return", waypointVisited)
@@ -128,14 +118,13 @@ export class DetailComponent implements OnInit {
      throw new Error('Error generating QR code');
    }
  }
+
  async addSvgToImage(imageUrl: string, svgString: string): Promise<string> {
    const image = new Image();
    image.crossOrigin = 'anonymous';
    image.src = imageUrl;
-
    const svgBlob = new Blob([svgString], {type: 'image/svg+xml'});
    const svgUrl = URL.createObjectURL(svgBlob);
-
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    if (!ctx) {
@@ -147,10 +136,8 @@ export class DetailComponent implements OnInit {
        image.onload = () => {
          canvas.width = image.width;
          canvas.height = image.height;
-
          ctx.drawImage(image, 0, 0);
          const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
-
          let isAllWhite = true;
          for (let i = 0; i < imageData.data.length; i += 4) {
            if (imageData.data[i] !== 255 || imageData.data[i + 1] !== 255 || imageData.data[i + 2] !== 255) {
@@ -158,21 +145,17 @@ export class DetailComponent implements OnInit {
              break;
            }
          }
-
          if (isAllWhite) {
            const svgImage = new Image();
            svgImage.crossOrigin = 'anonymous';
            svgImage.src = svgUrl;
-
            svgImage.onload = () => {
              canvas.width = svgImage.width;
              canvas.height = svgImage.height;
-
              ctx.drawImage(svgImage, 0, 0);
              const outputImageUrl = canvas.toDataURL('image/png');
              resolve(outputImageUrl);
            };
-
            svgImage.onerror = () => {
              reject('Error loading SVG');
            };
@@ -180,22 +163,18 @@ export class DetailComponent implements OnInit {
            const svgImage = new Image();
            svgImage.crossOrigin = 'anonymous';
            svgImage.src = svgUrl;
-
            svgImage.onload = () => {
              const x = image.width - (image.width * 0.2 + 5);
              const y = image.height - (image.width * 0.2 + 5);
              ctx.drawImage(svgImage, x, y, image.width * 0.2, image.width * 0.2);
-
              const outputImageUrl = canvas.toDataURL('image/png');
              resolve(outputImageUrl);
            };
-
            svgImage.onerror = () => {
              reject('Error loading SVG');
            };
          }
        };
-
        image.onerror = () => {
          reject('Error loading image');
        };
@@ -203,32 +182,19 @@ export class DetailComponent implements OnInit {
    } catch (err) {
      console.error(err);
    }
-
    return canvas.toDataURL('image/png');
  }

-
-
-
-
  async generateQR() {
    console.log("generating QR code");
-    //console.log(this.URLParams.value);
    let url = `http://localhost:4200/location/${this.URLParams.location}/${this.URLParams.id}`;
-
    let qrCode = await this.generateQRCode(url);
-
-    //console.log(qrCode);
-
    const imageUrl = this.waypointInfo.img;
-
    this.addSvgToImage(imageUrl, qrCode).then((outputImageUrl) => {
      this.img = outputImageUrl // Output the URL of the output image
-      //console.log(outputImageUrl);
    }).catch((error) => {
      console.error(error); // Handle any errors that occur
    });
-
  }

  public downloadImage(): void {
@@ -243,6 +209,4 @@ export class DetailComponent implements OnInit {
    this.myModal.nativeElement.checked = false;
    this.router.navigate(['/location/', this.URLParams.location]);
  }
-
-
 }
--- a/src/app/component/list/list.component.html
+++ b/src/app/component/list/list.component.html
@@ -1,7 +1,7 @@
 <div *ngIf="isNear" class="container">
-  <h1>
+  <h3>
    {{translations.locationName}}: {{locationParams}}
-  </h1>
+  </h3>
  <div class="container2">
    <div class="left">
      <div *ngFor="let locations of locations, let i = index" class="row">
@@ -9,7 +9,7 @@
          <a class="link link-primary" href="location/{{locations.location}}">{{locations.location}}</a>
        </h3>
        <div class="distance">
-          <h4 *ngIf="locations.distance && !positionNotFound">{{translations.distance}}{{locations.distance}} km</h4>
+          <h4 *ngIf="locations.distance && !positionNotFound">{{translations.distance}}: {{locations.distance}} km</h4>
          <h4 *ngIf="positionNotFound">{{translations.positionNotFoundErrorMessage}}</h4>
        </div>
      </div>
--- a/src/app/component/list/list.component.ts
+++ b/src/app/component/list/list.component.ts
@@ -1,5 +1,5 @@
 import {Component, OnChanges, OnInit, SimpleChanges} from '@angular/core';
-import {ActivatedRoute, Router} from "@angular/router";
+import {ActivatedRoute} from "@angular/router";
 import {positionService} from "../../service/position.service";
 import {listTranslations} from "../../interface/translations";
 import {LocationService} from "../../service/http/location.service";
@@ -10,7 +10,6 @@ import {cookieService} from "../../service/cookie.service";
 import {UserService} from "../../service/http/user.service";
 import {WaypointVisitedService} from "../../service/http/waypointVisited.service";
 import {ReadTranslateJsonService} from "../../service/language/readTranslateJson.service";
-import {filter} from "rxjs";

@Component({
  selector: 'app-list',
@@ -18,21 +17,16 @@ import {filter} from "rxjs";
  styleUrls: ['./list.component.css']
 })
 export class ListComponent implements OnInit, OnChanges {
+
  percentage: number = 0;
  username: string = '';
  locationParams: string | undefined
  locations: LocationEntity[] | undefined;
  location: LocationEntity | undefined;
-
  waypoints: WaypointsEntity[] | undefined;
-
  positionCord: any;
-
  isNear: boolean = true;
-
-
  translations: listTranslations = {} as listTranslations
-
  positionNotFound: boolean = false;


@@ -49,15 +43,19 @@ export class ListComponent implements OnInit, OnChanges {
  }

  async ngOnInit() {
+    // get translations
    this.translations = this.readTranslationJsonService.getListTransaltions();
+    // get username by cookie
    this.username = this.cookieService.getUsername();
    this.route.params.subscribe(params => {
      this.locationParams = params['location'];
    });
+    // get location by locationParams
    this.locationService.getLocation(this.locationParams ?? "").subscribe(location => {
      this.location = location;
      if (this.location.location != null || this.location.location != undefined) {
        this.isNear = false;
+        // get waypoints by location
        this.waypointService.getWaypoints(this.location.location).subscribe(waypoints => {
          this.waypoints = waypoints;
          console.log("waypoints", this.waypoints);
@@ -65,29 +63,35 @@ export class ListComponent implements OnInit, OnChanges {
          this.setDistance();
        });
      }
-
    });
+    // get locations
    this.locationService.getLocations().subscribe(locations => {
      this.locations = locations;
      console.log("locations", this.locations)
      this.setDistance()
    });
+    // get position of user
    this.getPosition();
+    // set percentage of visited waypoints
    this.positionNotFoundFunction();
+    // set distance between user and waypoints
    this.setDistance();
  }

-
+  // set percentage of visited waypoints
  positionNotFoundFunction() {
    if (!this.positionNotFound) {
-      setTimeout(() => {
+      setInterval(() => {
        if (!this.positionCord) {
          this.positionNotFound = true;
+        }else {
+          this.positionNotFound = false;
        }
      }, 5000);
    }
  }

+  // check if positionCord is changed
  ngOnChanges(changes: SimpleChanges) {
    if (changes['positionCord'] && (changes['positionCord'])) {
      console.log("onChanges")
@@ -95,6 +99,7 @@ export class ListComponent implements OnInit, OnChanges {
    }
  }

+  // get position of user
  getPosition(): any {
    setInterval(async () => {
      this.positionCord = await this.positionService.getLocation();
@@ -102,21 +107,7 @@ export class ListComponent implements OnInit, OnChanges {
    }, 2000);
  }

-  private checkDataPopulated(): void {
-    if (this.locations && this.location) {
-      console.log("Dati popolati correttamente:", this.locations, this.location);
-      for (let i = 0; i < this.locations.length; i++) {
-        if (this.locations[i].location === this.locationParams) {
-          this.location = this.locations[i];
-          console.log("Location trovata:", this.location);
-          this.isNear = false;
-          this.setDistance();
-          break;
-        }
-      }
-    }
-  }
-
+  // set distance between user and waypoints
  private setDistance(): void {
    if (this.waypoints) {
      for (let i = 0; i < this.waypoints.length; i++) {
@@ -131,6 +122,7 @@ export class ListComponent implements OnInit, OnChanges {
    }
  }

+  // set visited waypoints by user
  private setVisited(): void {
    console.log("setVisited")
    if (this.username && this.waypoints) {
@@ -139,53 +131,15 @@ export class ListComponent implements OnInit, OnChanges {
          this.waypointVisitedService.getWaypointByUserAndWaypoint(this.username, this.waypoints[i].id).subscribe((waypointVisited: any) => {
            if (this.waypoints) {
              this.waypoints[i].visited = waypointVisited;
-              console.log(this.waypoints[i].visited);
              this.setPercentage();
            }
          });
        }
      }
    }
-
  }

-  /*
-    private setVisited(): void {
-      if (this.username && this.waypoints) {
-        for (let i = 0; i < this.waypoints.length; i++) {
-          if (this.waypoints[i].id !== undefined) {
-            this.waypoints[i].visited == this.waypointVisitedService.getWaypointByUserAndWaypoint(this.username, this.waypoints[i].id);
-          }
-        }
-      }
-    }
-  */
-
-  /*
-    private setVisited(): void {
-      this.userService.getUser(this.username).subscribe((user: any) => {
-        if (this.waypoints && user.id) {
-          let userid: string = user.id.toString();
-          for (let i = 0; i < this.waypoints.length; i++) {
-            let waypoint: number;
-            if (this.waypoints[i].id!==undefined) {
-              waypoint = this.waypoints[i].id;
-            } else {
-              waypoint = 0;
-            }
-            this.waypointVisitedService.getWaypointByUserAndWaypoint(userid, waypoint).subscribe((waypointVisited: any) => {
-              if (waypointVisited) {
-                this.waypoints[i].visited = true;
-                this.setPercentage();
-              }
-            });
-          }
-        }
-      });
-    }
-
-  */
-
+  // set percentage of visited waypoints by user
  setPercentage(): void {
    if (this.waypoints) {
      let count: number = 0;
@@ -196,7 +150,5 @@ export class ListComponent implements OnInit, OnChanges {
      }
      this.percentage = parseFloat((count / this.waypoints.length * 100).toFixed(0));
    }
-  console.log("percentage", this.percentage)
  }
-
 }
--- a/src/app/component/login/login.component.ts
+++ b/src/app/component/login/login.component.ts
@@ -32,9 +32,11 @@ export class LoginComponent implements OnInit {
  }

  ngOnInit(): void {
+    // get login translations
    this.loginTranslation = this.readTranslationJsonService.getLoginTranslations();
  }

+  // create new user
  createNewUser(createUser: newUser) {
    console.log(createUser.username+" "+createUser.password);
    if (createUser.username == '' || createUser.password == '') {
@@ -57,6 +59,7 @@ export class LoginComponent implements OnInit {
    });
  }

+  // login function
  loginFunction(username: string, password: string) {
    this.userService.getUser(username).subscribe(user => {
      console.log(user);
@@ -73,6 +76,7 @@ export class LoginComponent implements OnInit {
    });
  }

+  // submit function
  submit() {
    if (this.login) {
      this.loginFunction(this.newUser.username, this.newUser.password);
@@ -81,6 +85,7 @@ export class LoginComponent implements OnInit {
    }
  }

+  // switch between login and create user
  switch() {
    this.errorCreateUser = false;
    this.errorLogin = false;
--- a/src/app/component/management/management.component.ts
+++ b/src/app/component/management/management.component.ts
@@ -29,11 +29,9 @@ export class ManagementComponent implements OnInit {
  newUser: newUser = {password: "", username: ""};
  newLocation: LocationEntity = {location: "", lat: 0, lon: 0, region: ""};
  newWaypoint: newWaypoint = {description: "", img: "", lat: 0, locationName: "", lon: 0, name: ""};
-
  locations: LocationEntity[] | undefined;
  waypoints: WaypointsEntity[] | undefined;
  users: UserEntity[] | undefined;
-
  translations: managementTranslations = {} as managementTranslations

  constructor(
@@ -50,6 +48,7 @@ export class ManagementComponent implements OnInit {
  ngOnInit(): void {
    this.translations = this.readTranslationJsonService.getManagementTranslations();
    this.username = this.cookieService.getUsername();
+    // check if user is admin
    this.userService.getUser(this.username).subscribe(user => {
      if (user !== null) {
        if (user.admin == false) {
@@ -59,8 +58,8 @@ export class ManagementComponent implements OnInit {
        this.cookieService.deleteUsername();
        this.route.navigate(['/login']);
      }
-
    });
+    // get all locations, waypoints and users
    this.locationService.getLocations().subscribe(locations => {
      this.locations = locations;
    });
@@ -72,6 +71,7 @@ export class ManagementComponent implements OnInit {
    });
  }

+  // show user form
  formUser(username: string, password: string) {
    if (this.edit) {
      const user: UserEntity = {id: this.id, username: username, password: password};
@@ -82,6 +82,7 @@ export class ManagementComponent implements OnInit {
    }
  }

+  // show location form
  formLocation(name: string, region: string, lat: number, lon: number) {
    if (this.edit) {
      const location: LocationEntity = {location: name, region: region, lat: lat, lon: lon};
@@ -92,6 +93,7 @@ export class ManagementComponent implements OnInit {
    }
  }

+  // show waypoint form
  formWaypoint(name: string, lat: number, lon: number, description: string, image: string, locationName: string) {
    if (this.edit) {
      const waypoint: WaypointsEntity = {
@@ -110,6 +112,7 @@ export class ManagementComponent implements OnInit {
    }
  }

+  // add user to database
  addUser(username: string, password: string) {
    this.newUser = {username: username, password: password};
    this.userService.createUser(this.newUser).subscribe(user => {
@@ -118,6 +121,7 @@ export class ManagementComponent implements OnInit {
    this.closeUserForm();
  }

+  // add location to database
  addLocation(name: string, region: string, lat: number, lon: number) {
    this.newLocation = {location: name, region: region, lat: lat, lon: lon};
    console.log("newLocation")
@@ -128,6 +132,7 @@ export class ManagementComponent implements OnInit {
    this.closeLocationForm()
  }

+  // add waypoint to database
  addWaypoint(name: string, lat: number, lon: number, description: string, image: string, locationName: string) {
    this.newWaypoint = {
      description: description,
@@ -143,24 +148,28 @@ export class ManagementComponent implements OnInit {
    this.closeWaypointForm();
  }

+  // delete location from database
  deleteLocation(location: string) {
    this.locationService.deleteLocation(location).subscribe(location => {
      this.locations?.splice(this.locations?.indexOf(location), 1);
    });
  }

+  // delete waypoint from database
  deleteWaypoint(id: number) {
    this.waypointService.deleteWaypoint(id).subscribe(waypoint => {
      this.waypoints?.splice(this.waypoints?.indexOf(waypoint), 1);
    });
  }

+  // delete user from database
  deleteUser(id: number) {
    this.userService.deleteUser(id).subscribe(user => {
      this.users?.splice(this.users?.indexOf(user), 1);
    });
  }

+  // edit location in database
  editLocation(location: LocationEntity) {
    this.locationService.updateLocation(location).subscribe(location => {
      this.locations?.splice(this.locations?.indexOf(location), 1, location);
@@ -168,6 +177,7 @@ export class ManagementComponent implements OnInit {
    this.closeLocationForm()
  }

+  // edit waypoint in database
  editWaypoint(waypoint: WaypointsEntity) {
    this.waypointService.updateWaypoint(waypoint, waypoint.id).subscribe(waypoint => {
      this.waypoints?.splice(this.waypoints?.indexOf(waypoint), 1, waypoint);
@@ -175,6 +185,7 @@ export class ManagementComponent implements OnInit {
    this.closeWaypointForm()
  }

+  // edit user in database
  editUser(user: UserEntity) {
    this.userService.updateUser(user, user.id).subscribe(user => {
      this.users?.splice(this.users?.indexOf(user), 1, user);
@@ -182,12 +193,15 @@ export class ManagementComponent implements OnInit {
    this.closeUserForm()
  }

+
+  // open edit location forms
  openEditLocationForm(location: LocationEntity) {
    this.newLocation = location;
    this.edit = true;
    this.showLocationForm = true;
  }

+  // open edit waypoint forms
  openEditWaypointForm(waypoint: WaypointsEntity) {
    this.newWaypoint = waypoint;
    this.id = waypoint.id;
@@ -195,6 +209,7 @@ export class ManagementComponent implements OnInit {
    this.showWaypointForm = true;
  }

+  // open edit user forms
  openEditUserForm(user: UserEntity) {
    this.newUser = user;
    this.id = user.id;
@@ -202,28 +217,34 @@ export class ManagementComponent implements OnInit {
    this.showUserForm = true;
  }

+  // open user form
  openUserForm() {
    this.showUserForm = true;
  }

+  // open waypoint form
  openWaypointForm() {
    this.showWaypointForm = true;
  }

+  // open location form
  openLocationForm() {
    this.showLocationForm = true;
  }

+  // close user forms
  closeUserForm() {
    this.showUserForm = false;
    this.newUser = {username: '', password: ''};
  }

+  // close location forms
  closeLocationForm() {
    this.showLocationForm = false;
    this.newLocation = {location: '', region: '', lat: 0, lon: 0};
  }

+  // close waypoint forms
  closeWaypointForm() {
    this.showWaypointForm = false;
    this.newWaypoint = {description: "", img: "", lat: 0, locationName: "", lon: 0, name: ""};
--- a/src/app/service/http/location.service.ts
+++ b/src/app/service/http/location.service.ts
@@ -10,28 +10,34 @@ const LOCATION = BASE_URL + "/location";
  providedIn: 'root',
 })

+
 export class LocationService {
  constructor(
    private http: HttpClient,
  ) {
  }

+  // get all locations
  getLocations() {
    return this.http.get<LocationEntity[]>(LOCATION);
  }

+  // get location by location
  getLocation(location: string) {
    return this.http.get<LocationEntity>(LOCATION + "/" + location);
  }

+  // create location
  createLocation(location: LocationEntity) {
    return this.http.post<LocationEntity>(LOCATION, location);
  }

+  // update location
  updateLocation(location: LocationEntity) {
    return this.http.put<LocationEntity>(LOCATION+"/"+location.location, location);
  }

+  // delete location
  deleteLocation(location: string) {
    return this.http.delete<LocationEntity>(LOCATION +"/"+ location);
  }
--- a/src/app/service/http/user.service.ts
+++ b/src/app/service/http/user.service.ts
@@ -18,11 +18,11 @@ export class UserService {
  ) {
  }

+// get all users
  getUsers() {
    return this.http.get<UserEntity[]>(USER);
  }

-
  getUser(username: string) {
    return this.http.get<UserEntity>(USER + "/" + username).pipe(
      catchError(error => {
@@ -35,8 +35,6 @@ export class UserService {
    );
  }

-
-
  getUserById(id: number) {
    return this.http.get<UserEntity>(GET_USER_BY_ID + "/" + id);
  }