More translations

frontend/src/app/_components/back-btn/back-btn.component.html

@@ -1 +1 @@
-<button (click)="locationBackService.goBack()" id="backBtn" title="Go back"><i class="fas fa-arrow-left"></i> Torna indietro</button>
+<button (click)="locationBackService.goBack()" id="backBtn" [title]="'go_back'|translate|titlecase"><i class="fas fa-arrow-left"></i> {{ 'go_back'|translate|titlecase }}</button>

frontend/src/app/_components/back-btn/back-btn.module.ts

@@ -1,5 +1,6 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { TranslationModule } from '../../translation.module';
 
 import { BackBtnComponent } from './back-btn.component';
 
@@ -8,7 +9,8 @@ import { BackBtnComponent } from './back-btn.component';
     BackBtnComponent
   ],
   imports: [
-    CommonModule
+    CommonModule,
+    TranslationModule
   ],
   exports: [
     BackBtnComponent

frontend/src/app/_components/datetime-picker/datetime-picker.component.html

@@ -1,5 +1,5 @@
 <div class="input-group">
-    <input type="text" [disabled]="disabled" placeholder="Premi per selezionare data" class="form-control date-picker"
+    <input type="text" [disabled]="disabled" [placeholder]="'press_to_select_a_date'|translate|titlecase" class="form-control date-picker"
     bsDatepicker [bsConfig]="{ adaptivePosition: true, dateInputFormat: 'DD/MM/YYYY' }" [(ngModel)]="date" (ngModelChange)=updateValue()>
     <input type="time" [disabled]="disabled" class="form-control" [(ngModel)]="time" (change)=updateValue()>
 </div>

frontend/src/app/_components/datetime-picker/datetime-picker.module.ts

@@ -3,6 +3,7 @@ import { CommonModule } from '@angular/common';
 
 import { FormsModule } from '@angular/forms';
 import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
+import { TranslationModule } from '../../translation.module';
 
 import { DatetimePickerComponent } from './datetime-picker.component';
 
@@ -13,7 +14,8 @@ import { DatetimePickerComponent } from './datetime-picker.component';
   imports: [
     CommonModule,
     FormsModule,
-    BsDatepickerModule.forRoot()
+    BsDatepickerModule.forRoot(),
+    TranslationModule
   ],
   exports: [
     DatetimePickerComponent

frontend/src/app/_components/map-picker/map-picker.component.html

@@ -3,8 +3,8 @@
 </div>
 <div id="search" class="mt-2 mb-3">
   <div class="input-group mb-3">
-    <input type="text" class="form-control" placeholder="Luogo" [(ngModel)]="placeName" (keyup.enter)="searchPlace()">
-    <button class="btn btn-outline-secondary" type="button" (click)="searchPlace()">Cerca</button>
+    <input type="text" class="form-control" [placeholder]="'place'|translate|titlecase" [(ngModel)]="placeName" (keyup.enter)="searchPlace()">
+    <button class="btn btn-outline-secondary" type="button" (click)="searchPlace()">{{ 'search'|translate|titlecase }}</button>
   </div>
   <div id="results" *ngIf="isPlaceSearchResultsOpen">
     <li *ngFor="let result of placeSearchResults" (click)="selectPlace(result)">{{ result.display_name }}</li>

frontend/src/app/_components/map-picker/map-picker.module.ts

@@ -3,6 +3,7 @@ import { CommonModule } from '@angular/common';
 
 import { FormsModule } from '@angular/forms';
 import { LeafletModule } from '@asymmetrik/ngx-leaflet';
+import { TranslationModule } from '../../translation.module';
 
 import { MapPickerComponent } from './map-picker.component';
 
@@ -13,7 +14,8 @@ import { MapPickerComponent } from './map-picker.component';
   imports: [
     CommonModule,
     FormsModule,
-    LeafletModule
+    LeafletModule,
+    TranslationModule
   ],
   exports: [
     MapPickerComponent

frontend/src/app/_components/modal-availability-schedule/modal-availability-schedule.component.html

@@ -1,6 +1,6 @@
 <div class="modal-header">
     <h4 class="modal-title pull-left">{{ 'update_availability_schedule'|translate }}</h4>
-    <button type="button" class="btn-close close pull-right" aria-label="Close" (click)="bsModalRef.hide()">
+    <button type="button" class="btn-close close pull-right" [attr.aria-label]="'close'|translate|titlecase" (click)="bsModalRef.hide()">
         <span aria-hidden="true" class="visually-hidden">&times;</span>
     </button>
 </div>

frontend/src/app/_routes/edit-service/edit-service.component.html

@@ -3,29 +3,29 @@
 <form method="post" [formGroup]="serviceForm" (ngSubmit)="formSubmit()">
   <div class="container">
     <div class="form-group has-validation">
-      <label for="date-picker">Inizio</label>
+      <label for="date-picker">{{ 'start'|translate|titlecase }}</label>
       <datetime-picker formControlName="start" [class.is-invalid]="!isFieldValid('start')"></datetime-picker>
-      <div class="invalid-feedback" *ngIf="start.errors?.['required']">
-        Seleziona data e ora di inizio dell'intervento
+      <div class="invalid-feedback" *ngIf="start.errors?.['required']" translate>
+        edit_service.select_start_datetime
       </div>
     </div>
     <div class="form-group has-validation">
-      <label for="date-picker">Fine</label>
+      <label for="date-picker">{{ 'end'|translate|titlecase }}</label>
       <datetime-picker formControlName="end" [class.is-invalid]="!isFieldValid('end')"></datetime-picker>
-      <div class="invalid-feedback" *ngIf="end.errors?.['required']">
-        Seleziona data e ora di fine dell'intervento
+      <div class="invalid-feedback" *ngIf="end.errors?.['required']" translate>
+        edit_service.select_end_datetime
       </div>
     </div>
     <div class="form-group has-validation">
-      <label for="progressivo">Progressivo</label>
-      <input formControlName="code" [class.is-invalid]="!isFieldValid('code')" id="progressivo" class="form-control"
+      <label for="code">{{ 'code'|translate|titlecase }}</label>
+      <input formControlName="code" [class.is-invalid]="!isFieldValid('code')" id="code" class="form-control"
         type="text" placeholder="1234/5">
-      <div class="invalid-feedback" *ngIf="code.errors?.['required']">
-        Inserisci il progressivo dell'intervento
+      <div class="invalid-feedback" *ngIf="code.errors?.['required']" translate>
+        edit_service.insert_code
       </div>
     </div>
     <div class="form-group has-validation" [class.is-invalid-div]="!isFieldValid('chief')">
-      <label>Caposquadra</label>
+      <label>{{ 'chief'|translate|titlecase }}</label>
       <br>
       <ng-container *ngFor="let user of users">
         <div class="form-check">
@@ -38,7 +38,7 @@
       </ng-container>
     </div>
     <div class="form-group has-validation" [class.is-invalid-div]="!isFieldValid('drivers')">
-      <label>Autisti</label>
+      <label>{{ 'drivers'|translate|titlecase }}</label>
       <br>
       <ng-container *ngFor="let user of users">
         <div class="form-check" *ngIf="user.driver">
@@ -51,7 +51,7 @@
       </ng-container>
     </div>
     <div class="form-group has-validation" [class.is-invalid-div]="!isFieldValid('crew')">
-      <label>Altri membri della squadra</label>
+      <label translate>edit_service.other_crew_members</label>
       <br>
       <ng-container *ngFor="let user of users">
         <div class="form-check">
@@ -64,39 +64,39 @@
       </ng-container>
     </div>
     <div [class.is-invalid-div]="!isFieldValid('place')" class="mb-2">
-      <label>Luogo dell'intervento</label>
+      <label>{{ 'place'|translate|titlecase }}</label>
       <map-picker *ngIf="addingService" (onMarkerSet)="setPlace($event.lat, $event.lng)"></map-picker>
       <map-picker *ngIf="!addingService && loadedServiceLat !== ''" (onMarkerSet)="setPlace($event.lat, $event.lng)" [selectLat]="loadedServiceLat" [selectLng]="loadedServiceLng"></map-picker>
     </div>
     <div class="form-group">
-      <label for="notes">Note (es. altre informazioni)</label><br>
+      <label for="notes">{{ 'notes'|translate|titlecase }}</label><br>
       <textarea formControlName="notes" class="form-control" id="notes"></textarea>
     </div>
     <br>
     <div class="form-group">
-      <label>Tipologia</label>
+      <label>{{ 'type'|translate|titlecase }}</label>
       <br>
       <div class="input-group has-validation">
         <select formControlName="type" [class.is-invalid]="!isFieldValid('type')" class="form-control mr-2">
-          <option selected disabled>Seleziona tipologia..</option>
+          <option selected disabled translate>edit_service.select_type</option>
           <option *ngFor="let service_type of types" value="{{ service_type.id }}">{{ service_type.name }}</option>
         </select>
         <button class="btn btn-outline-secondary" type="button" tabindex="-1" (click)="addingType = true">
-          Aggiungi
+          {{ 'add'|translate|titlecase }}
         </button>
         <div class="invalid-feedback" *ngIf="type.errors?.['required']">
-          Seleziona una tipologia di intervento
+          edit_service.select_service_type
         </div>
       </div>
       <div class="input-group mb-2 mt-2" *ngIf="addingType">
-        <input type="text" class="form-control" placeholder="Nome della tipologia" [(ngModel)]="newType"
+        <input type="text" class="form-control" [placeholder]="'type'|translate" [(ngModel)]="newType"
           [ngModelOptions]="{standalone: true}">
-        <button class="btn btn-secondary" type="button" (click)="addType()">Invia</button>
+        <button class="btn btn-secondary" type="button" (click)="addType()">{{ 'chief'|translate|titlecase }}</button>
       </div>
     </div>
     <br>
-    <button id="submit_button" type="submit" class="btn btn-primary" [disabled]="submittingForm">Invia</button>
-    <button class="btn" type="button" (click)="formReset()" [disabled]="submittingForm">Reset</button>
+    <button id="submit_button" type="submit" class="btn btn-primary" [disabled]="submittingForm">{{ 'submit'|translate|titlecase }}</button>
+    <button class="btn" type="button" (click)="formReset()" [disabled]="submittingForm">{{ 'reset'|translate|titlecase }}</button>
     <div class="d-flex justify-content-center mt-2 pt-2 mb-3" *ngIf="submittingForm">
       <div class="spinner spinner-border"></div>
     </div>

frontend/src/app/_routes/edit-service/edit-service.module.ts

@@ -6,6 +6,7 @@ import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
 import { MapPickerModule } from '../../_components/map-picker/map-picker.module';
 import { DatetimePickerModule } from '../../_components/datetime-picker/datetime-picker.module';
 import { BackBtnModule } from '../../_components/back-btn/back-btn.module';
+import { TranslationModule } from '../../translation.module';
 
 import { EditServiceRoutingModule } from './edit-service-routing.module';
 import { EditServiceComponent } from './edit-service.component';
@@ -22,7 +23,8 @@ import { EditServiceComponent } from './edit-service.component';
     BsDatepickerModule.forRoot(),
     MapPickerModule,
     DatetimePickerModule,
-    BackBtnModule
+    BackBtnModule,
+    TranslationModule
   ]
 })
 export class EditServiceModule { }

