Feat(SQL, UI): 1. Calc and Get Many Stored Procedures created for Weather, Lighting Level, Assessment, Distraction Type, Distraction Intensity Level, Distraction, Bribe, Assessment Command Modality Link, Response Quality Metric, Obedience Level, and Assessment Response. \n 2. Assessments and Assessment pages created with data loading and hooked up, but not saving.
This commit is contained in:
603
static/js/pages/dog/assessment.js
Normal file
603
static/js/pages/dog/assessment.js
Normal file
@@ -0,0 +1,603 @@
|
||||
|
||||
import API from "../../api.js";
|
||||
import BusinessObjects from "../../lib/business_objects/business_objects.js";
|
||||
import DOM from "../../dom.js";
|
||||
import Events from "../../lib/events.js";
|
||||
import TableBasePage from "../base_table.js";
|
||||
import Utils from "../../lib/utils.js";
|
||||
import Validation from "../../lib/validation.js";
|
||||
import DogTableMixinPage from "./mixin_table.js";
|
||||
|
||||
var _rowBlankDistraction;
|
||||
var _rowBlankAssessmentCommandModalityLink;
|
||||
|
||||
export default class PageDogAssessment extends TableBasePage {
|
||||
static hash = hashPageDogAssessment;
|
||||
static attrIdRowObject = attrIdAssessment;
|
||||
callSaveTableContent = API.saveAssessments;
|
||||
|
||||
constructor(router) {
|
||||
super(router);
|
||||
this.dogMixin = new DogTableMixinPage(this);
|
||||
}
|
||||
|
||||
initialize() {
|
||||
this.sharedInitialize();
|
||||
}
|
||||
|
||||
hookupFilters() {
|
||||
}
|
||||
|
||||
loadRowTable(rowJson) {
|
||||
if (rowJson == null) return;
|
||||
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("applying data row: ", rowJson); }
|
||||
}
|
||||
getJsonRow(row) {
|
||||
if (row == null) return;
|
||||
/*
|
||||
let inputTemperatureCelcius = row.querySelector('td.' + flagTemperatureCelcius + ' input');
|
||||
let buttonActive = row.querySelector('td.' + flagActive + ' .' + flagActive);
|
||||
*/
|
||||
let jsonRow = {};
|
||||
jsonRow[attrIdAssessment] = row.getAttribute(attrIdAssessment);
|
||||
return jsonRow;
|
||||
}
|
||||
initialiseRowNew(tbody, row) {
|
||||
|
||||
}
|
||||
postInitialiseRowNewCallback(tbody) {
|
||||
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
|
||||
let newestRow = newRows[0];
|
||||
let clickableElementsSelector = [
|
||||
'td.' + flagWeather + ' div.' + flagWeather
|
||||
, ',td.' + flagLightingLevel + ' div.' + flagLightingLevel
|
||||
, ',td.' + flagLocation + ' div.' + flagLocation
|
||||
, ',td.' + flagUserHandler + ' div.' + flagUserHandler
|
||||
].join('');
|
||||
newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
|
||||
clickableElement.click();
|
||||
});
|
||||
}
|
||||
|
||||
hookupTableMain() {
|
||||
super.hookupTableMain();
|
||||
this.hookupTableAssessmentHeader();
|
||||
this.hookupTableDistractions();
|
||||
this.hookupTableAssessmentCommandModalityLinks();
|
||||
}
|
||||
hookupTableAssessmentHeader() {
|
||||
this.hookupTableAssessmentFieldWeather();
|
||||
this.hookupTableAssessmentFieldLightingLevel();
|
||||
this.hookupTableAssessmentFieldTemperature();
|
||||
this.hookupTableAssessmentFieldLocation();
|
||||
this.hookupTableAssessmentFieldUserHandler();
|
||||
this.hookupTableAssessmentFieldNotes();
|
||||
}
|
||||
hookupTableAssessmentFieldWeather() {
|
||||
let fieldFlag = flagWeather;
|
||||
let optionList = Utils.getListFromDict(filterWeathers); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessment + ' td.' + flagWeather;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentFieldLightingLevel() {
|
||||
let fieldFlag = flagLightingLevel;
|
||||
let optionList = Utils.getListFromDict(filterLightingLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessment + ' td.' + flagLightingLevel;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentFieldTemperature() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessment + ' td.' + flagTemperatureCelcius + ' .' + flagTemperatureCelcius);
|
||||
}
|
||||
hookupTableAssessmentFieldLocation() {
|
||||
let fieldFlag = flagLocation;
|
||||
let optionList = Utils.getListFromDict(filterLocations); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessment + ' td.' + flagLocation;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentFieldUserHandler() {
|
||||
let fieldFlag = flagUserHandler;
|
||||
let optionList = Utils.getListFromDict(filterUserHandlers); // .sort((a, b) => a[flagName].localeCompare(b[flagName]));
|
||||
let cellSelector = idTableAssessment + ' td.' + flagUserHandler;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentFieldNotes() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessment + ' td.' + flagNotes + ' .' + flagNotes);
|
||||
}
|
||||
hookupTableDistractions() {
|
||||
Events.initialiseEventHandler(idTableDistractions, flagInitialised, (table) => {
|
||||
let selectorRowNew = idTableDistractions + ' tbody tr.' + flagRowNew;
|
||||
let rowBlankTemp = document.querySelector(selectorRowNew);
|
||||
Utils.consoleLogIfNotProductionEnvironment("row blank temp: ", rowBlankTemp);
|
||||
let countRows = document.querySelectorAll(idTableDistractions + ' > tbody > tr').length;
|
||||
_rowBlankDistraction = rowBlankTemp.cloneNode(true);
|
||||
document.querySelectorAll(selectorRowNew).forEach(function(row) {
|
||||
row.remove();
|
||||
});
|
||||
_rowBlankDistraction.setAttribute(attrIdDistraction, -1 - countRows);
|
||||
});
|
||||
|
||||
this.hookupTableDistractionsFieldsDistractionType();
|
||||
this.hookupTableDistractionsFieldsIntensityLevelEmotional();
|
||||
this.hookupTableDistractionsFieldsIntensityLevelScent();
|
||||
this.hookupTableDistractionsFieldsIntensityLevelSight();
|
||||
this.hookupTableDistractionsFieldsIntensityLevelSound();
|
||||
this.hookupTableDistractionsFieldsIntensityLevelTouch();
|
||||
this.hookupTableDistractionsFieldsQuantity();
|
||||
this.hookupTableDistractionsFieldsProximityMetres();
|
||||
this.hookupTableDistractionsFieldsNotes();
|
||||
this.hookupTableDistractionsFieldsActive();
|
||||
}
|
||||
hookupTableDistractionsFieldsDistractionType() {
|
||||
let fieldFlag = flagDistractionType;
|
||||
let optionList = Utils.getListFromDict(filterDistractionTypes); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableDistractions + ' td.' + flagDistractionType;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableDistractionsFieldsIntensityLevelEmotional() {
|
||||
let fieldFlag = flagDistractionIntensityLevelEmotional;
|
||||
let optionList = Utils.getListFromDict(filterDistractionIntensityLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableDistractions + ' td.' + flagDistractionIntensityLevelEmotional;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableDistractionsFieldsIntensityLevelScent() {
|
||||
let fieldFlag = flagDistractionIntensityLevelScent;
|
||||
let optionList = Utils.getListFromDict(filterDistractionIntensityLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableDistractions + ' td.' + flagDistractionIntensityLevelScent;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableDistractionsFieldsIntensityLevelSight() {
|
||||
let fieldFlag = flagDistractionIntensityLevelSight;
|
||||
let optionList = Utils.getListFromDict(filterDistractionIntensityLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableDistractions + ' td.' + flagDistractionIntensityLevelSight;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableDistractionsFieldsIntensityLevelSound() {
|
||||
let fieldFlag = flagDistractionIntensityLevelSound;
|
||||
let optionList = Utils.getListFromDict(filterDistractionIntensityLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableDistractions + ' td.' + flagDistractionIntensityLevelSound;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableDistractionsFieldsIntensityLevelTouch() {
|
||||
let fieldFlag = flagDistractionIntensityLevelTouch;
|
||||
let optionList = Utils.getListFromDict(filterDistractionIntensityLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableDistractions + ' td.' + flagDistractionIntensityLevelTouch;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableDistractionsFieldsQuantity() {
|
||||
this.hookupChangeHandlerTableCells(idTableDistractions + ' td.' + flagQuantity + ' .' + flagQuantity);
|
||||
}
|
||||
hookupTableDistractionsFieldsProximityMetres() {
|
||||
this.hookupChangeHandlerTableCells(idTableDistractions + ' td.' + flagProximityMetres + ' .' + flagProximityMetres);
|
||||
}
|
||||
hookupTableDistractionsFieldsNotes() {
|
||||
this.hookupChangeHandlerTableCells(idTableDistractions + ' td.' + flagNotes + ' .' + flagNotes);
|
||||
}
|
||||
hookupTableDistractionsFieldsActive() {
|
||||
this.hookupFieldsActive(flagDistraction, (event, element) => { this.handleClickAddRowTableDistractions(event, element); });
|
||||
}
|
||||
handleClickAddRowTableDistractions(event, button) {
|
||||
event.stopPropagation();
|
||||
_rowBlankDistraction.setAttribute(attrIdDistraction, -1 - _rowBlankDistraction.getAttribute(attrIdDistraction));
|
||||
let tbody = document.querySelector(idTableDistractions + ' tbody');
|
||||
if (tbody.classList.contains(flagIsCollapsed)) return;
|
||||
let row = _rowBlankDistraction.cloneNode(true);
|
||||
row.classList.remove(flagInitialised);
|
||||
row.querySelectorAll('.' + flagInitialised).forEach(function(element) {
|
||||
element.classList.remove(flagInitialised);
|
||||
});
|
||||
let countRows = document.querySelectorAll(idTableDistractions + ' > tbody > tr').length;
|
||||
row.setAttribute(attrIdDistraction, -1 - countRows);
|
||||
tbody.prepend(row);
|
||||
tbody.scrollTop = 0;
|
||||
this.hookupTableDistractions();
|
||||
this.postInitialiseDistractionRowNewCallback(tbody);
|
||||
}
|
||||
postInitialiseDistractionRowNewCallback(tbody) {
|
||||
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
|
||||
let newestRow = newRows[0];
|
||||
let clickableElementsSelector = [
|
||||
'td.' + flagDistractionType + ' div.' + flagDistractionType
|
||||
, ',td.' + flagDistractionIntensityLevelEmotional + ' div.' + flagDistractionIntensityLevelEmotional
|
||||
, ',td.' + flagDistractionIntensityLevelScent + ' div.' + flagDistractionIntensityLevelScent
|
||||
, ',td.' + flagDistractionIntensityLevelSight + ' div.' + flagDistractionIntensityLevelSight
|
||||
, ',td.' + flagDistractionIntensityLevelSound + ' div.' + flagDistractionIntensityLevelSound
|
||||
, ',td.' + flagDistractionIntensityLevelTouch + ' div.' + flagDistractionIntensityLevelTouch
|
||||
].join('');
|
||||
newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
|
||||
clickableElement.click();
|
||||
});
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinks() {
|
||||
Events.initialiseEventHandler(idTableAssessmentCommandModalityLinks, flagInitialised, (table) => {
|
||||
let selectorRowNew = idTableAssessmentCommandModalityLinks + ' tbody tr.' + flagRowNew;
|
||||
let rowBlankTemp = document.querySelector(selectorRowNew);
|
||||
Utils.consoleLogIfNotProductionEnvironment("row blank temp: ", rowBlankTemp);
|
||||
let countRows = document.querySelectorAll(idTableAssessmentCommandModalityLinks + ' > tbody > tr').length;
|
||||
_rowBlankAssessmentCommandModalityLink = rowBlankTemp.cloneNode(true);
|
||||
document.querySelectorAll(selectorRowNew).forEach(function(row) {
|
||||
row.remove();
|
||||
});
|
||||
_rowBlankAssessmentCommandModalityLink.setAttribute(attrIdAssessmentCommandModalityLink, -1 - countRows);
|
||||
});
|
||||
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsCommandCategory();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsCommand();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsCommandModality();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsBribe();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsDistanceFromHandler();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsIsInHearingRangeOfHandler();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsIsInScentRangeOfHandler();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsIsInSightOfHandler();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsIsOnLead();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsTrialCount();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsNotes();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsResponses();
|
||||
this.hookupTableAssessmentCommandModalityLinksFieldsActive();
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsCommandCategory() {
|
||||
this.hookupFieldsCommandCategory(idTableAssessmentCommandModalityLinks);
|
||||
/*
|
||||
let fieldFlag = flagCommandCategory;
|
||||
let optionList = Utils.getListFromDict(filterCommandCategories).sort((a, b) => a[flagName].localeCompare(b[flagName]));
|
||||
let cellSelector = idTableAssessmentCommandModalityLinks + ' td.' + flagCommandCategory;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
, (tdSelector) => { this.hookupTableAssessmentCommandModalityLinksDdlsCommandCategory(tdSelector); }
|
||||
, (event, element) => { this.handleChangeTableAssessmentCommandModalityLinksDdlCommandCategory(event, element); }
|
||||
);
|
||||
*/
|
||||
}
|
||||
/*
|
||||
hookupTableAssessmentCommandModalityLinksDdlsCommandCategory(ddlSelector) {
|
||||
this.hookupChangeHandlerTableCells(ddlSelector, (event, element) => { this.handleChangeTableAssessmentCommandModalityLinksDdlCommandCategory(event, element); });
|
||||
}
|
||||
handleChangeTableAssessmentCommandModalityLinksDdlCommandCategory(event, ddlCategory) {
|
||||
let row = DOM.getRowFromElement(ddlCategory);
|
||||
let idCommandCategoryRowOld = this.getIdCommandCategoryRow(row); // DOM.getElementAttributeValueCurrent(ddlCategory);
|
||||
this.handleChangeNestedElementCellTable(event, ddlCategory);
|
||||
let idCommandCategoryRowNew = this.getIdCommandCategoryRow(row); // DOM.getElementAttributeValueCurrent(ddlCategory);
|
||||
if (idCommandCategoryRowOld == idCommandCategoryRowNew) return;
|
||||
let divCommand = row.querySelector('td.' + flagCommand + ' div');
|
||||
if (divCommand) divCommand.dispatchEvent(new Event('click'));
|
||||
let ddlCommand = row.querySelector('td.' + flagCommand + ' select.' + flagCommand);
|
||||
ddlCommand.innerHTML = '';
|
||||
ddlCommand.appendChild(DOM.createOption(null));
|
||||
let optionJson, option;
|
||||
let commandsInCategory = Utils.getListFromDict(filterCommands).filter(command =>
|
||||
(
|
||||
command[attrIdCommandCategory] == idCommandCategoryRowNew
|
||||
|| idCommandCategoryRowNew == 0
|
||||
)
|
||||
);
|
||||
let sortedCommands = commandsInCategory.sort((a, b) => a[flagName].localeCompare(b[flagName]));
|
||||
sortedCommands.forEach((command) => {
|
||||
optionJson = BusinessObjects.getOptionJsonFromObjectJson(command);
|
||||
option = DOM.createOption(optionJson);
|
||||
ddlCommand.appendChild(option);
|
||||
});
|
||||
this.handleChangeNestedElementCellTable(event, ddlCommand);
|
||||
}
|
||||
*/
|
||||
hookupTableAssessmentCommandModalityLinksFieldsCommand() {
|
||||
this.hookupFieldsCommand(idTableAssessmentCommandModalityLinks);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsCommandModality() {
|
||||
let fieldFlag = flagCommandModality;
|
||||
let optionList = Utils.getListFromDict(filterCommandModalities); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessmentCommandModalityLinks + ' td.' + flagCommandModality;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsBribe() {
|
||||
let fieldFlag = flagBribe;
|
||||
let optionList = Utils.getListFromDict(filterBribes); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessmentCommandModalityLinks + ' td.' + flagBribe;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsDistanceFromHandler() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' td.' + flagDistanceFromHandler + ' .' + flagDistanceFromHandler);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsIsInHearingRangeOfHandler() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' td.' + flagIsInHearingRangeOfHandler + ' .' + flagIsInHearingRangeOfHandler);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsIsInScentRangeOfHandler() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' td.' + flagIsInScentRangeOfHandler + ' .' + flagIsInScentRangeOfHandler);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsIsInSightOfHandler() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' td.' + flagIsInSightOfHandler + ' .' + flagIsInSightOfHandler);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsIsOnLead() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' td.' + flagIsOnLead + ' .' + flagIsOnLead);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsTrialCount() {
|
||||
// this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' td.' + flagTrialCount + ' .' + flagTrialCount);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsNotes() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentCommandModalityLinks + ' > tbody > tr > td.' + flagNotes + ' .' + flagNotes);
|
||||
}
|
||||
hookupTableAssessmentCommandModalityLinksFieldsResponses() {
|
||||
let eventType = "click";
|
||||
let selector = idTableAssessmentCommandModalityLinks + ' td.' + flagAssessmentResponse + ' div.' + flagAssessmentResponse;
|
||||
let handler = (event, element) => {
|
||||
let parentTd = DOM.getCellFromElement(element);
|
||||
let responsesTable = document.createElement("table");
|
||||
responsesTable.id = idTableAssessmentResponses.replace("#", "");
|
||||
responsesTable.classList.add(flagTableMain, flagAssessmentResponse);
|
||||
|
||||
let head = document.createElement("thead");
|
||||
let headRow = document.createElement("tr");
|
||||
let thResponseQualityMetric = document.createElement("th");
|
||||
thResponseQualityMetric.classList.add(flagResponseQualityMetric);
|
||||
thResponseQualityMetric.innerText = 'Response Quality Metric';
|
||||
headRow.appendChild(thResponseQualityMetric);
|
||||
let thObedienceLevel = document.createElement("th");
|
||||
thObedienceLevel.classList.add(flagObedienceLevel);
|
||||
thObedienceLevel.innerText = 'Obedience Level';
|
||||
headRow.appendChild(thObedienceLevel);
|
||||
let thValueMeasured = document.createElement("th");
|
||||
thValueMeasured.classList.add(flagValueMeasured);
|
||||
thValueMeasured.innerText = 'Value Measured';
|
||||
headRow.appendChild(thValueMeasured);
|
||||
let thNotes = document.createElement("th");
|
||||
thNotes.classList.add(flagNotes);
|
||||
thNotes.innerText = 'Notes';
|
||||
headRow.appendChild(thNotes);
|
||||
let thActive = document.createElement("th");
|
||||
thActive.classList.add(flagActive);
|
||||
let templateAddIcon = document.querySelector(idContainerTemplateElements + ' .' + flagButton + '.' + flagIcon + '.' + flagActive + '.' + flagAdd);
|
||||
thActive.appendChild(templateAddIcon.cloneNode(true));
|
||||
headRow.appendChild(thActive);
|
||||
head.appendChild(headRow);
|
||||
responsesTable.appendChild(head);
|
||||
|
||||
let body = document.createElement("tbody");
|
||||
|
||||
let assessmentCommandModalityLink = assessment[flagAssessmentCommandModalityLink];
|
||||
let responses = (assessmentCommandModalityLink == null) ? null : assessmentCommandModalityLink[flagAssessmentResponse];
|
||||
|
||||
if (responses != null && responses.length > 0) {
|
||||
for (let response in responses) {
|
||||
let row = PageDogAssessment.createNewRowTableAssessmentResponses(response);
|
||||
body.appendChild(row);
|
||||
}
|
||||
}
|
||||
responsesTable.appendChild(body);
|
||||
|
||||
parentTd.innerHTML = responsesTable.outerHTML;
|
||||
|
||||
this.hookupTablesAssessmentResponses();
|
||||
};
|
||||
Events.hookupEventHandler(
|
||||
eventType
|
||||
, selector
|
||||
, handler
|
||||
);
|
||||
this.hookupTablesAssessmentResponses();
|
||||
}
|
||||
static createNewRowTableAssessmentResponses(response) {
|
||||
if (response == null) response = {
|
||||
[attrIdAssessmentResponse]: null
|
||||
, [flagResponseQualityMetric]: 0
|
||||
, [flagObedienceLevel]: 0
|
||||
, [flagValueMeasured]: ''
|
||||
, [flagNotes]: ''
|
||||
, [flagActive]: true
|
||||
};
|
||||
let isNew = (response[attrIdAssessmentResponse] == null || response[attrIdAssessmentResponse] < 1);
|
||||
let row = document.createElement("tr");
|
||||
row.classList.add(flagAssessmentResponse);
|
||||
if (isNew) row.classList.add(flagRowNew);
|
||||
row.setAttribute(attrIdAssessmentResponse, response[attrIdAssessmentResponse]);
|
||||
|
||||
let tdResponseQualityMetric = document.createElement("td");
|
||||
tdResponseQualityMetric.classList.add(flagResponseQualityMetric, flagDdlPreview);
|
||||
let divResponseQualityMetric = document.createElement("div");
|
||||
divResponseQualityMetric.classList.add(flagResponseQualityMetric);
|
||||
DOM.setElementAttributesValuesCurrentAndPrevious(divResponseQualityMetric, response[flagResponseQualityMetric]);
|
||||
divResponseQualityMetric.innerText = response[flagResponseQualityMetric];
|
||||
tdResponseQualityMetric.appendChild(divResponseQualityMetric);
|
||||
row.appendChild(tdResponseQualityMetric);
|
||||
|
||||
let tdObedienceLevel = document.createElement("td");
|
||||
tdObedienceLevel.classList.add(flagObedienceLevel, flagDdlPreview);
|
||||
let divObedienceLevel = document.createElement("div");
|
||||
divObedienceLevel.classList.add(flagObedienceLevel);
|
||||
DOM.setElementAttributesValuesCurrentAndPrevious(divObedienceLevel, response[flagObedienceLevel]);
|
||||
divObedienceLevel.innerText = response[flagObedienceLevel];
|
||||
tdObedienceLevel.appendChild(divObedienceLevel);
|
||||
row.appendChild(tdObedienceLevel);
|
||||
|
||||
let tdValueMeasured = document.createElement("td");
|
||||
tdValueMeasured.classList.add(flagValueMeasured, flagDdlPreview);
|
||||
let inputValueMeasured = document.createElement("input");
|
||||
inputValueMeasured.type = "number";
|
||||
inputValueMeasured.classList.add(flagValueMeasured);
|
||||
DOM.setElementAttributesValuesCurrentAndPrevious(inputValueMeasured, response[flagValueMeasured]);
|
||||
inputValueMeasured.value = response[flagValueMeasured];
|
||||
tdValueMeasured.appendChild(inputValueMeasured);
|
||||
row.appendChild(tdValueMeasured);
|
||||
|
||||
let tdNotes = document.createElement("td");
|
||||
tdNotes.classList.add(flagNotes, flagDdlPreview);
|
||||
let inputNotes = document.createElement("textarea");
|
||||
inputNotes.classList.add(flagNotes);
|
||||
DOM.setElementAttributesValuesCurrentAndPrevious(inputNotes, response[flagNotes]);
|
||||
inputNotes.value = response[flagNotes];
|
||||
tdNotes.appendChild(inputNotes);
|
||||
row.appendChild(tdNotes);
|
||||
|
||||
let tdActive = document.createElement("td");
|
||||
tdActive.classList.add(flagActive, flagDdlPreview);
|
||||
let templateAddIcon = document.querySelector(idContainerTemplateElements + ' .' + flagButton + '.' + flagIcon + '.' + flagActive + '.' + flagAdd);
|
||||
let templateDeleteIcon = document.querySelector(idContainerTemplateElements + ' .' + flagButton + '.' + flagIcon + '.' + flagActive + '.' + flagDelete);
|
||||
let buttonActive = (response[flagActive]) ? templateDeleteIcon.cloneNode(true) : templateAddIcon.cloneNode(true);
|
||||
tdActive.appendChild(buttonActive);
|
||||
row.appendChild(tdActive);
|
||||
|
||||
return row;
|
||||
}
|
||||
hookupTablesAssessmentResponses() {
|
||||
this.hookupTableAssessmentResponsesFieldsResponseQualityMetric();
|
||||
this.hookupTableAssessmentResponsesFieldsObedienceLevel();
|
||||
this.hookupTableAssessmentResponsesFieldsValueMeasured();
|
||||
this.hookupTableAssessmentResponsesFieldsNotes();
|
||||
this.hookupTableAssessmentResponsesFieldsActive();
|
||||
}
|
||||
hookupTableAssessmentResponsesFieldsResponseQualityMetric() {
|
||||
let fieldFlag = flagResponseQualityMetric;
|
||||
let optionList = Utils.getListFromDict(filterResponseQualityMetrics); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessmentResponses + ' td.' + flagResponseQualityMetric;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentResponsesFieldsObedienceLevel() {
|
||||
let fieldFlag = flagObedienceLevel;
|
||||
let optionList = Utils.getListFromDict(filterObedienceLevels); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
|
||||
let cellSelector = idTableAssessmentResponses + ' td.' + flagObedienceLevel;
|
||||
this.hookupTableCellDdlPreviews(
|
||||
fieldFlag
|
||||
, optionList
|
||||
, cellSelector
|
||||
);
|
||||
}
|
||||
hookupTableAssessmentResponsesFieldsValueMeasured() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentResponses + ' td.' + flagValueMeasured + ' .' + flagValueMeasured);
|
||||
}
|
||||
hookupTableAssessmentResponsesFieldsNotes() {
|
||||
this.hookupChangeHandlerTableCells(idTableAssessmentResponses + ' td.' + flagNotes + ' .' + flagNotes);
|
||||
}
|
||||
hookupTableAssessmentResponsesFieldsActive() {
|
||||
this.hookupFieldsActive(flagAssessmentResponse, (event, element) => { this.handleClickAddRowTableAssessmentResponses(event, element); });
|
||||
}
|
||||
handleClickAddRowTableAssessmentResponses(event, button) {
|
||||
event.stopPropagation();
|
||||
let tableResponses = DOM.getClosestParent(button, "table");
|
||||
let tbody = tableResponses.querySelector(":scope > tbody");
|
||||
let row = PageDogAssessment.createNewRowTableAssessmentResponses(null);
|
||||
if (tbody.classList.contains(flagIsCollapsed)) return;
|
||||
row.classList.remove(flagInitialised);
|
||||
row.querySelectorAll('.' + flagInitialised).forEach(function(element) {
|
||||
element.classList.remove(flagInitialised);
|
||||
});
|
||||
let countRows = document.querySelectorAll(attrIdAssessmentResponse + ' > tbody > tr').length;
|
||||
row.setAttribute(attrIdAssessmentResponse, -1 - countRows);
|
||||
tbody.prepend(row);
|
||||
tbody.scrollTop = 0;
|
||||
this.hookupTablesAssessmentResponses();
|
||||
this.postInitialiseAssessmentResponseRowNewCallback(tbody);
|
||||
}
|
||||
postInitialiseAssessmentResponseRowNewCallback(tbody) {
|
||||
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
|
||||
let newestRow = newRows[0];
|
||||
let clickableElementsSelector = [
|
||||
'td.' + flagResponseQualityMetric + ' div.' + flagResponseQualityMetric
|
||||
, ',td.' + flagObedienceLevel + ' div.' + flagObedienceLevel
|
||||
, ',td.' + flagValueMeasured + ' div.' + flagValueMeasured
|
||||
, ',td.' + flagNotes + ' div.' + flagNotes
|
||||
].join('');
|
||||
newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
|
||||
clickableElement.click();
|
||||
});
|
||||
let countActiveRows = tbody.querySelectorAll('td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive + '.' + flagDelete).length;
|
||||
/*
|
||||
newRows.filter(row => {
|
||||
let activeButton = row.querySelector('td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
|
||||
return activeButton.classList.contains(flagDelete);
|
||||
}).length;
|
||||
*/
|
||||
let rowAssessmentCommandModalityLink = DOM.getRowFromElement(tbody);
|
||||
let divTrialCount = rowAssessmentCommandModalityLink.querySelector('td.' + flagTrialCount + ' div.' + flagTrialCount);
|
||||
divTrialCount.innerText = countActiveRows;
|
||||
}
|
||||
|
||||
hookupTableAssessmentCommandModalityLinksFieldsActive() {
|
||||
this.hookupFieldsActive(flagAssessmentCommandModalityLink, (event, element) => { this.handleClickAddRowTableAssessmentCommandModalityLinks(event, element); });
|
||||
}
|
||||
handleClickAddRowTableAssessmentCommandModalityLinks(event, button) {
|
||||
event.stopPropagation();
|
||||
_rowBlankAssessmentCommandModalityLink.setAttribute(attrIdAssessmentCommandModalityLink, -1 - _rowBlankAssessmentCommandModalityLink.getAttribute(attrIdAssessmentCommandModalityLink));
|
||||
let tbody = document.querySelector(idTableAssessmentCommandModalityLinks + ' tbody');
|
||||
if (tbody.classList.contains(flagIsCollapsed)) return;
|
||||
let row = _rowBlankAssessmentCommandModalityLink.cloneNode(true);
|
||||
row.classList.remove(flagInitialised);
|
||||
row.querySelectorAll('.' + flagInitialised).forEach(function(element) {
|
||||
element.classList.remove(flagInitialised);
|
||||
});
|
||||
let countRows = document.querySelectorAll(idTableAssessmentCommandModalityLinks + ' > tbody > tr').length;
|
||||
row.setAttribute(attrIdAssessmentCommandModalityLink, -1 - countRows);
|
||||
tbody.prepend(row);
|
||||
tbody.scrollTop = 0;
|
||||
this.hookupTableAssessmentCommandModalityLinks();
|
||||
this.postInitialiseAssessmentCommandModalityLinkRowNewCallback(tbody);
|
||||
}
|
||||
postInitialiseAssessmentCommandModalityLinkRowNewCallback(tbody) {
|
||||
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
|
||||
let newestRow = newRows[0];
|
||||
let clickableElementsSelector = [
|
||||
'td.' + flagCommandCategory + ' div.' + flagCommandCategory
|
||||
, ',td.' + flagCommand + ' div.' + flagCommand
|
||||
, ',td.' + flagCommandModality + ' div.' + flagCommandModality
|
||||
, ',td.' + flagBribe + ' div.' + flagBribe
|
||||
].join('');
|
||||
newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
|
||||
clickableElement.click();
|
||||
});
|
||||
}
|
||||
|
||||
leave() {
|
||||
super.leave();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user