diff --git a/static/src/app/app.component.css b/static/src/app/app.component.css
index d14f402..e5407e4 100644
--- a/static/src/app/app.component.css
+++ b/static/src/app/app.component.css
@@ -8,6 +8,12 @@ li {
display: inline;
}
+.sidebar-toggle-btn {
+ background: linear-gradient(-90deg, #e8e5e5, #ffffff);
+ margin-left: -12px;
+ z-index: 500;
+}
+
.content {
padding-left: 15px;
padding-right: 15px;
diff --git a/static/src/app/app.component.html b/static/src/app/app.component.html
index 3e7b1f9..5a699ae 100644
--- a/static/src/app/app.component.html
+++ b/static/src/app/app.component.html
@@ -96,9 +96,9 @@
-
+
diff --git a/static/src/app/app.component.ts b/static/src/app/app.component.ts
index 7743739..8c24bb5 100644
--- a/static/src/app/app.component.ts
+++ b/static/src/app/app.component.ts
@@ -34,6 +34,8 @@ export class AppComponent implements OnInit {
leftBoxShadow;
+ // a map of svgIcon names and associated svg file names
+ // to load from assets/icon folder
svgIcons = {
'add': 'outline-add_box-24px',
'add-user': 'twotone-person_add-24px',
@@ -63,17 +65,20 @@ export class AppComponent implements OnInit {
this.spinnerService.activate();
}
if (event instanceof NavigationEnd) {
+ this.spinnerService.deactivate();
const currentUrl = this.router.url;
- this.spinnerService.deactivate();
// scroll to top on route from army overview to user detail and back
if (currentUrl.includes('/overview')) {
this.scrollToTop();
}
+
// show sidebar menu on initial page access
this.sidebarOpen = true;
this.showSidebarToggleBtn = currentUrl.includes('/stats');
+ // remove sidebar styling for components that are rendered inside,
+ // but not really shown as sidebar (legacy)
if (currentUrl.includes('/login') ||
currentUrl.includes('/signup') ||
currentUrl.endsWith('/404')) {
@@ -87,13 +92,14 @@ export class AppComponent implements OnInit {
});
}
- toggleSpinner(active){
+ toggleSpinner(active) {
this.loading = active;
}
initMaterialSvgIcons() {
Object.keys(this.svgIcons).forEach(key => {
- const fileUri = '../assets/icon/' + this.svgIcons[key] + '.svg';
+ const fileUri = '../assets/icon/'.concat(this.svgIcons[key])
+ .concat('.svg');
this.iconRegistry.addSvgIcon(key, this.sanitizer.bypassSecurityTrustResourceUrl(fileUri));
});
}
diff --git a/static/src/app/app.module.ts b/static/src/app/app.module.ts
index 10c897b..5c8f9c6 100644
--- a/static/src/app/app.module.ts
+++ b/static/src/app/app.module.ts
@@ -23,13 +23,13 @@ import {UserService} from './services/army-management/user.service';
import {UserStore} from './services/stores/user.store';
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';
+import {MatSnackBarModule} from '@angular/material';
@NgModule({
imports: [SharedModule, BrowserModule, BrowserAnimationsModule, appRouting, HttpModule, HttpClientModule,
- ClipboardModule, MaterialComponentsModule],
+ ClipboardModule, MatSnackBarModule],
providers: [
HttpClient,
LoginService,
diff --git a/static/src/app/login/login.component.html b/static/src/app/login/login.component.html
index 92de22e..2b588bd 100644
--- a/static/src/app/login/login.component.html
+++ b/static/src/app/login/login.component.html
@@ -15,10 +15,6 @@
Anmelden
-
- {{error}}
-
diff --git a/static/src/app/login/login.component.ts b/static/src/app/login/login.component.ts
index c801702..b5e48e6 100644
--- a/static/src/app/login/login.component.ts
+++ b/static/src/app/login/login.component.ts
@@ -2,6 +2,7 @@ import {Component, OnInit} from '@angular/core';
import {Router} from '@angular/router';
import {LoginService} from '../services/app-user-service/login-service';
import {RouteConfig} from '../app.config';
+import {SnackBarService} from '../services/user-interface/snack-bar/snack-bar.service';
@Component({
@@ -12,16 +13,13 @@ import {RouteConfig} from '../app.config';
export class LoginComponent implements OnInit {
- showErrorLabel = false;
-
- error: string;
-
loading = false;
returnUrl: string;
constructor(private router: Router,
- private loginService: LoginService) {
+ private loginService: LoginService,
+ private snackBarService: SnackBarService) {
}
ngOnInit() {
@@ -40,11 +38,7 @@ export class LoginComponent implements OnInit {
this.router.navigate([this.returnUrl]);
},
error => {
- this.error = error._body;
- this.showErrorLabel = true;
- setTimeout(() => {
- this.showErrorLabel = false;
- }, 4000);
+ this.snackBarService.showError(error._body, 15000);
this.loading = false;
});
}
diff --git a/static/src/app/material-components.module.ts b/static/src/app/material-components.module.ts
deleted file mode 100644
index b21a508..0000000
--- a/static/src/app/material-components.module.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-/**
- * Angular material imports
- */
-
-import {NgModule} from '@angular/core';
-import {MatProgressSpinnerModule, MatSnackBarModule} from '@angular/material';
-
-@NgModule({
- imports: [
- MatSnackBarModule,
- MatProgressSpinnerModule,
- ],
- exports: [
- MatSnackBarModule,
- MatProgressSpinnerModule,
- ]
-})
-
-export class MaterialComponentsModule {
-}
diff --git a/static/src/app/statistic/campaign/campaign-submit/campaign-submit.component.ts b/static/src/app/statistic/campaign/campaign-submit/campaign-submit.component.ts
index 31e3420..5820889 100644
--- a/static/src/app/statistic/campaign/campaign-submit/campaign-submit.component.ts
+++ b/static/src/app/statistic/campaign/campaign-submit/campaign-submit.component.ts
@@ -44,7 +44,7 @@ export class CampaignSubmitComponent {
this.snackBarService.showSuccess(Message.SUCCESS_SAVE);
this.router.navigate([redirectSuccessUrl + campaign._id], {relativeTo: this.route});
},
- error => this.snackBarService.showError(error._body.error.message, 30000));
+ error => this.snackBarService.showError(error._body.error.message, 15000));
}
cancel() {
diff --git a/static/src/app/statistic/war/war-edit/war-edit.component.ts b/static/src/app/statistic/war/war-edit/war-edit.component.ts
index 634d3fa..d0e18c2 100644
--- a/static/src/app/statistic/war/war-edit/war-edit.component.ts
+++ b/static/src/app/statistic/war/war-edit/war-edit.component.ts
@@ -12,8 +12,7 @@ import {Message} from '../../../i18n/de.messages';
@Component({
selector: 'war-edit',
templateUrl: './war-edit.component.html',
- styleUrls: ['./war-edit.component.css', '../../../style/load-indicator.css',
- '../../../style/entry-form.css', '../../../style/overview.css']
+ styleUrls: ['./war-edit.component.css', '../../../style/entry-form.css', '../../../style/overview.css']
})
export class WarEditComponent {
@@ -43,7 +42,7 @@ export class WarEditComponent {
this.snackBarService.showSuccess(Message.SUCCESS_SAVE);
this.router.navigate(['../../war/' + war._id], {relativeTo: this.route});
},
- error => this.snackBarService.showError(error._body.error.message, 30000));
+ error => this.snackBarService.showError(error._body.error.message, 15000));
}
cancel() {
diff --git a/static/src/app/statistic/war/war-submit/war-submit.component.html b/static/src/app/statistic/war/war-submit/war-submit.component.html
index 2708d55..b3566e4 100644
--- a/static/src/app/statistic/war/war-submit/war-submit.component.html
+++ b/static/src/app/statistic/war/war-submit/war-submit.component.html
@@ -49,6 +49,4 @@
[disabled]="!form.valid">
Bestätigen
-
-
diff --git a/static/src/app/statistic/war/war-submit/war-submit.component.ts b/static/src/app/statistic/war/war-submit/war-submit.component.ts
index 798e445..09c4edd 100644
--- a/static/src/app/statistic/war/war-submit/war-submit.component.ts
+++ b/static/src/app/statistic/war/war-submit/war-submit.component.ts
@@ -5,13 +5,13 @@ import {WarService} from '../../../services/logs/war.service';
import {War} from '../../../models/model-interfaces';
import {CampaignService} from '../../../services/logs/campaign.service';
import {SnackBarService} from '../../../services/user-interface/snack-bar/snack-bar.service';
+import {SpinnerService} from '../../../services/user-interface/spinner/spinner.service';
@Component({
selector: 'war-submit',
templateUrl: './war-submit.component.html',
- styleUrls: ['./war-submit.component.css', '../../../style/load-indicator.css',
- '../../../style/entry-form.css', '../../../style/overview.css']
+ styleUrls: ['./war-submit.component.css', '../../../style/entry-form.css', '../../../style/overview.css']
})
export class WarSubmitComponent {
@@ -25,14 +25,13 @@ export class WarSubmitComponent {
loading = false;
- error;
-
@ViewChild(NgForm) form: NgForm;
constructor(private route: ActivatedRoute,
private router: Router,
private warService: WarService,
private snackBarService: SnackBarService,
+ private spinnerService: SpinnerService,
public campaignService: CampaignService) {
}
@@ -53,15 +52,17 @@ export class WarSubmitComponent {
}
const file: File = this.fileList[0];
this.loading = true;
+ this.spinnerService.activate();
this.warService.submitWar(this.war, file)
.subscribe(war => {
this.router.navigate(['../war/' + war._id], {relativeTo: this.route});
},
error => {
+ this.spinnerService.deactivate();
this.loading = false;
const errorMsg = JSON.parse(error._body).error.message;
- this.snackBarService.showError('Error: '.concat(errorMsg), 10000);
+ this.snackBarService.showError('Error: '.concat(errorMsg), 15000);
});
}
diff --git a/static/src/app/style/load-indicator.css b/static/src/app/style/load-indicator.css
index 526fcaf..362096e 100644
--- a/static/src/app/style/load-indicator.css
+++ b/static/src/app/style/load-indicator.css
@@ -2,43 +2,36 @@
position: absolute;
top: 50%;
z-index: 10000;
+ left: 46%;
+ filter: drop-shadow(3px 1px 2px #dadada);
}
-@media only screen and (max-width: 1199px) {
- .load-indicator {
- left: 46%;
- }
-}
+
@media only screen and (min-width: 1200px) {
.load-indicator {
- left: 46%;
+ left: 47.4%;
}
}
@media only screen and (min-width: 1376px) {
.load-indicator {
- left: 46.5%;
+ left: 48%;
}
}
@media only screen and (min-width: 1600px) {
.load-indicator {
- left: 47.5%;
+ left: 48.2%;
}
}
@media only screen and (min-width: 1925px) {
.load-indicator {
- left: 48%;
+ left: 48.7%;
}
}
-:host /deep/ .mat-progress-spinner circle, .mat-spinner circle {
- stroke: #303030 !important;
- stroke-linecap: round;
-}
-
.load-arrow {
background: url(../../assets/loading.png) no-repeat;
display: block;
- width: 80px;
- height: 80px;
+ width: 70px;
+ height: 70px;
}
/* Loading Animation */
diff --git a/static/src/assets/loading.png b/static/src/assets/loading.png
index adcf3c6..4a484da 100644
Binary files a/static/src/assets/loading.png and b/static/src/assets/loading.png differ