fraport/fradrive
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(exam-correct): server date handling in frontend and refactor

Browse Source
This commit is contained in:
Sarah Vaupel 2020-01-21 16:44:35 +01:00
parent daf9eee1d3
commit d8a080d74d
2 changed files with 26 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/src/utils/exam-correct/exam-correct.js
View File

@ -111,19 +111,18 @@ export class ExamCorrect {
if (this._userInput.getAttribute(EXAM_CORRECT_USER_ATTR) !== null) { if (this._userInput.getAttribute(EXAM_CORRECT_USER_ATTR) !== null) {
if (this._userInput.value === this._userInput.getAttribute(EXAM_CORRECT_USER_DNAME_ATTR)) { if (this._userInput.value === this._userInput.getAttribute(EXAM_CORRECT_USER_DNAME_ATTR)) {
setStatus(this._userInputStatus, STATUS.NONE); setStatus(this._userInputStatus, STATUS.SUCCESS);
return; return;
} else { } else {
this._userInput.removeAttribute(EXAM_CORRECT_USER_ATTR); this._userInput.removeAttribute(EXAM_CORRECT_USER_ATTR);
this._userInput.removeAttribute(EXAM_CORRECT_USER_DNAME_ATTR);
} }
} }
setStatus(this._userInputStatus, STATUS.LOADING); setStatus(this._userInputStatus, STATUS.LOADING);
const body = { const body = {
name: user, user: user,
results: {},
op: false,
}; };
this._app.httpClient.post({ this._app.httpClient.post({
@ -143,10 +142,11 @@ export class ExamCorrect {
// refocus user input element for convenience // refocus user input element for convenience
this._userInput.focus(); this._userInput.focus();
const userId = this._userInput.getAttribute(EXAM_CORRECT_USER_ATTR);
const user = this._userInput.value; const user = this._userInput.value;
// abort send if the user input is empty // abort send if the user input is empty
if (!user) { if (!user && !userId) {
this._userInput.classList.add(INPUT_EMPTY_CLASS); this._userInput.classList.add(INPUT_EMPTY_CLASS);
this._userInput.addEventListener('input', this._removeInputEmptyClassHandler.bind(this), { once: true }); this._userInput.addEventListener('input', this._removeInputEmptyClassHandler.bind(this), { once: true });
return; return;
@ -177,6 +177,7 @@ export class ExamCorrect {
const now = moment(); const now = moment();
dateTD.appendChild(document.createTextNode(now.format(MOMENT_FORMAT))); dateTD.appendChild(document.createTextNode(now.format(MOMENT_FORMAT)));
dateTD.setAttribute('date', moment()); dateTD.setAttribute('date', moment());
dateTD.classList.add('exam-correct--local-time');
const userTD = document.createElement('TD'); const userTD = document.createElement('TD');
userTD.appendChild(document.createTextNode(user)); userTD.appendChild(document.createTextNode(user));
userTD.setAttribute(EXAM_CORRECT_USER_ATTR, user); userTD.setAttribute(EXAM_CORRECT_USER_ATTR, user);
@ -198,15 +199,13 @@ export class ExamCorrect {
const tableBody = this._element.querySelector(`tbody:not(#${EXAM_CORRECT_INPUT_BODY_ID})`); const tableBody = this._element.querySelector(`tbody:not(#${EXAM_CORRECT_INPUT_BODY_ID})`);
tableBody.insertBefore(correctionRow, tableBody.firstChild); tableBody.insertBefore(correctionRow, tableBody.firstChild);
// clear input values on validation success // clear inputs on validation success
// TODO only clear input on post success this._clearUserInput();
[this._userInput, ...this._partInputs].forEach(clearInput); this._partInputs.forEach(clearInput);
setStatus(this._userInputStatus, STATUS.NONE);
const body = { const body = {
name: user, user: userId || user,
results: results, results: results,
op: true,
}; };
this._app.httpClient.post({ this._app.httpClient.post({
@ -223,8 +222,6 @@ export class ExamCorrect {
} }
_processResponse(response, user) { _processResponse(response, user) {
console.log('WIP _processResponse', response, user);
if (response) { if (response) {
if (response.status === 'no-op') { if (response.status === 'no-op') {
if (response.users) { if (response.users) {
@ -288,6 +285,10 @@ export class ExamCorrect {
if (response.user) { if (response.user) {
userElem.setAttribute(EXAM_CORRECT_USER_ATTR, response.user.id); userElem.setAttribute(EXAM_CORRECT_USER_ATTR, response.user.id);
userElem.innerHTML = userToHTML(response.user); userElem.innerHTML = userToHTML(response.user);
const timeElem = row.cells.item(0);
timeElem.innerHTML = moment(response.time).format(MOMENT_FORMAT);
timeElem.classList.remove('exam-correct--local-time');
// TODO special style for server time?
} }
// TODO replace results with results from response // TODO replace results with results from response
// TODO set edit button visibility // TODO set edit button visibility
@ -318,7 +319,6 @@ export class ExamCorrect {
} }
_removeInputEmptyClassHandler() { _removeInputEmptyClassHandler() {
console.log('removeclass');
if (this._userInput.value) { if (this._userInput.value) {
this._userInput.classList.remove(INPUT_EMPTY_CLASS); this._userInput.classList.remove(INPUT_EMPTY_CLASS);
} else { } else {
@ -349,6 +349,14 @@ export class ExamCorrect {
} }
} }
_clearUserInput() {
removeAllChildren(this._userInputCandidates);
clearInput(this._userInput);
this._userInput.removeAttribute(EXAM_CORRECT_USER_ATTR);
this._userInput.removeAttribute(EXAM_CORRECT_USER_DNAME_ATTR);
setStatus(this._userInputStatus, STATUS.NONE);
}
} }
// TODO move to general util section? // TODO move to general util section?

4
frontend/src/utils/exam-correct/exam-correct.sass
View File

@ -9,6 +9,10 @@ input.input--invalid
i i
margin-left: $exam-correct--input-status-margin margin-left: $exam-correct--input-status-margin
.exam-correct--local-time
color: var(--color-fontsec)
font-style: italic
.exam-correct--success .exam-correct--success
color: var(--color-success) color: var(--color-success)