From 0212ac466097564dd1351dc4e206f90e048a498b Mon Sep 17 00:00:00 2001 From: Nikodem Keller Date: Mon, 30 Sep 2024 12:46:50 +0200 Subject: [PATCH 1/4] Loading data communique --- .../map-location-edit.component.html | 8 +++ .../map-location-edit.component.ts | 11 +++- .../map-location-list.component.html | 9 +++ .../map-location-list.component.ts | 21 ++++-- .../map-location-modal.component.html | 6 ++ .../map-location-modal.component.ts | 65 +++++++++++-------- .../route-list/route-list.component.html | 10 +++ .../route/route-list/route-list.component.ts | 58 ++++++++++++----- src/proxy.conf.json | 2 +- 9 files changed, 137 insertions(+), 53 deletions(-) diff --git a/src/app/map-location/map-location-edit/map-location-edit.component.html b/src/app/map-location/map-location-edit/map-location-edit.component.html index eb7773b..ca0f498 100644 --- a/src/app/map-location/map-location-edit/map-location-edit.component.html +++ b/src/app/map-location/map-location-edit/map-location-edit.component.html @@ -85,6 +85,14 @@

Audio Files

+
+

Loading audio files, please wait...

+
+ +
+

Error loading audio files. Please try again later.

+
+
diff --git a/src/app/map-location/map-location-edit/map-location-edit.component.ts b/src/app/map-location/map-location-edit/map-location-edit.component.ts index bb0fd51..4b14a2d 100644 --- a/src/app/map-location/map-location-edit/map-location-edit.component.ts +++ b/src/app/map-location/map-location-edit/map-location-edit.component.ts @@ -43,6 +43,8 @@ export class MapLocationEditComponent implements OnInit { selectedAudioFile: File | null = null; temporaryAudioData: { audio: Audio, url: SafeUrl,file: File }[] = []; returnUrl: string | null = null; + isLoadingAudio = false; + isErrorAudio = false; constructor(private activatedRoute: ActivatedRoute, private router: Router, @@ -297,8 +299,9 @@ export class MapLocationEditComponent implements OnInit { }); } - private fetchMapLocationAudio() { - + fetchMapLocationAudio() { + this.isLoadingAudio = true; + this.isErrorAudio = false; this.mapLocationService.getMapLocationsById(this.mapLocationId).subscribe(response => { this.mapLocation = response; @@ -326,7 +329,11 @@ export class MapLocationEditComponent implements OnInit { }); Promise.all(audioPromises).then(() => { + this.isLoadingAudio = false; }); + }, error => { + this.isErrorAudio = true; + this.isLoadingAudio = false; }); }); } diff --git a/src/app/map-location/map-location-list/map-location-list.component.html b/src/app/map-location/map-location-list/map-location-list.component.html index bd2302a..62f7eec 100644 --- a/src/app/map-location/map-location-list/map-location-list.component.html +++ b/src/app/map-location/map-location-list/map-location-list.component.html @@ -1,4 +1,13 @@
    + +
    +

    Loading map locations, please wait...

    +
    + +
    +

    Error loading map locations. Please try again later.

    +
    +
  • { - this.mapLocations = response.content; - this.mapService.routeSelectedEventEmitter.emit(this.mapLocations); - }); + .subscribe( + response => { + this.mapLocations = response.content; + this.mapService.routeSelectedEventEmitter.emit(this.mapLocations); + this.isLoading = false; + }, + error => { + this.isError = true; + this.isLoading = false; + console.error('Error fetching map locations:', error); + } + ); } } diff --git a/src/app/map-location/map-location-modal/map-location-modal.component.html b/src/app/map-location/map-location-modal/map-location-modal.component.html index cb20164..db61bcf 100644 --- a/src/app/map-location/map-location-modal/map-location-modal.component.html +++ b/src/app/map-location/map-location-modal/map-location-modal.component.html @@ -11,6 +11,12 @@
    {{mapLocation.name}}
    Navigate
      • +
      +

      Loading audio files, please wait...

      +
      +
      +

      Error loading audio files. Please try again later.

      +
    • diff --git a/src/app/map-location/map-location-modal/map-location-modal.component.ts b/src/app/map-location/map-location-modal/map-location-modal.component.ts index 40f554e..83c50ef 100644 --- a/src/app/map-location/map-location-modal/map-location-modal.component.ts +++ b/src/app/map-location/map-location-modal/map-location-modal.component.ts @@ -29,6 +29,8 @@ export class MapLocationModalComponent implements OnInit { audiosEntities: Audio[] = []; audioData: { audio: Audio, url: SafeUrl }[] = []; mobileVersion: boolean; + isError: boolean; + isLoading: boolean; constructor( private mapLocationService: MapLocationService, @@ -50,49 +52,56 @@ export class MapLocationModalComponent implements OnInit { } } - //fetch images for map locations + private fetchMapLocationImage() { this.mapLocationService.getMapLocationImageById(this.mapLocation.id).subscribe({ next: (response: Blob | null) => { if (response) { - //convert Blob (raw byte object) to url to display it in the template const objectURL = URL.createObjectURL(response); this.mapLocationImageUrl = this.sanitizer.bypassSecurityTrustUrl(objectURL); - } - }, + }}, error: (error: any) => { - // } }); } private fetchMapLocationAudio() { + this.isLoading= true; + this.isError = false; this.audiosEntities = []; this.audioData = []; - - this.audioService.getAudiosByMapLocation(this.mapLocation, 0, maxPageSize).subscribe(response => { - this.audiosEntities = response.content; - - const audioPromises = this.audiosEntities.map((audio, index) => { - return this.audioService.getAudioFileByAudio(audio).toPromise() - .then(response => { - let audioUrl: SafeUrl = null; - if (response) { - const objectURL = URL.createObjectURL(response); - audioUrl = this.sanitizer.bypassSecurityTrustUrl(objectURL); - } - this.audioData[index] = {audio: audio, url: audioUrl}; - }) - .catch(error => { - console.log("getaudio error", error); - this.audioData[index] = {audio: audio, url: null}; - }); - }); - - Promise.all(audioPromises).then(() => { - // All audio files fetched and URLs are set - }); + this.audioService.getAudiosByMapLocation(this.mapLocation, 0, maxPageSize).subscribe({ + next: (response) => { + this.audiosEntities = response.content; + + const audioPromises = this.audiosEntities.map((audio, index) => { + return this.audioService.getAudioFileByAudio(audio).toPromise() + .then((audioBlob) => { + let audioUrl: SafeUrl = null; + if (audioBlob) { + const objectURL = URL.createObjectURL(audioBlob); + audioUrl = this.sanitizer.bypassSecurityTrustUrl(objectURL); + } + this.audioData[index] = {audio, url: audioUrl}; + }) + .catch(error => { + console.error("Error fetching audio:", error); + this.audioData[index] = {audio, url: null}; + }); + }); + Promise.all(audioPromises).then(() => { + this.isLoading = false; + }).catch(() => { + this.isError = true; + this.isLoading = false; + }); + }, + error: (error) => { + console.error('Error fetching audio:', error); + this.isError = true; + this.isLoading= false; + } }); } diff --git a/src/app/route/route-list/route-list.component.html b/src/app/route/route-list/route-list.component.html index 404d729..09ef6f3 100644 --- a/src/app/route/route-list/route-list.component.html +++ b/src/app/route/route-list/route-list.component.html @@ -25,6 +25,16 @@
      + +
      +

      Loading routes, please wait...

      +
      + + +
      +

      Error loading routes. Please try again later.

      +
      +
      diff --git a/src/app/route/route-list/route-list.component.ts b/src/app/route/route-list/route-list.component.ts index d7467da..43e0d99 100644 --- a/src/app/route/route-list/route-list.component.ts +++ b/src/app/route/route-list/route-list.component.ts @@ -45,6 +45,8 @@ export class RouteListComponent implements OnInit{ @Input() addingPointToRoute: boolean = false; @Input() pointIdToBeAdded: string; + protected isLoading: boolean; + protected isError: boolean; constructor(private routeService: RouteService, private router: Router, @@ -138,28 +140,48 @@ export class RouteListComponent implements OnInit{ } getRoutes() { + this.isLoading = true; // Ustawienie flagi ładowania na true + this.isError = false; // Resetowanie błędu przed nową próbą pobrania danych + this.validateQueryParams(); + if (this.userMode || this.addingPointToRoute) { - this.routeService.getRouteByUserId(this.currentPageNumber, defaultPageSize, this.routeNameToSearch).subscribe(response => { - this.routes = response.content; - this.totalPages = response.totalPages; - if (this.currentPageNumber > this.totalPages) { - this.currentPageNumber = this.totalPages; - this.onPageChanged(); - } - }); + this.routeService.getRouteByUserId(this.currentPageNumber, defaultPageSize, this.routeNameToSearch) + .subscribe( + response => { + this.routes = response.content; + this.totalPages = response.totalPages; + if (this.currentPageNumber > this.totalPages) { + this.currentPageNumber = this.totalPages; + this.onPageChanged(); + } + this.isLoading = false; + }, + error => { + this.isError = true; + this.isLoading = false; + console.error('Error fetching user routes:', error); + } + ); } else { - this.routeService.getRoutes(this.currentPageNumber, defaultPageSize, this.routeNameToSearch).subscribe(response => { - this.routes = response.content; - this.totalPages = response.totalPages; - if (this.currentPageNumber > this.totalPages) { - this.currentPageNumber = this.totalPages; - this.onPageChanged(); - - } - }); + this.routeService.getRoutes(this.currentPageNumber, defaultPageSize, this.routeNameToSearch) + .subscribe( + response => { + this.routes = response.content; + this.totalPages = response.totalPages; + if (this.currentPageNumber > this.totalPages) { + this.currentPageNumber = this.totalPages; + this.onPageChanged(); + } + this.isLoading = false; + }, + error => { + this.isError = true; + this.isLoading = false; + console.error('Error fetching routes:', error); + } + ); } - } validateQueryParams() { diff --git a/src/proxy.conf.json b/src/proxy.conf.json index 12bff4b..905eb96 100644 --- a/src/proxy.conf.json +++ b/src/proxy.conf.json @@ -1,6 +1,6 @@ { "/api": { - "target": "http://localhost:8090", + "target": "http://localhost:18120", "secure": false, "changeOrigin": true } From 5b3f8990e9e4071729170f4b1152f83970672246 Mon Sep 17 00:00:00 2001 From: Nikodem Keller Date: Mon, 30 Sep 2024 13:15:04 +0200 Subject: [PATCH 2/4] clean --- src/app/route/route-list/route-list.component.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/app/route/route-list/route-list.component.html b/src/app/route/route-list/route-list.component.html index 09ef6f3..d706c16 100644 --- a/src/app/route/route-list/route-list.component.html +++ b/src/app/route/route-list/route-list.component.html @@ -25,12 +25,11 @@
      - +

      Loading routes, please wait...

      -

      Error loading routes. Please try again later.

      From 38c7a35590eccd51ec0f69a9eabfd55ab3281cae Mon Sep 17 00:00:00 2001 From: Nikodem Keller Date: Tue, 1 Oct 2024 12:16:37 +0200 Subject: [PATCH 3/4] clean2 --- src/app/route/route-list/route-list.component.ts | 4 ++-- src/proxy.conf.json | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/app/route/route-list/route-list.component.ts b/src/app/route/route-list/route-list.component.ts index 43e0d99..3e0726b 100644 --- a/src/app/route/route-list/route-list.component.ts +++ b/src/app/route/route-list/route-list.component.ts @@ -140,8 +140,8 @@ export class RouteListComponent implements OnInit{ } getRoutes() { - this.isLoading = true; // Ustawienie flagi ładowania na true - this.isError = false; // Resetowanie błędu przed nową próbą pobrania danych + this.isLoading = true; + this.isError = false; this.validateQueryParams(); diff --git a/src/proxy.conf.json b/src/proxy.conf.json index 905eb96..6bb9a0a 100644 --- a/src/proxy.conf.json +++ b/src/proxy.conf.json @@ -1,7 +1,7 @@ { "/api": { - "target": "http://localhost:18120", + "target": "http://localhost:8090", "secure": false, "changeOrigin": true } -} +}s From ff95ae865d7c487d27e66159d4fb622da3badf3c Mon Sep 17 00:00:00 2001 From: niksuu <108527214+niksuu@users.noreply.github.com> Date: Tue, 1 Oct 2024 12:32:35 +0200 Subject: [PATCH 4/4] Update proxy.conf.json --- src/proxy.conf.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/proxy.conf.json b/src/proxy.conf.json index 6bb9a0a..12bff4b 100644 --- a/src/proxy.conf.json +++ b/src/proxy.conf.json @@ -4,4 +4,4 @@ "secure": false, "changeOrigin": true } -}s +}