-
Notifications
You must be signed in to change notification settings - Fork 482
/
sectionAssessmentsRedux.js
401 lines (357 loc) · 14 KB
/
sectionAssessmentsRedux.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
import {SET_SECTION} from '@cdo/apps/redux/sectionDataRedux';
/**
* Initial state of sectionAssessmentsRedux
* The redux state matches the structure of our API calls and our views don't
* use this structure directly. Selectors filter and transform data to what they need.
*
* assessmentResponsesByScript - object - keys are scriptIds, values are objects of
* student ids to student response data for each assessment
* assessmentQuestionsByScript - object - keys are scriptIds, values are objects of
* assessmentIds to question and answer information for each assessment
* surveysByScript - object - keys are scriptIds, values are objects of
* assessmentIds to survey questions and anonymous responses
* isLoading - boolean - indicates that requests for assessments and surveys have been
* sent to the server but the client has not yet received a response
* assessmentId - int - the level_group id of the assessment currently in view
*/
const initialState = {
assessmentResponsesByScript: {},
assessmentQuestionsByScript: {},
surveysByScript: {},
isLoading: false,
assessmentId: 0,
};
// Action type constants
const SET_ASSESSMENT_RESPONSES = 'sectionAssessments/SET_ASSESSMENT_RESPONSES';
const SET_ASSESSMENTS_QUESTIONS = 'sectionAssessments/SET_ASSESSMENTS_QUESTIONS';
const SET_SURVEYS = 'sectionAssessments/SET_SURVEYS';
const START_LOADING_ASSESSMENTS = 'sectionAssessments/START_LOADING_ASSESSMENTS';
const FINISH_LOADING_ASSESSMENTS = 'sectionAssessments/FINISH_LOADING_ASSESSMENTS';
const SET_ASSESSMENT_ID = 'sectionAssessments/SET_ASSESSMENT_ID';
// Action creators
export const setAssessmentResponses = (scriptId, assessments) =>
({ type: SET_ASSESSMENT_RESPONSES, scriptId, assessments});
export const setAssessmentQuestions = (scriptId, assessments) =>
({ type: SET_ASSESSMENTS_QUESTIONS, scriptId, assessments});
export const startLoadingAssessments = () => ({ type: START_LOADING_ASSESSMENTS });
export const finishLoadingAssessments = () => ({ type: FINISH_LOADING_ASSESSMENTS });
export const setAssessmentId = (assessmentId) => ({ type: SET_ASSESSMENT_ID, assessmentId: assessmentId });
export const setSurveys = (scriptId, surveys) => ({ type: SET_SURVEYS, scriptId, surveys });
export const asyncLoadAssessments = (sectionId, scriptId) => {
return async (dispatch, getState) => {
const state = getState().sectionAssessments;
// Don't load data if it's already stored in redux.
if (state.assessmentResponsesByScript[scriptId]) {
return;
}
dispatch(startLoadingAssessments());
const loadResponses = loadAssessmentResponsesFromServer(sectionId, scriptId);
const loadQuestions = loadAssessmentQuestionsFromServer(scriptId);
const loadSurveys = loadSurveysFromServer(sectionId, scriptId);
const [responses, questions, surveys] = await Promise.all([loadResponses, loadQuestions, loadSurveys]);
dispatch(setAssessmentResponses(scriptId, responses));
dispatch(setAssessmentQuestions(scriptId, questions));
dispatch(setSurveys(scriptId, surveys));
dispatch(finishLoadingAssessments());
};
};
export default function sectionAssessments(state=initialState, action) {
if (action.type === SET_SECTION) {
/**
* Setting the section is the first action to be called when switching
* sections, which requires us to reset our state. This might need to change
* once switching sections is in react/redux.
*/
return {
...initialState
};
}
if (action.type === SET_ASSESSMENT_ID) {
return {
...state,
assessmentId: action.assessmentId,
};
}
if (action.type === SET_ASSESSMENT_RESPONSES) {
return {
...state,
assessmentResponsesByScript: {
...state.assessmentResponsesByScript,
[action.scriptId]: action.assessments
}
};
}
if (action.type === SET_SURVEYS) {
return {
...state,
surveysByScript: {
...state.surveysByScript,
[action.scriptId]: action.surveys
}
};
}
if (action.type === SET_ASSESSMENTS_QUESTIONS) {
return {
...state,
assessmentQuestionsByScript: {
...state.assessmentQuestionsByScript,
[action.scriptId]: action.assessments
},
// Default the assessmentId to the first assessment in the structure
assessmentId: parseInt(Object.keys(action.assessments)[0]),
};
}
if (action.type === START_LOADING_ASSESSMENTS) {
return {
...state,
isLoading: true
};
}
if (action.type === FINISH_LOADING_ASSESSMENTS) {
return {
...state,
isLoading: false
};
}
return state;
}
// Selector functions
// Returns an array of objects, each indicating an assessment name and it's id
// for the assessments and surveys in the current script.
export const getCurrentScriptAssessmentList = (state) => {
const assessmentStructure = state.sectionAssessments.assessmentQuestionsByScript[state.scriptSelection.scriptId] || {};
const assessments = Object.values(assessmentStructure).map(assessment => {
return {
id: assessment.id,
name: assessment.name,
};
});
const surveysStructure = state.sectionAssessments.surveysByScript[state.scriptSelection.scriptId] || {};
const surveys = Object.keys(surveysStructure).map(surveyId => {
return {
id: parseInt(surveyId),
name: surveysStructure[surveyId].stage_name,
};
});
return assessments.concat(surveys);
};
// Get the student responses for assessments in the current script and current assessment
export const getAssessmentResponsesForCurrentScript = (state) => {
return state.sectionAssessments.assessmentResponsesByScript[state.scriptSelection.scriptId] || {};
};
// Get the question structure for assessments in the current script and current assessment
export const getCurrentAssessmentQuestions = (state) => {
const currentScriptData = state.sectionAssessments.assessmentQuestionsByScript[state.scriptSelection.scriptId]
|| {};
return currentScriptData[state.sectionAssessments.assessmentId];
};
/**
* Returns an array of objects, each of type questionStructurePropType
* indicating the question and correct answers for each multiple choice
* question in the currently selected assessment.
*/
export const getMultipleChoiceStructureForCurrentAssessment = (state) => {
const assessmentsStructure = getCurrentAssessmentQuestions(state);
if (!assessmentsStructure) {
return [];
}
const questionData = assessmentsStructure.questions;
// Transform that data into what we need for this particular table, in this case
// questionStructurePropType structure.
return questionData.filter(question => question.type === 'Multi').map(question => {
return {
id: question.level_id,
question: question.question_text,
correctAnswer: getCorrectAnswer(question.answers),
};
});
};
/**
* Returns an array of objects, each of type studentAnswerDataPropType
* indicating the student responses to multiple choice questions for the
* currently selected assessment.
*/
export const getStudentMCResponsesForCurrentAssessment = (state) => {
const studentResponses = getAssessmentResponsesForCurrentScript(state);
if (!studentResponses) {
return [];
}
const studentResponsesArray = Object.keys(studentResponses).map(studentId => {
studentId = parseInt(studentId);
const studentObject = studentResponses[studentId];
const currentAssessmentId = state.sectionAssessments.assessmentId;
const studentAssessment = studentObject.responses_by_assessment[currentAssessmentId];
// If the student has not submitted this assessment, don't display results.
if (!studentAssessment) {
return;
}
// Transform that data into what we need for this particular table, in this case
// is the structure studentAnswerDataPropType
return {
id: studentId,
name: studentObject.student_name,
studentResponses: studentAssessment.level_results.map(answer => {
return {
responses: answer.student_result || '',
isCorrect: answer.status === 'correct',
};
})
};
}).filter(studentData => studentData);
return studentResponsesArray;
};
/**
* Returns an array of objects, each of type freeResponseQuestionsPropType
* indicating the question and responses to free response questions for the
* currently selected survey.
*/
export const getSurveyFreeResponseQuestions = (state) => {
const surveysStructure = state.sectionAssessments.surveysByScript[state.scriptSelection.scriptId] || {};
const currentSurvey = surveysStructure[state.sectionAssessments.assessmentId];
if (!currentSurvey) {
return [];
}
const questionData = currentSurvey.levelgroup_results;
return questionData.filter(question => question.type === 'free_response').map(question => {
return {
questionText: question.question,
answers: question.results.map((response, index) => {
return {index: index, response: response.result};
}),
};
});
};
/**
* Returns an array of objects, each of type multipleChoiceSurveyDataPropType
* indicating a multiple choice question and the percent of responses received
* for each answer.
*/
export const getMultipleChoiceSurveyResults = (state) => {
const surveysStructure = state.sectionAssessments.surveysByScript[state.scriptSelection.scriptId] || {};
const currentSurvey = surveysStructure[state.sectionAssessments.assessmentId];
if (!currentSurvey) {
return [];
}
const questionData = currentSurvey.levelgroup_results;
// Filter to multiple choice questions.
return questionData.filter(question => question.type === 'multi').map((question, index) => {
// Calculate the total responses for each answer.
const totalAnswered = question.results.length;
// Each value of answerTotals represents the number of responses received for
// the answer in that index.
const answerTotals = [];
// Initialize each answer to 0 responses.
for (let i = 0; i< question.answer_texts.length; i++) {
answerTotals[i] = 0;
}
let notAnswered = 0;
// For each response, add 1 to the correct value in answerTotals.
for (let i = 0; i<totalAnswered; i++) {
const answerIndex = question.results[i].answer_index;
if (answerIndex >= 0) {
answerTotals[answerIndex]++;
} else {
notAnswered++;
}
}
// TODO(caleybrock): Make a better way to get letter options, here and below.
return {
id: index,
question: question.question,
answers: question.answer_texts.map((answer, index) => {
return {
multipleChoiceOption: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'][index],
percentAnswered: Math.floor((answerTotals[index]/totalAnswered) * 100),
};
}),
notAnswered: Math.floor((notAnswered/totalAnswered) * 100),
};
});
};
/** Get data for students assessments multiple choice table
* Returns an object, each of type studentOverviewDataPropType with
* the value of the key being an object that contains the number
* of multiple choice answered correctly by a student, total number
* of multiple choice options, check for if the student submitted the
* assessment and a timestamp that indicates when a student submitted
* the assessment.
*/
export const getStudentsMCSummaryForCurrentAssessment = (state) => {
const summaryOfStudentsMCData = getAssessmentResponsesForCurrentScript(state);
if (!summaryOfStudentsMCData) {
return [];
}
const studentsSummaryArray = Object.keys(summaryOfStudentsMCData).map(studentId => {
studentId = parseInt(studentId);
const studentsObject = summaryOfStudentsMCData[studentId];
const currentAssessmentId = state.sectionAssessments.assessmentId;
const studentsAssessment = studentsObject.responses_by_assessment[currentAssessmentId];
// If the student has not submitted this assessment, don't display results.
if (!studentsAssessment) {
return;
}
// Transform that data into what we need for this particular table, in this case
// it is the structure studentOverviewDataPropType
return {
id: studentId,
name: studentsObject.student_name,
numMultipleChoiceCorrect: studentsAssessment.multi_correct,
numMultipleChoice: studentsAssessment.multi_count,
isSubmitted: studentsAssessment.submitted,
submissionTimeStamp: studentsAssessment.timestamp,
};
}).filter(studentOverviewData => studentOverviewData);
return studentsSummaryArray;
};
// Helpers
/**
* Takes in an array of objects {answerText: '', correct: true/false} and
* returns the corresponding letter to the option with the correct answer.
*
* TODO(caleybrock): Add letter options to response from the server so they are
* consistent with the structure, but for now look up letter in this array.
*
* Ex - [{correct: false}, {correct: true}] --> returns 'B'
*/
const getCorrectAnswer = (answerArr) => {
if (!answerArr) {
return '';
}
const correctIndex = answerArr.findIndex(answer => answer.correct);
const letterArr = ['A','B', 'C', 'D', 'E', 'F', 'G', 'H'];
return letterArr[correctIndex];
};
// Requests to the server for assessment data
// Loads the assessment responses.
const loadAssessmentResponsesFromServer = (sectionId, scriptId) => {
let payload = {section_id: sectionId};
if (scriptId) {
payload.script_id = scriptId;
}
return $.ajax({
url: `/dashboardapi/assessments/section_responses`,
method: 'GET',
contentType: 'application/json;charset=UTF-8',
data: payload
});
};
// Loads the assessment question structure.
const loadAssessmentQuestionsFromServer = (scriptId) => {
const payload = {script_id: scriptId};
return $.ajax({
url: `/dashboardapi/assessments`,
method: 'GET',
contentType: 'application/json;charset=UTF-8',
data: payload,
});
};
// Loads survey questions and anonymous responses.
const loadSurveysFromServer = (sectionId, scriptId) => {
const payload = {script_id: scriptId, section_id: sectionId};
return $.ajax({
url: `/dashboardapi/assessments/section_surveys`,
method: 'GET',
contentType: 'application/json;charset=UTF-8',
data: payload,
});
};