diff --git a/src/app/answer-statistics/answer-statistics.component.html b/src/app/answer-statistics/answer-statistics.component.html
index 2b66b71d02397edfdddde76524cbc259040f4ca9..a7475655358a1370eb50eb51ea85df171583a567 100644
--- a/src/app/answer-statistics/answer-statistics.component.html
+++ b/src/app/answer-statistics/answer-statistics.component.html
@@ -7,19 +7,29 @@
{{ state.viewValue }}
</mat-option>
</mat-select>
- <div *ngIf="selected == 1">
- <!-- Add list of Question statistic -->
- <mat-progress-bar [value]="50">
+ <div *ngFor="let statistic of statistics">
+ {{ statistic.name }}
+ <mat-progress-bar [value]="statistic.percent">
</mat-progress-bar>
+ <div align="right"> Responded answers: {{ statistic.answers }} </div>
</div>
- <div *ngIf="selected == 2">
- <!-- Add list of Question statistic -->
- <mat-progress-bar [value]="50" color="warn">
+ </mat-tab>
+ <mat-tab label="Evaluation" (choose)="showEvaluation(selectedContent.index)">
+ <h2 fxLayoutAlign="center">{{ selectedContent.name }}</h2>
+ <div class="evaluation" *ngFor="let choice of evaluation">
+ {{ choice.name }}
+ <mat-progress-bar [value]="choice.percent" color="primary" *ngIf="choice.correct">
+ </mat-progress-bar>
+ <mat-progress-bar [value]="choice.percent" color="warn" *ngIf="!choice.correct">
</mat-progress-bar>
+ <div align="right"> Selected: {{ choice.answers }} times</div>
+ </div>
+ <div fxLayoutAlign="center" fxLayoutGap="10px">
+ <button mat-raised-button color="primary" (click)="showEvaluation(selectedContent.index - 1)">Before</button>
+ <div><b>{{ selectedContent.index }} / {{ selectedContent.length }}</b></div>
+ <button mat-raised-button color="primary" (click)="showEvaluation(selectedContent.index + 1)">Next</button>
</div>
</mat-tab>
- <!-- Add second tab with true false answers -->
</mat-tab-group>
</mat-card>
</div>
-
diff --git a/src/app/answer-statistics/answer-statistics.component.scss b/src/app/answer-statistics/answer-statistics.component.scss
index f0a767c2e0a748dfdafd59899bc77022270576e4..4483c337510473d8e0dd76cb0c755c742def225c 100644
--- a/src/app/answer-statistics/answer-statistics.component.scss
+++ b/src/app/answer-statistics/answer-statistics.component.scss
@@ -10,5 +10,13 @@ mat-select {
}
mat-progress-bar {
- margin-top: 20px;
+ height: 50px;
+}
+
+h1 {
+ margin-top: 10px;
+}
+
+.evaluation {
+ margin-top: 10px;
}
diff --git a/src/app/answer-statistics/answer-statistics.component.ts b/src/app/answer-statistics/answer-statistics.component.ts
index e52b560ac887f58a2889eab6a73e39df4056faa4..686f82be5f7873b19789a0e047b72efcee6dbd64 100644
--- a/src/app/answer-statistics/answer-statistics.component.ts
+++ b/src/app/answer-statistics/answer-statistics.component.ts
@@ -1,4 +1,12 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { RoomService } from '../room.service';
+import { Content } from '../content';
+import { ContentService } from '../content.service';
+import { ContentAnswerService } from '../content-answer.service';
+import { AnswerText } from '../answer-text';
+import { ChoiceAnswer } from '../choice-answer';
+import { ContentType } from '../content-type';
@Component({
selector: 'app-answer-statistics',
@@ -6,18 +14,85 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./answer-statistics.component.scss']
})
export class AnswerStatisticsComponent implements OnInit {
+ @Input() content: Content[];
+ @Input() textAnswers: AnswerText[] = [];
+ @Input() choiceAnswers: ChoiceAnswer[] = [];
+ statistics: any = null;
+ selectedContent: any =
+ { name: 'HOW TO MAKE CONTENT GREAT AGAIN', index: '1', length: '1' };
+ evaluation: any = [
+ { name: 'Skill', percent: 10, correct: false, answers: 1, },
+ { name: 'Knowledge', percent: 10, correct: false, answers: 1, },
+ { name: '???', percent: 30, correct: true, answers: 3, },
+ { name: 'Not at all', percent: 50, correct: true, answers: 5, }
+ ];
states = [
- { value: '1', viewValue: 'Responded' },
- { value: '2', viewValue: 'Not responded' },
+ { value: '1', viewValue: 'Text answers' },
+ { value: '2', viewValue: 'Choice answers' }
];
selected: number = null;
- constructor() { }
+ constructor(
+ private route: ActivatedRoute,
+ private roomService: RoomService,
+ private contentService: ContentService,
+ private contentAnswerService: ContentAnswerService ) { }
- ngOnInit() {
+ ngOnInit(): void {
+ this.route.params.subscribe(params => {
+ this.getContent(params['roomId']);
+ });
}
- showStatistic(value) {
+ getContent(roomId: string): void {
+ this.contentService.getContents(roomId).subscribe(content => {
+ this.content = content;
+ this.getAnswers();
+ });
+ }
+
+ getAnswers(): void {
+ for (const question of this.content) {
+ this.contentAnswerService.getTextAnswers(question.contentId).subscribe( answer => {
+ [].push.apply(this.textAnswers, answer);
+ });
+ this.contentAnswerService.getChoiceAnswers(question.contentId).subscribe( answer => {
+ [].push.apply(this.choiceAnswers, answer);
+ });
+ }
+ }
+
+ showStatistic(value) { // refactor answer class structure for less code and more abstraction
+ this.statistics = [];
+ for (const question of this.content) {
+ if (value === '1') {
+ if (question.format === ContentType.TEXT) {
+ const count = this.countTextAnswers(question.contentId);
+ this.statistics.push({
+ name: question.subject, answers: count, percent: count * 100 / this.textAnswers.length,
+ });
+ }
+ } else {
+ if (question.format === ContentType.CHOICE) {
+ const count = this.countChoiceAnswers(question.contentId);
+ this.statistics.push({
+ name: question.subject, answers: count, percent: count * 100 / this.choiceAnswers.length,
+ });
+ }
+ }
+ }
this.selected = value;
}
+
+ countTextAnswers(contentId: string): number {
+ return this.textAnswers.filter(answer => answer.contentId === contentId).length;
+ }
+
+ countChoiceAnswers(contentId: string): number {
+ return this.choiceAnswers.filter(answer => answer.contentId === contentId).length;
+ }
+
+ showEvaluation(index: number) {
+ // coming with api connection, logic doesnt make sense without knowledge about api
+ }
}
diff --git a/src/app/content-answer.service.ts b/src/app/content-answer.service.ts
index 35c6e2419f88bec8fe68bc1a6c03972d071913a3..77a734226d51689c42622a9c79352a26aff5f297 100644
--- a/src/app/content-answer.service.ts
+++ b/src/app/content-answer.service.ts
@@ -10,27 +10,35 @@ const httpOptions = {
@Injectable()
export class ContentAnswerService extends ErrorHandlingService {
- private answerUrl = 'api/answerTexts';
+ private textAnswerUrl = 'api/textAnswers';
+ private choiceAnswerUrl = 'api/choiceAnswers';
constructor(private http: HttpClient) {
super();
}
- getAnswerTexts(contentId: string): Observable<AnswerText[]> {
- const url = `${this.answerUrl}/?contentId=${contentId}`;
+ getTextAnswers(contentId: string): Observable<AnswerText[]> {
+ const url = `${this.textAnswerUrl}/?contentId=${contentId}`;
return this.http.get<AnswerText[]>(url).pipe(
- catchError(this.handleError('getAnswerTexts', []))
+ catchError(this.handleError('getTextAnswers', []))
+ );
+ }
+
+ getChoiceAnswers(contentId: string): Observable<AnswerText[]> {
+ const url = `${this.choiceAnswerUrl}/?contentId=${contentId}`;
+ return this.http.get<AnswerText[]>(url).pipe(
+ catchError(this.handleError('getChoiceAnswers', []))
);
}
addAnswerText(answerText: AnswerText): Observable<AnswerText> {
- return this.http.post<AnswerText>(this.answerUrl, answerText, httpOptions).pipe(
+ return this.http.post<AnswerText>(this.textAnswerUrl, answerText, httpOptions).pipe(
catchError(this.handleError<AnswerText>('addAnswerText'))
);
}
getAnswerText(id: string): Observable<AnswerText> {
- const url = `${this.answerUrl}/${id}`;
+ const url = `${this.textAnswerUrl}/${id}`;
return this.http.get<AnswerText>(url).pipe(
catchError(this.handleError<AnswerText>(`getAnswerText id=${id}`))
);
diff --git a/src/app/content-answers-list/content-answers-list.component.ts b/src/app/content-answers-list/content-answers-list.component.ts
index e621957abe7729e7daa6f83b54e9526869db4636..30d2d94b56fb0e009045131998b369c5a176c66e 100644
--- a/src/app/content-answers-list/content-answers-list.component.ts
+++ b/src/app/content-answers-list/content-answers-list.component.ts
@@ -25,7 +25,7 @@ export class ContentAnswersListComponent implements OnInit {
}
getAnswerTexts(contentId: string): void {
- this.contentAnswerService.getAnswerTexts(contentId)
+ this.contentAnswerService.getTextAnswers(contentId)
.subscribe(textAnswers => {
this.textAnswers = textAnswers;
});
diff --git a/src/app/in-memory-data.service.ts b/src/app/in-memory-data.service.ts
index 30b63b24bcfadbc08770d00e0054e30f03ac6c8f..0c87d6f218172aafdc5bbaeb573403a69cf74adb 100644
--- a/src/app/in-memory-data.service.ts
+++ b/src/app/in-memory-data.service.ts
@@ -98,15 +98,51 @@ export class InMemoryDataService implements InMemoryDbService {
{
contentId: '2',
revision: '2',
- roomId: '3',
+ roomId: '1',
subject: 'Text Content 2',
+ body: 'testcontent alpha beta',
+ round: 1,
+ format: ContentType.TEXT
+ },
+ {
+ contentId: '3',
+ revision: '3',
+ roomId: '1',
+ subject: 'Text Content 3',
+ body: 'testcontent alpha beta',
+ round: 1,
+ format: ContentType.TEXT
+ },
+ {
+ contentId: '4',
+ revision: '4',
+ roomId: '1',
+ subject: 'Text Content 4',
+ body: 'testcontent alpha beta',
+ round: 1,
+ format: ContentType.TEXT
+ },
+ {
+ contentId: '5',
+ revision: '5',
+ roomId: '1',
+ subject: 'Choice Content 1',
+ body: 'testcontent alpha beta',
+ round: 1,
+ format: ContentType.CHOICE
+ },
+ {
+ contentId: '6',
+ revision: '2',
+ roomId: '3',
+ subject: 'Text Content 1',
body: 'This is yet another body of a text content.',
round: 2,
format: ContentType.TEXT
}
];
- const answerTexts = [
+ const textAnswers = [
{
id: '1',
revision: '1',
@@ -118,8 +154,8 @@ export class InMemoryDataService implements InMemoryDbService {
creationTimestamp: Date,
},
{
- id: '1',
- revision: '1',
+ id: '2',
+ revision: '2',
contentId: '1',
round: '1',
subject: 'Textaufgabe 1',
@@ -128,8 +164,8 @@ export class InMemoryDataService implements InMemoryDbService {
creationTimestamp: Date,
},
{
- id: '2',
- revision: '2',
+ id: '3',
+ revision: '3',
contentId: '2',
round: '3',
subject: 'Textaufgabe 2',
@@ -138,6 +174,16 @@ export class InMemoryDataService implements InMemoryDbService {
creationTimestamp: Date,
}
];
- return { rooms, comments, contents, answerTexts };
+
+ const choiceAnswers = [
+ {
+ id: '1',
+ revision: '1',
+ contentId: '5',
+ round: 0,
+ selectedChoiceIndexes: [ 1, 2 ],
+ }
+ ];
+ return { rooms, comments, contents, textAnswers, choiceAnswers };
}
}