frontend/src/app/_routes/list/list.component.html

@@ -1,8 +1,8 @@
 <div class="text-center">
     <h3 *ngIf="available !== undefined">{{ 'list.your_availability_is'|translate }} <b>{{ available ? ("available"|translate|uppercase) : ("unavailable"|translate|uppercase) }}{{ manual_mode ? "" : " ("+('programmed'|translate)+")" }}</b></h3>
     <div id="availability-btn-group">
-        <button (click)="changeAvailibility(1)" type="button" [delay]="1000" tooltip="Cambia la tua disponibilità in 'attivo'" id="activate-btn" class="btn btn-lg btn-success me-1">{{ 'set_available'|translate|titlecase }}</button>
-        <button (click)="changeAvailibility(0)" type="button" [delay]="1000" tooltip="Cambia la tua disponibilità in 'non attivo'" id="deactivate-btn" class="btn btn-lg btn-danger">{{ 'set_unavailable'|translate|titlecase }}</button>
+        <button (click)="changeAvailibility(1)" type="button" [delay]="1000" [tooltip]="'tooltip_change_availability'|translate:{state: 'available'|translate}" id="activate-btn" class="btn btn-lg btn-success me-1">{{ 'set_available'|translate|titlecase }}</button>
+        <button (click)="changeAvailibility(0)" type="button" [delay]="1000" [tooltip]="'tooltip_change_availability'|translate:{state: 'unavailable'|translate}" id="deactivate-btn" class="btn btn-lg btn-danger">{{ 'set_unavailable'|translate|titlecase }}</button>
     </div>
     <ng-container *ngIf="manual_mode !== undefined">
         <button type="button" class="btn btn-secondary" *ngIf="manual_mode" (click)="updateManualMode(0)">

