|
@@ -2,24 +2,24 @@
|
|
| 2 |
[formGroup]="bookForm"
|
| 3 |
(ngSubmit)="submitForm()">
|
| 4 |
|
| 5 |
-
<label>Buchtitel</label>
|
| 6 |
<input formControlName="title">
|
| 7 |
<bm-form-messages
|
| 8 |
[control]="bookForm.get('title')"
|
| 9 |
controlName="title">
|
| 10 |
</bm-form-messages>
|
| 11 |
|
| 12 |
-
<label>Untertitel</label>
|
| 13 |
<input formControlName="subtitle">
|
| 14 |
|
| 15 |
-
<label>ISBN</label>
|
| 16 |
<input formControlName="isbn">
|
| 17 |
<bm-form-messages
|
| 18 |
[control]="bookForm.get('isbn')"
|
| 19 |
controlName="isbn">
|
| 20 |
</bm-form-messages>
|
| 21 |
|
| 22 |
-
<label>Erscheinungsdatum</label>
|
| 23 |
<input type="date"
|
| 24 |
useValueAsDate
|
| 25 |
formControlName="published">
|
|
@@ -28,15 +28,17 @@
|
|
| 28 |
controlName="published">
|
| 29 |
</bm-form-messages>
|
| 30 |
|
| 31 |
-
<label>Autoren</label>
|
| 32 |
<button type="button" class="ui mini button"
|
| 33 |
-
(click)="addAuthorControl()"
|
|
|
|
| 34 |
+ Autor
|
| 35 |
</button>
|
| 36 |
<div class="fields" formArrayName="authors">
|
| 37 |
<div class="sixteen wide field"
|
| 38 |
*ngFor="let c of authors.controls; index as i">
|
| 39 |
<input placeholder="Autor"
|
|
|
|
| 40 |
[formControlName]="i">
|
| 41 |
</div>
|
| 42 |
</div>
|
|
@@ -45,12 +47,13 @@
|
|
| 45 |
controlName="authors">
|
| 46 |
</bm-form-messages>
|
| 47 |
|
| 48 |
-
<label>Beschreibung</label>
|
| 49 |
<textarea formControlName="description"></textarea>
|
| 50 |
|
| 51 |
-
<label>Bilder</label>
|
| 52 |
<button type="button" class="ui mini button"
|
| 53 |
-
(click)="addThumbnailControl()"
|
|
|
|
| 54 |
+ Bild
|
| 55 |
</button>
|
| 56 |
<div formArrayName="thumbnails">
|
|
@@ -59,17 +62,20 @@
|
|
| 59 |
[formGroupName]="i">
|
| 60 |
<div class="nine wide field">
|
| 61 |
<input placeholder="URL"
|
|
|
|
| 62 |
formControlName="url">
|
| 63 |
</div>
|
| 64 |
<div class="seven wide field">
|
| 65 |
<input placeholder="Titel"
|
|
|
|
| 66 |
formControlName="title">
|
| 67 |
</div>
|
| 68 |
</div>
|
| 69 |
</div>
|
| 70 |
|
| 71 |
<button class="ui button" type="submit"
|
| 72 |
-
[disabled]="bookForm.invalid"
|
|
|
|
| 73 |
Speichern
|
| 74 |
</button>
|
| 75 |
</form>
|
| 2 |
[formGroup]="bookForm"
|
| 3 |
(ngSubmit)="submitForm()">
|
| 4 |
|
| 5 |
+
<label i18n="@@BookFormComponent:book title">Buchtitel</label>
|
| 6 |
<input formControlName="title">
|
| 7 |
<bm-form-messages
|
| 8 |
[control]="bookForm.get('title')"
|
| 9 |
controlName="title">
|
| 10 |
</bm-form-messages>
|
| 11 |
|
| 12 |
+
<label i18n="@@BookFormComponent:book subtitle">Untertitel</label>
|
| 13 |
<input formControlName="subtitle">
|
| 14 |
|
| 15 |
+
<label i18n="@@BookFormComponent:book isbn">ISBN</label>
|
| 16 |
<input formControlName="isbn">
|
| 17 |
<bm-form-messages
|
| 18 |
[control]="bookForm.get('isbn')"
|
| 19 |
controlName="isbn">
|
| 20 |
</bm-form-messages>
|
| 21 |
|
| 22 |
+
<label i18n="@@BookFormComponent:book published date">Erscheinungsdatum</label>
|
| 23 |
<input type="date"
|
| 24 |
useValueAsDate
|
| 25 |
formControlName="published">
|
| 28 |
controlName="published">
|
| 29 |
</bm-form-messages>
|
| 30 |
|
| 31 |
+
<label i18n="@@BookFormComponent:book authors">Autoren</label>
|
| 32 |
<button type="button" class="ui mini button"
|
| 33 |
+
(click)="addAuthorControl()"
|
| 34 |
+
i18n="@@BookFormComponent:add author">
|
| 35 |
+ Autor
|
| 36 |
</button>
|
| 37 |
<div class="fields" formArrayName="authors">
|
| 38 |
<div class="sixteen wide field"
|
| 39 |
*ngFor="let c of authors.controls; index as i">
|
| 40 |
<input placeholder="Autor"
|
| 41 |
+
i18n-placeholder="@@BookFormComponent:author placeholder"
|
| 42 |
[formControlName]="i">
|
| 43 |
</div>
|
| 44 |
</div>
|
| 47 |
controlName="authors">
|
| 48 |
</bm-form-messages>
|
| 49 |
|
| 50 |
+
<label i18n="@@BookFormComponent:book description">Beschreibung</label>
|
| 51 |
<textarea formControlName="description"></textarea>
|
| 52 |
|
| 53 |
+
<label i18n="@@BookFormComponent:book thumbnails">Bilder</label>
|
| 54 |
<button type="button" class="ui mini button"
|
| 55 |
+
(click)="addThumbnailControl()"
|
| 56 |
+
i18n="@@BookFormComponent:add thumbnail">
|
| 57 |
+ Bild
|
| 58 |
</button>
|
| 59 |
<div formArrayName="thumbnails">
|
| 62 |
[formGroupName]="i">
|
| 63 |
<div class="nine wide field">
|
| 64 |
<input placeholder="URL"
|
| 65 |
+
i18n-placeholder="@@BookFormComponent:book url placeholder"
|
| 66 |
formControlName="url">
|
| 67 |
</div>
|
| 68 |
<div class="seven wide field">
|
| 69 |
<input placeholder="Titel"
|
| 70 |
+
i18n-placeholder="@@BookFormComponent:book thumbnail placeholder"
|
| 71 |
formControlName="title">
|
| 72 |
</div>
|
| 73 |
</div>
|
| 74 |
</div>
|
| 75 |
|
| 76 |
<button class="ui button" type="submit"
|
| 77 |
+
[disabled]="bookForm.invalid"
|
| 78 |
+
i18n="@@BookFormComponent:book form save">
|
| 79 |
Speichern
|
| 80 |
</button>
|
| 81 |
</form>
|
|
@@ -1,3 +1,3 @@
|
|
| 1 |
-
<h1>Buch hinzufügen</h1>
|
| 2 |
|
| 3 |
<bm-book-form (submitBook)="createBook($event)"></bm-book-form>
|
| 1 |
+
<h1 i18n="@@BookFormComponent:book form">Buch hinzufügen</h1>
|
| 2 |
|
| 3 |
<bm-book-form (submitBook)="createBook($event)"></bm-book-form>
|
|
@@ -1,4 +1,4 @@
|
|
| 1 |
-
<h1>Buch bearbeiten</h1>
|
| 2 |
|
| 3 |
<bm-book-form
|
| 4 |
*ngIf="book"
|
| 1 |
+
<h1 i18n="@@BookFormComponent:book form">Buch bearbeiten</h1>
|
| 2 |
|
| 3 |
<bm-book-form
|
| 4 |
*ngIf="book"
|
|
@@ -16,11 +16,11 @@
|
|
| 16 |
},
|
| 17 |
{
|
| 18 |
path: 'books',
|
| 19 |
-
loadChildren: () => import('src/app/book-monkey/iteration-
|
| 20 |
},
|
| 21 |
{
|
| 22 |
path: 'admin',
|
| 23 |
-
loadChildren: () => import('src/app/book-monkey/iteration-
|
| 24 |
canActivate: [CanNavigateToAdminGuard]
|
| 25 |
}
|
| 26 |
];
|
| 16 |
},
|
| 17 |
{
|
| 18 |
path: 'books',
|
| 19 |
+
loadChildren: () => import('src/app/book-monkey/iteration-7/i18n/books/books.module').then(m => m.BooksModule)
|
| 20 |
},
|
| 21 |
{
|
| 22 |
path: 'admin',
|
| 23 |
+
loadChildren: () => import('src/app/book-monkey/iteration-7/i18n/admin/admin.module').then(m => m.AdminModule),
|
| 24 |
canActivate: [CanNavigateToAdminGuard]
|
| 25 |
}
|
| 26 |
];
|
|
@@ -1,6 +1,6 @@
|
|
| 1 |
<div class="ui menu">
|
| 2 |
-
<a routerLink="home" routerLinkActive="active" class="item">Home</a>
|
| 3 |
-
<a routerLink="books" routerLinkActive="active" class="item">Bücher</a>
|
| 4 |
-
<a routerLink="admin" routerLinkActive="active" class="item">Administration</a>
|
| 5 |
</div>
|
| 6 |
<router-outlet></router-outlet>
|
| 1 |
<div class="ui menu">
|
| 2 |
+
<a routerLink="home" routerLinkActive="active" class="item" i18n="Text of the link to the home screen@@AppComponent:home">Home</a>
|
| 3 |
+
<a routerLink="books" routerLinkActive="active" class="item" i18n="Text of the link to the books screen@@AppComponent:book">Bücher</a>
|
| 4 |
+
<a routerLink="admin" routerLinkActive="active" class="item" i18n="Text of the link to the admin screen@@AppComponent:admin">Administration</a>
|
| 5 |
</div>
|
| 6 |
<router-outlet></router-outlet>
|
|
@@ -1,8 +1,6 @@
|
|
| 1 |
import { CommonModule } from '@angular/common';
|
| 2 |
-
import { NgModule, LOCALE_ID } from '@angular/core';
|
| 3 |
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
|
| 4 |
-
import localeDe from '@angular/common/locales/de';
|
| 5 |
-
import { registerLocaleData } from '@angular/common';
|
| 6 |
|
| 7 |
import { AppRoutingModule } from './app-routing.module.one-app';
|
| 8 |
import { AppComponent } from './app.component';
|
|
@@ -23,12 +21,11 @@
|
|
| 23 |
],
|
| 24 |
providers: [
|
| 25 |
{ provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true },
|
| 26 |
-
{ provide: LOCALE_ID, useValue: 'de' }
|
| 27 |
],
|
| 28 |
bootstrap: [AppComponent]
|
| 29 |
})
|
| 30 |
export class AppModule {
|
| 31 |
-
constructor() {
|
| 32 |
-
|
| 33 |
}
|
| 34 |
}
|
| 1 |
import { CommonModule } from '@angular/common';
|
| 2 |
+
import { NgModule, LOCALE_ID, Inject } from '@angular/core';
|
| 3 |
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
|
|
|
|
|
|
|
| 4 |
|
| 5 |
import { AppRoutingModule } from './app-routing.module.one-app';
|
| 6 |
import { AppComponent } from './app.component';
|
| 21 |
],
|
| 22 |
providers: [
|
| 23 |
{ provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true },
|
|
|
|
| 24 |
],
|
| 25 |
bootstrap: [AppComponent]
|
| 26 |
})
|
| 27 |
export class AppModule {
|
| 28 |
+
constructor(@Inject(LOCALE_ID) locale: string) {
|
| 29 |
+
console.log('DEBUG – Current Locale:', locale);
|
| 30 |
}
|
| 31 |
}
|
|
@@ -4,21 +4,29 @@
|
|
| 4 |
<div class="ui divider"></div>
|
| 5 |
<div class="ui grid">
|
| 6 |
<div class="four wide column">
|
| 7 |
-
<h4>
|
|
|
|
|
|
|
| 8 |
<ng-container *ngFor="let author of book.authors">
|
| 9 |
{{ author }}<br>
|
| 10 |
</ng-container>
|
| 11 |
</div>
|
| 12 |
<div class="four wide column">
|
| 13 |
-
<h4>
|
|
|
|
|
|
|
| 14 |
{{ book.isbn | isbn }}
|
| 15 |
</div>
|
| 16 |
<div class="four wide column">
|
| 17 |
-
<h4>
|
|
|
|
|
|
|
| 18 |
{{ book.published | date:'longDate' }}
|
| 19 |
</div>
|
| 20 |
<div class="four wide column" *ngIf="book.rating">
|
| 21 |
-
<h4>
|
|
|
|
|
|
|
| 22 |
<ng-container
|
| 23 |
*ngFor="let r of getRating(book.rating);
|
| 24 |
index as i">
|
|
@@ -27,7 +35,9 @@
|
|
| 27 |
</ng-container>
|
| 28 |
</div>
|
| 29 |
</div>
|
| 30 |
-
<h4>
|
|
|
|
|
|
|
| 31 |
<p>{{ book.description }}</p>
|
| 32 |
<div class="ui small images">
|
| 33 |
<img *ngFor="let thumbnail of book.thumbnails"
|
|
@@ -35,11 +45,17 @@
|
|
| 35 |
</div>
|
| 36 |
<button class="ui tiny red labeled icon button"
|
| 37 |
(click)="removeBook()">
|
| 38 |
-
<i class="remove icon"></i>
|
|
|
|
|
|
|
|
|
|
| 39 |
</button>
|
| 40 |
<a class="ui tiny yellow labeled icon button"
|
| 41 |
[routerLink]="['../../admin/edit', book.isbn]">
|
| 42 |
-
<i class="write icon"></i>
|
|
|
|
|
|
|
|
|
|
| 43 |
</a>
|
| 44 |
</div>
|
| 45 |
|
| 4 |
<div class="ui divider"></div>
|
| 5 |
<div class="ui grid">
|
| 6 |
<div class="four wide column">
|
| 7 |
+
<h4 i18n="@@BookDetailsComponent:book authors">
|
| 8 |
+
Autoren
|
| 9 |
+
</h4>
|
| 10 |
<ng-container *ngFor="let author of book.authors">
|
| 11 |
{{ author }}<br>
|
| 12 |
</ng-container>
|
| 13 |
</div>
|
| 14 |
<div class="four wide column">
|
| 15 |
+
<h4 i18n="@@BookDetailsComponent:book isbn">
|
| 16 |
+
ISBN
|
| 17 |
+
</h4>
|
| 18 |
{{ book.isbn | isbn }}
|
| 19 |
</div>
|
| 20 |
<div class="four wide column">
|
| 21 |
+
<h4 i18n="@@BookDetailsComponent:book published date">
|
| 22 |
+
Erschienen
|
| 23 |
+
</h4>
|
| 24 |
{{ book.published | date:'longDate' }}
|
| 25 |
</div>
|
| 26 |
<div class="four wide column" *ngIf="book.rating">
|
| 27 |
+
<h4 i18n="@@BookDetailsComponent:book rating">
|
| 28 |
+
Rating
|
| 29 |
+
</h4>
|
| 30 |
<ng-container
|
| 31 |
*ngFor="let r of getRating(book.rating);
|
| 32 |
index as i">
|
| 35 |
</ng-container>
|
| 36 |
</div>
|
| 37 |
</div>
|
| 38 |
+
<h4 i18n="@@BookDetailsComponent:book description">
|
| 39 |
+
Beschreibung
|
| 40 |
+
</h4>
|
| 41 |
<p>{{ book.description }}</p>
|
| 42 |
<div class="ui small images">
|
| 43 |
<img *ngFor="let thumbnail of book.thumbnails"
|
| 45 |
</div>
|
| 46 |
<button class="ui tiny red labeled icon button"
|
| 47 |
(click)="removeBook()">
|
| 48 |
+
<i class="remove icon"></i>
|
| 49 |
+
<ng-container i18n="@@BookDetailsComponent:book delete">
|
| 50 |
+
Buch löschen
|
| 51 |
+
</ng-container>
|
| 52 |
</button>
|
| 53 |
<a class="ui tiny yellow labeled icon button"
|
| 54 |
[routerLink]="['../../admin/edit', book.isbn]">
|
| 55 |
+
<i class="write icon"></i>
|
| 56 |
+
<ng-container i18n="@@BookDetailsComponent:book edit">
|
| 57 |
+
Buch bearbeiten
|
| 58 |
+
</ng-container>
|
| 59 |
</a>
|
| 60 |
</div>
|
| 61 |
|
|
@@ -1,19 +1,24 @@
|
|
| 1 |
<div class="ui middle aligned selection divided list">
|
| 2 |
-
|
| 3 |
<ng-container *ngIf="books$ | async as books; else loading">
|
| 4 |
<bm-book-list-item class="item"
|
| 5 |
*ngFor="let b of books"
|
| 6 |
[book]="b"
|
| 7 |
[routerLink]="b.isbn"></bm-book-list-item>
|
| 8 |
-
|
| 9 |
-
<p *ngIf="!books.length"
|
|
|
|
|
|
|
|
|
|
| 10 |
</ng-container>
|
| 11 |
|
| 12 |
<ng-template #loading>
|
| 13 |
<div class="ui active dimmer">
|
| 14 |
-
<div class="ui large text loader"
|
|
|
|
|
|
|
|
|
|
| 15 |
</div>
|
| 16 |
</ng-template>
|
| 17 |
|
| 18 |
</div>
|
| 19 |
-
|
| 1 |
<div class="ui middle aligned selection divided list">
|
| 2 |
+
|
| 3 |
<ng-container *ngIf="books$ | async as books; else loading">
|
| 4 |
<bm-book-list-item class="item"
|
| 5 |
*ngFor="let b of books"
|
| 6 |
[book]="b"
|
| 7 |
[routerLink]="b.isbn"></bm-book-list-item>
|
| 8 |
+
|
| 9 |
+
<p *ngIf="!books.length"
|
| 10 |
+
i18n="@@BookListComponent:no book">
|
| 11 |
+
Es wurden noch keine Bücher eingetragen.
|
| 12 |
+
</p>
|
| 13 |
</ng-container>
|
| 14 |
|
| 15 |
<ng-template #loading>
|
| 16 |
<div class="ui active dimmer">
|
| 17 |
+
<div class="ui large text loader"
|
| 18 |
+
i18n="@@BookListComponent:loading data">
|
| 19 |
+
Daten werden geladen...
|
| 20 |
+
</div>
|
| 21 |
</div>
|
| 22 |
</ng-template>
|
| 23 |
|
| 24 |
</div>
|
|
|
|
@@ -5,12 +5,13 @@
|
|
| 5 |
providedIn: 'root'
|
| 6 |
})
|
| 7 |
export class CanNavigateToAdminGuard implements CanActivate {
|
| 8 |
-
|
| 9 |
accessGranted = false;
|
| 10 |
|
| 11 |
canActivate(): boolean {
|
| 12 |
if (!this.accessGranted) {
|
| 13 |
-
|
|
|
|
| 14 |
}
|
| 15 |
return this.accessGranted;
|
| 16 |
}
|
| 5 |
providedIn: 'root'
|
| 6 |
})
|
| 7 |
export class CanNavigateToAdminGuard implements CanActivate {
|
| 8 |
+
|
| 9 |
accessGranted = false;
|
| 10 |
|
| 11 |
canActivate(): boolean {
|
| 12 |
if (!this.accessGranted) {
|
| 13 |
+
const question = $localize`:@@CanNavigateToAdminGuard\:question:Mit großer Macht kommt große Verantwortung. Möchten Sie den Admin-Bereich betreten?`;
|
| 14 |
+
this.accessGranted = window.confirm(question);
|
| 15 |
}
|
| 16 |
return this.accessGranted;
|
| 17 |
}
|
|
@@ -1,9 +1,9 @@
|
|
| 1 |
-
<h1>Home</h1>
|
| 2 |
-
<p>Das ist der BookMonkey.</p>
|
| 3 |
<a routerLink="../books" class="ui red button">
|
| 4 |
-
Buchliste ansehen
|
| 5 |
<i class="right arrow icon"></i>
|
| 6 |
</a>
|
| 7 |
|
| 8 |
-
<h2>Suche</h2>
|
| 9 |
<bm-search></bm-search>
|
| 1 |
+
<h1 i18n="@@HomeComponent:header">Home</h1>
|
| 2 |
+
<p i18n="a proud sentence about the project@@HomeComponent:tagline">Das ist der BookMonkey.</p>
|
| 3 |
<a routerLink="../books" class="ui red button">
|
| 4 |
+
<ng-container i18n="Text of the link to the books screen@@HomeComponent:book list link">Buchliste ansehen</ng-container>
|
| 5 |
<i class="right arrow icon"></i>
|
| 6 |
</a>
|
| 7 |
|
| 8 |
+
<h2 i18n="@@HomeComponent:search">Suche</h2>
|
| 9 |
<bm-search></bm-search>
|
|
@@ -85,7 +85,7 @@
|
|
| 85 |
);
|
| 86 |
}
|
| 87 |
|
| 88 |
-
private errorHandler(error: HttpErrorResponse): Observable<
|
| 89 |
console.error('Fehler aufgetreten!');
|
| 90 |
return throwError(error);
|
| 91 |
}
|
| 85 |
);
|
| 86 |
}
|
| 87 |
|
| 88 |
+
private errorHandler(error: HttpErrorResponse): Observable<never> {
|
| 89 |
console.error('Fehler aufgetreten!');
|
| 90 |
return throwError(error);
|
| 91 |
}
|