diff --git a/src/app/component/list/list.component.ts b/src/app/component/list/list.component.ts index f5df874..4086238 100644 --- a/src/app/component/list/list.component.ts +++ b/src/app/component/list/list.component.ts @@ -73,21 +73,6 @@ export class ListComponent implements OnInit, OnChanges { setTimeout(() => { if (!this.positionCord) { this.positionNotFound = true; - } else { - if (this.waypoints) { - if (!this.waypoints[0].distance) { - this.positionNotFound = true; - } else { - this.positionNotFound = false; - } - } - if (this.locations) { - if (!this.locations[0].distance) { - this.positionNotFound = true; - } else { - this.positionNotFound = false; - } - } } }, 5000); } diff --git a/src/app/component/management/management.component.html b/src/app/component/management/management.component.html index 78d93c2..ee45ca6 100644 --- a/src/app/component/management/management.component.html +++ b/src/app/component/management/management.component.html @@ -5,13 +5,25 @@ Management -

Users

+ + + +

{{translations.users}}

- - - + + + @@ -26,40 +38,40 @@
-

Add User

+

{{translations.addUserButton}}

- +
- +
- +
- + - +
-

Locations

+

{{translations.locations}}

NameUsernamePassword{{ translations.name }}{{translations.username}}{{translations.password}}
- - - - + + + + @@ -75,49 +87,49 @@
-

Add Location

+

{{translations.addLocationButton}}

- +
- +
- +
- +
- + - +
-

Waypoints

+

{{translations.waypoints}}

LocationRegionLatitudeLongitude{{translations.location}}{{translations.region}}{{translations.lat}}{{translations.lon}}
- - - - - + + + + + @@ -134,50 +146,50 @@
-

Add Location

+

{{translations.addWaypointButton}}

