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 5fde64a0296554164683dca2d160d73caab9756c..20b4cabe02d3fcb71b9f6566e4499696c985208f 100644
--- a/src/app/sys-check/network-check/network-check.component.html
+++ b/src/app/sys-check/network-check/network-check.component.html
@@ -1,57 +1,66 @@
<mat-card>
- <div class="spinner-container" *ngIf="!testDone">
- <mat-spinner></mat-spinner>
- </div>
-
<mat-card-header>
<mat-card-title>Netzwerk</mat-card-title>
<mat-card-subtitle>
- <div *ngIf="!testDone">
- <p>{{this.status.message}}</p>
- </div>
+ {{status.message}}
- <div *ngIf="testDone">
+ <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 <i class="material-icons">error</i></span>
- <span *ngSwitchCase="'ok'" style="color: orange; font-weight: bold;">vorauss. ausreichend <i class="material-icons">warning</i></span>
- <span *ngSwitchCase="'good'" style="color: green; font-weight: bold;">gut <i class="material-icons">check</i></span>
- <span *ngSwitchCase="'unstable'" style="color: orangered; font-weight: bold;">sehr instabil <i class="material-icons">check</i></span>
- </span>
- </div>
+ <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 class="spinner-container-local" *ngIf="!status.done">
+ <mat-spinner></mat-spinner>
+ </div>
<div fxLayout="row">
+
<div fxFlex="50%">
<h4>Geschwindigkeit Download</h4>
<p *ngIf="status.avgDownloadSpeedBytesPerSecond >= 0">⌀ {{ humanReadableBytes(status.avgDownloadSpeedBytesPerSecond, true) }}ps</p>
<p *ngIf="status.avgDownloadSpeedBytesPerSecond < 0">Test noch nicht gestartet</p>
<tc-speed-chart #downloadChart></tc-speed-chart>
</div>
+
<div fxFlex="50%">
<h4>Geschwindigkeit Upload</h4>
<p *ngIf="status.avgUploadSpeedBytesPerSecond >= 0">⌀ {{ humanReadableBytes(status.avgUploadSpeedBytesPerSecond, true) }}ps</p>
<p *ngIf="status.avgUploadSpeedBytesPerSecond < 0">Test noch nicht gestartet</p>
<tc-speed-chart #uploadChart></tc-speed-chart>
</div>
+
</div>
+ <mat-divider></mat-divider>
- <div fxLayout="row">
+ <div>
<h4>Netzwerkeigenschaften</h4>
- <p *ngIf="!detectedNetworkInformations.available">Ihr Browser ist veraltet, daher konnten keine weiteren Netzwerkeigenschaften ermittelt werden.</p>
- <p *ngIf="detectedNetworkInformations.available">Verbindung: {{detectedNetworkInformations.effectiveNetworkType}} {{detectedNetworkInformations.networkType}}</p>
- <p *ngIf="detectedNetworkInformations.roundTripTimeMs">Network RoundTrip: {{detectedNetworkInformations.roundTripTimeMs}} Millisekunden</p>
- <p *ngIf="detectedNetworkInformations.downlinkMegabitPerSecond">Network Downlink: {{detectedNetworkInformations.downlinkMegabitPerSecond}} mbps</p>
+ <table *ngIf="detectedNetworkInformations.available">
+ <tr>
+ <td>Verbindung</td>
+ <td>{{detectedNetworkInformations.networkType}}</td>
+ </tr>
+ <tr>
+ <td>Network RoundTrip</td>
+ <td>{{detectedNetworkInformations.roundTripTimeMs}}</td>
+ </tr>
+ <tr>
+ <td>Network Downlink: </td>
+ <td>{{detectedNetworkInformations.downlinkMegabitPerSecond}}</td>
+ </tr>
+ </table>
+ <div *ngIf="!detectedNetworkInformations.available">Ihr Browser ist veraltet, daher konnten keine weiteren Netzwerkeigenschaften ermittelt werden.</div>
</div>
-
-
</mat-card-content>
<mat-card-actions>
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 b6236ba2f8016227be878487121b9da8de4060f0..c1eb19157630332d2c34a1f043c10fc08bba4594 100644
--- a/src/app/sys-check/network-check/network-check.component.ts
+++ b/src/app/sys-check/network-check/network-check.component.ts
@@ -15,6 +15,7 @@ interface NetworkCheckStatus {
message: string;
avgUploadSpeedBytesPerSecond: number;
avgDownloadSpeedBytesPerSecond: number;
+ done: boolean;
}
interface BenchmarkDefinition {
@@ -51,13 +52,13 @@ export class NetworkCheckComponent implements OnInit {
readonly benchmarkDefinitions = new Map<BenchmarkType, BenchmarkDefinition>([
[BenchmarkType.down, {
- testSizes: [1024, 2048, 4096, 8192, 16384, 32768, 65536, 131072, 262144, 524288, 1048576, 2097152, 4194304],
+ testSizes: [1024], //, 2048, 4096, 8192, 16384, 32768, 65536, 131072, 262144, 524288, 1048576, 2097152, 4194304],
allowedDevianceBytesPerSecond: 100000,
allowedErrorsPerSequence: 0,
allowedSequenceRepetitions: 15
}],
[BenchmarkType.up, {
- testSizes: [1024, 4096, 16384, 65536, 262144, 1048576, 4194304],
+ testSizes: [1024],// 4096, 16384, 65536, 262144, 1048576, 4194304],
allowedDevianceBytesPerSecond: 10000000,
allowedErrorsPerSequence: 0,
allowedSequenceRepetitions: 15
@@ -65,11 +66,11 @@ export class NetworkCheckComponent implements OnInit {
]);
public status: NetworkCheckStatus = {
+ done: true,
message: 'Messung noch nicht gestartet',
avgUploadSpeedBytesPerSecond: -1,
avgDownloadSpeedBytesPerSecond: -1
};
- public testDone = false;
private networkStats = new Map<BenchmarkType, number[]>([
[BenchmarkType.down, []],
@@ -99,10 +100,9 @@ export class NetworkCheckComponent implements OnInit {
public startCheck() {
- this.testDone = false;
-
this.status = {
- message: 'Netzwerk-Analyse wird neu gestartet',
+ done: false,
+ message: 'Netzwerk-Analyse wird gestartet',
avgUploadSpeedBytesPerSecond: -1,
avgDownloadSpeedBytesPerSecond: -1
};
@@ -127,8 +127,8 @@ export class NetworkCheckComponent implements OnInit {
const testSizes = this.benchmarkDefinitions.get(benchmarkType).testSizes;
const plotterSettings = {
- css: 'border: 0px solid black; width: 100%; max-width: 400px',
- width: 400,
+ css: 'border: 1px solid silver; margin: 2px; width: 100%;',
+ width: 800,
height: 140,
labelPadding: 4,
xAxisMaxValue: 16 + Math.max(...testSizes),
@@ -216,10 +216,10 @@ export class NetworkCheckComponent implements OnInit {
const testRound = this.networkStats.get(benchmarkType).length + 1;
const testPackage = this.humanReadableBytes(requestSize);
if (benchmarkType === BenchmarkType.down) {
- this.updateStatus(`Downloadgeschwindigkeit Testrunde ${testRound} - Testgröße: ${testPackage} bytes`);
+ this.updateStatus(`Downloadgeschwindigkeit Testrunde ${testRound} - Testgröße: ${testPackage}`);
return this.bs.benchmarkDownloadRequest(requestSize);
} else {
- this.updateStatus(`Uploadgeschwindigkeit Testrunde ${testRound} - Testgröße: ${testPackage} bytes)`);
+ this.updateStatus(`Uploadgeschwindigkeit Testrunde ${testRound} - Testgröße: ${testPackage})`);
return this.bs.benchmarkUploadRequest(requestSize);
}
}
@@ -275,7 +275,7 @@ export class NetworkCheckComponent implements OnInit {
}
this.updateStatus(`Die folgenden Netzwerkeigenschaften wurden festgestellt:`);
- this.testDone = true;
+ this.status.done = true;
// send data for reporting
const reportEntry: ReportEntry[] = [];
diff --git a/src/app/sys-check/report/report.component.css b/src/app/sys-check/report/report.component.css
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/src/app/sys-check/report/report.component.ts b/src/app/sys-check/report/report.component.ts
index f59a423e3135ce6a84253c1bcce4525119dfe5e4..633dcc786a15fd35cf94a557e2af3d611a447ce9 100644
--- a/src/app/sys-check/report/report.component.ts
+++ b/src/app/sys-check/report/report.component.ts
@@ -4,8 +4,7 @@ import { Component, OnInit } from '@angular/core';
@Component({
selector: 'iqb-report',
- templateUrl: './report.component.html',
- styleUrls: ['./report.component.css']
+ templateUrl: './report.component.html'
})
export class ReportComponent implements OnInit {
reportEnabled = false;
@@ -19,7 +18,7 @@ export class ReportComponent implements OnInit {
}
ngOnInit() {
- // this.ds.environmentData$.subscribe(rd => ); too early!
+ // this.ds.environmentData$.subscribe(rd => this.environmentData ); //too early!
this.ds.networkData$.subscribe(rd => {
this.networkData = rd;
this.environmentData = this.ds.environmentData$.getValue();
diff --git a/src/app/sys-check/run.component.css b/src/app/sys-check/run.component.css
index a626628631e388a91b747ba03a12c756ccc62f5d..76a6294bd5f7ac3d57ffc9633f84ccbe4ccff6cd 100644
--- a/src/app/sys-check/run.component.css
+++ b/src/app/sys-check/run.component.css
@@ -2,13 +2,13 @@
overflow: auto;
}
-.mat-mini-fab {
- margin-right: 4px
-}
+/*.mat-mini-fab {*/
+/* margin-right: 4px*/
+/*}*/
-.mat-mini-fab[disabled] {
- background-color: grey;
-}
+/*.mat-mini-fab[disabled] {*/
+/* background-color: grey;*/
+/*}*/
.fullheight {
min-height: 90%;
@@ -18,6 +18,10 @@
margin: 1em;
}
+::ng-deep .mat-card-header-text {
+ margin-left: 0 !important;
+}
+
/*mat-card-content {*/
/* padding: 16px*/
/*}*/
diff --git a/src/environments/environment.xx.ts b/src/environments/environment.xx.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1af49e5e9ed86b036578c12ac6354f1d4d82d74a
--- /dev/null
+++ b/src/environments/environment.xx.ts
@@ -0,0 +1,21 @@
+
+// This file can be replaced during build by using the `fileReplacements` array.
+// `ng build ---prod` replaces `environment.ts` with `environment.prod.ts`.
+// The list of file replacements can be found in `angular.json`.
+
+export const environment = {
+ production: false,
+ // testcenterUrl: 'https://www.iqb-testcenter.de/',
+ testcenterUrl: 'https://ocba2.iqb.hu-berlin.de/',
+ appName: 'IQB-Testcenter',
+ appPublisher: 'IQB - Institut zur Qualitätsentwicklung im Bildungswesen',
+ appVersion: '0 (dev)'
+};
+
+/*
+ * In development mode, to ignore zone related error stack frames such as
+ * `zone.run`, `zoneDelegate.invokeTask` for easier debugging, you can
+ * import the following file, but please comment it out in production mode
+ * because it will have performance impact when throw error
+ */
+// import 'zone.js/dist/zone-error'; // Included with Angular CLI.
diff --git a/src/styles.css b/src/styles.css
index 68f0965a9e0d7cd0c3c6306955fe2a09f9a8e026..425f0a2812252ae50a50b6cec7b30df624eda1ab 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -36,7 +36,6 @@
z-index: 999;
height: 2em;
width: 2em;
- overflow: show;
margin: auto;
top: 0;
left: 0;
@@ -44,11 +43,26 @@
right: 0;
}
+.spinner-container-local {
+ z-index: 999;
+ margin: auto;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ text-align: center;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: rgba(0, 0, 0, 0.3);
+ position: absolute;
+}
+
iframe.unitHost {
width: 100%;
background-color: white;
border: none;
- margin: 0px;
+ margin: 0;
}
p.unitMessage {