diff --git a/package-lock.json b/package-lock.json
index 78164f6af756f1ce21e6c5b2d30c61faffb22488..476286932efc6454e8d56856a8788b8dc081f790 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3719,7 +3719,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"aproba": {
"version": "1.2.0",
@@ -4134,7 +4135,8 @@
"safe-buffer": {
"version": "5.1.1",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"safer-buffer": {
"version": "2.1.2",
@@ -4190,6 +4192,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@@ -4233,12 +4236,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"yallist": {
"version": "3.0.2",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
}
}
},
diff --git a/src/app/sys-check/backend.service.ts b/src/app/sys-check/backend.service.ts
index a58c90ace784a49c9c3e837dd60e866bc0603fe7..4ec20106ac185a82fb12eb76133571dccd45532f 100644
--- a/src/app/sys-check/backend.service.ts
+++ b/src/app/sys-check/backend.service.ts
@@ -137,6 +137,8 @@ export class BackendService {
// uses https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/timeout
// and https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send
+ const base64Characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcefghijklmnopqrstuvwxyz0123456789+/';
+
let startingTime;
const xhr = new XMLHttpRequest();
xhr.open('POST', this.serverUrl + 'doSysCheckUploadTest.php', true);
@@ -173,7 +175,12 @@ export class BackendService {
let uploadedContent = '';
for (let i = 1; i <= requestedUploadSize; i++) {
- uploadedContent += String(Math.floor(Math.random() * 10));
+ let randomCharacterID = Math.floor(Math.random() * 63);
+ if (randomCharacterID > base64Characters.length - 1) {
+ // failsafe, in case the random number generator is a bit imprecisely programmed and gives too big of a number back
+ randomCharacterID = base64Characters.length - 1;
+ }
+ uploadedContent += base64Characters[randomCharacterID];
}
startingTime = new Date().getTime();
xhr.send('package=' + uploadedContent);
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 2af4a2fff3b4948d22db4adf93d5f1be64e07bc5..3d7d4f5d8dd94d7a28c36be62c1454d3ed14bc65 100644
--- a/src/app/sys-check/environment-check/environment-check.component.html
+++ b/src/app/sys-check/environment-check/environment-check.component.html
@@ -1,6 +1,66 @@
-<p>
- environment-check works!
-</p>
-<p>
- <button (click)="goto()">jojo</button>
-</p>
+<br>
+<mat-card>
+ <!-- <button (click)="goto()">Go To</button> -->
+ <!-- <button mat-raised-button (click)="osInfo()">Press for screen size</button> -->
+ <!-- <button mat-raised-button (click)="removeSysInfo()">Hide info</button> -->
+ <mat-list>
+ <mat-list-item *ngIf="discoveredEnvRating.OSRating === 'Good'">OS is <span style="color: darkgreen; font-weight: bold;"> {{discoveredEnvRating.OSRating }} </span> <i class="material-icons networkCheck_inlineIcon">check</i> ({{ osName }}) </mat-list-item>
+ <mat-divider></mat-divider>
+ <mat-list-item *ngIf="discoveredEnvRating.OSRating === 'N/A'">OS is <span style="color: darkgrey; font-weight: bold;"> {{discoveredEnvRating.OSRating }} </span> <i class="material-icons networkCheck_inlineIcon">warning</i> ({{ osName }}) </mat-list-item>
+ <mat-divider></mat-divider>
+ <mat-list-item *ngIf="discoveredEnvRating.OSRating === 'Possibly compatible'">OS is <span style="color: orange; font-weight: bold;"> {{discoveredEnvRating.OSRating }} </span> <i class="material-icons networkCheck_inlineIcon">warning</i> ({{ osName }}) </mat-list-item>
+ <mat-divider></mat-divider>
+ <mat-list-item *ngIf="discoveredEnvRating.OSRating === 'Not compatible'">OS is <span style="color: red; font-weight: bold;"> {{discoveredEnvRating.OSRating }} </span> <i class="material-icons networkCheck_inlineIcon">error</i> ({{ osName }}) </mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item *ngIf="discoveredEnvRating.ResolutionRating === 'Good'">Resolution is <span style="color: darkgreen; font-weight: bold;"> {{discoveredEnvRating.ResolutionRating}} </span> <i class="material-icons networkCheck_inlineIcon">check</i> ({{ screenSize }})</mat-list-item>
+ <mat-divider></mat-divider>
+ <mat-list-item *ngIf="discoveredEnvRating.ResolutionRating === 'N/A'">Resolution is <span style="color: darkgrey; font-weight: bold;"> {{discoveredEnvRating.ResolutionRating}} </span> <i class="material-icons networkCheck_inlineIcon">warning</i> ({{ screenSize }})</mat-list-item>
+ <mat-divider></mat-divider>
+ <mat-list-item *ngIf="discoveredEnvRating.ResolutionRating === 'Possibly compatible'">Resolution is <span style="color: orange; font-weight: bold;"> {{discoveredEnvRating.ResolutionRating}} </span> <i class="material-icons networkCheck_inlineIcon">warning</i> ({{ screenSize }})</mat-list-item>
+ <mat-divider></mat-divider>
+ <mat-list-item *ngIf="discoveredEnvRating.ResolutionRating === 'Not compatible'">Resolution is <span style="color: red; font-weight: bold;"> {{discoveredEnvRating.ResolutionRating}} </span> <i class="material-icons networkCheck_inlineIcon">error</i> ({{ screenSize }})</mat-list-item>
+ <mat-divider></mat-divider>
+
+ <mat-list-item *ngIf="discoveredEnvRating.BrowserRating === 'Good'">Browser is <span style="color: darkgreen; font-weight: bold;"> {{discoveredEnvRating.BrowserRating}} </span> <i class="material-icons networkCheck_inlineIcon">check</i>({{ result[0] }} {{ result[1] }})</mat-list-item>
+ <mat-list-item *ngIf="discoveredEnvRating.BrowserRating === 'N/A'">Browser is <span style="color: darkgrey; font-weight: bold;"> {{discoveredEnvRating.BrowserRating}} </span> <i class="material-icons networkCheck_inlineIcon">warning</i>({{ result[0] }} {{ result[1] }})</mat-list-item>
+ <mat-list-item *ngIf="discoveredEnvRating.BrowserRating === 'Possibly compatible'">Browser is <span style="color: orange; font-weight: bold;"> {{discoveredEnvRating.BrowserRating}} </span> <i class="material-icons networkCheck_inlineIcon">warning</i>({{ result[0] }} {{ result[1] }})</mat-list-item>
+ <mat-list-item *ngIf="discoveredEnvRating.BrowserRating === 'Not compatible'">Browser is <span style="color: red; font-weight: bold;"> {{discoveredEnvRating.BrowserRating}} </span> <i class="material-icons networkCheck_inlineIcon">error</i>({{ result[0] }} {{ result[1] }})</mat-list-item>
+ </mat-list>
+
+</mat-card>
+<br>
+
+
+
+
+
+
+
+
+
+
+
+<!-- <p *ngIf="discoveredEnvRating.ResolutionRating === 'Not compatible'">
+ Ihre Verbindung zum Testserver ist: <span style="color: red; font-weight: bold;">unzureichend <i class="material-icons networkCheck_inlineIcon">error</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'slow'">
+ Ihre Verbindung zum Testserver ist: <span style="color: orange; font-weight: bold;">langsam <i class="material-icons networkCheck_inlineIcon">warning</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'ok'">
+ Ihre Verbindung zum Testserver ist: <span style="color: green; font-weight: bold;">ok <i class="material-icons networkCheck_inlineIcon">check</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'fast'">
+ Ihre Verbindung zum Testserver ist: <span style="color: green; font-weight: bold;">schnell <i class="material-icons networkCheck_inlineIcon">check</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'very fast'">
+ Ihre Verbindung zum Testserver ist: <span style="color: darkgreen; font-weight: bold;">sehr schnell <i class="material-icons networkCheck_inlineIcon">check</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'wow'">
+ Ihre Verbindung zum Testserver ist: <span style="color: darkgreen; font-weight: bold;">sehr schnell (wow!) <i class="material-icons networkCheck_inlineIcon">check</i></span>
+ </p> -->
\ No newline at end of file
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 b7185cd0c5ea1b367c5fe074dd2d333b247efbe0..4ac0a8855d4fc9c65e0d5b9433e1e61444c91935 100644
--- a/src/app/sys-check/environment-check/environment-check.component.ts
+++ b/src/app/sys-check/environment-check/environment-check.component.ts
@@ -1,5 +1,7 @@
import { Component, OnInit } from '@angular/core';
-import { SyscheckDataService } from '../syscheck-data.service';
+import { SyscheckDataService, EnvironmentRating, EnvironmentData } from '../syscheck-data.service';
+import { GeneratedFile } from '@angular/compiler';
+
@Component({
selector: 'iqb-environment-check',
@@ -7,12 +9,77 @@ import { SyscheckDataService } from '../syscheck-data.service';
styleUrls: ['./environment-check.component.css']
})
export class EnvironmentCheckComponent implements OnInit {
+ environmentRating: EnvironmentRating;
+ screenSize: any;
+ deviceInfo: any;
+ osName: any = "Unknown";
+ regex: any;
+ helperRegex: any;
+ isExisting: Array<string>;
+ result: Array<string>;
+
+
+ discoveredEnvData: EnvironmentData = {
+ 'osName': '',
+ 'browserName': '',
+ 'browserVersion': '',
+ 'resolution': {
+ height: -1,
+ width: -1
+ }
+ };
+ discoveredEnvRating: EnvironmentRating = {
+ OSRating: 'N/A',
+ ResolutionRating: 'N/A',
+ BrowserRating: 'N/A'
+ };
- constructor(
+ constructor(
private ds: SyscheckDataService
) { }
ngOnInit() {
+ this.deviceInfo = window.navigator.userAgent;
+ this.regex = /(MSIE|Trident|(?!Gecko.+)Firefox|(?!AppleWebKit.+Chrome.+)Safari(?!.+Edge)|(?!AppleWebKit.+)Chrome(?!.+Edge)|(?!AppleWebKit.+Chrome.+Safari.+)Edge|AppleWebKit(?!.+Chrome|.+Safari)|Gecko(?!.+Firefox))(?: |\/)([\d\.apre]+)/;
+ // credit due to: https://gist.github.com/ticky/3909462#gistcomment-2245669
+ this.helperRegex = /[^.]*/;
+ this.isExisting = this.regex.exec(this.deviceInfo);
+ this.isExisting = this.helperRegex.exec(this.isExisting[0]);
+ this.result = this.isExisting[0].split("/");
+ this.screenSize = "Screen size is " + window.screen.width + " pixels by " + window.screen.height + " pixels";
+ this.osName = window.navigator.platform;
+
+
+
+ this.discoveredEnvData = {
+ osName: this.getOSVersion(),
+ browserName: this.result[0],
+ browserVersion: this.result[1],
+ resolution: {
+ height: window.screen.height,
+ width: window.screen.width
+ }
+ }
+
+ this.discoveredEnvRating = this.ds.calculateEnvironmentRating(this.discoveredEnvData);
+
+ this.ds.environmentData$.next(this.discoveredEnvData);
+
+ }
+
+ getOSVersion() {
+ if (window.navigator.userAgent.indexOf("Windows")!= -1) {
+ if (window.navigator.userAgent.indexOf("Windows NT 10.0")!= -1) this.osName="Windows 10";
+ if (window.navigator.userAgent.indexOf("Windows NT 6.2") != -1) this.osName="Windows 8";
+ if (window.navigator.userAgent.indexOf("Windows NT 6.1") != -1) this.osName="Windows 7";
+ if (window.navigator.userAgent.indexOf("Windows NT 6.0") != -1) this.osName="Windows Vista";
+ if (window.navigator.userAgent.indexOf("Windows NT 5.1") != -1) this.osName="Windows XP";
+ if (window.navigator.userAgent.indexOf("Windows NT 5.0") != -1) this.osName="Windows 2000";
+ }
+ if (window.navigator.userAgent.indexOf("Mac") != -1) this.osName="Mac/iOS";
+ if (window.navigator.userAgent.indexOf("X11") != -1) this.osName="UNIX";
+ if (window.navigator.userAgent.indexOf("Linux") != -1) this.osName="Linux";
+ return this.osName;
}
goto() {
diff --git a/src/app/sys-check/network-check/network-check.component.css b/src/app/sys-check/network-check/network-check.component.css
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..4519b63af82c4f62959f21fb0b932c61f3dc6985 100644
--- a/src/app/sys-check/network-check/network-check.component.css
+++ b/src/app/sys-check/network-check/network-check.component.css
@@ -0,0 +1,4 @@
+.networkCheck_inlineIcon {
+ position: relative;
+ top: 6px;
+}
\ No newline at end of file
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 df81efd175d58b2a275c6b7fe77e6e377e581a78..f47874533d710ff4c1596a1414a48f65b7a2cc7f 100644
--- a/src/app/sys-check/network-check/network-check.component.html
+++ b/src/app/sys-check/network-check/network-check.component.html
@@ -18,6 +18,21 @@
Ping: {{averageSpeed.pingTest | number}} ms
</p>
+ <!-- network rating in simpler terms -->
+ <p *ngIf="networkRating === 'insufficient'">
+ Ihre Verbindung zum Testserver ist: <span style="color: red; font-weight: bold;">unzureichend <i class="material-icons networkCheck_inlineIcon">error</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'ok'">
+ Ihre Verbindung zum Testserver ist: <span style="color: orange; font-weight: bold;">ok <i class="material-icons networkCheck_inlineIcon">warning</i></span>
+ </p>
+
+ <p *ngIf="networkRating === 'good'">
+ Ihre Verbindung zum Testserver ist: <span style="color: green; font-weight: bold;">gut <i class="material-icons networkCheck_inlineIcon">check</i></span>
+ </p>
+
+ <!-- end of network rating in simpler terms -->
+
<p>
<button mat-raised-button (click)="startCheck()" *ngIf="testDone">Netz erneut prüfen</button>
</p>
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 098fcbb5c9a82ebaa97c5c5368b4569fc1f1b446..5053dc4cb694657408e352ab1d002657eac20cf4 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 @@ export class NetworkCheckComponent implements OnInit {
downloadTest: -1,
pingTest: -1
};
+ networkRating: NetworkRating = 'N/A';
constructor(
private ds: SyscheckDataService,
@@ -31,12 +32,19 @@ export class NetworkCheckComponent implements OnInit {
this.networkCheck() ;
}
+
public networkCheck() {
this.testDone = false;
const testResults: Array<NetworkRequestTestResult> = [];
+ this.averageSpeed = {
+ uploadTest: -1,
+ downloadTest: -1,
+ pingTest: -1
+ };
+
let currentSize = 1024;
let currentSizeIteration = 0;
let currentSizePassed = 0;
@@ -93,7 +101,7 @@ export class NetworkCheckComponent implements OnInit {
}
if (shouldContinue) {
- const timeout = currentSizeIteration * 3000; // 3000 (1st iteration), 6000 (2nd iteration), 9000 (3rd iteration)
+ const timeout = 1000 + (currentSizeIteration - 1) * 2000; // 1000 (1st iteration), 3000 (2nd iteration), 5000 (3rd iteration)
if (whatIsBeingTested === 'download') {
updateStatus(`Downloadgeschwindigkeit wird getestet... (Testgröße: ${currentSize} bytes; Test: ${currentSizeIteration}/3)`);
@@ -136,6 +144,8 @@ export class NetworkCheckComponent implements OnInit {
// console.log(testResults);
// console.log(averageSpeed);
+ this.networkRating = this.ds.calculateNetworkRating(this.averageSpeed);
+
updateStatus(`Die folgenden Netzwerkeigenschaften wurden festgestellt:`);
this.testDone = true;
@@ -155,3 +165,20 @@ export interface AverageSpeed {
downloadTest: number;
pingTest: number;
}
+
+export interface EnvironmentData {
+ osName: string;
+ // osVersion: string;
+ browserName: string;
+ browserVersion: string;
+ resolution: {
+ height: number;
+ width: number;
+ };
+}
+
+export interface EnvironmentRating {
+ OSRating: 'N/A' | 'Good'| 'Not compatible' | 'Possibly compatible';
+ ResolutionRating: 'N/A' | 'Good'| 'Not compatible' | 'Possibly compatible';
+ BrowserRating: 'N/A' | 'Good'| 'Not compatible' | 'Possibly compatible';
+}
diff --git a/src/app/sys-check/run.component.ts b/src/app/sys-check/run.component.ts
index b0ed894f342156d55276b54ac28b79456015d290..e512b8bb7d74bd5608e4c1d2ff6a544f22bdca1a 100644
--- a/src/app/sys-check/run.component.ts
+++ b/src/app/sys-check/run.component.ts
@@ -68,7 +68,7 @@ export class RunComponent implements OnInit {
} else if (e.selectedStep === this.stepNetwork) {
if (!this.stepNetwork.completed) {
this.compNetwork.startCheck();
- this.stepNetwork.completed = true;
+ // this.stepNetwork.completed = true;
}
}
diff --git a/src/app/sys-check/sys-check.module.ts b/src/app/sys-check/sys-check.module.ts
index bb32ada5cc531b20204b43e9ddfcbd74a3a479e4..7f53a26f6689ad98e6ef06248c96fd1fae21bfb1 100644
--- a/src/app/sys-check/sys-check.module.ts
+++ b/src/app/sys-check/sys-check.module.ts
@@ -11,6 +11,9 @@ import { FlexLayoutModule } from '@angular/flex-layout';
import { MatButtonModule, MatCheckboxModule, MatMenuModule, MatTooltipModule, MatCardModule, MatStepperModule,
MatToolbarModule, MatIconModule, MatDialogModule, MatFormFieldModule, MatInputModule,
MatTabsModule, MatProgressSpinnerModule } from '@angular/material';
+import {MatDividerModule} from '@angular/material/divider';
+import {MatListModule} from '@angular/material/list';
+
import { EnvironmentCheckComponent } from './environment-check/environment-check.component';
import { NetworkCheckComponent } from './network-check/network-check.component';
import { UnitCheckComponent } from './unit-check/unit-check.component';
@@ -25,7 +28,9 @@ import { ReportComponent } from './report/report.component';
SysCheckRoutingModule,
MatProgressSpinnerModule,
MatStepperModule,
- MatButtonModule
+ MatButtonModule,
+ MatDividerModule,
+ MatListModule
],
declarations: [
StartComponent,
diff --git a/src/app/sys-check/syscheck-data.service.ts b/src/app/sys-check/syscheck-data.service.ts
index 9359d201280ab937d424b71800072423f6406f4f..0fb20c305fb4b30d1840717a31386a57243964a4 100644
--- a/src/app/sys-check/syscheck-data.service.ts
+++ b/src/app/sys-check/syscheck-data.service.ts
@@ -1,6 +1,7 @@
import { CheckConfigData } from './backend.service';
import { BehaviorSubject } from 'rxjs';
import { Injectable } from '@angular/core';
+import { e } from '@angular/core/src/render3';
@Injectable({
providedIn: 'root'
@@ -34,11 +35,65 @@ export class SyscheckDataService {
}
});
}
+
+ public calculateNetworkRating(nd: NetworkData): NetworkRating {
+
+ /*
+
+ <1MB download und <0.5 MB upload ---> insufficient (~ < 8Mb download; ~ < 4Mb upload)
+ 1-10 MB download; 0.5 - 5 MB upload ---> ok (8-80 Mb download; 4-40 Mb upload)
+ > 10 MB download; > 0.5 MB upload; ----> good (> 80 Mb download; > 40 Mb upload;)
+
+ */
+
+ if ((nd.downloadTest < 1024 * 1024) || (nd.uploadTest < 1024 * 512)) {
+ return 'insufficient';
+ } else {
+ if ((nd.downloadTest < 1024 * 1024 * 10) || (nd.uploadTest < 1024 * 1024 * 5)) {
+ return 'ok';
+ } else {
+ return 'good';
+ }
+ }
+ }
+
+ public calculateEnvironmentRating(ed: EnvironmentData): EnvironmentRating {
+ let ratings: EnvironmentRating = {
+ OSRating: 'N/A',
+ ResolutionRating: 'N/A',
+ BrowserRating: 'N/A'
+ };
+
+ if(ed.osName === "Windows 7" || ed.osName === "Windows 10" || ed.osName === "Windows 8" || ed.osName === "Mac/iOS") {
+ ratings.OSRating = 'Good';
+ } else if (ed.osName === "Windows Vista" || ed.osName === "Linux" || ed.osName === "UNIX") {
+ ratings.OSRating = 'Possibly compatible';
+ } else {
+ ratings.OSRating = 'Not compatible';
+ }
+
+ if(ed.browserName.indexOf("Chrome") || ed.browserName.indexOf("Mozilla"))
+ if(parseInt(ed.browserVersion) >= 60) {
+ ratings.BrowserRating = 'Good'
+ }
+ else {
+ ratings.BrowserRating = 'Not compatible'
+ }
+
+ if(ed.resolution.width >= 1024 && ed.resolution.height >= 768) {
+ ratings.ResolutionRating = 'Good'
+ } else {
+ ratings.ResolutionRating = 'Not compatible'
+ }
+ return ratings;
+ }
+
}
-export interface ReportEntry {
- label: string;
- value: string;
+export interface NetworkData {
+ uploadTest: number;
+ downloadTest: number;
+ pingTest: number;
}
export interface NetworkRequestTestResult {
@@ -46,3 +101,11 @@ export interface NetworkRequestTestResult {
'size': number;
'duration': number;
}
+
+export type NetworkRating = 'N/A' | 'insufficient' | 'ok' | 'good';
+
+export interface ReportEntry {
+ label: string;
+ value: string;
+}
+