frontend/src/assets/i18n/en.json

@@ -12,7 +12,8 @@
         "enable_schedules": "Enable hour schedules",
         "disable_schedules": "Disable hour schedules",
         "update_schedules": "Update availability schedules",
-        "connect_telegram_bot": "Connect your account to the Telegram bot"
+        "connect_telegram_bot": "Connect your account to the Telegram bot",
+        "tooltip_change_availability": "Change your availability to {{state}}"
     },
     "login": {
         "username": "username",
@@ -20,14 +21,22 @@
         "submit_btn": "Login"
     },
     "place_details": {
-        "open_in_google_maps": "Apri il luogo in Google Maps",
-        "place_name": "Nome del luogo",
-        "house_number": "numero civico",
-        "road": "strada",
-        "village": "comune",
-        "postcode": "CAP",
-        "hamlet": "frazione",
-        "municipality": "raggruppamento del comune"
+        "open_in_google_maps": "Open in Google Maps",
+        "place_name": "Place name",
+        "house_number": "house number",
+        "road": "road",
+        "village": "village",
+        "postcode": "postcode",
+        "hamlet": "hamlet",
+        "municipality": "municipality"
+    },
+    "edit_service": {
+        "select_start_datetime": "Select start date and time for the service",
+        "select_end_datetime": "Select end date and time for the service",
+        "insert_code": "Insert service code",
+        "other_crew_members": "Other crew members",
+        "select_type": "Select a type",
+        "select_service_type": "Select a service type"
     },
     "update_availability_schedule": "Update availability schedule",
     "save_changes": "Save changes",
