Compare commits

..

No commits in common. "16e7e655bb0f35bf241441b0fcdce1e811b61a20" and "4d2ea25fe99bcc43334fe27572780a6416344537" have entirely different histories.

12 changed files with 207 additions and 179 deletions

View File

@ -1,14 +1,10 @@
<div>
<mat-sidenav-container>
<mat-sidenav-content>
<app-header (sidenavToggle)="sidenav.toggle()"
(userLogout)="logout()">
</app-header>
<app-header (sidenavToggle)="sidenav.toggle()"></app-header>
</mat-sidenav-content>
<mat-sidenav #sidenav role="navigation">
<app-sidenav-list (sidenavClose)="sidenav.close()"
(userLogout)="logout()">
</app-sidenav-list>
<app-sidenav-list (sidenavClose)="sidenav.close()"></app-sidenav-list>
</mat-sidenav>
</mat-sidenav-container>

View File

@ -6,8 +6,6 @@ import {MatIconRegistry} from '@angular/material';
import {SpinnerService} from './services/user-interface/spinner/spinner.service';
import {SnackBarService} from './services/user-interface/snack-bar/snack-bar.service';
import {Observable} from 'rxjs';
import {LoginService} from './services/app-user-service/login-service';
import {BaseConfig, RouteConfig} from './app.config';
@Component({
@ -66,7 +64,6 @@ export class AppComponent implements OnInit {
};
constructor(private router: Router,
private loginService: LoginService,
private iconRegistry: MatIconRegistry,
private sanitizer: DomSanitizer,
private spinnerService: SpinnerService,
@ -111,14 +108,6 @@ export class AppComponent implements OnInit {
});
}
logout() {
this.loginService.logout();
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

@ -1,5 +1,7 @@
export class AppConfig {
public readonly apiUrl = '/api';
public readonly apiAppUserPath = this.apiUrl + '/account/';
public readonly apiAuthenticationPath = this.apiUrl + '/authenticate';
public readonly apiAwardPath = this.apiUrl + '/awardings';
@ -42,14 +44,6 @@ export const RouteConfig = {
decorationOverviewPath: 'public/decorations',
};
export const BaseConfig = {
responsive: {
export const ResponsiveConfig = {
breakpointPx: 959,
},
i18n: {
availableLanguages: [
'de',
'en'
]
}
};

View File

@ -1,5 +1,5 @@
<mat-toolbar color="primary">
<div fxHide.gt-sm style="position:absolute;">
<div fxHide.gt-sm>
<button mat-icon-button (click)="onToggleSidenav()">
<mat-icon svgIcon="menu"></mat-icon>
</button>
@ -11,7 +11,7 @@
<span class="version-label">v{{version}}</span>
</div>
<div fxHide.lt-md>
<ul fxLayout="row" class="navigation-items">
<ul fxLayout="row" fxLayoutGap="15px" class="navigation-items">
<li routerLinkActive="active">
<a href="https://www.opt4.net/dashboard" class="link">{{'navigation.top.board' | translate}}</a>
</li>
@ -107,7 +107,7 @@
</mat-menu>
</li>
<li *ngIf="loginService.isLoggedIn()" class="link" style="cursor: pointer">
<a (click)="doUserLogout()">{{'navigation.top.logout' | translate}}</a>
<a (click)="logout()">{{'navigation.top.logout' | translate}}</a>
</li>
<li *ngIf="!loginService.isLoggedIn()" routerLinkActive="active">
<a routerLink='{{config.loginPath}}' class="link">{{'navigation.top.login' | translate}}</a>
@ -120,13 +120,13 @@
</a>
</mat-list-item>
<mat-menu #menuLanguage="matMenu">
<button mat-menu-item (click)="setLanguage(availableLanguages[0])">
<mat-icon svgIcon="flag-{{availableLanguages[0]}}"></mat-icon>
<span class="text-uppercase">{{availableLanguages[0]}}</span>
<button mat-menu-item (click)="setLanguage(languages[0])">
<mat-icon svgIcon="flag-{{languages[0]}}"></mat-icon>
<span class="text-uppercase">{{languages[0]}}</span>
</button>
<button mat-menu-item (click)="setLanguage(availableLanguages[1])">
<mat-icon svgIcon="flag-{{availableLanguages[1]}}"></mat-icon>
<span class="text-uppercase">{{availableLanguages[1]}}</span>
<button mat-menu-item (click)="setLanguage(languages[1])">
<mat-icon svgIcon="flag-{{languages[1]}}"></mat-icon>
<span class="text-uppercase">{{languages[1]}}</span>
</button>
</mat-menu>
</li>

View File

@ -1,11 +1,23 @@
@import url('../../style/blink-indicator.scss');
li {
height: 50px;
line-height: 46px;
}
mat-toolbar {
height: 2.5em;
min-height: 50px;
li a {
font-size: 16px;
text-decoration: none;
color: #9d9d9d;
padding: 16px 5px;
}
&.mat-toolbar.mat-primary {
background: #222222;
li mat-list-item {
cursor: pointer;
}
li:hover, li.active {
a {
color: white;
}
}
.navigation-items {
@ -14,34 +26,13 @@ mat-toolbar {
margin: 0;
}
li {
height: 50px;
line-height: 46px;
padding: 0 10px;
cursor: pointer;
mat-list-item {
cursor: pointer;
.mat-toolbar.mat-primary {
background: #222222;
}
a {
font-size: 16px;
text-decoration: none;
color: #9d9d9d;
padding: 16px 5px;
}
&:hover {
a {
color: white;
}
}
&.active {
@extend li:hover;
background: #000000;
}
mat-toolbar {
height: 2.5em;
min-height: 50px;
}
.brand-logo {
@ -67,4 +58,33 @@ mat-toolbar {
}
}
.unprocessed {
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink;
animation-duration: 4s;
animation-iteration-count: infinite;
}
.unprocessed-child {
background-color: orange;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}
@keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}

View File

@ -1,7 +1,8 @@
import {Component, EventEmitter, OnInit, Output} from '@angular/core';
import {BaseConfig, RouteConfig} from '../../app.config';
import {RouteConfig} from '../../app.config';
import {environment} from '../../../environments/environment';
import {LoginService} from '../../services/app-user-service/login-service';
import {Router} from '@angular/router';
import {PromotionService} from '../../services/army-management/promotion.service';
import {AwardingService} from '../../services/army-management/awarding.service';
import {SettingsService} from '../../services/settings.service';
@ -16,21 +17,20 @@ declare function require(url: string);
})
export class NavigationHeaderComponent implements OnInit {
@Output() sidenavToggle = new EventEmitter();
@Output() userLogout = new EventEmitter();
@Output() public sidenavToggle = new EventEmitter();
readonly features = environment.features;
readonly availableLanguages = BaseConfig.i18n.availableLanguages;
readonly version = require('./../../../../../package.json').version;
config = RouteConfig;
language;
languages = ['de', 'en'];
version = require('./../../../../../package.json').version;
constructor(public loginService: LoginService,
private router: Router,
private promotionService: PromotionService,
private awardingService: AwardingService,
private translate: TranslateService,
@ -49,18 +49,21 @@ export class NavigationHeaderComponent implements OnInit {
}
}
public onToggleSidenav() {
public onToggleSidenav = () => {
this.sidenavToggle.emit();
};
public doUserLogout() {
this.userLogout.emit()
};
setLanguage(language: string) {
if (language) {
this.language = language;
this.settingsService.setLanguage(language);
}
}
logout() {
this.loginService.logout();
setTimeout(() => {
this.router.navigate([RouteConfig.overviewPath]);
}, 500);
}
}

View File

@ -96,23 +96,23 @@
</a>
</mat-list-item>
<mat-menu #menuLanguage="matMenu">
<button mat-menu-item (click)="setLanguage(availableLanguages[0])">
<mat-icon svgIcon="flag-{{availableLanguages[0]}}"></mat-icon>
<span class="text-uppercase">{{availableLanguages[0]}}</span>
<button mat-menu-item (click)="setLanguage(languages[0])">
<mat-icon svgIcon="flag-{{languages[0]}}"></mat-icon>
<span class="text-uppercase">{{languages[0]}}</span>
</button>
<button mat-menu-item (click)="setLanguage(availableLanguages[1])">
<mat-icon svgIcon="flag-{{availableLanguages[1]}}"></mat-icon>
<span class="text-uppercase">{{availableLanguages[1]}}</span>
<button mat-menu-item (click)="setLanguage(languages[1])">
<mat-icon svgIcon="flag-{{languages[1]}}"></mat-icon>
<span class="text-uppercase">{{languages[1]}}</span>
</button>
</mat-menu>
<a mat-list-item *ngIf="loginService.isLoggedIn()"
(click)="doUserLogout(); onSidenavClose()">
(click)="logout(); onSidenavClose()">
<span class="nav-caption">{{'navigation.top.logout' | translate}}</span>
</a>
<a mat-list-item *ngIf="!loginService.isLoggedIn()"
routerLinkActive="active" routerLink='{{config.loginPath}}' (click)="onSidenavClose()">
routerLink='{{config.loginPath}}' (click)="onSidenavClose()">
<span class="nav-caption">{{'navigation.top.login' | translate}}</span>
</a>

View File

@ -1,14 +1,8 @@
@import url('../../style/blink-indicator.scss');
mat-list-item.mat-list-item, a.mat-list-item {
font-size: 16px;
text-decoration: none;
color: #9d9d9d;
&.active {
background: #000000;
}
&:hover, &.active {
color: #ffffff;
}
@ -23,3 +17,34 @@ mat-divider {
margin: 15% 0;
border-color: #9d9d9d;
}
.unprocessed {
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink;
animation-duration: 4s;
animation-iteration-count: infinite;
}
.unprocessed-child {
background-color: orange;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}
@keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}

View File

@ -1,11 +1,12 @@
import {Component, EventEmitter, OnInit, Output} from '@angular/core';
import {BaseConfig, RouteConfig} from '../../app.config';
import {RouteConfig} from '../../app.config';
import {LoginService} from '../../services/app-user-service/login-service';
import {PromotionService} from '../../services/army-management/promotion.service';
import {AwardingService} from '../../services/army-management/awarding.service';
import {environment} from '../../../environments/environment';
import {TranslateService} from '@ngx-translate/core';
import {SettingsService} from '../../services/settings.service';
import {Router} from '@angular/router';
@Component({
selector: 'app-sidenav-list',
@ -16,19 +17,18 @@ export class SidenavListComponent implements OnInit {
@Output() sidenavClose = new EventEmitter();
@Output() userLogout = new EventEmitter();
readonly features = environment.features;
readonly availableLanguages = BaseConfig.i18n.availableLanguages;
config = RouteConfig;
language;
languages = ['de', 'en'];
constructor(public loginService: LoginService,
public promotionService: PromotionService,
public awardingService: AwardingService,
private router: Router,
private promotionService: PromotionService,
private awardingService: AwardingService,
private translate: TranslateService,
private settingsService: SettingsService) {
}
@ -40,18 +40,21 @@ export class SidenavListComponent implements OnInit {
});
}
public onSidenavClose() {
public onSidenavClose = () => {
this.sidenavClose.emit();
};
public doUserLogout() {
this.userLogout.emit()
};
setLanguage(language: string) {
if (language) {
this.language = language;
this.settingsService.setLanguage(language);
}
}
logout() {
this.loginService.logout();
setTimeout(() => {
this.router.navigate([RouteConfig.overviewPath]);
}, 500);
}
}

View File

@ -5,8 +5,9 @@ import {ActivatedRoute, Router} from '@angular/router';
import {TranslateService} from '@ngx-translate/core';
import {SettingsService} from '../services/settings.service';
import {WarService} from '../services/logs/war.service';
import {UIHelpers} from '../utils/global.helpers';
import {Observable} from 'rxjs';
import {BaseConfig} from '../app.config';
import {ResponsiveConfig} from '../app.config';
@Component({
selector: 'cc-stats',
@ -30,24 +31,25 @@ export class StatisticComponent implements OnInit {
private translate: TranslateService,
private settingsService: SettingsService) {
this.settingsService.getLanguage().subscribe((language) => this.translate.setDefaultLang(language));
this.collapsed = UIHelpers.isMobileDevice();
}
ngOnInit() {
this.campaignService.getAllCampaigns()
.filter(campaigns => campaigns.length !== 0)
.subscribe((campaigns) => {
this.campaigns = campaigns;
this.resolveCampaignFromUrl();
});
Observable.fromEvent(window, 'resize').subscribe(event => {
if (event.target['innerWidth'] <= BaseConfig.responsive.breakpointPx) {
if (event.target['innerWidth'] <= ResponsiveConfig.breakpointPx) {
this.collapsed = true;
this.collapseBtnVisible = false;
} else {
this.collapseBtnVisible = true;
}
});
this.campaignService.getAllCampaigns()
.filter(campaigns => campaigns.length !== 0)
.subscribe((campaigns) => {
this.campaigns = campaigns;
this.resolveCampaignFromUrl();
});
}
resolveCampaignFromUrl() {

View File

@ -1,30 +0,0 @@
.unprocessed {
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink;
animation-duration: 4s;
animation-iteration-count: infinite;
}
.unprocessed-child {
background-color: orange;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}
@keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}

View File

@ -21,4 +21,30 @@ export const UIHelpers = {
}
return currentVal;
},
isMobileDevice: (): boolean => {
const exp1 = new RegExp('(android|bb\\d+|meego).+mobile|avantgo|bada\\/|blackberry|blazer|compal|elaine|' +
'fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|' +
'palm( os)?|phone|p(ixi|re)\\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\\.(browser|link)|vodafone|wap|' +
'windows (ce|phone)|xda|xiino', 'i');
const exp2 = new RegExp('1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\\-)|ai(ko|rn)' +
'|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl' +
'(ac|az)|br(e|v)w|bumb|bw\\-(n|u)|c55\\/|capi|ccwa|cdm\\-|cell|chtm|cldc|cmd\\-|co(mp|nd)|craw|da(it|ll|ng)|db' +
'te|dc\\-s|devi|dica|dmob|do(c|p)o|ds(12|\\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly' +
'(\\-|_)|g1 u|g560|gene|gf\\-5|g\\-mo|go(\\.w|od)|gr(ad|un)|haie|hcit|hd\\-(m|p|t)|hei\\-|hi(pt|ta)|hp( i|ip)|' +
'hs\\-c|ht(c(\\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\\-(20|go|ma)|i230|iac( |\\-|\\/)|ibro|idea|ig01|ikom|im1k|inno' +
'|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\\/)|klon|kpt |kwc\\-|kyo(c|k)|le(no|xi)|lg( g|\\/(k|l|u)|' +
'50|54|\\-[a-w])|libw|lynx|m1\\-w|m3ga|m50\\/|ma(te|ui|xo)|mc(01|21|ca)|m\\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo' +
'(01|02|bi|de|do|t(\\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)' +
'|ne((c|m)\\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\\-([1-8]|c))' +
'|phil|pire|pl(ay|uc)|pn\\-2|po(ck|rt|se)|prox|psio|pt\\-g|qa\\-a|qc(07|12|21|32|60|\\-[2-7]|i\\-)|qtek|r380|r6' +
'00|raks|rim9|ro(ve|zo)|s55\\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\\-|oo|p\\-)|sdk\\/|se(c(\\-|0|1)|47|mc|nd|ri)|sgh' +
'\\-|shar|sie(\\-|m)|sk\\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\\-|v\\-|v )|sy(01|mb)|t2(18|50)|t6(0' +
'0|10|18)|ta(gt|lk)|tcl\\-|tdg\\-|tel(i|m)|tim\\-|t\\-mo|to(pl|sh)|ts(70|m\\-|m3|m5)|tx\\-9|up(\\.b|g1|si)|uts' +
't|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\\-| )|web' +
'c|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\\-|your|zeto|zte\\-', 'i');
return exp1.test(navigator.userAgent) || exp2.test(navigator.userAgent.substr(0, 4));
}
};