diff --git a/package.json b/package.json index ce2e20b..ddc3151 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "opt-cc", - "version": "1.4.1", + "version": "1.4.2", "license": "MIT", "private": true, "scripts": { diff --git a/static/package.json b/static/package.json index ec92565..67bf713 100644 --- a/static/package.json +++ b/static/package.json @@ -41,7 +41,6 @@ "devDependencies": { "@types/jasmine": "2.5.38", "@types/node": "~6.0.60", - "@types/systemjs": "^0.20.4", "codelyzer": "~2.0.0-beta.1", "jasmine-core": "^2.5.2", "jasmine-spec-reporter": "^3.2.0", diff --git a/static/src/app/app.component.html b/static/src/app/app.component.html index e7dff4e..e4e67bf 100644 --- a/static/src/app/app.component.html +++ b/static/src/app/app.component.html @@ -87,6 +87,7 @@
+
diff --git a/static/src/app/app.component.ts b/static/src/app/app.component.ts index f785986..8cf0b2e 100644 --- a/static/src/app/app.component.ts +++ b/static/src/app/app.component.ts @@ -1,5 +1,5 @@ import {Component} from '@angular/core'; -import {Router} from '@angular/router'; +import {NavigationEnd, NavigationStart, Router} from '@angular/router'; import {LoginService} from './services/login-service/login-service'; import {PromotionService} from "./services/promotion-service/promotion.service"; import {AwardingService} from "./services/awarding-service/awarding.service"; @@ -8,16 +8,26 @@ import {RouteConfig} from "./app.config"; @Component({ selector: 'app-root', templateUrl: 'app.component.html', - styleUrls: ['app.component.css'] + styleUrls: ['app.component.css', 'style/load-indicator.css'] }) export class AppComponent { config = RouteConfig; + loading: boolean = false; + constructor(private loginService: LoginService, private promotionService: PromotionService, private awardingService: AwardingService, private router: Router) { + router.events.subscribe(event => { + if (event instanceof NavigationStart) { + this.loading = true; + } + if (event instanceof NavigationEnd) { + this.loading = false; + } + }); } diff --git a/static/src/app/statistic/war-submit/war-submit.component.html b/static/src/app/statistic/war-submit/war-submit.component.html index 44fe2c2..0c1ca3f 100644 --- a/static/src/app/statistic/war-submit/war-submit.component.html +++ b/static/src/app/statistic/war-submit/war-submit.component.html @@ -79,7 +79,7 @@ Bestätigen - + {{error}} diff --git a/static/src/app/statistic/war-submit/war-submit.component.ts b/static/src/app/statistic/war-submit/war-submit.component.ts index 22fc580..690c540 100644 --- a/static/src/app/statistic/war-submit/war-submit.component.ts +++ b/static/src/app/statistic/war-submit/war-submit.component.ts @@ -8,7 +8,7 @@ import {War} from "../../models/model-interfaces"; @Component({ selector: 'war-submit', templateUrl: './war-submit.component.html', - styleUrls: ['./war-submit.component.css'] + styleUrls: ['./war-submit.component.css', '../../style/load-indicator.css'] }) export class WarSubmitComponent { diff --git a/static/src/app/style/load-indicator.css b/static/src/app/style/load-indicator.css new file mode 100644 index 0000000..c35686d --- /dev/null +++ b/static/src/app/style/load-indicator.css @@ -0,0 +1,28 @@ +.load-indicator { + position:absolute; + top:50%; + left:50%; + transform:translate(-50%, -50%); + width:50%; +} + +.load-arrow { + background: url(../../assets/loading.png) no-repeat; + display: block; + width: 80px; + height: 80px; +} + +/* Loading Animation */ +.glyphicon-refresh-animate { + animation: spin 1.5s linear infinite; +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} diff --git a/static/src/assets/loading.png b/static/src/assets/loading.png index 0e00d49..adcf3c6 100644 Binary files a/static/src/assets/loading.png and b/static/src/assets/loading.png differ