* Suppress enter key action in critical forms (CC-39)

* Add spinner service
pull/43/head
HardiReady 2018-07-17 10:07:12 +02:00
parent 374e7df34d
commit f2e2133496
13 changed files with 68 additions and 50 deletions

View File

@ -98,7 +98,7 @@
<button mat-icon-button
(click)="toggleSidebar()"
*ngIf="showSidebarToggleBtn"
style="background: linear-gradient(-90deg, #e8e5e5,#ffffff);margin-left: -12px;">
style="background: linear-gradient(-90deg, #e8e5e5,#ffffff);margin-left: -12px;z-index:500;">
<mat-icon svgIcon="chevron-left" *ngIf="sidebarOpen">
</mat-icon>
<mat-icon svgIcon="chevron-right" *ngIf="!sidebarOpen">

View File

@ -7,6 +7,7 @@ import {RouteConfig} from './app.config';
import {DOCUMENT} from '@angular/common';
import {DomSanitizer} from '@angular/platform-browser';
import {MatIconRegistry} from '@angular/material';
import {SpinnerService} from './services/user-interface/spinner/spinner.service';
declare function require(url: string);
@ -51,17 +52,20 @@ export class AppComponent implements OnInit {
private router: Router,
private iconRegistry: MatIconRegistry,
private sanitizer: DomSanitizer,
private spinnerService: SpinnerService,
@Inject(DOCUMENT) private document) {
this.initMaterialSvgIcons();
this.spinnerService.spinnerActive.subscribe(active => this.toggleSpinner(active));
router.events.subscribe(event => {
if (event instanceof NavigationStart) {
this.loading = true;
this.spinnerService.activate();
}
if (event instanceof NavigationEnd) {
const currentUrl = this.router.url;
this.loading = false;
this.spinnerService.deactivate();
// scroll to top on route from army overview to user detail and back
if (currentUrl.includes('/overview')) {
this.scrollToTop();
@ -83,6 +87,10 @@ export class AppComponent implements OnInit {
});
}
toggleSpinner(active){
this.loading = active;
}
initMaterialSvgIcons() {
Object.keys(this.svgIcons).forEach(key => {
const fileUri = '../assets/icon/' + this.svgIcons[key] + '.svg';
@ -113,14 +121,14 @@ export class AppComponent implements OnInit {
logout() {
this.loginService.logout();
this.router.navigate([RouteConfig.overviewPath]);
return false;
setTimeout(() => {
this.router.navigate([RouteConfig.overviewPath]);
}, 500);
}
scrollToTop() {
this.document.body.scrollTop = 0; // For Safari
this.document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
}
}

View File

@ -25,6 +25,7 @@ import {CookieService} from 'ngx-cookie-service';
import {SnackBarService} from './services/user-interface/snack-bar/snack-bar.service';
import {MaterialComponentsModule} from './material-components.module';
import {HttpClientModule} from '@angular/common/http';
import {SpinnerService} from './services/user-interface/spinner/spinner.service';
@NgModule({
imports: [SharedModule, BrowserModule, BrowserAnimationsModule, appRouting, HttpModule, HttpClientModule,
@ -49,7 +50,8 @@ import {HttpClientModule} from '@angular/common/http';
AppConfig,
routingProviders,
CookieService,
SnackBarService
SnackBarService,
SpinnerService
],
declarations: [
AppComponent,

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="decoration._id">Auszeichnung editieren</h3>
<h3 *ngIf="!decoration._id">Neue Auszeichnung hinzufügen</h3>
@ -70,6 +70,7 @@
</button>
<button id="save"
type="submit"
(click)="saveDecoration(fileInput)"
class="btn btn-default"
[disabled]="!form.valid">

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="rank._id">Rang editieren</h3>
<h3 *ngIf="!rank._id">Neuen Rang hinzufügen</h3>
@ -51,6 +51,7 @@
</button>
<button id="save"
type="submit"
(click)="saveRank(fileInput)"
class="btn btn-default"
[disabled]="!form.valid">

View File

@ -0,0 +1,19 @@
import {EventEmitter, Injectable} from '@angular/core';
@Injectable()
export class SpinnerService {
public spinnerActive: EventEmitter<Boolean>;
constructor() {
this.spinnerActive = new EventEmitter();
}
activate() {
this.spinnerActive.emit(true)
}
deactivate() {
this.spinnerActive.emit(false)
}
}

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="squad._id">Squad editieren</h3>
<h3 *ngIf="!squad._id">Neues Squad hinzufügen</h3>
@ -51,6 +51,7 @@
</button>
<button id="save"
type="submit"
(click)="saveSquad(fileInput)"
class="btn btn-default"
[disabled]="!form.valid">

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="campaign._id">Kampagne editieren</h3>
<h3 *ngIf="!campaign._id">Neue Kampagne hinzufügen</h3>
@ -20,15 +20,10 @@
</button>
<button id="save"
type="submit"
(click)="saveCampaign()"
class="btn btn-default"
[disabled]="!form.valid">
Bestätigen
</button>
<span *ngIf="showErrorLabel"
class="center-block label label-danger" style="font-size: medium; padding: 2px; margin-top: 2px">
{{error}}
</span>
</form>

View File

@ -4,6 +4,8 @@ import {NgForm} from '@angular/forms';
import {Subscription} from 'rxjs/Subscription';
import {Campaign} from '../../../models/model-interfaces';
import {CampaignService} from '../../../services/logs/campaign.service';
import {Message} from '../../../i18n/de.messages';
import {SnackBarService} from '../../../services/user-interface/snack-bar/snack-bar.service';
@Component({
@ -15,24 +17,21 @@ export class CampaignSubmitComponent {
campaign: Campaign = {};
showErrorLabel = false;
error;
subscription: Subscription;
@ViewChild(NgForm) form: NgForm;
constructor(private route: ActivatedRoute,
private router: Router,
private campaignService: CampaignService) {
private campaignService: CampaignService,
private snackBarService: SnackBarService) {
this.subscription = this.route.params
.map(params => params['id'])
.filter(id => id !== undefined)
.flatMap(id => this.campaignService.getCampaign(id))
.subscribe(campaign => {
this.campaign = campaign;
});
.map(params => params['id'])
.filter(id => id !== undefined)
.flatMap(id => this.campaignService.getCampaign(id))
.subscribe(campaign => {
this.campaign = campaign;
});
}
saveCampaign() {
@ -42,12 +41,10 @@ export class CampaignSubmitComponent {
if (this.campaign._id) {
redirectSuccessUrl = '../' + redirectSuccessUrl;
}
this.snackBarService.showSuccess(Message.SUCCESS_SAVE);
this.router.navigate([redirectSuccessUrl + campaign._id], {relativeTo: this.route});
},
error => {
this.error = error._body.error.message;
this.showErrorLabel = true;
});
error => this.snackBarService.showError(error._body.error.message, 30000));
}
cancel() {

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3>Schlacht bearbeiten</h3>
<div class="form-group">
@ -71,15 +71,10 @@
</button>
<button id="save"
type="submit"
(click)="updateWar()"
class="btn btn-default"
[disabled]="!form.valid">
Bestätigen
</button>
<span *ngIf="showErrorLabel"
class="center-block label label-danger" style="font-size: medium; padding: 2px; margin-top: 2px">
{{error}}
</span>
</form>

View File

@ -5,6 +5,8 @@ import {WarService} from '../../../services/logs/war.service';
import {War} from '../../../models/model-interfaces';
import {CampaignService} from '../../../services/logs/campaign.service';
import {Subscription} from 'rxjs/Subscription';
import {SnackBarService} from '../../../services/user-interface/snack-bar/snack-bar.service';
import {Message} from '../../../i18n/de.messages';
@Component({
@ -19,15 +21,12 @@ export class WarEditComponent {
subscription: Subscription;
showErrorLabel = false;
error;
@ViewChild(NgForm) form: NgForm;
constructor(private route: ActivatedRoute,
private router: Router,
private warService: WarService,
private snackBarService: SnackBarService,
public campaignService: CampaignService) {
this.subscription = this.route.params
.map(params => params['id'])
@ -41,12 +40,10 @@ export class WarEditComponent {
updateWar() {
this.warService.updateWar(this.war)
.subscribe(war => {
this.snackBarService.showSuccess(Message.SUCCESS_SAVE);
this.router.navigate(['../../war/' + war._id], {relativeTo: this.route});
},
error => {
this.error = error._body.error.message;
this.showErrorLabel = true;
});
error => this.snackBarService.showError(error._body.error.message, 30000));
}
cancel() {

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3>Neue Schlacht hinzufügen</h3>
<div class="form-group">
@ -42,6 +42,7 @@
</button>
<button id="save"
type="submit"
*ngIf="!loading"
(click)="saveWar()"
class="btn btn-default"

View File

@ -1,4 +1,4 @@
<form #form="ngForm" class="overview">
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="user._id">Teilnehmer editieren</h3>
<h3 *ngIf="!user._id">Neuen Teilnehmer hinzufügen</h3>
@ -41,7 +41,7 @@
<option *ngFor="let rank of ranks" [value]="rank.level">{{rank.name}}</option>
</select>
<show-error displayName="Squad" controlPath="squad"></show-error>
<show-error displayName="Rang" controlPath="rank"></show-error>
</div>
<button id="cancel"
@ -51,6 +51,7 @@
</button>
<button id="save"
type="submit"
(click)="saveUser(rankLevel.value)"
class="btn btn-default"
[disabled]="!form.valid">