+ (submit)="addWaypoint(newWaypoint.name, newWaypoint.lat, newWaypoint.lon, newWaypoint.description, newWaypoint.img, newWaypoint.locationName)">
- +
- +
- +
- +
- +
- +
- + - +
diff --git a/src/app/component/management/management.component.ts b/src/app/component/management/management.component.ts index b62ba1b..fde46d0 100644 --- a/src/app/component/management/management.component.ts +++ b/src/app/component/management/management.component.ts @@ -6,6 +6,10 @@ import {ActivatedRoute} from "@angular/router"; import {LocationService} from "../../service/http/location.service"; import {UserService} from "../../service/http/user.service"; import {WaypointService} from "../../service/http/waypoint.service"; +import {toNumbers} from "@angular/compiler-cli/src/version_helpers"; +import {managementTranslations} from "../../interface/translations"; +import {TranslateService} from "../../service/language/translate.service"; +import {ReadTranslateJsonService} from "../../service/language/readTranslateJson.service"; @Component({ selector: 'app-home', @@ -18,24 +22,29 @@ export class ManagementComponent implements OnInit { showLocationForm: boolean = false; showWaypointForm: boolean = false; - newUser: UserEntity; - newLocation: LocationEntity; - newWaypoint: WaypointsEntity; + newUser: UserEntity = {name: "", password: "", username: ""}; + newLocation: LocationEntity = {lat: 0, location: "", lon: 0, region: ""}; + newWaypoint: WaypointsEntity = {description: "", img: "", lat: 0, locationName: "", lon: 0, name: ""}; locations: LocationEntity[] | undefined; waypoints: WaypointsEntity[] | undefined; users: UserEntity[] | undefined; + translations: managementTranslations = {} as managementTranslations + constructor( private route: ActivatedRoute, private locationService: LocationService, private waypointService: WaypointService, private userService: UserService, + private translateService: TranslateService, + private readTranslationJsonService: ReadTranslateJsonService, ) { } ngOnInit(): void { + this.translations = this.readTranslationJsonService.getManagementTranslations(); this.locationService.getLocations().subscribe(locations => { this.locations = locations; }); @@ -56,15 +65,15 @@ export class ManagementComponent implements OnInit { } addLocation(name: string, region: string, lat: number, lon: number) { - this.newLocation = {name: name, region: region, lat: lat, lon: lon}; + this.newLocation = {location: name, region: region, lat: lat, lon: lon}; this.locationService.createLocation(this.newLocation).subscribe(location => { this.locations?.push(location); }); this.showLocationForm = false; } - addWaypoint(name: string, lat: string, lon: string, description: string, image: string, locationName: string) { - this.newWaypoint = {name: name, lat: lat, lon: lon, description: description, img: image, locationName: locationName}; + addWaypoint(name: string, lat: number, lon: number, description: string, image: string, locationName: string) { + this.newWaypoint = {description: description, img: image, lat: lat, locationName: locationName, lon: lon, name: name} this.waypointService.createWaypoint(this.newWaypoint).subscribe(waypoint => { this.waypoints?.push(waypoint); }); @@ -94,4 +103,28 @@ export class ManagementComponent implements OnInit { closeWaypointForm() { this.showWaypointForm = false; } + + async switchLanguage(lang: string) { + this.translations.users = await this.translateService.getData(this.translations.users, lang); + this.translations.locations = await this.translateService.getData(this.translations.locations, lang); + this.translations.waypoints = await this.translateService.getData(this.translations.waypoints, lang); + this.translations.name = await this.translateService.getData(this.translations.name, lang); + this.translations.username = await this.translateService.getData(this.translations.username, lang); + this.translations.password = await this.translateService.getData(this.translations.password, lang); + this.translations.location = await this.translateService.getData(this.translations.location, lang); + this.translations.region = await this.translateService.getData(this.translations.region, lang); + this.translations.lat = await this.translateService.getData(this.translations.lat, lang); + this.translations.lon = await this.translateService.getData(this.translations.lon, lang); + this.translations.description = await this.translateService.getData(this.translations.description, lang); + this.translations.locationName = await this.translateService.getData(this.translations.locationName, lang); + this.translations.image = await this.translateService.getData(this.translations.image, lang); + this.translations.translate = await this.translateService.getData(this.translations.translate, lang); + this.translations.addLocationButton = await this.translateService.getData(this.translations.addLocationButton, lang); + this.translations.addUserButton = await this.translateService.getData(this.translations.addUserButton, lang); + this.translations.addWaypointButton = await this.translateService.getData(this.translations.addWaypointButton, lang); + this.translations.add = await this.translateService.getData(this.translations.add, lang); + this.translations.close = await this.translateService.getData(this.translations.close, lang); + } + + protected readonly String = String; } diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index bc6241b..c48ebfd 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -1,12 +1,7 @@ .search { - display: flex; align-items: center; justify-content: center; flex-direction: column; - position: absolute; - top: 35%; - left: 50%; - transform: translate(-50%, -50%); } input { @@ -16,10 +11,8 @@ input { } #list { - position: absolute; - top: 46%; - left: 44%; - transform: translate(-50%, -50%); + align-self: center; + height: auto; justify-content: center; align-items: center; align-content: center; @@ -40,13 +33,13 @@ input { } .bg-image { + padding-top: 25%; background-image: url('src/assets/img/mountains.png'); background-size: cover; background-repeat: no-repeat; background-position: center center; - height: 100vh; + height: 94vh; + display: flex; + flex-direction: column; } -#translate{ - margin: 100px 10px 10px 10px; -} diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index 2545413..4a02806 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -1,6 +1,6 @@
-
+
@@ -11,7 +11,7 @@
-
+ +
+
diff --git a/src/app/interface/WaypointsEntity.ts b/src/app/interface/WaypointsEntity.ts index 3c98648..7c52dba 100644 --- a/src/app/interface/WaypointsEntity.ts +++ b/src/app/interface/WaypointsEntity.ts @@ -1,5 +1,5 @@ export interface WaypointsEntity { - id: number; + id?: number; name: string; lat: number; lon: number; diff --git a/src/app/interface/translations.ts b/src/app/interface/translations.ts index f944289..a56c7d7 100644 --- a/src/app/interface/translations.ts +++ b/src/app/interface/translations.ts @@ -13,3 +13,24 @@ export interface listTranslations { positionNotFoundErrorMessage: string; } +export interface managementTranslations { + users: string; + locations: string; + waypoints: string; + name: string; + username: string; + password: string; + location: string; + region: string; + lat: string; + lon: string; + description: string; + locationName: string; + image: string; + translate: string; + addUserButton: string; + addLocationButton: string; + addWaypointButton: string; + add: string; + close: string; +} diff --git a/src/app/service/language/readTranslateJson.service.ts b/src/app/service/language/readTranslateJson.service.ts index 172c6a6..90b6ff2 100644 --- a/src/app/service/language/readTranslateJson.service.ts +++ b/src/app/service/language/readTranslateJson.service.ts @@ -1,6 +1,6 @@ import {Injectable} from '@angular/core'; import {HttpClient} from "@angular/common/http"; -import {homeTranslations} from "../../interface/translations"; +import {homeTranslations, managementTranslations} from "../../interface/translations"; import {listTranslations} from "../../interface/translations"; @Injectable({ @@ -9,6 +9,7 @@ import {listTranslations} from "../../interface/translations"; export class ReadTranslateJsonService { private homeTranslations: homeTranslations = {} as homeTranslations; // declares a private object to hold the home translations private listTranslation: listTranslations = {} as listTranslations; // declares a private object to hold the list translations + private managementTransaltion: managementTranslations = {} as managementTranslations; // declares a private object to hold the management translations constructor(private http: HttpClient) { // loads the home translations from the assets file for the English language @@ -29,6 +30,29 @@ export class ReadTranslateJsonService { this.listTranslation.positionNotFoundErrorMessage = data.positionNotFoundErrorMessage; console.log("data loaded", this.homeTranslations) }); + + this.http.get('assets/i18n/management/en.json').subscribe(data => { + this.managementTransaltion.translate = data.translate; + this.managementTransaltion.users = data.users; + this.managementTransaltion.locations = data.locations; + this.managementTransaltion.waypoints = data.waypoints; + this.managementTransaltion.name = data.name; + this.managementTransaltion.username = data.username; + this.managementTransaltion.password = data.password; + this.managementTransaltion.location = data.location; + this.managementTransaltion.region = data.region; + this.managementTransaltion.lat = data.lat; + this.managementTransaltion.lon = data.lon; + this.managementTransaltion.description = data.description; + this.managementTransaltion.locationName = data.locationName; + this.managementTransaltion.image = data.image; + this.managementTransaltion.addUserButton = data.addUserButton; + this.managementTransaltion.addLocationButton = data.addLocationButton; + this.managementTransaltion.addWaypointButton = data.addWaypointButton; + this.managementTransaltion.add = data.add; + this.managementTransaltion.close = data.close; + console.log("data loaded", this.homeTranslations) + }); } // returns the home translations object @@ -40,4 +64,8 @@ export class ReadTranslateJsonService { getListTransaltions(): listTranslations { return this.listTranslation; } + + getManagementTranslations(): managementTranslations { + return this.managementTransaltion; + } } diff --git a/src/assets/i18n/management/en.json b/src/assets/i18n/management/en.json new file mode 100644 index 0000000..ab6df28 --- /dev/null +++ b/src/assets/i18n/management/en.json @@ -0,0 +1,21 @@ +{ + "users": "Users", + "locations": "Locations", + "waypoints": "Waypoints", + "name": "Name", + "username": "Username", + "password": "Password", + "location": "Location", + "region": "Region", + "lat": "Latitude", + "lon": "Longitude", + "description": "Description", + "locationName": "Location Name", + "image": "Image", + "translate": "Translate", + "addUserButton": "Add User", + "addLocationButton": "Add Location", + "addWaypointButton": "Add Waypoint", + "add": "Add", + "close": "Close" +}
NameLatitudeLongitudeDescriptionLocation Name{{translations.name}}{{translations.lat}}{{translations.lon}}{{translations.description}}{{translations.locationName}}