@@ -78,6 +87,11 @@
     "update": "update",
     "remove": "remove",
     "more details": "more details",
+    "search": "search",
+    "submit": "invia",
+    "reset": "reset",
+    "go_back": "go back",
+    "press_to_select_a_date": "press to select a date",
     "footer_text": "Allerta-VVF, free software developed for volunteer firefighters brigades.",
     "revision": "revision"
 }

frontend/src/assets/i18n/it.json

@@ -12,7 +12,8 @@
         "enable_schedules": "Abilita programmazione oraria",
         "disable_schedules": "Disattiva programmazione oraria",
         "update_schedules": "Modifica orari disponibilità",
-        "connect_telegram_bot": "Collega l'account al bot Telegram"
+        "connect_telegram_bot": "Collega l'account al bot Telegram",
+        "tooltip_change_availability": "Cambia la tua disponibilità in {{state}}"
     },
     "login": {
         "username": "username",
@@ -29,6 +30,14 @@
         "hamlet": "frazione",
         "municipality": "raggruppamento del comune"
     },
+    "edit_service": {
+        "select_start_datetime": "Seleziona data e ora di inizio dell'intervento",
+        "select_end_datetime": "Seleziona data e ora di fine dell'intervento",
+        "insert_code": "Inserisci il progressivo dell'intervento",
+        "other_crew_members": "Altri membri della squadra",
+        "select_type": "Seleziona una tipologia",
+        "select_service_type": "Seleziona una tipologia di intervento"
+    },
     "update_availability_schedule": "Aggiorna programmazione disponibilità",
     "save_changes": "Salva modifiche",
     "close": "Chiudi",
@@ -78,6 +87,11 @@
     "update": "modifica",
     "remove": "rimuovi",
     "more details": "altri dettagli",
+    "search": "cerca",
+    "submit": "invia",
+    "reset": "reset",
+    "go_back": "torna indietro",
+    "press_to_select_a_date": "premi per selezionare una data",
     "footer_text": "Allerta-VVF, software libero realizzato per i Vigili del Fuoco volontari.",
     "revision": "revisione"
 }