Newer
Older
import {Component, OnDestroy, OnInit} from '@angular/core';
import {Chart} from 'angular-highcharts';
import {LecturerInfoService} from 'src/app/services/lecturer-info.service';
import {ResponseGraphDetailsDao} from 'src/app/dao/ResponseGraphDetails.dao';
import {LecturerResponseGraphService} from 'src/app/services/lecturer-response-graph.service';
import {OmpClassDao} from 'src/app/dao/omp-class.dao';
import {StudentGraphDetailsDao} from 'src/app/dao/StudentGraphDetails.dao';
import {Subject} from 'rxjs';
@Component({
selector: 'app-student-response-chart',
templateUrl: './student-response-chart.component.html',
})
export class StudentResponseChartComponent implements OnInit, OnDestroy {
public studentResponseChart: any;
public isLoading: boolean;
public responseGraphClasses: ResponseGraphDetailsDao[];
public studentResponses: StudentGraphDetailsDao[];
public currentlyViewedYear;
private lecturerId: string;
private generateGraphSubject = new Subject<Boolean>();
private generateGraph$ = this.generateGraphSubject.asObservable();
constructor(private lecturerInfoService: LecturerInfoService,
private lecturerGraphService: LecturerResponseGraphService) {
}
ngOnInit(): void {
this.lecturerId = sessionStorage.getItem('username');
this.responseGraphClasses = [];
this.isLoading = true;
this.lecturerGraphService.loadedYear$.subscribe(data => this.currentlyViewedYear = data);
this.lecturerGraphService.loadedClasses$.subscribe((data: ResponseGraphDetailsDao[]) => {
this.responseGraphClasses = data;
this.generateGraphSubject.next(true);
});
this.generateGraph$.subscribe(flag => {
if (flag) {
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
this.getStudentResponseData(this.responseGraphClasses[0].classCode);
}
});
}
ngOnDestroy(): void {
}
public switchClass() {
this.getStudentResponseData(this.currentClass.classCode);
}
private getStudentResponseData(classCode: String): void {
this.lecturerInfoService.getStudentResponseData(classCode)
.subscribe((data: StudentGraphDetailsDao[]) => {
this.studentResponses = data;
this.buildChart();
this.isLoading = false;
}
);
}
private createXAxisHeaders(): string[] {
const xAxisHeaders = [];
this.studentResponses.forEach(student => {
xAxisHeaders.push(student.username);
});
return xAxisHeaders;
}
private getStudentSeries(): any {
const responses = [];
this.studentResponses.forEach(elem => {
responses.push(elem.numberOfResponses);
});
return {name: 'Responses', data: responses};
}
private buildChart(): void {
this.studentResponseChart = new Chart({
chart: {
type: 'column'
},
title: {
text: 'Individual Student Responses For ' + this.currentClass.classCode
},
xAxis: {
categories: this.createXAxisHeaders(),
title: {
text: 'Students In The Class'
}
},
yAxis: {
min: 0,
title: {
text: 'Number of Responses'
}
},
credits: {
enabled: false
},
series: [this.getStudentSeries()]
});
}
}