diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 1ffed1323c25e913af3e2caa53f2adbfdcf2d9bb..23426f93d82cfb56011ef899d570c94dd8456642 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -25,6 +25,7 @@ import {MatRadioModule} from "@angular/material/radio";
import {MatTabsModule} from "@angular/material/tabs";
import {MatToolbarModule} from "@angular/material/toolbar";
import {MatTooltipModule} from "@angular/material/tooltip";
+import {MatBadgeModule} from '@angular/material/badge';
import {RouterModule} from "@angular/router";
import { AppRootComponent } from './app-root/app-root.component';
import { SysCheckStarterComponent } from './app-root/sys-check-starter/sys-check-starter.component';
@@ -39,6 +40,7 @@ import { PrivacyComponent } from './app-root/privacy/privacy.component';
+
@NgModule({
declarations: [
AppComponent,
@@ -57,6 +59,7 @@ import { PrivacyComponent } from './app-root/privacy/privacy.component';
ApplicationModule,
BrowserModule,
BrowserAnimationsModule,
+ MatBadgeModule,
MatButtonModule,
MatCardModule,
MatCheckboxModule,
diff --git a/src/app/group-monitor/booklet.service.ts b/src/app/group-monitor/booklet.service.ts
index eccceee274957675fbf795160d89c85dcf01264a..ea523cbd676289b9f942bf8ade3181e59a5af06b 100644
--- a/src/app/group-monitor/booklet.service.ts
+++ b/src/app/group-monitor/booklet.service.ts
@@ -25,7 +25,7 @@ export class BookletService {
if (isDefined(this.booklets[bookletName])) {
- // console.log('FORWARDING testletOrUnit data for ' + bookletName + '');
+ // console.log('FORWARDING booklet for ' + bookletName + '');
return this.booklets[bookletName];
}
@@ -100,7 +100,11 @@ export class BookletService {
private static parseTestlet(testletElement: Element): Testlet {
+ // TODO fehlende ID -> Zeit wird nicht angezeigt... Þberdenken: https://github.com/iqb-berlin/testcenter-iqb-php/issues/116
+
return {
+ id: testletElement.getAttribute('id') || '',
+ label: testletElement.getAttribute('label') || '',
restrictions: BookletService.parseRestrictions(testletElement),
children: BookletService.xmlGetChildElements(testletElement)
.filter((element: Element) => (['Unit', 'Testlet'].indexOf(element.tagName) > -1))
@@ -157,7 +161,7 @@ export class BookletService {
const elements = element.getElementsByTagName(childName);
if (!elements.length && !isOptional) {
- throw new Error(`Missing field: '${childName}'`);
+ throw new Error(`Missing field: '${childName}'`); // TODO hierauf wird irgendwie gar nicht reagiert
}
return elements.length ? elements[0] : null;
}
diff --git a/src/app/group-monitor/group-monitor.interfaces.ts b/src/app/group-monitor/group-monitor.interfaces.ts
index 4108982b4414cb457074edd5a1726b8c17ecd0c3..a5cd269f4acb2b670360354e8e7f115b598791d1 100644
--- a/src/app/group-monitor/group-monitor.interfaces.ts
+++ b/src/app/group-monitor/group-monitor.interfaces.ts
@@ -37,6 +37,8 @@ export interface BookletMetadata {
}
export interface Testlet {
+ id: string;
+ label: string;
restrictions?: Restrictions;
children: (Unit|Testlet)[];
}
diff --git a/src/app/group-monitor/group-monitor.module.ts b/src/app/group-monitor/group-monitor.module.ts
index 085c98228d380b669d7dd859fa058b1efd130626..89f6783633b3662187361f518fa99bfaf971ae66 100644
--- a/src/app/group-monitor/group-monitor.module.ts
+++ b/src/app/group-monitor/group-monitor.module.ts
@@ -12,6 +12,8 @@ import { CdkTableModule } from '@angular/cdk/table';
import {BackendService} from './backend.service';
import {BookletService} from './booklet.service';
import { TestViewComponent } from './test-view/test-view.component';
+import {MatIconModule} from '@angular/material/icon';
+import {MatBadgeModule} from '@angular/material/badge';
@@ -21,14 +23,16 @@ import { TestViewComponent } from './test-view/test-view.component';
GroupMonitorComponent,
TestViewComponent
],
- imports: [
- CommonModule,
- GroupMonitorRoutingModule,
- MatTableModule,
- MatTooltipModule,
- CdkTableModule,
- MatChipsModule
- ],
+ imports: [
+ CommonModule,
+ GroupMonitorRoutingModule,
+ MatTableModule,
+ MatTooltipModule,
+ CdkTableModule,
+ MatChipsModule,
+ MatIconModule,
+ MatBadgeModule
+ ],
providers: [
BackendService,
BookletService
diff --git a/src/app/group-monitor/test-view/test-view.component.css b/src/app/group-monitor/test-view/test-view.component.css
index da1b51193bc109c15f7279b3e8730875fdb79944..2ea0f6b4f322022b9329ceecac27bea9e9052e44 100644
--- a/src/app/group-monitor/test-view/test-view.component.css
+++ b/src/app/group-monitor/test-view/test-view.component.css
@@ -1,6 +1,14 @@
+.featured-unit h1,
+.featured-unit h2,
.booklet h1 {
font-size: 100%;
display: inline-block;
+ margin-right: 0.3em;
+}
+
+.featured-unit h2 {
+ font-weight: normal;
+ margin-right: 0.3em;
}
.units {
@@ -53,7 +61,3 @@
vertical-align: middle;
align-items: center;
}
-
-.featured-unit .unit-badge {
- margin-left: 0.5em;
-}
diff --git a/src/app/group-monitor/test-view/test-view.component.html b/src/app/group-monitor/test-view/test-view.component.html
index b0c3c4dec3d82ba0fdb1602ed7e42fadae05f9d0..029dbb41475c34263a37ab6fd96cd655caef8a63 100644
--- a/src/app/group-monitor/test-view/test-view.component.html
+++ b/src/app/group-monitor/test-view/test-view.component.html
@@ -15,16 +15,28 @@
<!-- <pre>{{featuredUnit$|async|json}}</pre>-->
-<div class="featured-unit" *ngIf="featuredUnit$ | async as unit">
+<div class="featured-unit" *ngIf="featuredUnit$ | async as unitContext">
- <div>Aktuelle Aufgabe: {{unit.label || 'Ohne Titel'}}</div>
- <div *ngIf="hasState(testStatus.unitState, 'PRESENTATIONCOMPLETE', 'yes')" class="material-icons unit-badge">
- remove_red_eye
- </div>
- <pre>{{maxTimeLeft|json}}</pre>
+ <h1>{{unitContext.parent.label || 'Aktueller Abschnitt'}}</h1>
+
+ <mat-icon class="unit-badge"
+ *ngIf="maxTimeLeft && (maxTimeLeft[unitContext.parent.id] !== undefined)"
+ matBadge="{{maxTimeLeft[unitContext.parent.id].toString()}}"
+ matBadgeColor="accent"
+ matTooltip="Verbleibende Zeit"
+ >alarm
+ </mat-icon>
+
+ <h1>:</h1>
- <div *ngIf="maxTimeLeft[unit.id] as time">{{time}}</div>
+ <h2>{{unitContext.unit.label || unitContext.unit.labelShort || unitContext.unit.id}}</h2>
+
+ <mat-icon class="unit-badge"
+ *ngIf="hasState(testStatus.unitState, 'PRESENTATIONCOMPLETE', 'yes')"
+ matTooltip="VollstÃĪndig betrachtet / angehÃķrt"
+ >remove_red_eye
+ </mat-icon>
<!-- <div class="state"><pre>{{testStatus.unitState | json}}</pre></div>-->
@@ -32,6 +44,8 @@
<!-- <div class="state"><pre>{{unit | json}}</pre></div>-->
</div>
+<!--<pre>{{maxTimeLeft|json}}</pre>-->
+
<ng-template #testletTemplate let-testlet>
@@ -44,7 +58,7 @@
<!-- <span *ngIf="(testStatus.unitName === testletOrUnit.id)">{{setFeaturedUnit(testletOrUnit)}}</span>-->
</span>
- <span *ngSwitchCase="'testlet'" class="testlet">
+ <span *ngSwitchCase="'testlet'" class="testlet" matTooltip="{{testlet.label}}">
<ng-container *ngTemplateOutlet="testletTemplate; context: {$implicit: testletOrUnit}"></ng-container>
</span>
<!-- <pre>{{testletOrUnit|json}}</pre>-->
diff --git a/src/app/group-monitor/test-view/test-view.component.ts b/src/app/group-monitor/test-view/test-view.component.ts
index bb3cdd7e690f73fea3fda4fedd3ea93606dbbc34..7b2005f75f450e878cac691ad1f210d5223f6ecb 100644
--- a/src/app/group-monitor/test-view/test-view.component.ts
+++ b/src/app/group-monitor/test-view/test-view.component.ts
@@ -7,7 +7,7 @@ import {map} from 'rxjs/operators';
function isUnit(testletOrUnit: Testlet|Unit): testletOrUnit is Unit {
- return (('id' in testletOrUnit) && ('label' in testletOrUnit));
+ return !('children' in testletOrUnit);
}
@Component({
@@ -21,7 +21,10 @@ export class TestViewComponent implements OnInit, OnDestroy, OnChanges {
private testStatus$: Subject<StatusUpdate>;
public booklet$: Observable<boolean|Booklet>;
- public featuredUnit$: Observable<Unit|null>;
+ public featuredUnit$: Observable<{
+ unit: Unit,
+ parent: Testlet
+ }|null>;
private childrenSubscription;
@@ -115,7 +118,7 @@ export class TestViewComponent implements OnInit, OnDestroy, OnChanges {
}
- findUnitByName(testlet: Testlet, unitName: String): Unit|null {
+ findUnitByName(testlet: Testlet, unitName: String): {unit: Unit|null, parent: Testlet} {
for (let i = 0; i < testlet.children.length; i++) {
@@ -124,7 +127,10 @@ export class TestViewComponent implements OnInit, OnDestroy, OnChanges {
if (isUnit(testletOrUnit)) {
if (testletOrUnit.id === unitName) {
- return testletOrUnit
+ return {
+ parent: testlet,
+ unit: testletOrUnit
+ }
}
} else {