From 6f1fa63729993cc6ac9aeedf6b4207f8f59d95a0 Mon Sep 17 00:00:00 2001 From: Mirza Hamzic Date: Mon, 21 Oct 2024 08:39:18 +0200 Subject: [PATCH 1/4] Add dev/test database based on env variable --- backend/config/db.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/backend/config/db.js b/backend/config/db.js index 38f0589..adae119 100644 --- a/backend/config/db.js +++ b/backend/config/db.js @@ -3,7 +3,10 @@ const dotenv = require('dotenv'); dotenv.config(); -const sequelize = new Sequelize(process.env.DATABASE_URL, { +const isProduction = process.env.NODE_ENV === 'production'; +const databaseUrl = isProduction ? process.env.DATABASE_URL : process.env.DEV_DATABASE_URL; + +const sequelize = new Sequelize(databaseUrl, { dialect: 'postgres', logging: false, }); From 8bb01c3aeb67c0ca34cde3ad74d44a5c5e92363e Mon Sep 17 00:00:00 2001 From: Mirza Hamzic Date: Mon, 21 Oct 2024 09:01:04 +0200 Subject: [PATCH 2/4] Add port use check --- backend/server.js | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/backend/server.js b/backend/server.js index 286ba45..dcd5baf 100644 --- a/backend/server.js +++ b/backend/server.js @@ -29,9 +29,22 @@ const startServer = async () => { await initModels(); const PORT = process.env.PORT || 5100; - app.listen(PORT, () => { + const FALLBACK_PORT = 5200; + + const server = app.listen(PORT, () => { console.log(`Server is running on port ${PORT}`); }); + + server.on('error', (err) => { + if (err.code === 'EADDRINUSE') { + console.error(`Port ${PORT} is already in use. Trying port ${FALLBACK_PORT}...`); + app.listen(FALLBACK_PORT, () => { + console.log(`Server is running on port ${FALLBACK_PORT}`); + }); + } else { + console.error('Server error:', err); + } + }); }; startServer(); \ No newline at end of file From a2709ecb11eb84a948730877d852845c56a53348 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tarik=20Dedi=C4=87?= Date: Mon, 21 Oct 2024 20:59:21 +0200 Subject: [PATCH 3/4] Location fetch from db with images from front assets - smaller adjustments on UI --- .../components/table/table.component.html | 52 +++++++++--------- .../pages/locations/locations.component.html | 2 +- .../pages/locations/locations.component.ts | 28 +++++++++- .../item-list/item-list.component.html | 2 +- .../location-card.component.html | 4 +- .../src/app/home/pages/home/home.component.ts | 3 +- .../pages/location/location.component.html | 27 ++++----- .../home/pages/location/location.component.ts | 21 +++++-- .../src/app/shared/models/location.model.ts | 7 ++- .../app/shared/services/location.service.ts | 8 ++- .../{smet.jpg => konjicki_klub_smet.jpg} | Bin 11 files changed, 96 insertions(+), 58 deletions(-) rename frontend/src/assets/images/{smet.jpg => konjicki_klub_smet.jpg} (100%) diff --git a/frontend/src/app/admin/components/table/table.component.html b/frontend/src/app/admin/components/table/table.component.html index a646ff7..d05b826 100644 --- a/frontend/src/app/admin/components/table/table.component.html +++ b/frontend/src/app/admin/components/table/table.component.html @@ -14,33 +14,33 @@ {{ row[column.key] }} - - - -
- - - -
- + + + + + diff --git a/frontend/src/app/admin/pages/locations/locations.component.html b/frontend/src/app/admin/pages/locations/locations.component.html index 50b6083..48b3191 100644 --- a/frontend/src/app/admin/pages/locations/locations.component.html +++ b/frontend/src/app/admin/pages/locations/locations.component.html @@ -1 +1 @@ -

Lokacije

\ No newline at end of file + \ No newline at end of file diff --git a/frontend/src/app/admin/pages/locations/locations.component.ts b/frontend/src/app/admin/pages/locations/locations.component.ts index 68a77ca..fe35c37 100644 --- a/frontend/src/app/admin/pages/locations/locations.component.ts +++ b/frontend/src/app/admin/pages/locations/locations.component.ts @@ -1,14 +1,40 @@ import { Component } from '@angular/core'; import { RouterLink } from '@angular/router'; +import { Location } from 'src/app/shared/models/location.model'; +import { LocationService } from 'src/app/shared/services/location.service'; +import { TableComponent } from '../../components/table/table.component'; @Component({ selector: 'app-locations', standalone: true, - imports: [RouterLink], + imports: [RouterLink, TableComponent], templateUrl: './locations.component.html', styleUrls: ['./locations.component.scss'] }) export class LocationsComponent { + columns = [ + { key: 'id', label: 'ID' }, + { key: 'image', label: 'Slika' }, + { key: 'name', label: 'Ime' }, + { key: 'description', label: 'Opis' }, + { key: 'actions', label: 'Akcije' } + ]; + locations: Location[] = []; + constructor(private locationService: LocationService) {} + + ngOnInit(): void { + this.getUsers(); + } + + getUsers() { + this.locationService.getLocations().subscribe({ + next: (locations: Location[]) => { + this.locations = locations; + }, + error: err => console.error('Observable emitted an error: ' + err), + complete: () => console.log('Observable emitted the complete notification') + }); + } onClick() { console.log('Link clicked!'); } diff --git a/frontend/src/app/home/components/item-list/item-list.component.html b/frontend/src/app/home/components/item-list/item-list.component.html index b2e69b4..dac4c7f 100644 --- a/frontend/src/app/home/components/item-list/item-list.component.html +++ b/frontend/src/app/home/components/item-list/item-list.component.html @@ -9,7 +9,7 @@ class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8">
- {{item.name}} + {{item.name}}

{{item.name}}

diff --git a/frontend/src/app/home/components/location-card/location-card.component.html b/frontend/src/app/home/components/location-card/location-card.component.html index 71b49c3..fbf9079 100644 --- a/frontend/src/app/home/components/location-card/location-card.component.html +++ b/frontend/src/app/home/components/location-card/location-card.component.html @@ -11,14 +11,14 @@

{{ location.name }} + src="../../../../assets/images/{{location.image}}" alt="{{ location.name }}">
- {{ location.type }} + {{ location.Category.name }}

{{ location.description | slice:0:300 }}

diff --git a/frontend/src/app/home/pages/home/home.component.ts b/frontend/src/app/home/pages/home/home.component.ts index b7f4a38..8038105 100644 --- a/frontend/src/app/home/pages/home/home.component.ts +++ b/frontend/src/app/home/pages/home/home.component.ts @@ -15,6 +15,7 @@ import { Title, Meta } from '@angular/platform-browser'; }) export class HomeComponent implements OnInit { locations: Location[] = []; + constructor(private locationService: LocationService, private title: Title, private meta: Meta) { this.title.setTitle('Početna - Dobro došli'); this.meta.addTags([ @@ -25,7 +26,7 @@ export class HomeComponent implements OnInit { ngOnInit() { this.locationService.getLocations().subscribe(data => { - this.locations = data.locations; // Assuming 'locations' is the key in your JSON + this.locations = data; // Assuming 'locations' is the key in your JSON }); } } diff --git a/frontend/src/app/home/pages/location/location.component.html b/frontend/src/app/home/pages/location/location.component.html index 15859d6..54b6fc2 100644 --- a/frontend/src/app/home/pages/location/location.component.html +++ b/frontend/src/app/home/pages/location/location.component.html @@ -1,28 +1,23 @@ -
+
+
+
+
- +
- + -
- +
+

{{ infoWindowContent.name }}

@@ -31,4 +26,4 @@

{{ infoWindowContent.name }}

-
+
\ No newline at end of file diff --git a/frontend/src/app/home/pages/location/location.component.ts b/frontend/src/app/home/pages/location/location.component.ts index f05ce9b..76abdcc 100644 --- a/frontend/src/app/home/pages/location/location.component.ts +++ b/frontend/src/app/home/pages/location/location.component.ts @@ -26,6 +26,7 @@ export class LocationComponent implements OnInit { }; zoom = 12; markers: Marker[] = []; + loading: boolean = true; options: google.maps.MapOptions = { mapTypeId: 'hybrid', zoomControl: true, @@ -59,17 +60,25 @@ export class LocationComponent implements OnInit { constructor(private locationService: LocationService) {} ngOnInit() { - this.locationService.getLocations().subscribe(data => { - this.locations = data.locations; // Assuming 'locations' is the key in your JSON - this.loadMarkers(); - }) + this.locationService.getLocations().subscribe({ + next: (locations: Location[]) => { + this.locations = locations; + this.loadMarkers(); + }, + error: err => console.error('Observable emitted an error: ' + err), + complete: () => this.loading = false + }); } loadMarkers() { - this.locations.forEach(location => { + this.locations.forEach((location: Location) => { + let coordinates = { + lat: location.latitude, + lng: location.longitude + } this.markers.push( { - position: location.coordinates, + position: coordinates, title: location.name, image: location.image }, diff --git a/frontend/src/app/shared/models/location.model.ts b/frontend/src/app/shared/models/location.model.ts index cd5ebbc..3aafc70 100644 --- a/frontend/src/app/shared/models/location.model.ts +++ b/frontend/src/app/shared/models/location.model.ts @@ -4,13 +4,18 @@ export interface WorkingHours { close: string; // e.g., "17:00" } export interface Location { + latitude: number; + longitude: number, id: number; name: string; description: string, address: string; type: string; image?: string; - coordinates: google.maps.LatLngLiteral; + Category: { + name: string, + id: number + } } export interface LocationWithHours extends Location { diff --git a/frontend/src/app/shared/services/location.service.ts b/frontend/src/app/shared/services/location.service.ts index 84698f3..4e5c8ed 100644 --- a/frontend/src/app/shared/services/location.service.ts +++ b/frontend/src/app/shared/services/location.service.ts @@ -1,16 +1,18 @@ import { Injectable } from '@angular/core'; import { Observable } from 'rxjs/internal/Observable'; import { HttpClient } from '@angular/common/http'; +import { Location } from '../models/location.model'; +import { environment } from 'src/environments/environment'; @Injectable({ providedIn: 'root' }) export class LocationService { - private jsonUrl = 'assets/data/data.json'; // Path to your JSON file + private apiUrl = environment.apiUrl; constructor(private http: HttpClient) {} - getLocations(): Observable { - return this.http.get(this.jsonUrl); + getLocations(): Observable { + return this.http.get(this.apiUrl + '/locations'); } } diff --git a/frontend/src/assets/images/smet.jpg b/frontend/src/assets/images/konjicki_klub_smet.jpg similarity index 100% rename from frontend/src/assets/images/smet.jpg rename to frontend/src/assets/images/konjicki_klub_smet.jpg From 332b8195eb00bef6b150316663450c2437e45e62 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tarik=20Dedi=C4=87?= Date: Mon, 21 Oct 2024 21:25:07 +0200 Subject: [PATCH 4/4] Adjusting if there is no data in location page + adding spinner --- .../pages/location/location.component.html | 19 ++++++++++++++----- .../home/pages/location/location.component.ts | 2 +- frontend/src/environments/environment.ts | 2 +- 3 files changed, 16 insertions(+), 7 deletions(-) diff --git a/frontend/src/app/home/pages/location/location.component.html b/frontend/src/app/home/pages/location/location.component.html index 54b6fc2..a4b78b5 100644 --- a/frontend/src/app/home/pages/location/location.component.html +++ b/frontend/src/app/home/pages/location/location.component.html @@ -4,11 +4,20 @@
- - - - +
+ + + + +
+ +
+

+ Nema podataka. +

+
+
diff --git a/frontend/src/app/home/pages/location/location.component.ts b/frontend/src/app/home/pages/location/location.component.ts index 76abdcc..5a626f5 100644 --- a/frontend/src/app/home/pages/location/location.component.ts +++ b/frontend/src/app/home/pages/location/location.component.ts @@ -65,7 +65,7 @@ export class LocationComponent implements OnInit { this.locations = locations; this.loadMarkers(); }, - error: err => console.error('Observable emitted an error: ' + err), + error: err => this.loading = false, complete: () => this.loading = false }); } diff --git a/frontend/src/environments/environment.ts b/frontend/src/environments/environment.ts index 30ba284..fe36f2f 100644 --- a/frontend/src/environments/environment.ts +++ b/frontend/src/environments/environment.ts @@ -1,4 +1,4 @@ export const environment = { production: false, - apiUrl: 'http://localhost:5500/api' + apiUrl: 'http://localhost:4000/api' };