From 93b6f2facf9c9dae6882a21aea84226a9e6137b2 Mon Sep 17 00:00:00 2001
From: mechtelm <mechtel@iqb.hu-berlin.de>
Date: Mon, 10 Feb 2020 14:09:22 +0100
Subject: [PATCH] system-check: basic test config removed; some wording changed
---
src/app/about/about.component.html | 6 +-
src/app/about/about.component.ts | 6 ++
src/app/sys-check/backend.service.ts | 6 --
.../environment-check.component.html | 34 ++++-----
.../environment-check.component.ts | 2 +-
.../network-check.component.html | 75 +++++++++----------
.../network-check/network-check.component.ts | 2 +-
.../network-check/tc-speed-chart.component.ts | 10 ++-
.../questionnaire/questionnaire.component.ts | 2 +-
src/app/sys-check/report/report.component.ts | 11 ++-
src/app/sys-check/start.component.html | 21 ++++--
src/app/sys-check/start.component.ts | 4 +-
src/app/sys-check/sys-check.component.html | 13 +++-
src/app/sys-check/sys-check.component.ts | 48 ++++++------
src/app/sys-check/sys-check.interfaces.ts | 8 +-
src/app/sys-check/sys-check.module.ts | 2 +
src/app/sys-check/syscheck-data.service.ts | 2 +-
.../unit-check/unit-check.component.html | 5 +-
.../unit-check/unit-check.component.ts | 33 ++++----
src/styles.css | 2 +-
20 files changed, 164 insertions(+), 128 deletions(-)
diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html
index edd56307..51ae13ab 100644
--- a/src/app/about/about.component.html
+++ b/src/app/about/about.component.html
@@ -1,6 +1,6 @@
<div class="logo">
<a [routerLink]="['/']">
- <img src="assets/IQB-LogoA.png" matTooltip="Startseite"/>
+ <img src="assets/IQB-LogoA.png" matTooltip="Startseite" alt="IQB-logo"/>
</a>
</div>
<div class="page-body">
@@ -46,8 +46,10 @@
E-Mail: datenschutz@uv.hu-berlin.de<br/>
<a href="http://www.hu-berlin.de/de/datenschutz" target="_blank">www.hu-berlin.de/de/datenschutz</a>
</p>
- <p><a [routerLink]="['/']"><i class="material-icons">arrow_back</i> zurück zur Startseite</a></p>
</mat-card-content>
+ <mat-card-actions>
+ <button (click)="goBack()" mat-raised-button color="primary"><i class="material-icons">arrow_back</i> zurück zur Startseite</button>
+ </mat-card-actions>
</mat-card>
</div>
</div>
diff --git a/src/app/about/about.component.ts b/src/app/about/about.component.ts
index db504334..adf69666 100644
--- a/src/app/about/about.component.ts
+++ b/src/app/about/about.component.ts
@@ -1,5 +1,6 @@
import { MainDataService } from 'src/app/maindata.service';
import { Component, Inject } from '@angular/core';
+import {Router} from "@angular/router";
@Component({
templateUrl: './about.component.html'
@@ -10,6 +11,11 @@ export class AboutComponent {
@Inject('APP_NAME') public appName: string,
@Inject('APP_PUBLISHER') public appPublisher: string,
@Inject('APP_VERSION') public appVersion: string,
+ private router: Router,
public mds: MainDataService
) { }
+
+ goBack() {
+ this.router.navigate(['/']);
+ }
}
diff --git a/src/app/sys-check/backend.service.ts b/src/app/sys-check/backend.service.ts
index 729b513a..96c796f9 100644
--- a/src/app/sys-check/backend.service.ts
+++ b/src/app/sys-check/backend.service.ts
@@ -10,12 +10,6 @@ import {ErrorHandler, ServerError} from "iqb-components";
providedIn: 'root'
})
export class BackendService {
- public basicTestConfig: CheckConfig = {
- id: 'Basistest',
- label: 'Basistest',
- description: 'Es wird nur ein Bericht zu grundlegenden Systemeigenschaften und zur Netzverbindung gegeben.'
- };
-
private serverSlimUrl_GET: string;
constructor(
diff --git a/src/app/sys-check/environment-check/environment-check.component.html b/src/app/sys-check/environment-check/environment-check.component.html
index f74a29e8..d6910822 100644
--- a/src/app/sys-check/environment-check/environment-check.component.html
+++ b/src/app/sys-check/environment-check/environment-check.component.html
@@ -1,20 +1,16 @@
-<mat-card>
+<mat-card-header>
+ <mat-card-title>
+ Computer/Browser
+ </mat-card-title>
+</mat-card-header>
- <mat-card-header>
- <mat-card-title>
- Computer/Browser
- </mat-card-title>
- </mat-card-header>
-
- <mat-card-content>
- <table fxFlex="100%">
- <tbody>
- <tr *ngFor="let ed of data">
- <td>{{ed.label}}</td>
- <td> {{ed.value}}</td>
- </tr>
- </tbody>
- </table>
- </mat-card-content>
-
-</mat-card>
+<mat-card-content>
+ <table fxFlex="100%">
+ <tbody>
+ <tr *ngFor="let ed of data">
+ <td>{{ed.label}}</td>
+ <td> {{ed.value}}</td>
+ </tr>
+ </tbody>
+ </table>
+</mat-card-content>
diff --git a/src/app/sys-check/environment-check/environment-check.component.ts b/src/app/sys-check/environment-check/environment-check.component.ts
index faae98b4..9531d640 100644
--- a/src/app/sys-check/environment-check/environment-check.component.ts
+++ b/src/app/sys-check/environment-check/environment-check.component.ts
@@ -9,7 +9,7 @@ import { ReportEntry } from '../sys-check.interfaces';
export class EnvironmentCheckComponent implements OnInit {
private report: Map<string, ReportEntry> = new Map<string, ReportEntry>();
- private data: ReportEntry[] = [];
+ data: ReportEntry[] = [];
private rating = {
browser: {
diff --git a/src/app/sys-check/network-check/network-check.component.html b/src/app/sys-check/network-check/network-check.component.html
index 599cf55f..01ae4476 100644
--- a/src/app/sys-check/network-check/network-check.component.html
+++ b/src/app/sys-check/network-check/network-check.component.html
@@ -1,45 +1,42 @@
-<mat-card>
- <mat-card-header>
- <mat-card-title>
- Netzwerk
- <span *ngIf="!status.done" style="color:red"> - Test läuft, bitte warten.</span>
- </mat-card-title>
- <mat-card-subtitle>
- {{status.message}}
+<mat-card-header>
+ <mat-card-title>
+ Netzwerk
+ <span *ngIf="!status.done" style="color:red"> - Test läuft, bitte warten.</span>
+ </mat-card-title>
+ <mat-card-subtitle>
+ {{status.message}}
- <span *ngIf="status.done && (networkRating.overallRating !== 'N/A')">
- <span [ngSwitch]="networkRating.overallRating">Ihre Verbindung zum Testserver ist
- <span *ngSwitchCase="'insufficient'" style="color: red; font-weight: bold;">unzureichend</span>
- <span *ngSwitchCase="'ok'" style="color: orange; font-weight: bold;">vorauss. ausreichend</span>
- <span *ngSwitchCase="'good'" style="color: green; font-weight: bold;">gut</span>
- <span *ngSwitchCase="'unstable'" style="color: orangered; font-weight: bold;">sehr instabil</span>
- </span>.
- </span>
- </mat-card-subtitle>
- </mat-card-header>
+ <span *ngIf="status.done && (networkRating.overallRating !== 'N/A')">
+ <span [ngSwitch]="networkRating.overallRating">Ihre Verbindung zum Testserver ist
+ <span *ngSwitchCase="'insufficient'" style="color: red; font-weight: bold;">unzureichend</span>
+ <span *ngSwitchCase="'ok'" style="color: orange; font-weight: bold;">vorauss. ausreichend</span>
+ <span *ngSwitchCase="'good'" style="color: green; font-weight: bold;">gut</span>
+ <span *ngSwitchCase="'unstable'" style="color: orangered; font-weight: bold;">sehr instabil</span>
+ </span>.
+ </span>
+ </mat-card-subtitle>
+</mat-card-header>
- <mat-card-content>
- <div fxLayout="row">
+<mat-card-content>
+ <div fxLayout="row">
- <div fxFlex="50%">
- <h4>
- <span style="font-weight: normal">Geschwindigkeit Download: </span>
- <span *ngIf="status.avgDownloadSpeedBytesPerSecond >= 0">⌀ {{humanReadableBytes(status.avgDownloadSpeedBytesPerSecond, true, false)}}/s</span>
- <span *ngIf="status.avgDownloadSpeedBytesPerSecond < 0">Test noch nicht gestartet</span>
- </h4>
- <tc-speed-chart #downloadChart></tc-speed-chart>
- </div>
-
- <div fxFlex="50%">
- <h4>
- <span style="font-weight: normal">Geschwindigkeit Upload: </span>
- <span *ngIf="status.avgUploadSpeedBytesPerSecond >= 0">⌀ {{humanReadableBytes(status.avgUploadSpeedBytesPerSecond, true)}}/s</span>
- <span *ngIf="status.avgUploadSpeedBytesPerSecond < 0">Test noch nicht gestartet</span>
- </h4>
- <tc-speed-chart #uploadChart></tc-speed-chart>
- </div>
+ <div fxFlex="50%">
+ <h4>
+ <span style="font-weight: normal">Geschwindigkeit Download: </span>
+ <span *ngIf="status.avgDownloadSpeedBytesPerSecond >= 0">⌀ {{humanReadableBytes(status.avgDownloadSpeedBytesPerSecond, true, false)}}/s</span>
+ <span *ngIf="status.avgDownloadSpeedBytesPerSecond < 0">Test noch nicht gestartet</span>
+ </h4>
+ <tc-speed-chart #downloadChart></tc-speed-chart>
+ </div>
+ <div fxFlex="50%">
+ <h4>
+ <span style="font-weight: normal">Geschwindigkeit Upload: </span>
+ <span *ngIf="status.avgUploadSpeedBytesPerSecond >= 0">⌀ {{humanReadableBytes(status.avgUploadSpeedBytesPerSecond, true)}}/s</span>
+ <span *ngIf="status.avgUploadSpeedBytesPerSecond < 0">Test noch nicht gestartet</span>
+ </h4>
+ <tc-speed-chart #uploadChart></tc-speed-chart>
</div>
- </mat-card-content>
-</mat-card>
+ </div>
+</mat-card-content>
diff --git a/src/app/sys-check/network-check/network-check.component.ts b/src/app/sys-check/network-check/network-check.component.ts
index 4a0c23c3..fa887201 100644
--- a/src/app/sys-check/network-check/network-check.component.ts
+++ b/src/app/sys-check/network-check/network-check.component.ts
@@ -96,7 +96,7 @@ export class NetworkCheckComponent implements OnInit {
const plotterSettings = {
css: 'border: 1px solid silver; margin: 2px; width: 100%;',
width: 800,
- height: 140,
+ height: 240,
labelPadding: 4,
xAxisMaxValue: 16 + Math.max(...testSizes),
xAxisMinValue: Math.min(...testSizes),
diff --git a/src/app/sys-check/network-check/tc-speed-chart.component.ts b/src/app/sys-check/network-check/tc-speed-chart.component.ts
index a7fcf865..a61fe527 100644
--- a/src/app/sys-check/network-check/tc-speed-chart.component.ts
+++ b/src/app/sys-check/network-check/tc-speed-chart.component.ts
@@ -1,4 +1,4 @@
-import { Component, ElementRef, OnInit } from '@angular/core';
+import { Component, ElementRef } from '@angular/core';
export interface TcSpeedChartSettings {
lineWidth: number;
@@ -37,14 +37,14 @@ export class TcSpeedChartComponent {
css: 'border: 1px solid black',
lineWidth: 5,
width: 800,
- height: 240,
+ height: 400,
gridColor: 'silver',
axisColor: 'red',
labelFont: '20 pt Verdana',
labelPadding: 4,
xAxisMaxValue: 200,
xAxisMinValue: -10,
- yAxisMaxValue: 100,
+ yAxisMaxValue: 300,
yAxisMinValue: -10,
xAxisStepSize: 20,
yAxisStepSize: 10,
@@ -64,10 +64,11 @@ export class TcSpeedChartComponent {
this.context = this.canvas.getContext('2d');
this.config = {...this.config, ...config};
-
+ console.log("1: " + this.config.css);
this.canvas.setAttribute('style', this.config.css);
this.canvas.setAttribute('height', this.config.height);
this.canvas.setAttribute('width', this.config.width);
+ console.log("2: " + this.canvas.height);
this.context.setTransform(1, 0, 0, 1, 0, 0);
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
@@ -80,6 +81,7 @@ export class TcSpeedChartComponent {
this.xScale = this.canvas.width / (xAxisMaxValue - xAxisMinValue);
this.yScale = this.canvas.height / (yAxisMaxValue - yAxisMinValue);
+ console.log("3: " + this.config.css);
this.drawGridColumns();
this.drawGridRows();
diff --git a/src/app/sys-check/questionnaire/questionnaire.component.ts b/src/app/sys-check/questionnaire/questionnaire.component.ts
index 2a3c79f5..1359ecd9 100644
--- a/src/app/sys-check/questionnaire/questionnaire.component.ts
+++ b/src/app/sys-check/questionnaire/questionnaire.component.ts
@@ -46,7 +46,7 @@ export class QuestionnaireComponent implements OnInit {
this.questions.forEach(element => {
if (element.type !== 'header') {
const value = this.form.controls[element.id].value;
- const warning = (['string', 'select', 'radio'].indexOf(element.type) > -1) && (value === '');
+ const warning = (['string', 'select', 'radio', 'text'].indexOf(element.type) > -1) && (value === '') && (element.required);
myReportEntries.push({'id': element.id, 'type': element.type, 'label': element.prompt, 'value': value, warning: warning});
}
});
diff --git a/src/app/sys-check/report/report.component.ts b/src/app/sys-check/report/report.component.ts
index 795b91b5..cf12bb93 100644
--- a/src/app/sys-check/report/report.component.ts
+++ b/src/app/sys-check/report/report.component.ts
@@ -18,6 +18,7 @@ export class ReportComponent {
environmentData: ReportEntry[] = [];
networkData: ReportEntry[] = [];
questionnaireData: ReportEntry[] = [];
+ questionnaireDataWarnings: ReportEntry[] = [];
unitData: ReportEntry[] = [];
csvReport = '';
@@ -35,7 +36,15 @@ export class ReportComponent {
) {
this.eDataSubscription = this.ds.environmentData$.subscribe(rd => {this.environmentData = rd; });
this.nDataSubscription = this.ds.networkData$.subscribe(rd => {this.networkData = rd; });
- this.qDataSubscription = this.ds.questionnaireData$.subscribe(rd => this.questionnaireData = rd);
+ this.qDataSubscription = this.ds.questionnaireData$.subscribe(rd => {
+ this.questionnaireData = rd;
+ this.questionnaireDataWarnings = [];
+ this.questionnaireData.forEach(re => {
+ if (re.warning) {
+ this.questionnaireDataWarnings.push(re);
+ }
+ })
+ });
this.uDataSubscription = this.ds.unitData$.subscribe(rd => this.unitData = rd);
}
diff --git a/src/app/sys-check/start.component.html b/src/app/sys-check/start.component.html
index b9a21e44..718873a8 100644
--- a/src/app/sys-check/start.component.html
+++ b/src/app/sys-check/start.component.html
@@ -1,6 +1,6 @@
<div class="logo">
<a [routerLink]="['/']">
- <img src="assets/IQB-LogoA.png" matTooltip="Startseite"/>
+ <img src="assets/IQB-LogoA.png" matTooltip="Startseite" alt="IQB-logo"/>
</a>
</div>
<div class="spinner-container" *ngIf="dataLoading">
@@ -9,21 +9,23 @@
<div class="page-body">
<div fxLayout="row" fxLayoutAlign="center start">
<mat-card fxFlex="0 2 500px">
- <mat-card-title>Starten</mat-card-title>
+ <mat-card-title>System-Check: Starten</mat-card-title>
<mat-card-content>
<p>Hier können Sie ermitteln, ob das Computersystem, das Sie gerade benutzen, für
- die hier vorgesehenen Testungen geeignet ist. Sie erhalten hierzu einen detaillierten Bericht,
- den Sie speichern oder drucken können.</p>
- <p *ngIf="checkConfigList.length === 0">
+ die hier vorgesehenen Testungen geeignet ist.</p>
+ <p *ngIf="dataLoading">
Bitte warten... Konfiguration wird geladen
</p>
- <p *ngIf="checkConfigList.length > 1">
+ <p *ngIf="!dataLoading && (checkConfigList.length === 0)">
+ Auf diesem Server ist aktuell kein System-Check verfügbar.
+ </p>
+ <p *ngIf="!dataLoading && (checkConfigList.length > 1)">
Bitte wählen Sie einen Check aus!
</p>
- <p *ngIf="checkConfigList.length === 1">
+ <p *ngIf="!dataLoading && (checkConfigList.length === 1)">
Bitte klicken Sie auf den Schalter, um den Check zu starten!
</p>
- <div fxLayout="row" fxLayoutGap="10px" fxLayout="column">
+ <div fxLayout="column" fxLayoutGap="10px">
<button mat-raised-button color="primary" (click)="buttonStartCheck(c)"
*ngFor="let c of checkConfigList">
<div fxLayout="column">
@@ -33,6 +35,9 @@
</button>
</div>
</mat-card-content>
+ <mat-card-actions>
+ <button (click)="goBack()" mat-raised-button color="primary"><i class="material-icons">arrow_back</i> zurück zur Startseite</button>
+ </mat-card-actions>
</mat-card>
</div>
</div>
diff --git a/src/app/sys-check/start.component.ts b/src/app/sys-check/start.component.ts
index c2920a31..8873658b 100644
--- a/src/app/sys-check/start.component.ts
+++ b/src/app/sys-check/start.component.ts
@@ -25,7 +25,6 @@ export class StartComponent implements OnInit {
this.dataLoading = true;
this.bs.getCheckConfigs().subscribe(myConfigs => {
this.checkConfigList = myConfigs;
- this.checkConfigList.push(this.bs.basicTestConfig);
this.dataLoading = false;
});
}
@@ -34,4 +33,7 @@ export class StartComponent implements OnInit {
buttonStartCheck(c: CheckConfig) {
this.router.navigate(['../run/' + c.id], {relativeTo: this.route});
}
+ goBack() {
+ this.router.navigate(['/']);
+ }
}
diff --git a/src/app/sys-check/sys-check.component.html b/src/app/sys-check/sys-check.component.html
index 60d97212..4d76c5ba 100644
--- a/src/app/sys-check/sys-check.component.html
+++ b/src/app/sys-check/sys-check.component.html
@@ -4,12 +4,19 @@
</a>
</div>
-<div class="pagetitle">{{title}}</div>
+<div class="pagetitle">System-Check: {{title}}</div>
<div class="page-body">
+ <div class="spinner-container-local" *ngIf="dataLoading">
+ <mat-spinner></mat-spinner>
+ </div>
<div fxLayout="row wrap" fxLayoutAlign="center stretch">
- <iqb-environment-check fxFlex="0 0 25%"></iqb-environment-check>
- <iqb-network-check fxFlex="0 0 75%" [measureNetwork]="checks.network"></iqb-network-check>
+ <mat-card fxFlex="0 0 400px">
+ <iqb-environment-check></iqb-environment-check>
+ </mat-card>
+ <mat-card fxFlex="2 0 800px">
+ <iqb-network-check [measureNetwork]="checks.network"></iqb-network-check>
+ </mat-card>
</div>
diff --git a/src/app/sys-check/sys-check.component.ts b/src/app/sys-check/sys-check.component.ts
index d938a41b..26fa5676 100644
--- a/src/app/sys-check/sys-check.component.ts
+++ b/src/app/sys-check/sys-check.component.ts
@@ -2,7 +2,7 @@ import { SyscheckDataService } from './syscheck-data.service';
import { ActivatedRoute, ParamMap } from '@angular/router';
import { Component, OnInit} from '@angular/core';
import {BackendService} from './backend.service';
-import {CheckConfigData} from "./sys-check.interfaces";
+import {Subscription} from "rxjs";
interface Checks {
@@ -19,6 +19,8 @@ interface Checks {
styleUrls: ['./sys-check.component.scss']
})
export class SysCheckComponent implements OnInit {
+ private taskSubscription: Subscription = null;
+ dataLoading = false;
checks: Checks = {
environment: true,
@@ -40,29 +42,33 @@ export class SysCheckComponent implements OnInit {
ngOnInit() {
this.route.paramMap.subscribe((params: ParamMap) => {
const paramId = params.get('c');
- if (paramId === this.bs.basicTestConfig.id) {
- this.loadTestConfig();
- } else {
- this.bs.getCheckConfigData(paramId).subscribe(config => this.loadTestConfig(config));
- }
+ this.bs.getCheckConfigData(paramId).subscribe(checkConfig => {
+ this.ds.checkConfig$.next(checkConfig);
+
+ this.title = checkConfig.label;
+ this.checks.unit = checkConfig.hasunit;
+ this.checks.network = !checkConfig.skipnetwork;
+ this.checks.questions = checkConfig.questions.length > 0;
+ this.checks.report = checkConfig.cansave;
+
+ if (this.checks.unit) {
+ this.ds.taskQueue.push('loadunit');
+ }
+ if (this.checks.network) {
+ this.ds.taskQueue.push('speedtest');
+ }
+ this.ds.nextTask();
+ this.taskSubscription = this.ds.task$.subscribe(task => {
+ this.dataLoading = (typeof task !== 'undefined') && (this.ds.taskQueue.length > 0);
+ });
+
+ });
});
}
- loadTestConfig(checkConfig: CheckConfigData = null) {
- if (checkConfig) {
- this.ds.checkConfig$.next(checkConfig);
- } else {
- checkConfig = this.ds.checkConfig$.getValue();
+ ngOnDestroy() {
+ if (this.taskSubscription !== null) {
+ this.taskSubscription.unsubscribe();
}
-
- this.title = checkConfig.label;
- this.checks.unit = checkConfig.hasunit;
- this.checks.network = !checkConfig.skipnetwork;
- this.checks.questions = checkConfig.questions.length > 0;
- this.checks.report = checkConfig.cansave;
-
- if (this.checks.unit) { this.ds.taskQueue.push('loadunit'); }
- if (this.checks.network) { this.ds.taskQueue.push('speedtest'); }
- this.ds.nextTask();
}
}
diff --git a/src/app/sys-check/sys-check.interfaces.ts b/src/app/sys-check/sys-check.interfaces.ts
index 050b8172..e58c4522 100644
--- a/src/app/sys-check/sys-check.interfaces.ts
+++ b/src/app/sys-check/sys-check.interfaces.ts
@@ -19,7 +19,7 @@ export interface CheckConfigData {
questions: FormDefEntry[];
hasunit: boolean;
cansave: boolean;
- questionsintro: string;
+ customtexts: CustomText[];
skipnetwork: boolean;
downloadspeed: SpeedParameters;
uploadspeed: SpeedParameters;
@@ -31,6 +31,12 @@ export interface FormDefEntry {
prompt: string;
value: string;
options: string[];
+ required: boolean;
+}
+
+export interface CustomText {
+ key: string;
+ value: string;
}
export interface UnitData {
diff --git a/src/app/sys-check/sys-check.module.ts b/src/app/sys-check/sys-check.module.ts
index 63fe80ca..83eaee88 100644
--- a/src/app/sys-check/sys-check.module.ts
+++ b/src/app/sys-check/sys-check.module.ts
@@ -24,6 +24,7 @@ import { SaveReportComponent } from './report/save-report/save-report.component'
import { UnitNaviButtonsComponent } from './unit-check/tc-navi-buttons/unit-navi-buttons.component';
import { TcSpeedChartComponent } from './network-check/tc-speed-chart.component';
+import {MatTooltipModule} from "@angular/material/tooltip";
@NgModule({
imports: [
@@ -42,6 +43,7 @@ import { TcSpeedChartComponent } from './network-check/tc-speed-chart.component'
MatIconModule,
MatSelectModule,
MatRadioModule,
+ MatTooltipModule,
MatSnackBarModule,
MatDialogModule,
ReactiveFormsModule
diff --git a/src/app/sys-check/syscheck-data.service.ts b/src/app/sys-check/syscheck-data.service.ts
index 9d2ae5d2..480584ca 100644
--- a/src/app/sys-check/syscheck-data.service.ts
+++ b/src/app/sys-check/syscheck-data.service.ts
@@ -16,7 +16,7 @@ export class SyscheckDataService {
questions: [],
hasunit: false,
cansave: false,
- questionsintro: 'Bitte bearbeiten Sie die nachfolgenden Fragen.',
+ customtexts: [],
skipnetwork: false,
downloadspeed : {
min: 1.875e+6, // 15Mbit/s ~> typical dl speed 4G CAT4
diff --git a/src/app/sys-check/unit-check/unit-check.component.html b/src/app/sys-check/unit-check/unit-check.component.html
index e1b46fef..a471efc7 100644
--- a/src/app/sys-check/unit-check/unit-check.component.html
+++ b/src/app/sys-check/unit-check/unit-check.component.html
@@ -3,7 +3,7 @@
<mat-card-header>
<mat-card-title>
Test-Aufgabe
- <span *ngIf="dataLoading" style="color:red"> - wird gleich geladen, bitte warten.</span>
+ <span *ngIf="waitforloading" style="color:red"> - wird geladen, bitte warten.</span>
</mat-card-title>
<mat-card-subtitle>Hier können Sie eine Aufgabe ausprobieren</mat-card-subtitle>
@@ -11,9 +11,6 @@
</mat-card-header>
<mat-card-content style="height: 610px; overflow: auto">
- <div class="spinner-container-local" *ngIf="dataLoading">
- <mat-spinner></mat-spinner>
- </div>
<div style="color:red; position: absolute" *ngIf="errorMessage">{{errorMessage}}</div>
<div #iFrameHost iqbResizeIFrameChild style="height:99%"></div>
</mat-card-content>
diff --git a/src/app/sys-check/unit-check/unit-check.component.ts b/src/app/sys-check/unit-check/unit-check.component.ts
index f0a4a337..d709c327 100644
--- a/src/app/sys-check/unit-check/unit-check.component.ts
+++ b/src/app/sys-check/unit-check/unit-check.component.ts
@@ -17,12 +17,14 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
private iFrameItemplayer: HTMLIFrameElement = null;
private postMessageSubscription: Subscription = null;
+ private taskSubscription: Subscription = null;
+ private itemplayerPageRequestSubscription = null;
private itemplayerSessionId = '';
private postMessageTarget: Window = null;
private pendingItemDefinition$ = new BehaviorSubject(null);
+ waitforloading = true;
- public dataLoading = true;
public errorMessage = '';
constructor(
@@ -34,16 +36,16 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
ngOnInit() {
- combineLatest(
+ this.taskSubscription = combineLatest(
this.ds.task$,
this.ds.checkConfig$
- ).subscribe(([task, checkConfig]) => {
- if (task === 'loadunit') {
- this.loadUnitAndPlayer(checkConfig.id);
- }
+ ).subscribe(([task, checkConfig]) => {
+ if (task === 'loadunit') {
+ this.loadUnitAndPlayer(checkConfig.id);
+ }
});
- this.ds.itemplayerPageRequest$.subscribe((newPage: string) => {
+ this.itemplayerPageRequestSubscription = this.ds.itemplayerPageRequest$.subscribe((newPage: string) => {
if (newPage.length > 0) {
this.postMessageTarget.postMessage({
type: 'vo.ToPlayer.NavigateToPage',
@@ -96,6 +98,7 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
this.ds.itemplayerValidPages$.next([]);
this.ds.itemplayerCurrentPage$.next('');
}
+ this.waitforloading = false;
break;
case 'vo.FromPlayer.ChangedDataTransfer':
@@ -131,7 +134,6 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
this.ds.unitData$.next([
{id: '0', type: 'unit/player', label: 'loading error', value: 'Error: ' + unitAndPlayer.labelSystem, warning: true}
]);
- this.dataLoading = false;
return '';
}
@@ -142,7 +144,6 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
{id: '0', type: 'unit/player', label: 'loading time', value: unitAndPlayer.duration.toString(), warning: false}
]);
console.warn(unitAndPlayer);
- this.dataLoading = false;
return '';
}
@@ -159,9 +160,6 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
private clearPlayerElement(): void {
-
- this.dataLoading = true;
-
while (this.iFrameHostElement.nativeElement.hasChildNodes()) {
this.iFrameHostElement.nativeElement.removeChild(this.iFrameHostElement.nativeElement.lastChild);
}
@@ -175,10 +173,17 @@ export class UnitCheckComponent implements OnInit, OnDestroy {
this.iFrameItemplayer.setAttribute('class', 'unitHost');
this.iFrameItemplayer.setAttribute('height', '100');
this.iFrameHostElement.nativeElement.appendChild(this.iFrameItemplayer);
- this.dataLoading = false;
}
ngOnDestroy() {
- this.postMessageSubscription.unsubscribe();
+ if (this.taskSubscription !== null) {
+ this.taskSubscription.unsubscribe();
+ }
+ if (this.itemplayerPageRequestSubscription !== null) {
+ this.itemplayerPageRequestSubscription.unsubscribe();
+ }
+ if (this.postMessageSubscription !== null) {
+ this.postMessageSubscription.unsubscribe();
+ }
}
}
diff --git a/src/styles.css b/src/styles.css
index 1163ecfd..f41d547a 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -82,7 +82,7 @@ div.logo img {
.pagetitle {
position: absolute;
- left: 100px;
+ left: 140px;
top: 18px;
font-size: 1.5em;
color: white;
--
GitLab